Išreikšdami IT

Optimizuokite vaizdai

Optimizavimas paprasčiausiai reiškia išlaikyti vaizdo mažo palaikymo paveikslėlio padidinta iki reikalaujamo lygio kokybę, dydį. Yra apkrovų procedūrų, kad vieną kartą gali atlikti optimizuoti vaizdus, ​​kol jie yra pakraunami į serverį pristatymo. Įrankiai, kad mes naudojame šių vaizdų kūrimo (Photoshop, fejerverkai ir tt) paprastai turi įrankius, kurie leidžia naudotojams optimizuoti interneto naudojimo vaizdas.
• Patikrinkite, GIF, norėdami pamatyti, jei jie naudoja atitinkamą vaizdo spalvų paletės dydis. Kai atvaizdas naudoja 4 spalvas ir 256 spalvų paletę, tada vaizdas galėtų būti dar labiau optimizuota

• Konvertuoti GIF priemonę yra PNG ", kur įmanoma ir pamatyti, jei yra taupymas. Dažniau, nei ne, nėra. Nedvejokite naudoti PNG, nes jie visiškai pritarė dauguma dažniausiai naudojamų naršyklių. Tikėtis animacijos galimybėmis, PNG gali daryti tai, ką GIF, įskaitant skaidrumą.

• CSS sprites naudojamų vaizdų, teikti Sprite horizontaliai o ne vertikaliai paprastai rezultatų failo dydis mažesnis vaizdus. Be to, derinti vaizdus su panašiais į Sprite spalvų. Tai padeda norite išsaugoti spalva skaičius mažas, idealiai iki 256 spalvų, kad tilptų į PNG8.

• Jei naudojate favicon.ico, kad jis mažas, pageidautina pagal 1K.

Naudokite tinkamai mastelis / dydis vaizdas.

Visada stenkitės ir naudoti sumažinto vaizdus, ​​ty nenaudokite didesnį vaizdą, kaip jums reikia tik todėl, kad galite nustatyti plotį ir aukštį HTML,. Jei reikia rodyti 100px X 100px paveikslėlį puslapyje, tada nereikia naudoti masto žemyn 200x200px įvaizdžio.

Naudokite Progresyvios vaizdai

Interneto naršyklė jau teikia vaizdai palaipsniui. Norėdami tai padaryti dar geriau, tiesiog įrašykite savo GIF ar PNG paveikslėlius su "susipynę" variantą, ar jūsų JPEG vaizdus su "palaipsniui" variantą.

Vyksta diskusijos tarp interneto vartotojų, ar progresuojančia vaizdo naudojimas yra palaima ar kliūtis. Be to, laipsniškas vaizdas sveria maždaug 20% ​​daugiau nei jos nėra laipsniškai kolega. Taigi, Jei manote, kad jūs išdėstymas naudoja vaizdus, ​​kad netrukdys vartotojo patiriamas įspūdis, kad laipsniškas, jaustis laisvai tai padaryti.

Įtraukti JavaScript HTML dokumento apačioje

Jei neturite document.write (arba bet dinamiškas kartos puslapio turinio JAVASCRIPTS) įterpti puslapio turinio dalį savo scenarijų, perkelti scenarijų pareiškimą puslapio apačioje, prieš žymelės "body pabaigoje.
HTTP/1.1 specifikacija rodo, kad naršyklės atsisiųsti ne daugiau kaip du komponentus kartu per hostname. Jei tarnauti savo atvaizdus iš kelių pavadinimų as, galite gauti daugiau nei du parsisiųsti vykti lygiagrečiai. Nors scenarijus atsisiųsti, tačiau naršyklė nebus pradėti bet kokius kitus parsisiųsti, net skirtingų kompiuterių pavadinimus.
Yra būdų, dinamiškai sukurti SCRIPT mazgų ir įkelti nuotolinio scenarijus, po to, kai puslapis yra įkeliamas naudojant AJAX.

Išorę jums JavaScript-

Naudojant išorinius JavaScript failus greičiau pakrovimo puslapių, nes JavaScript failai talpyklos naršyklės. Inline JavaScript "HTML dokumentų siųstis kiekvieną kartą, HTML dokumentas yra prašoma. Tai iš tiesų gali sumažinti skaičių HTTP prašymus, tačiau vėliau padidėja HTML dokumento dydį. Išorinis JavaScript talpyklos naršyklės HTML dokumento dydis sumažinamas nedidinant HTTP užklausas.
Atkreipkite dėmesį, kad, jei jūsų svetainės vartotojai turi keletą puslapių peržiūrų per sesiją, ir daugelis iš jūsų puslapiuose vėl naudoti tie patys scenarijai ir stilių, yra didesnė nauda iš talpyklos išorinius failus.

