2008 15.května 2008

Best Practices: Práce s JavaScript je

Zahrnovat JavaScript je ve spodní části dokumentu HTML

Pokud nemáte document.write (nebo dynamické generování obsahu stránky pomocí Java Scripts) vložit část stránky obsahu ve svých skriptech, přesuňte skript obsahovat prohlášení v dolní části stránky, před koncem značky BODY.
HTTP/1.1 specifikace vyplývá, že prohlížeče stáhnout více než dva komponenty paralelně za hostname. Máte-li sloužit své snímky z různých hostitelů, můžete získat více než dva stažení nastat současně. Zatímco skript je stahování, však prohlížeč nelze spustit žádné další stahování, a to i na různých hostitelů.
Tam jsou také způsoby, jak dynamicky se Vytvořit skript uzly a načítat vzdálené skripty po načtení stránky pomocí AJAX.

Externalizovat vám JavaScript je

Použití externích souborů JavaScript bude mít za následek rychlejší načítání stránek, protože JavaScript soubory mezipaměti prohlížeče. Inline JavaScript je "v dokumentech HTML si stáhnout každém HTML dokumentu je požadováno. To by ve skutečnosti mohly snížit počet HTTP požadavků vyrobených ale následně se zvětší velikost dokumentu HTML. Externí JavaScript je být mezipaměti prohlížeče, velikost dokumentu HTML je snížena bez zvýšení počtu HTTP požadavků.
Vezměte prosím na vědomí, že pokud uživatelé na svých stránkách mají více zobrazení stránky na zasedání a mnoho z vašich stránek znovu použít stejné skripty a styly, tam je větší potenciální přínos z externích souborů uložených v mezipaměti.

Sbalte si souborů JavaScript

V případě JavaScripty, na rozdíl od CSS, může soubory drcené pomocí některé standardní algoritmy, které by daly sníženou velikost souboru než pouhé odstranění mezery nebo tabulátory. Příkladem javascript balírny naleznete zde http://dean.edwards.name/packer/

Zbavte se duplicitní skriptů

Je velmi neobvyklé, že celé skripty mohou být duplikovány, ale přehled deseti nejlepších amerických internetových stránek ukazuje, že dva z nich obsahují duplicitní skript. Duplicitní skripty ale samozřejmě snižuje výkon o vytváření zbytečných HTTP požadavky a zbytečně spouštění JavaScriptu.
Také v mnoha případech, i když dávkové názvy jsou různé, existuje pravděpodobnost duplicitních skriptů v rámci stejné stránce kvůli týmové velikosti a počtu skriptů.

Minimalizovat přístup DOM prvky kde je to možné

Přístup k DOM elementy pomocí JavaScriptu je pomalu tak, aby měla více citlivější stránku, měli byste:
• Cache odkazy na prvky přístupné
• Update uzly "offline" a pak je přidejte do stromu
• Vyhněte se kterým se rozložení pomocí JavaScriptu

Samostatné chování od obsahu a prezentace

Stejně jako jsme samostatné prezentace (CSS / XSLT) od obsahu (XHTML / XML), měli bychom také oddělit chování (JavaScript). To se nazývá nenápadný Javascript. Stejně jako jsme odkaz na externích CSS souborů, měli bychom se odkaz na externích souborů JavaScript.

Místo tvrdého kódování chování do obsahu (např. onmouseover, onclick, atd.), by chování může být dynamicky přidávány do prvky, tříd a unikátních prvků (IDS), pomocí DOM. Základní dokument, jehož obsah by měl obsahovat pouze platný XHTML / XML a žádnou javascript.
Javascript musí rozšířit přidáním obsahu chování. Obsah by měl i nadále užitečné a použitelné bez JavaScriptu (nebo bez plnou podporou JavaScriptu).


2008 07.05.2008

Best Practices: Pozor na stránky hmotnosti

Zachránil jsem tento článek věky zpátky, tak líto! I dont vzpomenout na zdroj ... ale zdálo užitečné pro nás, kteří si musí být vědomi o publiku, pro které vyvíjíme místo pro ... tak tady i je

Stránka hmotnosti může být použit k určení čas stahování pro danou stránku na různých rychlostech připojení k Internetu. Jako příklad, následující tabulce jsou uvedeny časy stahování pro tři různé stránky na několika populárních rychlosti připojení.

