2008 15 toukokuu 2008

Parhaat käytännöt: Työskentely JavaScript n

Sisällytä JavaScript n alareunassa HTML-asiakirja

Jos sinulla ei ole document.write (tai dynaaminen polven Sivujen sisällön avulla javascriptit) lisätä osa sivun sisältöä sivusi, siirrä käsikirjoitus sisältää lausuman sivun loppuun, ennen body.
HTTP/1.1 erittely osoittaa, että selaimet ladata korkeintaan kaksi komponenttia rinnakkain kohti hostname. Jos näytät kuvia useista isäntänimiä, voit saada enemmän kuin kaksi lataukset esiintyy rinnakkain. Kun käsikirjoitus ei lataamista, mutta selain ei aloita mitään muita ladattavia, jopa eri isäntänimiä.
On myös tapoja dynaamisesti luoda SCRIPT solmut ja ladata kauko-skriptien kun sivu ladataan AJAX.

Ulkoistaa te JavaScript n

Ulkoisen JavaScript tiedostot mahdollistaa nopeammat kuormitus sivut, koska JavaScript tiedostot välimuistiin selaimen. Inline JavaScript n 'HTML-asiakirjoissa saa ladata aina HTML asiakirja on pyydetty. Tämä voi todella vähentää määrää HTTP-pyyntöjen mutta sen jälkeen koko kasvaa HTML asiakirjan. Ulkoiset JavaScript n välimuistiin selaimen, koko HTML asiakirjan pienenee lisäämättä määrää HTTP-pyyntöjä.
Huomaa, että jos käyttäjät sivustossasi on useita sivun näyttökertaa istunto ja monet sivut uudelleen käyttää samaa skriptit ja stylesheets, on paremmat mahdollisuudet hyötyä välimuistiin ulkopuolisista tiedostoista.

Pakkaa Javascript tiedostot

Jos JavaScript, toisin kuin CSS-tiedostot voisi crunched käyttäen joitakin standardin algoritmeja, jotka antaisivat vähemmän tiedostokoko kuin yksinkertaisesti poistamalla välilyönneillä tai tabulaattorilla. Esimerkki javascript pakkaajan löytyvät täältä http://dean.edwards.name/packer/

Päästä eroon kaikista Duplicate Scripts

On erittäin harvinaista, että koko skriptejä voidaan monistaa, mutta uudelleen kymmenen eniten Yhdysvaltojen web-sivustojen mukaan kaksi niistä sisältävät päällekkäisiä käsikirjoituksen. Monista skriptejä mutta ilmeisesti heikentää suorituskykyä luomalla tarpeettomia HTTP-pyyntöjä ja hukkaan JavaScript-koodin suoritus.
Myös monissa tapauksissa, mutta skriptit nimet ovat erilaiset, on todennäköistä, kaksoiskappaleen skriptien saman sivun johtuen ryhmän kokoa ja määrää skriptien.

Minimoi pääsy DOM elementtien mahdollisuuksien

Pääsy DOM elementtejä JavaScript hitaasti niin, jotta entistä paremmin vastaamaan sivun, sinun pitäisi:
• Cache viittauksia näytetty elementtien
• Päivitä solmuja "offline", ja lisää ne puuhun
• Vältä vahvistamisesta ulkoasun kanssa JavaScriptin

Erillinen käyttäytymistä sisältöä ja esittämistapaa on

Aivan kuten me erillisenä Esitys (CSS / XSLT) Content (XHTML / XML), meidän pitäisi myös erottaa Behavior (Javascript). Tätä kutsutaan huomaamattomia Javascriptiä. Aivan kuten me linkittää ulkoiseen CSS-tiedostoja, meidän pitäisi linkittää ulkoisia javascript tiedostoja.

Sijaan kovaa koodausta käyttäytymisestä sisältöä (esim. onmouseover, onclick yms.), toiminta olisi dynaamisesti lisätä elementtejä, luokat ja ainutlaatuinen elementtejä (tunnukset) käyttäen DOM. Perustava asiakirja, sisältöä, pitäisi olla vain voimassa XHTML / XML eikä javascriptiä.
Javascript pitäisi lisätä sisältöä lisäämällä käyttäytymistä. Sisällön tulisi pysyä hyödyllinen ja käyttökelpoinen ilman javascriptiä (tai ilman täyttä javascript-tuki).


2008 07 toukokuu 2008

Parhaat käytännöt: Ole tietoinen sivun painon

Olen tallentanut tämän artikkelin aikojen takaisin, joten Sorry! En muista lähdettä ... mutta se tuntui hyötyä, meille, jotka on oltava tietoisia siitä yleisö, joille kehitämme sivuston ... joten tässä i on