Pakuotėje Jūsų Javascript failus

JAVASCRIPTS atveju, skirtingai nuo CSS failai krizės paliestose naudojant kai kuriuos standartinius algoritmus, kurie duotų mažesnį failo dydį, nei paprasčiausiai pašalinti tarpų ir skirtukus. Javascript Pakuotojo pavyzdį galima rasti čia http://dean.edwards.name/packer/

Atsikratyti bet kokius pasikartojančius Skriptai

Tai labai neįprasta, kad ištisi scenarijai gali būti dubliuojamas, bet iš dešimties geriausių JAV interneto svetainių apžvalga rodo, kad du iš jų yra besidubliuojančių scenarijų. Dubliuoti scenarijus, bet akivaizdžiai sumažina našumą sukurti nereikalingas HTTP užklausas ir švaistomi JavaScript vykdymas.
Be to, daugeliu atvejų, nors scenarijus pavadinimai skiriasi, yra pasikartojančius scenarijų tikimybė, per tą patį puslapį, atsižvelgiant į komandos dydį ir skaičių scenarijų.

Sumažinti, kur galima gauti DOM elementus

Prieiga prie DOM elementus su JavaScript yra lėtas, todėl, kad būtų labiau atsižvelgiama į puslapį, turėtumėte:
• Cache nuorodos, prieinamų elementų
• Atnaujinti mazgai "offline" ir tada įtraukite juos į medį
• Venkite nustatant išdėstymą su JavaScript

Atskiras elgesys nuo turinio ir pateikimo

Lygiai taip pat, kaip mes atskira pristatymas (CSS / XSLT), turinį (XHTML / XML), mes taip pat turėtų atskirti elgesys (JavaScript). Tai vadinama nekrenta į akis veikiancio Javascript. Lygiai taip pat mes susieti išorinių failų CSS, turėtume susieti su išorės javascript failus.

Vietoj kietojo kodavimo į jų turinį (pvz., onmouseover, onclick ir tt) elgesį, elgesys turėtų būti dinamiškai pridėti elementų, klasių ir unikalių elementų (IDS), naudojant DOM. Pamatinis dokumentas, turinys, turėtų turėti tik galiojantį XHTML / XML ir neturi JavaScript.
"Javascript" turėtų papildyti turinį, pridedant elgesį. Turinys neturėtų būti naudinga ir naudoti be JavaScript arba be visiško javascript paramos).

Aš išgelbėti šį straipsnių amžiaus atgal, taip gaila! I dont prisiminti šaltinį ... bet atrodė naudinga, mums, kurie turi žinoti apie auditoriją, kuriam mes sukurti svetainę ... todėl čia i yra

Puslapis svoris gali būti naudojama siekiant nustatyti įvairių interneto greitis atsisiuntimo laikas tam tikroje puslapio. Pavyzdžiui, toliau pateiktoje lentelėje rodo atsisiuntimo laikas trijų skirtingų puslapių vienu populiariausių prisijungimo greitį.

Privalumai sumažinti puslapiu svorio?

Teigiamas poveikis sumažinti puslapio svorio naudinga interneto svetainių savininkams ir vartotojams. Potencialus nauda apima:

1. Puslapiai įkeliami greičiau. Akivaizdžiausias poveikis sumažinti puslapio svorio yra, kad jūsų svetainės puslapiai bus įkeliami greičiau lankytojams, nepriklausomai nuo jų ryšio greitį.
2. Mažesnės puslapio įkelties laikas sukurti daugiau patogūs lankytojams. Lankytojai yra mažiau tikėtina, susierzinsite ir eiti kitur jei jūsų puslapiuose apkrova greitai. Kita vertus, ilgai krautis puslapiai vienas tikriausias būdų prarasti lankytojams bei potencialiems klientams.
3. Greičiau apkrova kartus prisidės prie didesnio konvertavimo. Daugiau lankytojai liks jūsų svetainė ilgiau. Daugiau iš jų bus baigti apsiperkant, užsiregistruoti savo naujienas, ar knyga ženklinimo savo svetainę.
4. Jūsų prekinio ženklo suvokimas bus sustiprintas. Sugrįžtantys klientai ir pirmą kartą lankytojai tiek bus labiau linkę aprašyti savo svetainę (ir verslo) kaip "profesionalu", jei jūsų puslapiuose apkrova greitai.
5. Puslapiai su švaraus, kieto kodą dažnai bus indeksuojami daugiau natūralių paieškos sistemų.
6. Puslapiai, optimizuotas svorį iš tikrųjų galite sutaupyti mokesčius pralaidumo intensyvaus eismo vietose. 100.000 puslapių kiekviena sveria 150 KB reikės dvigubai daugiau nei 100.000 puslapių per mažiau kaip 75 KB duomenų srauto, iš savo ISP. IPT, kad imti pralaidumo naudojamas arba Galiojimo laikas, šis sumažinimas gali sukurti žymiai sutaupyti dėl pralaidumo mokesčius.