Stránka Times Hmotnost ke stažení

Rychlost připojení

20 Kb stránky

40 Kb stránky

100 Kb stránky

14.4 Kbps

12 sec

25 sec

62 sec

28.8 Kbps

6 sec

12 sec

31 sec

33.3 Kbps

5 sec

10 sekund

26 sec

56 kbps (V.90)

2 sec

5 sec

13 sec

64 Kbps (ISDN)

2 sec

4 sec

12 sec

128 kbps (DSL / kabel)

1 sec

2 sec

6 sec

256 kbps (DSL / kabel)

<1 sec

1 sec

3 sec

Výhody snížení hmotnosti stránku?

Pozitivní vliv na snížení hmotnosti výhody, page jak majitelům webových stránek a spotřebitele. Potenciální výhody patří:

  1. Načítání stránek rychlejší. Nejviditelnější dopady snižování hmotnosti je, že stránky vašich webových stránek stránky budou načítat rychleji pro návštěvníky, bez ohledu na jejich rychlosti připojení.
  2. Nižší nahrávání stránek vytvořit pohodlnější návštěvníků. Návštěvníci jsou méně pravděpodobné, že se frustrovaný a jít jinam, pokud vaše stránky se rychle stahují. Na druhé straně, pomalé načítání stránek je jednou z nejjistějších způsobů, jak ztratit návštěvníky a potenciální zákazníky.
  3. Rychlejší zatížení-krát přispěje ke zvýšení konverze. Další návštěvníci zůstat na vaše stránky déle. Více z nich skončí nákupy, přihlášení se k odběru zpravodaje, nebo kniha značení na vaše stránky.
  4. Vaše vnímání značky bude posílena. Vracející se zákazníci a návštěvníci poprvé, stejně budou mít větší motivaci k popisu své stránky (a obchod) jako "profesionální", pokud vaše stránky se rychle stahují.
  5. Stránky s čistým, pevným kódem bude často být indexovány efektivněji přírodní vyhledávačů.
  6. Stránky jsou optimalizovány pro váha může skutečně ušetřit na šířku pásma poplatky za vysokým provozem stránek. 100.000 stran každý o hmotnosti 150 Kb bude vyžadovat dvojnásobek šířky pásma od vašeho ISP než 100.000 stránek každé váhové 75 Kb. Pro ISP, které účtují na šířku pásma používané nebo nadsazení, může toto snížení mělo významné úspory šířky pásma poplatků.

Zvažte následující údaje zveřejněné ve zprávě

Návštěvník Přenechání

Čas načítání stránky

Procento uživatelů
Pokračování čekat

10 sekund

84%

15 sekund

51%

20 sekund

26%

30 sekund

5%


2008 24 dubna 2008

Best Practices: Práce s CSS

Dejte styly na začátek

Pokud chcete stránku načíst postupně, to znamená, chceme, aby prohlížeč zobrazí obsah bez ohledu na to má, jakmile je to možné, dát CSS v horní části stránky uvnitř dokumentu HEAD. Tím stránky se zdají být rychlejší načítání, protože to usnadňuje postupné vykreslování stránky. To je důležité zejména pro stránky s množstvím obsahu a pro uživatele na pomalejším připojení k Internetu.

Je zdokumentováno, že pro celkové zlepšení uživatelského prostředí, je důležité, aby indikátory a vizuální zpětné vazby. Aby se předešlo nutnosti překreslení prvků na stránce, v případě, pokud jejich styly se mění, některé prohlížeče včetně IE, bloky ztvárnění stránky, dokud CSS je zcela zaplněný. Protože toto, uživatel uvidí prázdná bílá stránka.

V W3 HTML specifikace "dále uvádí, že CSS je mi zahrnout do HEAD části stránky HTML. at the bottom of the page, so it's best not to use it. Také si všimněte, že v IE @import se chová stejně jako při použití <link> v dolní části stránky, takže je to nejlepší, aby ji používat.

Vyhněte se použití prohlížeče specifika

