Webios.cz/weblog
informace ze světa grafiky, internetu, přírody, fotografie a podnikání
Archive for the ‘Grafika & webdesign’ Kategorie
Weblog restart
Autor: eforsee1 Čer
Koukám, že už je to, bez měsíce a půl, rok od mého posledního příspěvku na tomto, už několika lidmi (např.: http://www.tutorials.cz/…azeni-zdarma) pohřbeném, blogu. Není to dáno tím, že bych neměl o čem psát, ba naopak, nestíhám, nestíhám a..ehm, nestíhám. Jestli si to teda jenom nenamlouvám. :) Věcí, o kterých by se dalo psát je skutečně hafo.
Za poslední rok se udála spousta věcí a změn, o kterých by bylo, myslím, zajímavé se trochu více rozepsat. Na podzim jsem měl dokonce nápad spustit blog nazvaný „tři práce“ nebo tak nějak to tuším bylo. Psaní nebudu brát jako jednu z forem internetového exhibicionismu nebo výlevnu literárního přetlaku, ale jako místo, kde se s vámi, mimo jiné, chci podělit o pracovní zkušenosti z oblasti webdesignu a podnikání, a utřiďovat si své business myšlenky a plány, na které mi poslední dobou už skoro nezbývá ani pravidelná chvilka před spaním, kdy do postele ulehám s počmáraným blokem a nažhavenou tříbarevnou propiskou.
Na své by si měli přijít čtenáři zabraní do webdesignu nebo intenetového podnikání. Jsou to právě tyto dvě oblasti + skloubení se sportem a s IT zdánlivě totálně nesouvisejícími zájmy, díky nímž si poslední více než rok připadám jako zájmově totálně rozštěpená osobnost. Toť pro dnešek vše, neboť je strašně moc důležité nepřepálit začátek! Ale o tom až jindy..možná. ;)
Když se logotypy nápadně podobají.
Autor: eforsee25 Čvc
Na webu logodesignlove.com vyšel pěkný článek o tom, jak je stále těžší a těžší vymyslet nový, originální logotyp, aniž by se podobal byť třeba jen jednomu jinému logotypu, který už existuje a je používán.
Sám jsem na tento problém nedávno narazil, když jsem skicoval a vymýšlel nové logo pro vznikajicí IT společnost. Nakonec mi z mých návrhů vykrystalizovalo několik symbolů, které s tímto odvětvím jednoznačně asociují, ovšem strach z toho, že podobné logo již někde ve světe existuje a je viditelně používáno mi zabral celkem hodně času, který jsem strávil prochazením „tun“ materiálů s logotypy z celého světa, abych se ujistil, že nikde na stejný nenarazím.
U níže uvedených příkladů se to vždy jednomu z dvojice moc nepodařilo. Posuďte sami.
Stylegala a Sumpter & Gonzalez LLP
Columbia Sportswear a Sun Microsystems
Pro více příkladů podobných logotypů a celý článek, který mne inspiroval k tomuto příspěvku navštivte níže uvedený odkaz.
Dopravní kampaň od Ogilvy India
Autor: eforsee8 Dub
Nejsou vám ty pocity při čtení trochu povědomé? Hodně povedená věc, která plní svůj účel.
Ještě bych kolem silnic místo všech těch více či méně trapných reklam aspoň sem tam vylepil reálné fotografie z dopravních nehod. Ono by se pak mnohým pirátům (čti blbečkům) třeba rozsvítilo.
Podrobný návod jak na svém webu zprovoznit efektní prohlížeč obrázků a fotografií Lightbox
Autor: eforsee6 Lis
Ve své minulém příspěvku s fotkami z Orlických hor jsem na prohlížení obrázků použil efektní javascriptovou miniaplikaci Lightbox.
Lightbox aplikovaný na náhledové obrázky způsobí, že se po kliknutí na obrázek okolní plocha stránek zatemní, zpoloprůhlední do černa, přičemž je stále dobře rozpoznatelná, ale jakožto ztmavená tolik nenarušuje rozkliknutý objekt, který má díky Lightboxu navíc šikovné a kontrast zvyšující cca 10px široké, bílé orámování.
Pokud se i vám Lightbox, potažmo „Lightbox efekt“ líbí tak, jako mně, zde máte podrobný návod na jeho zprovoznění, plus jako bonus drobné přizpůsobení v podobě počeštění a návodu na editaci či vložení vlastního textu pod prohlíženými obrázky či fotkami. Zhasněte světla, začínáme.
--------
Postup:
0) Ukázka jak Lightbox funguje v praxi. Klikněte na obrázek:
--
1) Stáhněte si Lightbox (vizuální český překlad
Lightboxu naleznete na koncu článku v tipech)
stahuj Lightbox
v2.03.3
--
2) Stažený lightbox2.03.3.zip rozbalte a nahrajte na úroveň jednotlivých složek webu tak, aby byl na stejné úrovni jako stránka, na kterou jej chcete aplikovat. Pokud máte rozvětvenější web a Lightbox umisťujete do jiné úrovně, tak musíte ručně zadat (změnit) cestu v CSS souboru.
--
3) Do hlavičky stránky (mezi tagy <head> a </head>), na kterou chcete Lightbox aplikovat, vložte následující kód:
<script type="text/javascript"
src="js/prototype.js"></script>
<script type="text/javascript"
src="js/scriptaculous.js?load=effects"></script>
<script type="text/javascript"
src="js/lightbox.js"></script>
Upozornění: kvůli malé šířce jsem byl nucen druhý řádek rozdělit na dvě části, proto při vkládání do (X)HTML kódu dávejte pozor, aby mezi "...javascript"" a "src..." byla mezera! To samé platí i u následujícího kódu ve 4. kroku mezi „…css"“ a „type…“.
--
4) Do hlavičky stránky vložte též tento kód s CSS Lightboxu. Druhou možností je, že ho do hlavičky nevložíte, ale otevřete ve složce „css“ soubor „lightbox.css“, celý označíte (Ctrl+A) a vložíte (Ctrl+I) na konec (pro vlastní přehlednost) vašeho CSS souboru, který už na stránce používate.
<link rel="stylesheet" href="css/lightbox.css"
type="text/css" media="screen" />
--
5) Do odkazu obalujícího objekt, na něž chcete Lightbox aplikovat, vložte atribut rel="lightbox", pokud chcete u objektu zobrazit popisek, vložte ještě atribut title="popisek", viz. příklad níže:
<a href="složka s velkým obrázkem/velký obrázek" rel="lightbox" title="popisek"><img src="složka s náhledovým (malým) obrázkem/náhledový obrázek" alt="" /></a>
--
6) Pokud máte více obrázků nebo set fotografií, které spolu nějak souvisí, můžete je prohlížet za sebou, aniž byste vždy zavírali aktuálně prohlížený objekt a klikali na další. Stačí, když místo rel="lightbox" napíšete do odkazů na jednotlivé obrázky rel="lightbox[roadtrip]", Lightbox si je už sám spojí a vy jen klikáte do pravé části pro přechod na následující obrázky nebo do části levé na obrázky předešlé. Pro zavření buď klikněte vně objektu, na křížek (CLOSE/ZAVŘÍT) vpravo dole a nebo zmáčkněte klávesu „X“.
--------
Tipy:
– Pro ty z vás, kteří by Lightbox rádi s českými popisky u náhledů jsem připravil počeštěnou verzi: Lightbox v2.03.3_CS
– Chcete-li si ještě dále upravit popisek před číslem značícím o kolikátý obrázek či fotku z kolika se jedná a nevyhovuje vám mnou nastavená hodnota „Foto“, můžete si ji změnit v souboru „js/lightbox.js“, kde vyhledáte (Ctrl+F) výraz „Foto“ a přepíšete dle libosti.
--------
Doporučuji:
oficiální stránky Lightboxu (EN):
http://www.lokeshdhakar.com/projects/lightbox2/
oficiálni fórum (EN): http://www.huddletogether.com/forum/
Rubriky
- Fotografie (3)
- Grafika & webdesign (4)
- Inspirace (1)
- Internet (1)
- Návody, tutorialy (1)
- Podnikání (2)
- Příroda (2)
- Reklama (1)
- Srandičky (1)
- Tapety na plochu (wallpapers) (1)
- Typografie (2)
- Životní styl (1)
Poslední příspěvky
Poslední komentáře
- eforsee u Font Frutiger ke stažení zdarma!
- 1 u Font Frutiger ke stažení zdarma!
- Andrea u Podrobný návod jak na svém webu zprovoznit efektní prohlížeč obrázků a fotografií Lightbox
- Jan Kotrla u Podrobný návod jak na svém webu zprovoznit efektní prohlížeč obrázků a fotografií Lightbox
- orbiq u Podrobný návod jak na svém webu zprovoznit efektní prohlížeč obrázků a fotografií Lightbox
Archivy
- Březen 2010 (1)
- Leden 2010 (1)
- Červen 2009 (1)
- Červenec 2008 (1)
- Duben 2008 (1)
- Listopad 2007 (1)
- Říjen 2007 (3)