Annuncio pubblicitario
Mio HyperText Markup Lle abilità di anguage (HTML) sono arrugginite per certo, ma forse questo mi qualifica per questo articolo. Indietro nel giorno in cui Amici era ancora in TV e AOL inviava giornalmente sottobicchieri e mini-frisbee gratuiti, creavo siti Web da caricare su modem dial-up. Col passare del tempo, ho avuto il coraggio di pensare che ci sono ancora molte persone là fuori con connessioni non a banda larga (dial-up) e ho continuato a progettare siti web basati su questo.
Alla fine mi sono arreso web design e sviluppo Vuoi imparare il web design? 7 canali YouTube per iniziareYouTube ha migliaia di video e canali per i principianti del web design. Qui diamo un'occhiata ad alcuni dei migliori per iniziare. Leggi di più quando la qualità del contenuto ha iniziato a farsi da parte per quantità di contenuto. Siti flash, molte immagini, pop-up, pop-under, cursori, ecc. Fidati del tuo contenuto di qualità e non hai bisogno di questa lanugine. Fidati dei tuoi contenuti e puoi rendere il tuo sito Web incredibilmente veloce.
Con un sito Web ospitato su un servizio gratuito, è più veloce decisamente meglio. Perché? Perché "libero" tende ad attrarre molte persone e il server deve creare la tua pagina più migliaia di pagine di altre persone che non sono ottimizzate. È come provare a passare un convoglio di tronchi di Kenworth con i maiali di Jimmy Haulin. Ma se hai una piccola Porsche, diventa molto più facile da fare.
Ecco alcuni consigli per tagliare il grasso, in nessun ordine particolare.
1. Usa le tabelle con parsimonia
Le tabelle sono un catch-22. All'inizio venivano utilizzati per definire il design e per mettere il contenuto in formato tabella. Man mano che i layout di progettazione diventavano più complessi, le tabelle diventavano più grandi e nidificate più in profondità, e ciò significa sempre un rallentamento del tempo di caricamento.
Cascading Style Sheets (CSS) è arrivato e ha davvero aiutato il problema dell'utilizzo delle tabelle per il layout. Sfortunatamente, i produttori di browser non sono riusciti a avvolgere la testa attorno all'idea degli standard - e ancora non possono. Ciò che sembrava fantastico nei CSS in Firefox sembrava la colazione di un cane in IE e probabilmente non veniva nemmeno visualizzato in Safari. Non farmi iniziare IE5 su un Mac. Sono ancora in terapia per quello.
Utilizzare solo tabelle per il layout del contenuto che deve essere in a formato tabulare Tableizer: Genera tabella HTML da foglio di calcolo Excel Leggi di più - come un listino prezzi o statistiche di hockey. Ciò riduce il numero di tabelle e la profondità di annidamento, il che significa tempi di caricamento più rapidi. Apprendimento dei CSS I 5 migliori siti per imparare i CSS online Leggi di più farà una grande differenza, se devi avere un layout elaborato.
2. Usa HTML per creare colore
Sì, sono canadese, quindi è a colori con un "tu" per me. So che HTML è incentrato sull'America, quindi l'attributo è "color". Impara il tuo codici colore esadecimali e utilizzali per ravvivare i contenuti anziché le immagini.
Prova ad aggiungere l'attributo color ai tuoi elementi HTML per renderlo più piccante. Funziona particolarmente bene nelle tabelle o nel tag body, in questo modo:
Se fossi un browser, saresti più veloce nel caricare un semplice 7 caratteri di #FF00FF o un'immagine di 10 × 10 pixel del colore fucsia qualche migliaio di volte? Questa è una domanda retorica, tu in fondo alla fila. Metti giù la mano.
3. Collegamento a script / fogli di stile
Se ne usi un certo JavaScript (JS) o CSS ripetutamente nel tuo sito web, pensa a creare il proprio file e chiamarlo, invece di metterlo su ogni pagina. Poiché un browser tende a memorizzare nella cache un file e a chiamarlo prima di verificare con il server, il tuo browser avrà già quello script o CSS pronto per l'uso. Questo significa meno HyperText Transfer Pchiamate di protocollo (HTTP) che significa una pagina di caricamento più veloce.
Come chiamare un JavaScript esterno:
–>
Perché ho inserito quei tag di commento attorno alla chiamata per JavaScript? Perché non tutti i browser sono impostati per leggere gli script. L'aggiunta dei tag di commento fa sì che i browser con lo scripting disabilitato lo ignorino, anziché dare fastidiosi messaggi di errore.
Come chiamare un foglio di stile a cascata esterno:
È così semplice. L'attributo href è dove si imposta la posizione del foglio di stile. Il resto degli attributi indica al browser qual è quel file, quindi sa cosa farne.
Alcuni sviluppatori potrebbero utilizzare il @importare metodo per chiamare un foglio di stile. In Internet Explorer, è come avere il tuo tag nella parte inferiore del file, causando il caricamento dell'intera pagina e quindi il rendering degli stili su di esso. Non bene.
4. Combina i tuoi script comunemente usati in un unico file
Molti sviluppatori web useranno gli stessi script più e più volte. Forse c'è uno script dell'orologio e uno script del calendario e forse una sorta di script con effetti speciali che useranno su ogni pagina. Invece di avere 3 file separati, con 3 chiamate HTTP separate, metti gli script in un file e chiamali una volta. Ciò riduce le tue chiamate HTTP del 66% e viene anche memorizzato nella cache. Acceleri il demone, tu! Prima di alzare di nuovo la mano, sì, puoi fare la stessa cosa con i file CSS.
5. Non utilizzare HTML per modificare le dimensioni delle immagini
Se vuoi usare un'immagine di 1000 × 1000 pixel sulla tua pagina web, ma vuoi che sia solo 250 × 250 pixel, modificala in un editor di immagini. Alcune persone "restringono" l'immagine usando HTML in questo modo:
Se l'immagine di 1000 × 1000 pixel ha una dimensione di 2 MB, il ridimensionamento con HTML non riduce le dimensioni del file! In effetti, il caricamento potrebbe richiedere più tempo, perché ora il browser deve mettere 10 libbre di cacca in un sacco da 2 libbre, per così dire. Non è un compito facile.
Spero che questi suggerimenti ti possano aiutare. Dammi un messaggio nei commenti se li usi o hai altre idee di ottimizzazione HTML da condividere.
Con oltre 20 anni di esperienza in IT, formazione e scambi tecnici, è mio desiderio condividere ciò che ho imparato con chiunque sia disposto a imparare. Mi sforzo di fare il miglior lavoro possibile nel miglior modo possibile e con un po 'di umorismo.