Filtry: Použití filtru zvyšuje spotřebu paměti a aplikuje se na prvek, a to za snímek, takže je problém se násobí. Také Filtry jsou IE Vlastní, bude tedy fungovat podle plánu v jiných prohlížečích. Pokud chcete průhledné pozadí nebo přechod, použijte 1Pixel s obrázky.
Výrazy: CSS výrazy jsou pěkná vlastnost mít v CSS, ale stále je IE specifické funkce. Také je důležité si uvědomit, že tyto výrazy jsou hodnoceny, pokud je stránka vydání a velikost, posouvat a dokonce i když uživatel přesune kurzor myši na stránce. Netřeba říkat, že by to mohlo ovlivnit výkon vaší stránky. Proto v jednoduchých slov, nepoužívejte CSS výrazy, pokud si myslíte, jejich klady "váží více než jeho cons"

Externalizovat vám CSS

Pomocí externího CSS bude mít za následek rychlejší načítání stránky, protože JavaScript a CSS souborů jsou ukládány do mezipaměti prohlížeče. Inline CSS v dokumentech HTML si stáhnout každém dokumentu HTML je požadováno. To by ve skutečnosti mohly snížit počet HTTP požadavků vyrobených ale následně se zvětší velikost dokumentu HTML. Externí CSS, jsou uložené v prohlížeči, velikost dokumentu HTML je snížena bez zvýšení počtu HTTP požadavků.

Vezměte prosím na vědomí, že pokud uživatelé na svých stránkách mají více zobrazení stránky na zasedání a mnoho z vašich stránek znovu použít stejné skripty a styly, tam je větší potenciální přínos z externích souborů uložených v mezipaměti.

Zabalte svůj CSS soubor

Balení nebo skřípat vaše CSS je praxe odstranění zbytečných znaků z kódu snížit jeho velikost a tím zlepšuje načítání krát.

CSS je mi praskaly tím, že odstraní všechny připomínky a nežádoucí znaky, jako je bílých míst, nové řádky apod.


2008 14 březen 2008

Doporučené postupy pro vývojáře UI

Pro děti, jsem přemýšlel konsolidovat všechny osvědčené postupy, jsem četl tu a tam. Konečně! Já jsem dostat dolů, aby to pero. Uvědomil jsem si, že to bude mamutí úkol vytvoření této mamutí dokument, tak jsem se rozhodla věnovat celou kategorii, takže jsem mohl držet přidání věci o osvědčených postupech jak a když jsem se s nimi setkat ...

No! Obsah zde bude sloučení mých osobních UI praktiky rozvoje osvědčených s těmi, napsal standardních vývojáři jako Yahoo, Google apod.

Sledujte tento prostor a udržet browing na Best Practices kategorie


2007 15 září 2007

Co jsou DOCTYPES? Co to ​​jsou internetové Quirks a Přísný režim?

Jednoduché řečeno (pro ty, kteří nikdy neslyšeli o doctype před dnes)! DOCTYPE je deklarace v HTML dokumentu, který přichází před <HTML> značku, která vypadá nějak takto (vložen ze zdroje právě stránky)

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


Proč používat doctype?
Všechno to začalo, když byl prohlížeče normy zavedené W3C. Čím dříve weboví vývojáři realizován CSS podle přání prohlížečů, aby se stránky zobrazují správně v nich a většina internetových stránek měla CSS, které se ne zcela odpovídat těmto specifikacím / normy.

Proto se řešení tohoto problému bylo

  • umožnit webovým vývojářům, kteří znali své normy na výběr, jaký režim použít.
  • se zobrazovat staré stránky dle staré (vtípky) pravidel.

A DOCTYPE se narodil.

Takže podle toho, zda jste stránka je navržen tak, aby normy, nebo ne, můžete si vybrat vhodnou DOCTYPE.


Vztah mezi Doctype a režimy prohlížečů
DOCTYPE je tvrzení, že řekne váš prohlížeč jakém režimu by měla vykreslení stránky HTML nebo spíše přesněji řečeno, jak by měl prohlížeč interpretovat CSS v; Quirks režim nebo Přísný režim.

Staré stránky napsané před tyto normy byly zavedeny nemají DOCTYPE. Proto když není DOCTYPE v HTML prohlížeč pak je v režimu vtípků.
Ale pokud DOCTYPE je definována jako jedna z následujících, pak prohlížeč je řekl, aby byl v přísném režimu.

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


NDK domů | Vyjádření IT | Vyjádření patra | Vyjádření Penmenship | Vyjádření Awe | Vyjádření Myself