w3.Photoshop.szm.sk

adobe photoshop tutoriály

Úvod → Weblog →

Weblog – Webdesign

Viac Web 2.0, menej pre ľudí

Minule som sa rozplýval nad službou foto.sme.sk, ale odteraz si tam už asi fotky vyvolať nedám, lebo redesign ala Web 2.0.

Kamarát si chcel dať rýchlo vyvolať fotku, tak som mu poradil, nech skúsi foto.sme.sk. Ibaže mu neišlo vybrať miesto vyzdvihnutia, formulár neobsahoval žiadne možnosti. Samozrejme na mail pre technickú podporu nikto neodpísal. Hlavne že prišiel mail o doručení objednávky. Asi týždeň (možno aj viac) táto služba vôbec nefungovala. Myslel som, že asi robia redesign a v duchu som nadával. Áno, myslel som správne. Takže pravidlo jedna:

  • Počas prípravy redesignu nechajte službu (alebo web) fungovať v starej verzii, až do uvedenia novej verzie

Teraz už služba funguje, ale ako? Kamarát to išiel skúsiť znova. Odfajčili ho už v prvom kroku. Je tam napísané, netreba inštalovať žiaden software a v zapätí vás vyzve, aby ste si nainštalovali Javu. Pravidlo dva:

  • Nikdy, ale nikdy nevyžadujete, aby si užívateľ niečo doinštalovával! (Flash je výnimka)

Tak som si to skúšal doma ešte raz. Javu mám, takže som mohol vidieť dlhé loadovanie aplikácie a vyskúšať si veľmi pomalú a nepoužiteľnú prácu v divnom prostredí. Uploadovanie jednej fotografie trvalo asi minútu, ak nie dve. Pravidlo tri:

  • Cieľom každého redesignu má byť vyššia použiteľnosť, prístupnosť a väčšia rýchlosť pre pohodlie návštevníka

Keď som sa už konečne cez všetko prelúskal, konečne som si myslel, že to mám za sebou a vtom čítam, že sa mám prihlásiť, alebo registrovať. Pravidlo štyri:

  • Nevyžadujte povinnú registráciu!

Zhrniem to. Minule som tam prišiel, do dvoch minút som mal objednané fotky bez registrácie, bez Javy a po troch dňoch som si ich pri dome vyzdvihol. Dnes som sa tam babral desať minút, bez registrácie a bez fotiek som to vzdal.

Nechápem, prečo do toho rýpali, veď to bolo použiteľné a fungovalo to. Asi to nebolo dostatočne dobré. Bolo to málo Web 2.0. Takže máme na Slovensku ďalšiu službu 2.0, ale nie pre ľudí. Dlho sa však u nás nezdrží. Totiž ju úplne pochovali. Radšej si pôjdem fotky vyvolať do mesta, aspoň sa prejdem.

Vložené: 29/04/07 | Kategória: Webdesign
Trvalý odkaz |

Prístupné RSS

RSS je dnes každodennou samozrejmosťou. Túto technológiu však v skutočnosti využíva len malé percento ľudí. Ak ešte zoberieme do úvahy, že väčšina používa Internet Explorer 6, je táto technológia pre bežného používateľa neprístupná.

Na každom informačnom portáli sa ľudia stretávajú s odkazom na nejaké RSS. Zvedavší kliknú a ak majú tú smolu, že sú používateľmi IE6 (a starších), sú v pasci. Zmätený z xml kódu klikajú na tlačidlo späť a pritom existuje také jednoduché riešenie.

XSLT transformácia nieje nič nové. Pritom som sa nestretol so žiadnym webom, ktorý by ju pre svoje RSS používal (niežeby som hľadal). O čo ide? Pomocou XSLT transformácie môžete prehliadač prinútiť, aby si myslel že XML dokument je XHTML dokument. Koncovému používateľovi sa teda nezobrazí divný kód, ale prehľadná stránka. Oto je to lepšie, že si túto stránku možno naštýlovať pomocou CSS, takže to ešte aj bude vyzerať k svetu.

Od posledného redesignu používam XSLT, a hodnotím to veľmi pozitívne. Otvorte si RSS môjho návodu na photoshop v IE6. Stačí k tomu iba jeden súbor XSLT, ktorý prikáže prehliadaču, aby jednotlivé atribúty XML prepísal na požadované XHTML tagy a celé to oštýloval. Ako nato celé sa dočítate v článku na Intervale.