Sivun paino voidaan käyttää määrittämään latausaika tietyn sivun erilaisia ​​Internet-yhteys nopeuksilla. Esimerkkinä voidaan mainita, seuraavat taulukossa lataus kertaa kolmen eri sivua useita suosittu yhteyden nopeuksilla.

Page Paino Download Times

Yhteysnopeus

20 Kb sivu

40 kt sivu

100 Kb sivu

14,4 kbps

12 sekuntia

25 sek

62 sek

28.8 Kbps

6 sekuntia

12 sekuntia

31 sekuntia

33,3 Kbps

5 sek

10 sek

26 sekuntia

56 kbps (V.90)

2 sek

5 sek

13 s

64 Kbps (ISDN)

2 sek

4 sek

12 sekuntia

128 Kbps (DSL / kaapeli)

1 s

2 sek

6 sekuntia

256 Kbps (DSL / kaapeli)

<1 s

1 s

3 s

Edut vähentää sivun painoa?

Positiivinen vaikutus vähentää sivun painoa hyödyttää sekä sivustojen omistajat ja kuluttajat. Mahdollisia etuja ovat:

  1. Sivut latautuvat nopeammin. Ilmeisin vaikutus vähentää sivun painoa on, että sivustosi sivut latautuvat nopeammin vierailijoille, riippumatta yhteyden nopeudesta.
  2. Alempi sivujen lataamista luoda mukava kävijöitä. Vierailijat ovat vähemmän turhautuvat ja menevät muualle, jos sivut latautuvat nopeasti. Toisaalta, hidas-lastaus sivut ovat yhtä varmimpia tapoja menettää vierailijoiden ja viittauksia.
  3. Nopeampi kuorma-ajat osaltaan lisätä muuntaminen. Kauemmin kävijät viipyvät sivustossa kauemmin. Lisää ne päätyvät tekemään ostoksia, rekisteröitymisestä oman uutiskirjeen, tai arvo-merkintä sivustosi.
  4. Brändin käsitys tehostetaan. Rekisteröitynyt asiakas ja ensikertalaiselle samankaltaisia ​​tulevat helpommin kuvaamaan sivuston (ja liike) niin "ammattimainen", jos sivut latautuvat nopeasti.
  5. Sivut on puhdas, kiinteä koodi usein indeksoidaan tehokkaammin luonnollisen hakukoneita.
  6. Sivut optimoitu paino voi todella säästää kaistanleveyttä maksut Suuren liikenteen sivustoissa. 100000 sivua paino 150 Kb vaatii kaksi kertaa niin paljon kaistanleveyttä Internet-palveluntarjoajalta yli 100.000 sivua vähintään 75 Kb. Internet-palveluntarjoajien että maksullisia kaistanleveyden käytön tai Yliannostukset Tämä alennus voi aiheuttaa merkittäviä säästöjä kaistanleveys maksuja.

Tarkastellaan seuraavat tiedot julkaistaan ​​raportti

Visitor luopuminen

Latausaika

Prosenttia käyttäjistä
Jatkaminen Odota

10 sekuntia

84%

15 sekuntia

51%

20 sekuntia

26%

30 sekuntia

5%


2008 24 huhtikuu 2008

Parhaat käytännöt: Työskentely CSS

Laita Tyylitaulukkoja huipulla

Jos haluat sivu latautuu asteittain, eli haluamme selain näyttää mitä sisältöä siinä on mahdollisimman pian, laita CSS yläreunassa sivun sisältä dokumentin HEAD. Tämä tekee sivut näyttää olevan lastaus nopeammin, koska tämä helpottaa progressiivinen lajia sivun. Tämä on erityisen tärkeää sivua paljon sisältöä ja käyttäjille hitaammilla internet-yhteydet.

Se on dokumentoitu se, että se lisäisi käyttökokemusta, on tärkeää tarjota edistymistä mittaavat indikaattorit ja visuaalisia palautteita. Jottei tarvitsisi piirtää elementtejä sivulla, jos niiden tyyliä muutosta, jotkut selaimet, kuten IE, estää renderöinti sivun kunnes CSS on kokonaan latautunut. Tämän vuoksi, käyttäjä ei saa nähdä tyhjä valkoinen sivu.

W3 HTML Tekniset "todetaan myös, että CSS on minulle kuuluu HEAD-osioon HTML-sivun. at the bottom of the page, so it's best not to use it. Huomaa myös, että IE @import toimii samoin kuin käyttämällä <link> alareunassa sivun, joten se on parasta olla käyttämättä sitä.

Vältä selaimen erityispiirteet

