Prebrali sme sa hlavne na to, ako vytvoriť jednoduchú navigáciu, prečo je dôležité písať text zrozumiteľne a bez chýb, ako optimalizovať stránky pre vyhľadávače a prečo tvoriť stránky aj pre rozlíšenie monitora 800x600. Dnes budeme pokračovať v odporúčaniach, ktoré nám hovoria, akých ďalších pravidiel je potrebné držať sa pri tvorbe stránok.
Vytvorte si vlastnú stránku s chybovým hlásením 404 "Page not found" (stránka nenájdená)
Všetci sme už videli stránku 404. Na stránkach, ktoré sú obsluhované Windows servermi, je to čistá biela stránka, ktorá má tento text: "The page cannot be found" (stránka nenájdená)
Nie veľmi priateľská a tiež neužitočná pre návštevníkov, pretože táto stránka sama o sebe neposkytuje viac informácií. Riešením je vytvorenie si vašej vlastnej 404 stránky, ktorá sa objaví namiesto vyššie spomínanej.
Stránka 404 je stránka, ako mnoho iných, a teda všetko, čo potrebujete urobiť, je osloviť vášho poskytovateľa webhostingu, aby ju nasadil, takže vlastnú stránku 404 si môžete vytvoriť aj doma. Dobrá 404 stránka by mala byť zrozumiteľná pre návštevníkov v tom, že ich informuje, že našli dobrú stránku, len časť, ktorú zadali, je nesprávna. Stránka 404 môže tiež zahŕňať odkaz späť na vašu domovskú stránku a možno aj mapu stránky. Ak máte na vašej stránke zabudovaný aj vyhľadávač, včleňte tam aj ten.
Ukončujte URL v odkazoch lomítkomTento bod môže pomôcť urýchliť načítavanie stránok. Ak máte URL (webové adresy), ktoré bližšie neurčujú určitú stránku, mali by ste ich ukončiť lomítkom:<a href="http://www.vasadomena.sk/">Názov domény</a>
Vo vyššie uvedenom odkaze si môžete všimnúť, že po ".sk" je umiestnené lomítko (/).
Ak odkaz poukazuje na konkrétnu stránku, na koniec adresy už lomítko neumiestňujem:<a href="http://www.vasadomena.sk/produkty/index.html">Produkty z vašej domény</a>
Pridaním lomítka (ako v prvom príklade), odstránime krok, ktorý by inak webový server a prehliadač chceli vykonať; odstránenie tohto kroku navyše môže zabezpečiť zvýšenie rýchlosti. Tak si to zhrňme:
Ak váš odkaz poukazuje na konkrétny súbor (html stránku alebo PHP stránku alebo ASP stránku atď...) nepoužívajte koncové lomítko. Ale ak poukazujete na adresár ako:<a href="http://www.vasadomena.sk/produkty/">Produkty</a>, vtedy použite koncové lomítko.
Alternatívny text je text, ktorý ste vložili do tagu obrázka (<img ...>), a ktorý je ako text používaný iba prehliadačmi. Tento text používajú pri surfovaní nevidiaci, keďže obrázky im veľmi nepomôžu ... alternatívny text, ktorý sa nachádza v tagoch obrázka je v prehliadači čitateľný na mieste, kde sa zobrazujú obrázky.
Ako alternatívny text by ste mali umiestniť zmysluplnú informáciu, ktorá prinesie úžitok tým, čo nevidia a tiež vám pomôže vo vyhľadávačoch. Alternatívny text je umiestnený do tagov nasledujúcim spôsobom:<img src="obrazok/grafika.gif" alt="Logo firmy XYZ - kliknite na návrat na hlavnú stránku" border="0">
Alternatívny (alt) text sa v Internet Exploreri zobrazí ako informačná bublina (tool tip).
Poznámka pre používateľov MACov:ALT v MAC nepracuje, tak namiesto neho môžete použiť znak "title": <img src="obrazok/grafika.gif" title="Logo firmy XYZ - kliknite na návrat na hlavnú stránku" border="0">
Nie je žiadny dôvod, prečo by ste nemohli použiť obidva v jednom tagu.
Zrušte modré rámčeky okolo grafiky, ktorá je odkazomAko viete, grafiku môžete zmeniť na odkaz alebo iné tlačidlo, a to obalením odkazového tagu okolo obrázka. Štandardné prehliadače obklopia obrázok hnusným modrým rámčekom, ktorý nám ukazuje, že obrázok je vlastne odkaz. Vaše obrázky, ktoré sú tlačidlami, by mali vyzerať ako tlačidlá; malo by byť samozrejmé, že obrázok je niečo na čo sa dá kliknúť ... takže nepotrebujeme modrý rámček.
Na to, aby ste sa zbavili modrého rámčeka, potrebujete pridať tento kód do tagu obrázka: border="0". Skontrolujte tag obrázka:<img src="obrazok/grafika.gif" border="0"> alebo cez CSS img { border: 0; }
Grafické tlačidlá by mali vyzerať ako tlačidlá ... a na druhej strane, nevytvárajte grafiky, ktoré vyzerajú ako tlačidlá ale nie sú tlačidlami!
Čo je podstatou pri obrázkoch, ktoré sú tlačidlami?
Klasicky, hocijaké obrázky so skosenou stranou alebo 3d vzhľadom sú automaticky pokladané za tlačidlá a ľudia budú prirodzene skúšať kliknúť na ne. Ale najlepší spôsob ako vymedziť, ako by malo vyzerať tlačidlo (z pohľadu vášho návštevníka) je brať ohľad na vašu stránku; ak ste zistili, že vaše odkazy sú podčiarknutý text, potom akýkoľvek podčiarknutý text bude braný ako odkaz alebo tlačidlo ... stačí použiť len zdravý rozum. Ďalšia vec, ktorú môžete urobiť je navštíviť iné stránky a dávať pozor ako to robia iní.
Vyberajte si svojho web dizajnéra opatrneAk sa rozhodnete najať si web dizajnéra, prejdite si ponuky viacerých predtým, ako sa rozhodnete pre jedného. Vždy si preverte ich portfólia, či ich dizajn je originálny a nepoužívajú hotové šablóny (templates), ktoré sú vernou kópiou množstva iných stránok. Majte jasno, čo od nich očakávate. Preverte si, či za každú službu budete platiť navyše, alebo tieto služby sú zahrnuté v základnom odhade.
Položky ako napr. copywriting, kontrola pravopisu alebo návrh loga môžu byť súčasťou základného balíka, ktorý vám web dizajnér ponúkne. Niektorí však môžu obmedziť počet obrázkov pre vašu stránku, alebo si môžu účtovať platbu navyše za jednoduchý JavaScript.
Pozorne si skontrolujte ich portfólio a pozrite sa, či používajú jasný, výstižný text bez pravopisných chýb, nekomplikovanú navigáciu, či sa ich stránky načitávajú dostatočne rýchlo a či ich stránky dostatočne reflektujú obchod, ktorí reprezentujú.
ZáverNáš prehľad o tom, ktoré zásady je potrebné dodržiavať pri stavbe úspešného webu sa touto časťou končí. Na budúce sa bližšie pozrieme na to, čoho sa treba bezpodmienečne vyvarovať pri tvorbe web stránok.
Jozef Ring - webRing.sk
Autor je project managerom štúdia webRing, ktoré sa zaoberá tvorbou a propagáciou web stránok.