[HTML-CSS-Python-PHP] I miei dubbi

pako80 · 19-12-2013, 10:38

Ragazzi raccolgo qui i dubbi che mi dovessero venire nell'apprendimento di questi nuovi, per me,linguaggi.

Vorrei iniziare con l'HTML:
1) non ho capito la differenza tra, ad esempio, <h1> ed <h6> impostando un font-size più grande, o anche un semplice <p> con un font-size modificato. Cosa cambia?

2)Nel tutorial che sto seguendo mi dice di iniziare un paragrafo con <p>, ma poi riporta un esempio tipo il seguente in cui non c'è (per "big title")...è comunque corretto o è un errore?

Codice HTML:

<!DOCTYPE html>
<html>
	<head>
		<title>Loving the font changes</title>
	</head>
	<body>
		<h1>Big title</h1>
		 <ol>
		 	<li>This item is big Garamond.</li>
		 	<li>This item is medium Verdana.</li>
		 	<li>This item is small Impact.</li>
		 </ol>
	</body>
</html>

Tuvok-LuR- · 19-12-2013, 11:17

Devi capire che un documento ha un valore semantico, non necessariamente legato a quello visivo.
Ogni tag identifica il valore e la funzione del proprio contenuto, proprio per questo i tag utilizzati soltanto per la formattazione (es. <font>) sono deprecati, mentre html5 introduce nuovi tag che non sono altro che <div> con uno specifico livello semantico (es. <menu>).

L'html fornisce il livello semantico ed il CSS quello stilistico. Il fatto che alcuni tag abbiano un certo stile di default non ci preclude di cambiarlo liberamente.
Quando costruisci una pagina devi pensare "cosa rappresenta questo dato?", è una lista? un titolo? un corpo di testo? questo deve guidarti nella scelta del tag, non il fatto che tu voglia farlo apparire in un modo o in un altro.

Ad esempio se prendi un qualsiasi documento html e ne sostituisci il CSS puoi ottenere una pagina con un aspetto completamente diverso: il livello stilistico è completamente cambiato mentre quello semantico è sempre lo stesso.
Inoltre in certi casi il livello stilistico verrà sempre ignorato: ad esempio quando google eseguirà il parsing della pagina vedrà un tag H1, capirà che ciò che esso racchiude è una delle cose più importanti della pagina, e le parole che contiene avranno piu peso come indicizzazione come keyword.
Quindi i tag h1,h2... hanno una gerarchia di importanza decrescente (si consiglia addirittura spesso di avere un solo H1 per pagina per una migliore indicizzazione.

Altro esempio è l'accessibilità, pensa ad un non vedente che accede al sito con uno screen reader: il livello stilistico viene completamente bypassato e ciò che conta è solo il livello semantico. Lo screen reader sarà guidato soltanto dalla semantica .

Quote:

Originariamente inviato da pako80

2)Nel tutorial che sto seguendo mi dice di iniziare un paragrafo con <p>, ma poi riporta un esempio tipo il seguente in cui non c'è (per "big title")...è comunque corretto o è un errore?

un titolo è, appunto, un titolo, non un paragrafo, quindi viene usato un tag titolo (h1)

.

<p> ed <h1> sono entrambi block-level elements, ma coesistono allo stesso livello, non vanno mai inseriti l'uno nell'altro.

un articolo con altre info:
http://blog.meetweb.it/index.php/201...nti-dellhtml5/

pako80 · 20-12-2013, 12:54

ok grazie.

Un altro dubbio, il pezzo di codice seguente è una lista non ordinata con una sottolista ordinata:

Codice HTML:

<li>Pizza:
	        <ol style="background-color:red">
	             <li>Margherita</li>
	             <li>Messicana
	                 <ul>
	                       <li>Con salame piccante</li>
	                       <li>Con salsiccia</li>
	                 </ul>
	              </li>
                 </ol>
	    </li>

se volessi scrivere in rosso solo la voce pizza è corretto aggiungere il paragrafo per farlo? Come mostrato di seguito funziona, ma non so se è il modo giusto.

Codice HTML:

<li><p style="font-family:Verdana;color:red">Pizza:</p>
	        <ol style="background-color:red">
	             <li>Margherita</li>
	             <li>Messicana
	                 <ul>
	                       <li>Con salame piccante</li>
	                       <li>Con salsiccia</li>
	                 </ul>
	              </li>
                 </ol>
	    </li>

se lo mettessi direttamente in

Codice HTML:

<li style="font-family:Verdana;color:red">Pizza:

diventano rosse tutte le voci.

19-12-2013, 10:38	#1
pako80 Senior Member Iscritto dal: Dec 2008 Messaggi: 326	[HTML-CSS-Python-PHP] I miei dubbi Ragazzi raccolgo qui i dubbi che mi dovessero venire nell'apprendimento di questi nuovi, per me,linguaggi. Vorrei iniziare con l'HTML: 1) non ho capito la differenza tra, ad esempio, <h1> ed <h6> impostando un font-size più grande, o anche un semplice <p> con un font-size modificato. Cosa cambia? 2)Nel tutorial che sto seguendo mi dice di iniziare un paragrafo con <p>, ma poi riporta un esempio tipo il seguente in cui non c'è (per "big title")...è comunque corretto o è un errore? Codice HTML: <!DOCTYPE html> <html> <head> <title>Loving the font changes</title> </head> <body> <h1>Big title</h1> <ol> <li>This item is big Garamond.</li> <li>This item is medium Verdana.</li> <li>This item is small Impact.</li> </ol> </body> </html> Ultima modifica di pako80 : 11-02-2014 alle 15:59.

20-12-2013, 12:54	#3
pako80 Senior Member Iscritto dal: Dec 2008 Messaggi: 326	ok grazie. Un altro dubbio, il pezzo di codice seguente è una lista non ordinata con una sottolista ordinata: Codice HTML: <li>Pizza: <ol style="background-color:red"> <li>Margherita</li> <li>Messicana <ul> <li>Con salame piccante</li> <li>Con salsiccia</li> </ul> </li> </ol> </li> se volessi scrivere in rosso solo la voce pizza è corretto aggiungere il paragrafo per farlo? Come mostrato di seguito funziona, ma non so se è il modo giusto. Codice HTML: <li><p style="font-family:Verdana;color:red">Pizza:</p> <ol style="background-color:red"> <li>Margherita</li> <li>Messicana <ul> <li>Con salame piccante</li> <li>Con salsiccia</li> </ul> </li> </ol> </li> se lo mettessi direttamente in Codice HTML: <li style="font-family:Verdana;color:red">Pizza: diventano rosse tutte le voci.

Strumenti
Mostra una versione stampabile Invia questa pagina per email