Suodattimet: Käytä suodattimen lisää muistin kulutusta ja sitä sovelletaan kohti elementti, ei kuvaa kohti, joten ongelma kerrotaan. Myös suodattimet ovat IE suojattuja, joten ei toimi tarkoitetulla muissa selaimissa. Jos haluat läpinäkyvä tai liukuväri tausta, käytä 1Pixel kuviin.
Expressions: CSS ilmaisut ovat mukava ominaisuus on CSS, mutta silti on IE erityispiirre. Lisäksi on huomattava, että Nämä ilmaisut arvioidaan, kun sivu muodostetaan ja kokoa, selata ja silloinkin, kun käyttäjä siirtää hiirtä sivun. Tarpeetonta sanoa tämä saattaisi vaikuttaa suorituskykyyn oman sivun. Näin yksinkertaisin sanoin, Vältä CSS ilmaisuja, ellet tunne sen eduista "painaa enemmän kuin huonoja"

Ulkoistaa te CSS

Ulkoisen CSS mahdollistaa nopeammat kuormitus sivut, koska JavaScript-ja CSS-tiedostot välimuistiin selaimen. Inline CSS HTML-asiakirjoissa saa ladata aina HTML asiakirja on pyydetty. Tämä voi todella vähentää määrää HTTP-pyyntöjen mutta sen jälkeen koko kasvaa HTML asiakirjan. Ulkoinen CSS välimuistiin selaimen, koko HTML asiakirjan pienenee lisäämättä määrää HTTP-pyyntöjä.

Huomaa, että jos käyttäjät sivustossasi on useita sivun näyttökertaa istunto ja monet sivut uudelleen käyttää samaa skriptit ja stylesheets, on paremmat mahdollisuudet hyötyä välimuistiin ulkopuolisista tiedostoista.

Pakkaa CSS-tiedosto

Pakkaus tai murskaukseen CSS on käytäntö poistaa tarpeettomat merkit koodia sen pienentämiseksi ja siten parantaa latausaikoja.

CSS voi minua crunched poistamalla kaikki kommentit epätoivotut merkkejä kuten välilyöntejä, rivinvaihtoja yms.


2008 14 maaliskuu 2008

Parhaat käytännöt UI Developer

Kautta aikojen olen ajatellut yhdistää kaikki parhaat käytännöt, olen lukenut aina silloin tällöin. Vihdoinkin! En päästä alas laittaa sen kynään. Tajusin, että se tulee olemaan valtava tehtävä luoda tähän mammutti asiakirja, joten päätin omistaa koko luokka sitä, niin voisin pitää lisätä juttua parhaista käytännöistä ja kun minä kohdata niitä ...

No! sisältö tässä on yhdistetty oma UI kehityspolitiikan parhaiden käytäntöjen kanssa laatinut standardin kehittäjät kuten Yahoo, Google jne.

Tilaihme ja pitää browing Best Practices Luokka


2007 15 syyskuu 2007

Mitä DOCTYPES? Mitkä ovat selain koukero & STRICT tila?

Yksinkertainen ottaen (niille jotka eivät koskaan kuullutkaan DOCTYPE ennen tänään)! DOCTYPE on ilmoituksen HTML-dokumentti, joka tulee ennen <HTML> tunniste, joka näyttää tältä (liitetään lähteestä tämän erittäin sivulla)

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">


Miksi käyttää DOCTYPE?
Kaikki alkoi, kun selain standardit otettiin käyttöön W3C. Aikaisemmin web-kehittäjät toteutetaan CSS toiveiden mukaan selainten, on sivuille suoritettu oikein niitä ja useimmat sivustot olivat CSS ei oikein vastaa näitä eritelmiä / standardit.

Näin ollen ratkaisu tähän ongelmaan on ollut

  • mahdollistaa web-kehittäjät, jotka tiesivät standardit valita käytettävää tilaa.
  • jatkaa esillä vanhoja sivuja mukaan vanhan (koukero) sääntöjä.

Ja DOCTYPE syntyi.

Joten sen mukaan onko sinulla sivu on suunniteltu standardeja tai ei, valitse sopiva DOCTYPE.


Suhde DOCTYPE-selain tilat
DOCTYPE on ilmoitus, joka kertoo selaimen, missä tilassa se pitäisi tehdä HTML-sivun tai pikemminkin tarkemmin miten pitäisi selain tulkitsee CSS, quirks mode tai Strict-tila.

Vanhat sivut kirjoitettiin ennen näitä standardeja käyttöön ei ole DOCTYPE. Siksi kun ei ole DOCTYPE HTML-niin selain on oikkuja tilassa.
Mutta jos DOCTYPE tarkoittaa yhtä seuraavista, selain sanotaan olevan tiukasti tilassa.

<! DOCTYPE html JULKINEN "- / / W3C / / DTD HTML 4.01 Transitional / / EN" "http://www.w3.org/TR/html4/loose.dtd">


NDK home | Ilmaiseminen IT | ilmaiseminen Palate | ilmaiseminen Penmenship | ilmaiseminen Awe | ilmaista itseäni