Jak na Kritiku webů

Nechceme vás strašit, ale mnoho webů, které nám pošlete na zhodnocení, skončí opravdu špatně. Je to z toho důvodu, že autor má poměrně naivní představu o tom, jak by měl web vypadat Ne zřídka to celé skončí i hádkou, zvláště když není schopen následnou kritiku akceptovat. Potom ukřivděný opustí bojiště a už si dvakrát rozmyslí, než sem umístí opět svojí práci. Jak tomu předejít? Co udělat pro to, abyste z kritiky vyšli VŽDY jako vítězové?

Očekávání

Důležité je vaše očekávání, tedy co si myslíte, že vám kritika přinese. Pokud chcete jistou pochvalu, tak web raději ukažte někomu, kdo do webtvorby nedělá Jistě vám řekne, že jste šikovní. Když dáte web k nám, uvidí ho spoustu lidí s různými názory. Zcela jistě se někomu něco nebude líbit, určitě někdo najde nějakou chybu. Měli byste čekat objektivní hodnocení, které vám pomůže web vylepšit a dále rozšiřovat. Orientujte se hlavně podle skillu toho, kdo hodnotí. Komentář od někoho nezkušeného nemusí mít žádnou váhu, jsme otevřená komunita, hodnotit může kdokoli. Komentáře od členů s vysokými zkušenostmi jsou pro vás naopak velmi cenné.

Vzhled

Web by měl vypadat aspoň trochu k světu. Pokuste se sladit vhodné barvy, vytipovat si od nich pár odstínů (více než pět je většinou zbytečné) a používejte jenom je. Pryč jsou doby, kdy weby hýřily barvami, nedejbože animovanými gify a jenom to ne, posuvnými a blikajícími texty! Pokud nemáte jasnou představu, zkuste se podívat po webech s webovými šablonami. Na hlavních stránkách většinou uvidíte, co právě frčí a v sekcích nejoblíbenější co se lidem nejvíce líbí. Při návrhu vždy myslete na to, že se stránka musí korektně zobrazit na většině rozlišení, počítejte nejlépe s rozlišením od 1024x768 do 1920x1080. Běžně na to začátečníci zapomínají a vždycky jim to i vytkneme. Opět to zdůrazním, nepoužívejte grafiku a návrhy chráněné autorským zákonem! Zaprvé to dvakrát neoceníme, za druhé je to nelegální. Je mnoho serverů s grafikou, na kterou se vztahují volnější licence vyžadující třeba jen zpětný link, někdy ani to ne. Nejlépe je však si grafiku udělat. Pokud nedisponujete potřebným talentem a citem, není problém si ji u někoho objednat.

Kód

Nebojte se použití HTML5 a CSS3. Není to o nic složitější než starší verze HTML, a i když nevidíte prakticky žádný rozdíl ve funkčnosti, tak se minimálně budete lépe orientovat v kódu a stylech. Navíc obsahuje nové elementy, které vám ušetří spoustu práce, když je umíte používat. Pokud se bojíte, že vašimi uživateli budou lidé se starými prohlížeči, není to důvod k používání mraků divů místo sémantických elementů, použijte doplněk Modernizr, který je učiní funkčními i na starých prohlížečích.

Dejte si pozor na to, abyste měli styly v externím souboru/souborech, inline zápisy a přímé vložení stylu je nepřehledné a poměrně špatně udržovatelné. Pro javascript platí to samé, navíc si uvědomte, kam se javascript vkládá (hlavička, občas na konec).

Ještě se nestalo, aby někdo neprohnal kritizovaný web validátorem. Validátor je obávanou zbraní kritiky webů, přitom stačí si udělat validaci sám a podle zobrazených rad si kód opravit. Určitě nemusíte opravovat všechny chyby, ale měli byste opravit alespoň ty základní a alespoň výsledek validátoru znát. Stejně se ale může stát, že vám nějaký chytrolín řekne, že tam máte podle validátoru něco špatně Nejčastějšími problémy jsou neukončené nebo ukončení neexistujícího elementu, použití zastaralých HTML elementů nebo tagů namísto CSS, chybějící zástupný text u obrázku. U html vám validace občas nějaký ten error vyhodí, u CSS je to méně pravděpodobné, protože se většina chyb okamžitě na stránce projeví.

Nápad

Pokud nehodláte přijít s něčím originálním, nebo alespoň s něčím svým, tak ani nechoďte. Chceme hodnotit vaší práci a váš nápad. Přitom téměř vůbec nezáleží na tom, jestli to bude vypadat a fungovat hůř než jiné weby a nebo to bude úplná pecka, která nám všem vyrazí dech. Oceníme vaši myšlenku a pokud to bude v našich silách, tak vám poradíme, jak ji dotáhnout ke zdárnému konci

