Questa è la seconda "puntata" di consigli a chi ha un blog e non conosce il linguaggio HTML. Nella prima parte abbiamo parlato della struttura della pagina adesso parliamo della struttura del testo. Come concetto generale le tag possono essere inserite una all'interno di un'altra (identazione) ma devono essere chiuse nella giusta successione perché altrimenti non si sa che tipo di risultato otteniamo. Il concetto è lo stesso di quello delle parentesi nelle formule matematiche. All'interno di una parentesi quadra puoi mettere parentesi tonde ma devi chiuderle prima di chiudere quella quadra. Utilizziamo questo strumento online per visualizzare immediatamente le tag che abbiamo scritto. La sintassi è la seguente
<tag attributo>testo</tag> (1)
I tag possono essere scritti indifferentemente in maiuscolo o minuscolo. Per quanto riguarda il titolo di un post ci sono sei diversi tag per determinarne la grandezza e sono in forma decrescente ma solo i primi quattro sono realmente diversi
| <h1>titolo 1 </h1> | titolo 1 |
| <h2>titolo 2 </h2> | titolo 2 |
| <h3>titolo 3 </h3> | titolo 3 |
| <h4>titolo 4 </h4> | titolo 4 |
| <p> paragrafo</p> | lascia una riga vuota prima dell'apertura e una dopo la chiusura |
| <div> blocco di testo </div> | va a capo ma non lascia spazi prima dell'apertura e dopo la chiusura |
| <span> contenuto in linea </span> | lascia il testo nella stessa linea (p.e. se si vuol cambiare colore al testo) |
Per allineare un testo si dovrebbero usare i fogli di stile ma per dare un'idea di come si faccia basta ricordare la sintassi della (1) e mettere al posto dell'attributo align left right justify secondo lo schema seguente
| testo allineato a sinistra | <p align="left">testo</p> |
| testo allineato a destra | <p align="right">testo</p> |
| testo giustificato | <p align="justify">testo</p> |
Per vedere come funziona provate a selezionare, copiare ed incollare la seconda colonna della tabella nello strumento online per editare HTML. Il primo e terzo vi verranno sulla sinistra mentre il secondo andrà tutto a destra.
Per andare a capo esistono i tag <br> <br/>, alcuni mettono un <p> senza tag di chiusura. Un tag secondo me utile anche per un blogger di poche pretese è <hr> che serve per tracciare una linea orizzontale come potete verificare con lo strumento online e che può servire in alcuni post
per evidenziare meglio talune parti dell'articolo.
Per finire ecco la tabella dei tag per definire gli stili più importanti
| testo in grassetto | <b>testo in grassetto</b> |
| testo in corsivo | <i>testo in corsivo</i> |
| testo sottolineato | <u>testo sottolineato</u> |
| <strike>testo barrato</strike> |
Ecco il risultato visualizzato in questo screenshot; per chiarezza ho aggiunto il tag <br/> per andare a capo
Preziose informazioni pr me. Sono agli inizi, di cui hai parlato... :-)
RispondiEliminaCiao Ernesto,
RispondiEliminain questo periodo sto studiando un po' i tag h1, h2, h3, ecc.
Allora, ho scoperto che il fatto che Blogger associ automaticamente questi tag non è poi così positivo, in quanto non lo fa proprio nel modo corretto.
Ad esempio, ad h1 viene associato il titolo del blog, ad h2 le date degli articoli, ad h3 se non sbaglio i titoli dei widget e così via.
Cioè, i titoli dei post non vengono nemmeno considerati, anche se teoricamente sarebbe consigliato impostarli come h1.
So che è possibile cambiare le impostazioni assegnate da Blogger ai tag h1, h2, h3, ecc. andando a modificare il modello html, e ho visto qualcosina in merito sul forum di Blogger, ma non abbastanza da mettere mano al template rischiando di combinare qualche casino. Mi chiedevo se per caso tu hai trattato o hai in mente di trattare l'argomento in futuro, o se preferisci lasciare i tag h1 & co. così come stanno ;)
Grazie,
Giuliana
In aggiunta a quanto sopra, posso chiederti cosa ne pensi delle modifiche suggerite nell'articolo sotto per rendere il blog più seo-friendy?
Eliminahttp://seoblog7.blogspot.it/2010/03/h1-h2-h3-basic-guide-settings-to-make.html
@DietaEDintorni
EliminaMi hai linkato una guida interessante ma mi chiedo, se funzionasse perché non è lo stesso team di Blogger a cambiare il codice. Personalmente uso i tag dei titoli durante la pubblicazione dei post con l'Editor di Blogger.
Prima preparo l'articolo con WLW e lo inserisco come bozza su Blogger. Oltre alla Descrizione riguardo alle Preferenze di ricerca sulla destra, se è il caso, inserisco dei titoli secondari con l'apposito strumento di Blogger che ho presentato alla fine di questo post
http://www.ideepercomputeredinternet.com/2012/03/come-personalizzare-le-preferenze-di.html
Seleziono cioè un titolo di un paragrafo del post e lo denoto come Intestazione secondaria o Intestazione minore. Poi è chiaro non sono un mago e non so cosa potrebbe portare più benefici. Per i vecchi post, se li riapro per qualche ragione faccio anche delle modifiche in questo senso altrimenti lascio perdere.
P.S. Il post che mi hai indicato è stato pubblicato nel Marzo del 2010 come si evince anche dal suo URL, quindi da allora ne è passata di acqua sotto i ponti :)
EliminaSai, anch'io mi sono fatta la tua stessa domanda, cioè, se funzionasse perchè non ci penserebbe Blogger stesso?
EliminaSo che è meglio non avere più di un h1 per pagina, e quindi per ora ho fatto un unico cambiamento: ho passato i titoli dei post da h3 a h2, voglio vedere cosa succede. Mal che vada, posso sempre tornare indietro.
Ti chiedo un consiglio: secondo te i titoli dei widgets (che originariamente Blogger imposta come h2) è meglio che li lascio così o li passo in h3, che ora (avendo passato i titoli dei post da h3 a h2) risulta inutilizzato?
(Sembra una partita a scacchi detta così ;)
Grazie ^^
@DietaEDintorni
EliminaNon ho idea di quale sia la scelta migliore, credo che sia comunque abbastanza irrilevante. Tra h2 e h3 è Google poi che fa la differenza
Ho notato che con i tag "p" invece di "br" o "div" per andare a capo quando per dare ossigeno al testo l'articolo venga considerato meglio ottimizzato per la SEO. Ho notato che blogger automaticamente inserisce "div" quando si va a capo, ma esiste un modo per dirgli invece di usare il tag "p"?
RispondiEliminaIo ammetto che ho sempre abusato di "br" e credo di aver sempre sbagliato...
Io uso sempre il tag < p > perché non uso l'editor di Blogger ma Open Live Writer dove se si va a capo viene inserito un nuovo paragrafo con il < p >, tag che rimane anche quando posto l'articolo come bozza su Blogger. Dubito però che ci siano differenze di SEO.
Elimina@#