Pagreitinkite savo svetainę: optimizuokite CSS

Išdėstant svetainių stiliaus lakštus (Style Sheets) pakopomis padaro interneto svetaines labiau veiksmingas, nes tai leidžia naršyklėms surasti su stiliumi susijusią informaciją iš .css failų tiesiogiai, panaikinant būtinybę skaityti informaciją kiekvieną kartą iš naujo, kai kiekvienas puslapis yra įkeliamas vėl ir vėl. Net jei "Style Sheets" yra natūraliai efektyvesni nei HTML, jūs vis dar galite optimizuoti CSS kodą, kad padarytumėte savo svetainę švaresnę ir greitesnę.

Pirmiausia pabandykite rasti išskaidytą kodą ir apdoroti jį kartu. Pavyzdžiui vietoj:

margin-top: 10px;
margin-right: 20px;
margin-bottom: 10px;
margin-left: 20px;

jūs geriau naudokite: 

margin: 10px 20px 10px 20px; 

Vietoj:
<p class="decorated">A paragraph of decorated text</p>
<p class="decorated">Second paragraph</p>
<p class="decorated">Third paragraph</p>
<p class="decorated">Forth paragraph</p> geriau naudoti:
<div class="decorated">
<p>A paragraph of decorated text</p>
<p>Second paragraph</p>
<p>Third paragraph</p>
<p>Forth paragraph</p>
</div>

Be to, jūs taip pat galite pabandyti CSS optimizavimo įrankį, pvz. CleanCSS. Šie įrankiai yra skirti sujungti panašius sektorius, pašalinti nereikalingas savybes, pašalinti tarpus ir pan.

 Pagreitink savo svetainę serija:

•     Optimizuokite vaizdus.

•     Vaizdo formatai.

•     Optimizuokite jūsų CSS.

•     Naudokite įžambų brūkšnį (Slash) nuorodose.

•     Naudokite Height ir Width žymes, ( aukštis plotis).

•     Sumažinti HTTP užklausas...

 

Pagreitink savo svetainę - paveikslėlių formatai

Pirmojoje šios serijos dalyje aptarėme, kaip optimizuoti atvaizdus, siekiant sumažinti jų dydį ir dėl to svetainės užsikrovimo laiką. Reikėtų žinoti, kad taip pat svarbu yra pasirinkti ir tinkamą formatą. Turėtumėte naudoti GIF, PNG ir JPEG formatus atsižvelgiant į pasirinkto paveikslėlio tipą ir jūsų svetainę dydžio apribojimus. Žemiau keletas gairių apie kiekvieną formatą:

JPEG: Šis formatas buvo sukurtas nuotraukoms ir dailės darbams. Jūs turėtumėte naudoti JPEG vaizdus, kai jūs rodote nuotrauką ar tikrų spalvų vaizdą. Atkreipkite dėmesį, kad jei jūs naudojate suspaudimą, kad sumažinti failo dydį, jums reikia naudoti 50% suspaudimo norma kad gauti optimalų rezultatą.

GIF: šis formatas yra susijęs su interneto istorija, daugiausia dėl savo mažo dydžio. JPEG vaizdai yra paremti milijonais spalvų, o GIF integruoti daugiausiai 256 spalvų. Jūs turėtumėte naudoti šį formatą vienodų spalvų vaizdams, pavyzdžiui, logotipams, mygtukams ar teksto vaizdams. GIF yra taip pat pasirinkimo formatas animuotiems vaizdams.

PNG: šis formatas buvo sukurtas specialiai internetui tikslu pakeisti GIF vaizdus. Pagrindinis privalumas PNG vaizdų lyginant su GIF yra tai, kad jie palaiko 24-bitų spalvas ir alfa skaidrumą. Tai sako mums, kad ne visos naršyklės atpažinti kai kurias PNG savybes. Turėtumėte naudoti PNG formatą paprastiems vaizdamss, kurie reikalauja daugiau nei 256 spalvas.

 Pagreitink savo svetainę serija:

•     Optimizuokite vaizdus.

•     Vaizdo formatai.

•     Optimizuokite jūsų CSS.

•     Naudokite Slash ant jūsų nuorodų.

•     Naudokite Height ir Width žymes, ( aukštis plotis).

•     Sumažinti HTTP užklausas...