Obsah

Ať se jedná o službu nebo osobní web, měl by mít nějaký obsah. I když je to pouze portfolio, mělo by tam být něco o vás, vaše reference, práce, záliby, galerie, kontakt a podobně. U webu s články očekáváme články a podobně. Pokud web nemáte hotový, tak ho sem nedávejte a počkejte, až na něm něco bude.

WordPress

Pokud používáte nějaká hotová řešení (např. WordPress), předpokládá se, že to bude nějak vypadat. Často sem chodí ke kritice weby, které mají engine WordPress, šablonu staženou a ještě špatně upravenou a v obsahu je napsáno jen vítejte na mém webu, zatím zde nic není. S takovými weby jsme rychle hotoví a jejich autoři se tomu hrozně diví.

Jednoduchost

Stránky by neměly být složité. S tím souvisí velikost stránky. Úprava a optimalizace kódu vím zachrání pár kB, nicméně změna formátu obrázku a dobře zvolená komprese srazí velikost stránky o stovky kB až jednotky MB. Volba formátu a komprese obrázku je velice snadná. Pokud je obrázek průhledný, použijte PNG. Pokud ne, tak volba padne na JPEG. Co se týče komprese - obrázky ve slideru, hlavičce a obrázky v galerii komprimujeme minimálně. Naopak pozadí a textury můžete komprimovat bez problému sedmdesáti-ti procentní kompresí. Na šumy můžete použít kompresi maximální.

Komprese obrázku v Photoshopu, kvalita od 100 vlevo nahoře až po kvalitu 0 vpravo dole.

Často se stává, že programátor udělá skvělé stránky, ale jsou tak složité, že uživatelé prostě nepochopí, jak stránky fungují. Někdy ani k čemu jsou. Zkuste myslet jako běžný uživatel. Pokud máte možnost, využijte rodiče nebo kamarády, kteří s IT tolik nekamarádí a zkuste, zda budou vaše stránky umět samostatně bez problému používat. Pokud ano, tak bravo, jste na dobré cestě.

Na co si dát konkrétně pozor?

• Nejprve se zamyslete, zda má web vůbec nějaký význam. Využije ho vůbec někdo? Pokud existuje nějaký podobný jiný web, je váš alespoň na stejné úrovni? Je v něčem lepší?
• Web dělejte srozumitelný a přehledný pro široké spektrum běžných uživatelů internetu.
• Výsledná velikost jedné stránky by určitě neměla být větší než 1MB až na některé specifické a celkem ojedinělé případy.
• Nadpisy vždy patřičně zvýrazněte, aby byly odlišitelné od zbytku textu.
• Na běžný text používejte bezpatkové písmo.
• U obrázků sloužících jako odkaz odeberte nebo změňte rámeček (specialita IE)
• Pokud váš web obsahuje reklamu, tak je slušností ji patřičně oddělit od zbytku stránky a nadepsat ji nadpisem o velikosti minimálně 10px.
• Dnešní web už běžně nehýří barvami, vyberte si jednu nebo dvě barvy a pár odstínů.
• Používejte cizí grafiku, fonty a kód, pouze pokud splňujete podmínky užívání.
• Nebojte se nových technologií.

• Až web dopíšete, tak si projděte kód, v CSS spojte podobné styly do tříd, smažte nepotřebné části.
• Nechte projít validátorem jak HTML, tak i CSS a chyby opravte (HTML W3C Validator nebo CSS W3C Validator), na JavaScript použijte vestavěné nástroje pro vývojáře v prohlížečích. Určitě je zbytečné mít celý web kompletně validní, ale nemělo by se stát, že validátor vypíše 100 kritických chyb na hlavní stránce. Alespoň se na výsledek podívejte a zvažte, zda by nebylo potřeba něco upravit.
• Optimalizujte velikost webu vhodnou kompresí obrázků.
• Zkontrolujte si pravopisné a gramatické chyby. Často je to jeden z hlavních důvodů, proč uživatel opustí web jen co na něj přijde.
• Zobrazte si web na více rozlišeních, platformách a ve všech hlavních prohlížečích. Ideálně se podívejte na full-hd monitor, poté zkuste rozlišení 1024x768 běžné pro netbooky a tablety, můžete zkusit i chytrý telefon. Pokud takovými zařízeními nedisponujete, tak můžete najít kromě nástrojů pro vývojáře v prohlížečích i spoustu freewarových a profesionálních nástrojů pro testování zobrazení webu na různém rozlišení i testy kompatibility.