Prečo by mali byť používatelia IE6 znevýhodňovaní, keď vytvoriť použiteľné RSS je úplne jednoduché? Mimochodom, takéto RSS sa dá potom používať aj bez čítačky. Stačí si ho pridať medzi záložky a raz začas sa pozrieť, či je niečo nové. Aby to celé bolo ešte trochu použiteľnejšie, pridal som nakoniec RSS ešte odkaz na staršie aktuality, keby náhodou mal niekto problém, kam pokračovať.

Síce je prvého apríla, ale srandu si nerobím a myslím to smrteľne vážne.

Vložené: 01/04/07 | Kategória: Webdesign
Trvalý odkaz |

Vivat WYSIWYG

Profesionálmi všeobecne odsudzované. Dreamweaver, či GoLive – absolútny nepriateľ webdesignérskej komunity. Ak chceš patriť k nám, jedine PSPad. Ďakujem neprosím.

Mýtus WYSIWYG

WYSIWYG editori ničia kód, pridávajú, vymazávajú, jednoducho nieje pod kontrolou. WYSIWYG – synonymum tabuliek, žiadne CSS, alebo len minimálne, o CSS layoute nemôže byť reč.

Súhlasím, ale...

...aj tak používam WYSIWYG editor. Je to rýchle, pohodlné a nie vždy mýty platia. Nie, niesom prívrženec tabuliek. Samozrejme, layout si píšem ručne, CSS taktiež, v čomkoľvek (najčastejšie poznámkový blok, iba stlačím F4 v Total Commandery). Ale obsah už pridávam v Dreamweavery, aj správu webu robím cez neho. Je to tak jednoduché, príjemné a rýchle. Text napíšem rovno, alebo skopírujem z Wordu. Jednotlivým odstavcom priradím sémantickú značku (h1, h2, alebo p). Vyberiem si text, vložím adresu a mám odkaz, povkladám obrázky, pripíšem alty a ak je treba jednoducho priradím prvkom triedy. Netreba mi vypisovať tagy, Enter – nový odstavec, Shift+Enter – vloží <br />, Ctrl+B – vybraný text uzavrie do strong a Ctrl+I – uzavrie text do em, ešte som nespomenul automatickú tvorbu entít. Odkazu ukážem súbor na disku a automaticky vytvorí relatívnu cestu k nemu. Ak súbor uložím v hierarchii vyššie, alebo nižšie, všetky odkazy si automaticky prispôsobia adresy, tak aby fungovali. A na záver to môžem nechať prebehnúť validátorom v programe. Ozaj, celý čas je reč o statickom XHTML.

Všetko mám pod kontrolou, vidím stránku vo WYSIWYG móde a zároveň vidím aj kód. Za ten čas som objavil iba jeden prípad, kedy mi pridáva kód navyše. Ak urobím z obrázku odkaz, automaticky sa pridá border: 0, ale to som si už zvykol a vždy to odstránim (neviem, v novších verziách to už možno nerobí). Takýmto spôsobom je úplne jednoduché pre mňa robiť blog, úplne mi to vyhovuje, môžem blogovať off-line a je to rýchle.

Vložené: 07/03/07 | Kategória: Webdesign
Trvalý odkaz |

Ikona vs odkaz

Všeobecne panuje názor, že textový odkaz na web je hodnotnejší ako ikona, najmä ak obsahuje nejaké to kľúčové slovo. Mne sa však osvedčuje skôr ikona.

Skutočne. Vyhľadávače dosť prizerajú na text externého odkazu. Všetci vieme, že to má veľkú, skutočne veľkú váhu. Dobrá ikona však môže mať väčšiu hodnotu. Kedy tomu tak je?

Dobrá ikona upúta pozornosť omnoho viac ako odkaz. Ľudia radi klikajú na pekné ikony! Ikony na externých weboch mi prinášajú na môj manuál na Photoshop ďaleko viacej návštevníkov ako odkazy. Web sa na kľúčové frázy zobrazuje úplne navrchu, takže si môžem dovoliť tvrdiť, že sú ikony pre mňa lepšie, pretože až tak nepotrebujem relevantný text v odkazoch. Okrem toho, ikona môže tiež obsahovať relevantný text v alte a aj v titulku. Odkazy si nevymieňame (teda aspoň ja), aby sme mali vysoký PR (ktorý ani nemám), alebo nám pribudli návštevníci z Googlu, ale aby prišli návštevníci priamo cez tie odkazy. Návštevník z Googlu nemusí byť hodnotnejší, pretože jeho zaujíma práve obsah stránky. Rovnako hodnotný je aj návštevník z externého odkazu (ikony), ak je to web s podobným obsahom.

Dobrá ikona s kľúčovými slovami v atribútoch title a alt je lepšia ako textový odkaz, hlavne ak má web dobre zvládnuté SEO.