Apsvarstykite šiuos duomenis, skelbtus ataskaitos

Jei naudodami XML / XSL transformacija yra jūsų domian, tada yra laikas, kai mes nori dinaminį kodas peice, kuris bus naudojamas bibliotekos elementą (turi būti pakartotinai naudoti). Ką reiškia, tikriausiai galėtų būti aiškesnė Šiame pavyzdyje scenarijų.

Įsivaizduokite, kad kuriate svetainę (naudojant XML, XSL transfroms Žinoma) ir daugelis puslapių galėtų turėti Komentarai modulis. Gerai! tada kopijuoti arba įklijuokite šį kodą į kiekvieno puslapio šablone, kurias I dont pasakyti, bet įsitikinkite, techninės priežiūros ir remontuoti košmarą) arba dar geriau, galite sukurti bylą įtraukti, kurie galėtų būti ištrauktas, kur kada nors jūs norite savo puslapyje ( ai) ...
Taigi, kaip mes sukurti XSL Įtraukti failą ir įtraukti jį viduje kitos XSL failą? Štai kaip ...

Tik, kad viskas būtų aišku ... čia yra greitas failų sąrašą, kad galėtumėte sukurti ... čia bus, įskaitant informaciją apie vaisių ir daržovių į pradinio puslapio "maisto.

1. food.xml - XML ​​duomenų failą, kuris bus taikomos transformacija
2. food.xsl - pagrindinis XSL failą, kuris pakeis mūsų food.xml
3. inc_fruits.xsl - XSL failą, kuris perteiks vaisiai duomenis
4. inc_vegtables.xsl - XSL failą, kuris perteiks vetetables duomenis

I dont think turiu paaiškinti daug, pirmiau minėtais elementais kodai, bus savaime suprantama ...

FOOD.XML


<?xml version="1.0" encoding="ISO-8859-1"?>
<?xml-stylesheet type="text/xsl" href="food.xsl"?>
<food>
<date>July 2008</date>
<description>All about things we eat everyday</description>
<fruits type="tropical">
<item name="mango" moreinfo="http://www.mango.com">Mango is the king of fruits</item>
<item name="banana" moreinfo="http://www.banana.com">Banana once a day , keeps the doctor away</item>
<item name="orange" moreinfo="http://www.orange.com">Orange is the color and rich in vitamin C</item>
<item name="Papaya" moreinfo="http://www.papaya.com">Papaya - Hot when raw, cold when ripe</item>
</fruits>

<vegetables>
<item name="spinach" moreinfo="http://www.spinach.com">Spinach is full of iron</item>
<item name="asparagus" moreinfo="http://www.asparagus.com">Asparagus contains loads of vitamin D </item>
<item name="fenugreek" moreinfo="http://www.fenugreek.com">Fenugreek is rich in vitamin C</item>
</vegetables>
</food>


<?xml version="1.0" encoding="ISO-8859-1"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:include href="inc_fruits.xsl" />
<xsl:include href="inc_vegetables.xsl" />
<xsl:template match="/">
<html>
<head>
<title>Title</title>
</head>
<body>
<h3><xsl:value-of select="/food/description" /></h3>
Modification Date : <xsl:value-of select="/food/date" />
<hr/>
<h5> About Fruits</h5>
<xsl:call-template name="about_fruits"/>

<hr/>
<h5> About Vegetables</h5>
<xsl:call-template name="about_vegetables"/>

<hr/>
</ Body>
</ Html>
</ XSL: template>
</ XSL: Stilių>

<?xml version="1.0" encoding="utf-8"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:output method="html" encoding="iso-8859-1" />
<xsl:template name="about_fruits">
<xsl:for-each select="/food/fruits/item/@*">
attribute name : <xsl:value-of select="name()"/>
attribute value : <xsl:value-of select="."/> <br />
</xsl:for-each>
</xsl:template>
</xsl:stylesheet>

<?xml version="1.0" encoding="utf-8"?>
<xsl:stylesheet version="1.0" xmlns:xsl="http://www.w3.org/1999/XSL/Transform">
<xsl:output method="html" encoding="iso-8859-1" />
<xsl:template name="about_vegetables">
<xsl:for-each select="/food/vegetables/item/@*">
attribute name : <xsl:value-of select="name()"/>
attribute value : <xsl:value-of select="."/> <br/>
</xsl:for-each>
</xsl:template>
</xsl:stylesheet>

Atsisiųsti visus failus čia (255 parsisiųsti)