Macova fotošopa
grafický design, webdesign a photoshop

Fotošopa sa redizajnuje

Pretože mnohí web neidentifikujú podľa značky, ale podľa vzhľadu, môže sa im stať že po redizajne web nespoznajú a utečú preč. Aby som tomu čiastočne predišiel, hneď na úvod sem hodím obrázok toho ako to tu kedysi vyzeralo.

Proces návrhu

Ako to už býva zvykom, na designe som začal pracovať asi pred rokom a pol. Po pár mesiacoch vznikol návrh ktorý sa stal horúcim kandidátom.

Obrázok vyššie ukazuje ako to tu malo vyzerať (kliknite si na neho pre väčšiu verziu). Návrh mi kvasil na disku asi rok. Keď som si už povedal že ho idem pustiť do sveta, ako na potvoru sa mi v tej chvíli znepáčil. Prišiel mi príliš ťažký.

Keďže už píšem tretí článok po sebe o novom dizajne nejakého môjho webu, zjavne mám v týchto dňoch trochu viac voľna a chuti. Tak som to využil a pretvoril pôvodného kandidáta od začiatku. Vytvoril som jednoduchší, ľahší a priestranejší design, ktorý práve sledujete.

Proces tvorby

Kódujem už roky. Jeden by povedal že ho až tak moc už neprekvapí. Nanešťastie ma Firefox nepríjemne prekvapil drobnými nedostatkami pri štýlovaní veľmi zložitých očíslovaných zoznamov, ktoré som chcel použiť pre komentáre. Musel som ustúpiť a vzdať sa idei, že budú vyzerať na 100 % podľa mojej predstavy. Taktiež nepríjemne prekvapil pri jednej drobnosti s formulármi.

Poznámka: Za posledných 10 mesiacov som naštýloval viac zoznamov a formulárov ako je zdravé, preto to prekvapenie bolo nepríjemné.

Príjemné prekvapenie bol opäť Textpattern. Za tie dva roky som už aj zabudol aký krásny systém to je a ako jednoducho sa s ním robí. Poviem vám, ak spravíte za rok 10 až 15 webov vo Wordpresse (ako ja), tak Textpattern je potom ako hladkanie. Na čisté blogovanie skvelý systém.

Novinky

Ak by vás zaujímalo, čo sú to za odkazy v pravej časti, tak sú to články ktoré ma v mojej RSS čítačke zaujali. Pod nimi sú taktiež videá ktoré ma zaujali. Vymyslel som si veľmi jednoduchý spôsob ako ich tam pridávať. V mojej RSS čítačke (Google Redaer) iba označím článok ktorý sa mi páči. Tieto vybrané články majú vlastné RSS, ktoré cez FeedBurner zobrazujem na tomto webe. S videami je to rovnako, ale tie sú vyberané na Vimeo. Mám rád jednoduché a integrované riešenia.

Resuscitácia blogu

V posledných týždňoch sa mi to tu pomaly začína dariť oživovať. Nebojte sa, s písaním to nebudem preháňať ale dostal som chuť na to, takže sa tu občas niečo objaví. Čiže ak ma nemáte vo svojom RSS, hoďte si ma tam. A Vy, ktorí ma už máte, nezabudnite si zmeniť odkaz na nové RSS.

Tak píšte komentáre, som zvedavý ako to hodnotíte.

Redesign môjho portfólia

Idea vznikla ku koncu minulého leta, po niekoľkých neuspokojivých návrhoch. V priebehu roka som ju mierne upravil, ale stále nebola chuť pustiť sa do toho. Niekedy koncom marca som sa pokúsil začať kódovanie, ale po chvíli ma to prestalo baviť. Až tento víkend som sa zakúsol a celé to dotiahol do konca.

Pozrite sa na to: webdesign.photoshopbook.net. Či som to dotiahol do šťastného konca, to nechám na vás.

Som rád že sa mne ako ne-programátorovi podarilo vychytať funkčnosti ktoré som si zaumienil. Teší ma že som využil jQuery bez toho aby som čo i len trochu ovládal Java Script. Ak sa vám chce, pozrite sa aj do kódu. Zdá sa byť celkom pekný, čistý a validný.

Čo na to hovoríte? Vyjadrite svoju kritiku v komentároch.

Moje fotografické portfólio

Dizajn pre moje portfólio mi ležal na disku nejaký ten mesiac (3, 4?). Ale chuť do kódovania nebola. Až keď sa ma Marián spýtal, kde by si mohol pozrieť moje fotografie, som sa odhodlal dokončiť čo som započal.

