Proprio come una casa pulizie di primavera, il codice html delle pagine web dovrebbe ottenere la pulizia periodica pure. Nel corso del tempo, i cambiamenti e gli aggiornamenti sono fatti per una pagina Web, il codice può essere disseminato di file non necessari, rallentando i tempi di caricamento della pagina e danneggiando l'efficienza della vostra pagina web. Html ingombra può seriamente influire sulla classifica dei motori di ricerca.
Ciò è particolarmente vero se si utilizza un (What You See Is What You Get) WYSIWYG pacchetto di web design come FrontPage o Dreamweaver. Questi programmi si accelera la vostra creazione sito web, ma non sono così efficienti a scrivere codice html pulito.
Ci concentreremo questa discussione sul codice html reale, ignorando altri linguaggi di programmazione che può essere utilizzato in una pagina come JavaScript. Negli esempi di codice che verrà utilizzato (e) caratteri invece di html corretto in modo che gli esempi di codice verrà visualizzato correttamente in questa newsletter.
Fino a poco quando si scrive codice in una pagina HTML che sarebbe utilizzare i tag come il (font) e tag (p) tag di paragrafo. Tra questi tag sarebbe il nostro contenuto della pagina, testo, immagini e link. Ogni volta che è stata fatta una modifica alla formattazione dei tag nuova pagina sono stati necessari con la formattazione completa per la nuova sezione. Più recentemente abbiamo acquisito la capacità di utilizzare i fogli di stile a cascata, che ci permette di scrivere la formattazione una volta e poi fare riferimento al che la formattazione più volte all'interno di una pagina web.
Al fine di accelerare i tempi di caricamento delle pagine abbiamo bisogno di avere un minor numero di caratteri della pagina quando vengono visualizzati in un editor html. Visto che in realtà non desidera rimuovere uno dei nostri contenuti visibili abbiamo bisogno di guardare al codice html. Pulendo questo codice siamo in grado di rimuovere i caratteri, creando una pagina web più piccoli che verranno caricati più velocemente.
Nel corso del tempo HTML è cambiato e ora abbiamo molti modi diversi di fare la stessa cosa. Un esempio potrebbe essere il codice utilizzato per mostrare un volto grassetto. In HTML ci sono due scelte principali, il (forte) e il tag (b) di tag. Come si può vedere il (forte) tag utilizza 5 caratteri più del (b), tag, e se consideriamo il tag di chiusura e si vede che con il (forte) (/ strong) coppia di tag utilizza 10 caratteri più che il più pulito (b) (/ b) coppia di tag.
Questo è il nostro Primo Principio della pulizia del codice HTML: utilizzare il metodo più semplice di codifica disponibili.
HTML ha la capacità di codice all'interno di nidificazione altro codice. Per esempio potremmo avere una linea con tre parole in cui la parola mezzo era in grassetto. Ciò potrebbe essere realizzato modificando la formattazione del tutto ogni volta che cambia la formattazione del visibile. Consideriamo questo codice:
(Font face = "Times") Questa (/ font)
(Font face = "Times") (forte) grassetto (/ strong) (/ font)
(Font face = "Times") Word (/ font)
Questo occupa 90 caratteri.
Questo è il nostro Primo Principio della pulizia del codice HTML: utilizzare il metodo più semplice di codifica disponibili.
HTML ha la capacità di codice all'interno di nidificazione altro codice. Per esempio potremmo avere una linea con tre parole in cui la parola mezzo era in grassetto. Ciò potrebbe essere realizzato modificando la formattazione del tutto ogni volta che cambia la formattazione del visibile. Consideriamo questo codice:
(Font face = "Times") Questa (/ font)
(Font face = "Times") (forte) grassetto (/ strong) (/ font)
(Font face = "Times") Word (/ font)
Questo occupa 90 caratteri.
Questo è molto mal scritto html e è quello che a volte si ottiene quando si utilizza un editor WYSIWYG. Dato che la (font) i tag sono ripetendo le stesse informazioni si può semplicemente il nido delle (forti) all'interno del tag (font) tag, e meglio ancora utilizzare il (b) al posto del tag (forte) di tag. Questo ci darebbe questo codice (font face = "volte) Questa (b) grassetto (/ b) Word (/ font), occupando solo 46 caratteri.
Questo è il nostro Secondo Principio della pulizia del codice HTML: Utilizzare i tag annidati, quando possibile. Essere consapevoli del fatto che gli editor WYSIWYG si aggiornano frequentemente la formattazione con l'aggiunta di strati e strati di codice annidato. Così, mentre si sta pulendo il look codice ridondante codice nidificato messi lì dal vostro programma di editing WYSIWYG.
Un grosso problema con l'utilizzo di tag HTML è che abbiamo bisogno di ripetere il tag di codifica ogni volta che si cambia la formattazione. L'avvento dei CSS ci permette un grande vantaggio in codice pulito, permettendoci di disposizione la formattazione una volta in un documento, poi semplicemente riferirsi ad esso più e più volte.
Se avessimo sei paragrafi in una pagina che passare da due diversi tipi di formattazione, ad esempio titoli in Blue, Grassetto, Ariel, la dimensione del testo del paragrafo 4 e in Black, Times, misura 2, utilizzando i tag avremmo bisogno di lista che la formattazione completa ogni volta che si apporta una modifica.
(Font face = colore "Ariel" size = "blu" = "4") (b) La nostra voce (/ b) (/ font)
(Font face = "color volte =" "size =" nero 2 ") Il paragrafo (/ font)
(Font face = colore "Ariel" size = "blu" = "4") (b) Il titolo successivo (/ b) (/ font)
(Font face = "color volte =" "size =" nero 2 ") Il paragrafo successivo (/ font)
Vorremmo ripetere questa operazione per ogni titolo e il paragrafo, un sacco di codice html.
face = "Times") Word (/ font)Questo occupa 90 caratteri.
Questo è molto mal scritto html e è quello che a volte si ottiene quando si utilizza un editor WYSIWYG. Dato che la (font) i tag sono ripetendo le stesse informazioni si può semplicemente il nido delle (forti) all'interno del tag (font) tag, e meglio ancora utilizzare il (b) al posto del tag (forte) di tag. Questo ci darebbe questo codice (font face = "volte) Questa (b) grassetto (/ b) Word (/ font), occupando solo 46 caratteri.
Questo è il nostro Secondo Principio della pulizia del codice HTML: Utilizzare i tag annidati, quando possibile. Essere consapevoli del fatto che gli editor WYSIWYG si aggiornano frequentemente la formattazione con l'aggiunta di strati e strati di codice annidato. Così, mentre si sta pulendo il look codice ridondante codice nidificato messi lì dal vostro programma di editing WYSIWYG.
Un grosso problema con l'utilizzo di tag HTML è che abbiamo bisogno di ripetere il tag di codifica ogni volta che si cambia la formattazione. L'avvento dei CSS ci permette un grande vantaggio in codice pulito, permettendoci di disposizione la formattazione una volta in un documento, poi semplicemente riferirsi ad esso più e più volte.
Se avessimo sei paragrafi in una pagina che passare da due diversi tipi di formattazione, ad esempio titoli in Blue, Grassetto, Ariel, la dimensione del testo del paragrafo 4 e in Black, Times, misura 2, utilizzando i tag avremmo bisogno di lista che la formattazione completa ogni volta che si apporta una modifica.
(Font face = colore "Ariel" size = "blu" = "4") (b) La nostra voce (/ b) (/ font)
(Font face = "color volte =" "size =" nero 2 ") Il paragrafo (/ font)
(Font face = colore "Ariel" size = "blu" = "4") (b) Il titolo successivo (/ b) (/ font)
(Font face = "color volte =" "size =" nero 2 ") Il paragrafo successivo (/ font)
Vorremmo ripetere questa operazione per ogni titolo e il paragrafo, un sacco di codice html.
Con i CSS potremmo creare stili CSS per ogni tipo di formattazione, elencare i Stili volta nella intestazione della pagina, e poi semplicemente si riferiscono allo stile ogni volta che si apporta una modifica.
(Testa)
(Tipo style = "text / css")
(! -
. Style1 {
font-family: Arial, Helvetica, sans-serif;
font-weight: bold;
font-size: 24px;
}
. Style2 {
font-family: "Times New Roman", Times, serif;
font-size: 12px;
}
-)
(/ Stile)
(/ Capo)
(Corpo)
(P class = "style1") Titolo (/ p)
(P class = "style2") testo paragrafo (/ p)
(/ Corpo)
Si noti che gli stili sono creato nella sezione head della pagina e poi semplicemente riferimento nella sezione Corpo. Come si aggiungono più di formattazione dovremmo semplicemente continuare a fare riferimento al stili creati in precedenza.
Questo è il nostro terzo principio della Clean Codice HTML: utilizzare gli stili CSS quando mai possibile. CSS ha diversi altri vantaggi, come l'essere in grado di collocare gli stili CSS in un file esterno, riducendo così le dimensioni della pagina ancora di più, e la possibilità di aggiornare rapidamente la formattazione a livello di sito, semplicemente aggiornando il file esterno di stile CSS.
Così, con qualche semplice pulizia del codice HTML si può facilmente ridurre le dimensioni del file e fare un caricamento veloce, magro e avaro pagina web.
No comments:
Post a Comment