Vložené: 18/02/07 | Kategória: Webdesign
Trvalý odkaz |

Klasické iniciály pomocou CSS

Trochu som sa pohral s CSS a podarilo sa mi vytvoriť celkom pekné klasické iniciály fungujúce aj v IE bez hackov a zdá sa, že nemajú problémy so zväčšovaním textu.

Je to celkom jednoduché, finta spočíva v obliekaní prvého písmena. Určite niesom prvý koho tu už napadlo, ale ešte som to nevidel zrealizované. Kód je vlastne dosť jednoduchý:

p:first-letter{ font-size: 2.4em; font-weight: bold; text-indent: 1em; float: left; line-height: 1em; padding-right: 0.15em }

V Opere to funguje krásne (testoval som na 8.51), vo Firefoxe iniciála trochu vyčnieva z riadku, ale výsledok je uspokojivý. Explorer je treba prepnúť do quirk režimu, takže pred doctype treba pripísať xml deklaráciu. Doctype bude vyzerať nasledovne:

<?xml version="1.0"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

Celé si to môžete pozrieť v akcii na príklade. Testoval som na: Opera 8.51, Firefox 1.502 a 2, IE 6 a 5.5 (všade funguje).

Vložené: 20/01/07 | Kategória: Webdesign
Trvalý odkaz |

Majú MS SEO zmysel?

Začali sa nám neoficiálne majstrovstvá sveta v SEO 2007. Webdesigneri z celého sveta sa snažia umiestniť na prvom mieste v Googli, MSN a Yahoo na presnú frázu. Má to však nejaký zmysel?

Nie, nemá!

Okrem toho, že to neprináša nijaký úžitok (snáď len krátkodobá popularita pre víťaza), je len samotná myšlienka úplne nezmyselná. Aký má zmysle optimalizovať na vymyslenú frázu, doteraz na webe nevidenú? Je to skutočne SEO? Toto nieje súťaž v SEO, ale súťaž v získavaní spätných odkazov. Vyhrá ten, kto má viacej známych a dokáže zohnať najviac odkazov z hodnotných stránok so správnym textom. Skutočné SEO (ktoré však neexistuje) by nastalo, ak by bola predmetom súťaže fráza, na ktorú už optimalizovali tisíce webov. Zaujímavé, by bolo, ak by sa súťažiaci pokúsili dostať na prvé miesta s frázami ako MP3, či Free download. Potom by sa oplatilo sledovať vývoj takejto súťaže, najmä ak by sa niekomu podarilo vôbec vyhrať.

Vložené: 20/01/07 | Kategória: Webdesign
Trvalý odkaz |

SEO neexistuje

Rozmýšľal som už dávno, že to napíšem, ale Marek Prokop mi vyfúkol tému spod nosa vyhlásením, SEO je rozjetý vlak tažený mrtvým koněm. Pre niekoho možno silné tvrdenie, ja sa sním stotožňujem a preto som sa rozhodol, že o tom napíšem.

Keď sa k nám SEO dostalo, rozdelili sme si ho na on-page a off-page faktory. On-page faktory sú úplný základ, pozná to každý. Jeden nadpis H1 s kľúčovými slovami, titulok – podobne ako nadpis a tak ďalej. Dnes sa tomu hovorí sémantika. Kto je sémantický, zvládol on-page faktory (nemusí o tom ani vedieť). Off-page faktory si zhrňme do získavania spätných odkazov, najlepšie s relevantným textom. To sa skôr podobá na marketing ako na optimalizáciu pre vyhľadávače. Akosi sa nám SEO rozložilo, kde je?

O čo ide vyhľadávačom. Tie sa snažia na základe on a off-page faktorov ponúknuť hľadajúcemu najlepšie výsledky. Ľudia, ktorý majú na starosti nastavovanie váh jednotlivých prvkov hľadajú optimálne riešenie, ktoré sa najviac približuje človeku. Snažia sa vystihnúť psychické procesy hľadajúceho. Pochopením zmýšľania človeka vedia približne čo je najdôležitejšie, čím sa vyhľadávač približuje k človeku a viac sa naň podobá.

