Come ottimizzare la velocità di rendering HTML

January 26

Siti web offrono un modo potenziale per le imprese e gli individui a connettersi con milioni di altri utenti su Internet. titolari di siti web dovrebbero sforzarsi di avere un sito web che è facile da usare e navigare. Essi possono anche beneficiare di ottimizzazione del codice HTML che alimenta il sito per migliorare la velocità di rendering. Non solo questo collegare i visitatori con il sito prima, ma può contribuire ad alleviare sforzo sul server che ospita le pagine Web, script e file di immagine.

istruzione

1 Rimuovere le immagini in eccesso, sostituendo le immagini di solo testo con il testo vero e proprio. Accorciare i valori di ALT di immagini esistenti e ottimizzare le immagini nel vostro programma di grafica per ridurre il tempo di caricamento. Aiuta anche specificare le dimensioni delle immagini nel codice. Per esempio:

<Img alt = "testo descrittivo" height = "100" width = "200">

2 Premere il tasto "Backspace" o "Elimina" sulla tastiera per rimuovere lo spazio bianco - come ad esempio le schede, gli spazi e le linee vuote - dalla codifica.

3 Rimuovere i commenti HTML che la gente può vedere solo quando si visualizza il codice sorgente della pagina. Quanto segue è un esempio di un commento HTML:

<! - Questo è visibile soltanto quando qualcuno guarda il sorgente della pagina .-->

4 Rimuovere meta tag non necessari dal capo della pagina. Se necessario, includere solo i meta-tag come le descrizioni e parole chiave sulle pagine Web critiche. Tuttavia, specificando un set di caratteri utilizzando meta tag in grado di garantire il rendering HTML più veloce. Quanto segue è il meta tag di default per la codifica dei caratteri:

<Meta http-equiv = "Content-Type" content = "text / html; charset = utf-8">

5 Spostare CSS dal corpo del documento alla testa del documento. Se i tag attuali usano di stile CSS, può sembrare simile a questo:

<Div style = "position: absolute; sinistra: 3px; top: 445px; width: 260px; z-index: 1"> testo </ div>

Dopo aver spostato il CSS per la testa, il documento sarà simile a questo

<Div id = "Layer1"> testo </ div>

con un blocco di CSS nella sezione head:

<Head>

<Style type = "text / css">

layer1

{

position: absolute; sinistra: 3px; top: 445px; width: 260px; z-index: 1

}

</ Style>