Spraviť šablónu webu bolo na chvíľu. Najviac práce a času zabral výber fotografií a ich kategorizácia. Nazrite na www.photoshopbook.net/fotografia

Je to zatiaľ iba beta verzia. Ak by som mal čakať kým vychytám všetko čo by som rád, tak by som sa asi nedočkal. Budem rád ak mi sem napíšete svoje dojmi. Kritiku portfólia (webu ako takého), alebo fotografií. Prípadne, ktoré sa vám najviac páčia. A pochváľte sa svojimi fotkami, rád si ich pozriem (ak máte tiež niekde svoje portfólio, alebo aspoň album na Picase či Flickr).

Dodatok: Ten obkec na úvodnej stránke si moc nevšímajte, potreboval som to nejak vyplniť a nevedel som čím :).

Typografia ako hlavný prvok webdesignu

Dobrý grafický dizajnér vie využiť typografiu vo svoj prospech. Často sa stáva jeho jediným grafickým doplnkom a nástrojom. Tento trend vidím vo webdizajne za posledný rok narastať. Konečne, už bolo načase.

Veľmi sa mi páčia stránky ktoré na typografiu nedajú dopustiť. Neboja sa veľkého písma, niekedy priam až ohromujúceho. Dodržiavajú nutné zákonitosti dobrej čitateľnosti a nehanbia sa za mriežku. Takéto stránky nie je jednoduché navrhnúť ale plnia svoj účel výborne. Návštevník sa neprišiel pozerať na to aká je stránka pekná. Zaujíma ho text. A nie je pravda že by boli všetky nudné a nepútavé, práve naopak.

Tieto ukážky síce nezodpovedajú príliš vyššie písanému textu ale to nevadí, lebo mnoho ďalších ukážok nájdete v nasledujúcich článkoch:

• 15 Excellent Examples of Web Typography — PART I: SHOWCASE
• 15 Excellent Examples of Web Typography — THE LIST: Q1 2008
• 15 Excellent Examples of Web Typography — QUARTER 2, 2008

Mám rád design stavaný iba na typografii, je prehľadný, príjemný a ponúka iba čistú informáciu, tak to má byť!

Ako správne písať úvodzovky

Lepšie textové procesory sádzajú guľaté a správne úvodzovky samy od seba, s apostrofmi im človek väčšinou musí pomôcť ručne. Na webových stránkach je najlepšie používať UTF-8 a úvodzovky i ďalšie pekné znaky môžete sádzať priamo, teda bez entít. Pre poriadok však uvádzam aj html entity.

1. Slovenské dvojité úvodzovky

Otvárací znak (Unicode 201E) má tvar 99 a je dole.
Zatvárací znak (Unicode 201C) má tvar 66 a je hore.

Windows: Alt+0132, Alt+0147. Mac (na slovenskej klávesnici): Alt+Shift+N, Alt+Shift+H.
HTML: „ a “.

2. Slovenské jednoduché úvodzovky

Otvárací znak (Unicode 201A) má tvar 9 a je dole.
Zatvárací znak (Unicode 2018) má tvar 6 a je hore.

Windows: Alt+0130, Alt+0145. Mac (na slovenskej klávesnici): Alt+N, Alt+H.
HTML: ‚ a ‘.

3. Anglické dvojité úvodzovky

Otvárací znak (Unicode 201C) má tvar 66 a je hore.
Zatvárací znak (Unicode 201D) má tvar 99 a je hore.

Windows: Alt+0147, Alt+0148. Mac (na slovenskej klávesnici): Alt+Shift+H, Alt+Shift+J.
HTML: “ a ”.

4. Anglické jednoduché úvodzovky

Otvárací znak (Unicode 2018) má tvar.6 a je hore.
Zatvárací znak (Unicode 2019) má tvar 9 a je hore.

Windows: Alt+0145, Alt+0146. Mac (na slovenskej klávesnici): Alt+H, Alt+J.
HTML: ‘ a ’.

5. Francúzske dvojité úvodzovky

Vo francúzskej typografii, otvárací znak (Unicode 00AB) ukazuje sprava doľava («). Zatvárajúci (Unicode 00BB) zľava doprava (»).
V nemeckej typografii (archaicky), otvárací znak (Unicode 00BB) ukazuje zľava doprava (»). Zatvárajúci (Unicode 00AB) sprava doľava («).

<img src="logo.png" alt=""/>

$ mkdir -p `dirname nahledy/Thassos/Potos.jpg`

find -name "*jpg" -print | sed 's/a\/b\///'