Optimalizovanie pre vyhľadávač nieje nič extra. Kto pochopil, čo som predtým napísal, vie kam mierim. Je treba optimalizovať pre ľudí a nielen pre ľudí hľadajúcich (to už je veda). Google sa snaží pristupovať k webu čo najviac ako človek, preto ten, kto optimalizuje pre ľudí je úspešnejší. ľudskejší web sa rovná použiteľnému a prístupnému webu. Napríklad, pretože chcem, aby prvé čo návštevník videl je obsah (použiteľnosť) s výstižným nadpisom (sémantika), dám obsah v dokumente ako prvý a to sa páči aj vyhľadávaču, nieje na začiatku presýtený napríklad navigáciou. Ďalší príklad, ak si všimnem odkaz na nejakú stránku na viacerých weboch, pomyslím si, že to asi bude dobrý web a pozriem sa naň. Ten web získal návštevníka. Google postupuje rovnako a preto poznáme off-page faktory. Kto tvorí použiteľné weby, pre ľudí prívetivé, je vo vyhľadávači obľúbený. Potom už zostáva len zohnať spätné odkazy. S dobrým obsahom sa získavajú takmer sami od seba.

Pravidlá použiteľnosti, či dokumenty ako W4D niesu zbierkou chorých a prísnych rozkazov. Sú to veľmi inteligentne vymyslené osvedčené postupy ako na ľudskejší a použiteľný web, ktorý je radosť používať. A za odmenu sa web posunie vo výsledkoch vyššie. Kto vie, či to autorov W4D pri tvorbe tohto dokumentu napadlo.

Vložené: 08/01/07 | Kategória: Webdesign
Trvalý odkaz |

Už zase menu doprava

Na túto tému existuje nespočet článkov a predsa sa ešte nevyčerpala úplne. V poslednej dobe my stále viac vadí menu naľavo. Nie nechystám sa písať o tom ako čítame zľava doprava, aj keď to s tým má mnoho spoločného. Pri browsení mám rozlíšenie 1024x768 px a používam často postranú lištu. Každý deň, keď sa chystám zistiť, čo je nové v blogsfére, zobrazím si postrannú lištu s RSS čítačkou a začnem si čítať na mojej obľúbenej latríne. A tu je kameň úrazu. Veľa blogov (vrátane mňa) má menu naľavo. Spolu s postrannou lištou sa obsah blogu posúva asi o dve pätiny doprava a text začína približne v polovici. Nie, niesom vyrušovaný, lepšie povedané rozptyľovaný ľavým menu, som ním mega vyrušovaný. To sa naozaj nedá čítať. Už tú chybu neurobím a nabudúce dám menu na blogu doprava, pretože tam patrí. Menu by podľa mňa malo byť napravo. Jednoducho je viacej dôvodov za, ako proti. Pri weboch zameraných na textový obsah to považujem za nutné. Keď chcem čítať, nezaujíma ma, že menu patrí kompozične doprava doľava a ani, či to je podľa zlatého rezu.

Vložené: 25/12/06 | Kategória: Webdesign
Trvalý odkaz |

Odporúčam redesign

Moja príručka k Photoshopu zažila už druhý redesign (čítaj prestavba) a zatiaľ celkom úspešne. Pri prvom redesigne (prelom 2005/2006) narástla návštevnosť asi dva až tri krát.

Redesign ktorý to tu práve podstúpilo, resp. podstupuje (tutoriály nie sú stále dokončené) vyzerá zatiaľ celkom sľubne. Návštevnosť stúpa, viacej ľudí sa vracia a stúpol aj priemerný čas strávaný na jednotlivých stránkach a priemerný počet prehliadnutých (respektíve prečítaných, keď vidím strávený čas) stránok na návštevníka.

Samozrejme, môže to byť aj počiatočnou zvedavosťou návštevníkov. Predpokladám pokles čísiel, ale aj tak.

Čo rozumiem pod redesignom?

Určite nie len zmenu vizuálnej stránky webu. Pri oboch redesignoch som kompletne prerobil štruktúru webu a čo je najdôležitejšie, drasticky vylepšil obsah. V prvom vylepšené, veľmi podrobné tutoriály, teraz som pridal manuál na Photoshop.

Zmena vzhľadu je asi viditeľná. Možno si niekto všimol aj nejaký pokus o prístupnosť a použiteľnosť.

Samozrejme, k redesignu patrí aj technická stránka. Najnovšie sa mi podarilo odpútať od odporných tabuliek. Konečne som aj ja xHTML + CSS. Pridal som aj RSS.

Zhrnutie

Jednoznačne redesign odporúčam, najmä ak je spojený s vylepšením obsahu. Treba však postupovať uvážene, aby sa toho veľa neskazilo a návštevníci neboli po dlhých očakávaniach sklamaný. Radšej by som neohlasoval redesign dopredu.

Práve mi prišiel upozorňujúci mail o zvýšení návštevnosti :-).

Vložené: 14/12/06 | Kategória: Webdesign
Trvalý odkaz |