Webdesign, CMS » MyEgo.cz - Radek Hulán webzine

MyEgo.cz

home foto blogy mywindows.cz kontakt

Plovoucí (floating div) SkyScraper reklama

Webdesign, CMS 26.02.2010

SkyScraper o rozměru 120x600px je velice často používaný, pro čtenáře mimořádně otravný, ale pro inzerenty velice oblíbený reklamní formát. Díky jQuery jej můžete snadno udělat ještě viditelnější tím, že bude ladně plavat ve vertikálním směru po obrazovce.

Napsal jsem si na to jeden krátký skript, který respektuje výšku skyscraperu, jeho původní umístění o skyscraperOffset pixelů pod horním okrajem obrazovky a také zajišťuje, aby jeho obsah nevlezl do patičky webu, ale zastavil své plavání těsně nad ní. Celý DIV #skyscraper samozřejmě musí být absolutně pozicován.

Celý Javascriptový kód je zde, můžete jej libovolně použít:

$(document).ready(function(){
var skyscraperAd = $("#skyscraper");
var skyscraperOffset = skyscraperAd.offset().top;
var skyscraperBottom = $("#footer").offset().top - skyscraperAd.height();
$(window).scroll(function() {
skyscraperAd.stop();
var windowTop = $(window).scrollTop();
if (windowTop > skyscraperOffset) {
if (windowTop > skyscraperBottom) windowTop = skyscraperBottom;
if (windowTop < 0) windowTop = 0;
skyscraperAd.animate({top: windowTop + 'px'}, 'fast');
} else
skyscraperAd.animate({top: skyscraperOffset + 'px'},'fast');
});
});

A k tomu se váže (jako příklad) následující CSS:

#skyscraper {
width:120px; height:600px;
position:absolute;
top:300px; left:50%; margin-left:500px;
}

Nová prezentace a eshop: MeteorSport.cz

F-ART AGENCY s.r.o. vytvořila novou webovou prezentaci s eshopem a aplikaci pro společnost METEORSPORT s.r.o., dodavatele motocyklů VOXAN, skútrů SYM, motocyklového oblečení REV'IT a mnoha dalších značek.

Prezentace je založena na redakčním systému F-ART:CMS 5.0. Grafický návrh dělal Pavel Kout.

Meteorsport.czMeteorSport.cz

Nová prezentace a eshop: RAF.cz

Webdesign, CMS 22.02.2010

F-ART AGENCY s.r.o. vytvořila novou webovou prezentaci s eshopem a aplikaci pro společnost RAF ARMATURY s.r.o., výrobce komplexního sortimentu vodovodních baterií a doplňků určených pro koupelny, kuchyně a různé průmyslové objekty, zkrátka všude tam, kde se pracuje s vodou.

Prezentace je založena na redakčním systému F-ART:CMS 5.0 a nabízí 3 jazyková provedení.

RAF.czRAF.cz

Zaostalý Apple iPad je nejhorší možné zařízení pro procházení webu

Upozornění: pokud jste z nějakého důvodu člověk trpící komplexem z mého názoru, tak tento článek nečtěte. Ke stavu "mít rád Apple" fakt nepotřebujete moje posvěcení, stačí víra :-)

Apple se snaží propagovat svůj Apple iPad, tedy nejzaostalejší zařízení pro procházení webu, a tak kope kolem sebe, poslední dobou především do Adobe. Pojďme se tedy podívat, jak neuvěřitelně špatně se zaostalý Apple iPad vyrovná s procházením webu a s běžnými úkony:

  • Dívali jste se někdy v prohlížeči na iDNES.cz, BBC.co.uk, CNN.com, Novinky.cz, Blesk.cz, Youtube.com či Vimeo.com na video? Na iPadu máte smůlu, nepodporuje Flash.
  • Hráli jste někdy libovolnou hru na internetu? Na iPadu máte smůlu, nepodporuje Flash.
  • Dívali jste se někdy na screencast na internetu? Na iPadu máte smůlu, nepodporuje Flash.
  • Chcete se podívat na ZOH? Potřebujete Silverlight. Na iPadu máte smůlu.
  • Chcete si přehrát video v Xvid s českými titulky? Na iPadu máte smůlu.
  • Chcete se podívat na webovou prezentaci Breitlingu, Omegy či Cartier? Na iPadu máte smůlu, nepodporuje Flash, většina zážitkových prezentací jej přitom používá.
  • Chcete se kouknout na HD video v MKV? Na iPadu máte smůlu.
  • Chcete si spustit editor obrázků, upravit je, a nahrát na web? Na iPadu máte smůlu.
  • Chcete napsat delší email nebo komentář? Na iPadu máte smůlu, nemá použitelnou klávesnici.
  • Chcete uskutečnit video hovor s přítelkyní? Na iPadu máte smůlu, nemá videokameru.
  • Chcete zařízení, které nemá tyto vady, a stojí v ČR do 10.000 Kč? Na iPad zapomeňte.

Jak vidíte na příkladech výše, internet bez Flashe není plnohodnotný internet. Maximálně tak 50%. Většina lidí ani netuší, kde všude se Flash používá. To, že Apple nabízí zařízení s pomalým procesorem a bez akcelerace videa pomocí GPU neznamená, že by tyto svoje vady měl maskovat kydáním špíny na Adobe. Nicméně dělá to... Před pár dny jsou musel použít (kvůli klientovi) OS X 10.6.2 pro nějaký test, a byl jsem zhrozen - zaostalejší a méně stabilní systém si člověk těžko dokáže představit.

Přihlášení uživatele a ukládání hesla v databázi

Přihlášení uživatele je na většině webů realizováno pomocí kombinace uživatelské jméno / heslo. V databázi je uživatelské jméno uloženo typicky jako plaintext a heslo jako nějaký hash. Většina starších systémů používá md5(heslo) (třeba i tento web, MyEgo.cz, protože hesla jsou zde z roku 2003, kdy md5 bylo považováno za dostatečné; nicméně budu to měnit), novější třeba sha1(heslo), moderní například sha1(SALT.heslo). Sůl je v tomto případě náhodný řetězec, třeba |L$k!#Lcj29+RbXA=*N), unikátní pro každou instalaci. Důvodem pro použití soli je stížit možnou rekonstrukci skutečného hesla z hashe, pokud by tento byl odcizen.

Tento postup je jednoduchý na realizaci a všeobecně známý. Zajímavější je, jak poznat, že je klient přihlášen. Osobně toto řeším uložením náhodně vygenerovaného hashe do cookie. Tento náhodný řetězec přitom nijak nesouvisí s heslem. Generuje se třeba takto:

mt_srand( (double) microtime() * 100000000);
$this->cookiekey = sha1(COOKIE_SALT.uniqid(mt_rand()));

Poté, co je ověřeno jméno a heslo klienta, vygeneruje se a zapíše do databáze a do cookie tento hash s tajnou solí. Při návratu klienta na web je tato hodnota v cookies porovnána na databázi, a pokud se shoduje, je uživatel přihlášen. Navíc je více než vhodné kontrolovat IP adresu.

Tento postup samozřejmě nezamezí tomu, že někdo odposlechne danou cookie a má identickou IP adresu (zejména za NATem to není nemožné), ale pro běžné (nebankovní) redakční systémy je to rozumný kompromis mezi bezpečností, pohodlím a náklady na zabezpečení.

Celé je to samozřejmě možné ukládat do session namísto cookies, což dále zvýší bezpečnost, ale sníží komfort.

Pokud používáte ve svém CMS jiný postup, budu rád když se o něj podělíte v komentářích.

Facebook je nový a mnohem lepší koncept internetu než ten starý, protože lidé si nejsou rovni

Facebook je internet, který všichni chytří lidé chtějí. Jsou tam jen vámi zvolené inteligentní bytosti a žádní blbci. Nejsou tam chudáci, co potřebují psychiatrickou léčebnu, protože se neumí vyjadřovat bez vulgarit, zakomplexovaní puberťáci s beďary řvoucí na každého kolem sebe, lidé otravující se spamem v komentářích, či skupinky pomlouvačných debilů pobírajících sociální dávky a schovávajících se za zdánlivou "anonymitu".

Ne, Facebook je internet pro vámi vyvolené chytré lidi.

Facebook je elitní záležitost. Facebook je jako reálný život. V běžném životě se nebudete bavit s ošklivým hňupem, preferujete kolem sebe krásné a inteligentní lidi (jako jste vy) s podobnými zájmy. A přesně to vám Facebook nabízí. Vytvoříte si internet přesně podle svých potřeb a přání.

Mám rád Facebook. Je to internet, který se musí chytrým lidem líbit. Báječně kastuje a filtruje, protože lidé si nejsou rovni v tom co umí a jak se chovají. Blbci se v reálném životě kamarádí většinou zase jen s dalšími blbci, chytří naopak s chytrými. Internet ovšem tuto přirozenou a žádoucí rovnováhu narušuje.

S neustálým rozšiřováním Facebooku doufám, že jednoho dne nabídnou podobnou filtraci i weby třetích stran, a to propojením s Facebookem přes jeho API. Budete si číst třeba článek na Živě.cz, ale uvidíte jen komentáře vámi vyvolené elity, snadno oddělíte zrno od plev.

Elitní internet bez nudné a neužitečné anarchie podprůměrných je to, co potřebujeme. Současný internet je totiž (z velké části) pro ty chytré neuvěřitelná ztráta času.

Linuxový desktop je i v roce 2009 nedokončený a nabízí mizerné aplikace

Nemám vůbec rád Linux na desktopu, protože mám pocit, že jej místo designérů a expertů na UI navrhují uhrovití programátoři s nulovým smyslem pro ergonomii. I po 15 letech vývoje na mě stále Linux působí nedokončeným dojmem. Namísto toho preferuji Windows 7, nový systém Microsofu, a aplikace pro něj. Ostatně jako většina lidí.

Při používání Linuxu a aplikací pro něj trpím. A nejsem sám.

Někteří uživatelé Linuxu tvrdí, že "jejich" systém se nepoužívá masově proto, že jej lidé neznají. Nevědí prý vůbec o něm, o jeho úžasnosti. To je hloupost. O Linuxu se píše neustále, je dostupný zdarma, každý to ví, ale přesto jej používá jen 1% lidí. Bing hledání vrátí na slovo Linux zhruba 246 miliónů stránek a to je opravdu hodně.

Proč tedy Linux skoro nikdo nechce? Protože se s ním, a s aplikacemi pro něj, opravdu špatně pracuje. Jsou to sice aplikace zdarma, ale graficky většinou ohavné a funkčně nedostatečné.

Mizerné aplikace pro Linux, dokonalé pro Windows?

Následující testování probíhalo na poslední verzi Ubuntu 9.10, vydané zhruba před měsícem.

Otevření souboru

Při psaní článku na tento blog používám často HTML šablonu, která je umístěná na webu. V poslední verzi Ubuntu jsem si tedy nainstaloval Bluefish editor a pokusil se tento HTML soubor otevřít. Nejde to. Bluefish / Gnome asi neumí používat zhruba milión let starý http protokol:

otevření souboru v Ubuntu nefunguje pro http

Ve Windows 7 je vše nejenom graficky mnohem hezčí, ale otevřít soubor z běžného souborového dialogu přes http (či ftp, atd.) protokol samozřejmě není problém:

otevření souboru ve Windows je plně transparentní

Facebook i Twitter jsou internetovou revolucí, ale opravdový význam získají až s propojením na váš mobil

Čím dál tím více lidí používá Facebook i Twitter.

Seesmic Desktop

Já osobně Twitter používám nejen jako obdobu mikro-blogu, tedy své prezentace, ale i jako zdroj informací pro mě samotného, který nahradil RSS. RSS čtečky jsem nikdy neměl moc rád, a dnes je vůbec nepoužívám. Twitter je efektivnější. Stačí se zaregistrovat, kliknout na follow u lidí co vás zajímají a vše potřebné ihned vidíte na webu, mobilním telefonu či v desktopových klientech (třeba v Seesmic Desktop na obrázku).

Facebook je podobně užitečný, ale pro informace o tom, co dělají vaši přátelé. Naprosto geniální je Facebook ovšem až poté, co jsou data z něj integrována do běžných kontaktů na mobilním telefonu, jako to dělá HTC HD2 telefon s HTC Sense prostředím. U každého člověka najednou nevidíte jen jeho email, který jste tam ručně někdy napsali, ale i profilovou fotku z Facebooku, telefon (pokud jej publikoval), nově přidaná fotoalba, aktualizace stavů (kde je a co dělá) a vše je to zcela automatické. Nemusíte ani hnout prstem pro získání těchto informací. Telefon vám také ukáže kde se právě koná jaká party, kdo má narozeniny, a komu se narodilo dítě :-)

Tato data si navíc nemusíte nijak udržovat, když si někdo změní emailovou adresu či pracovní pozici, budete o tom ihned vědět.

Web 2.0 představovaný Twitterem a Facebookem jsou užitečné služby na PC, ale až jejich propojení na váš mobil s datovým tarifem a s online dostupnosti kdekoliv jim dávají obrovskou užitečnost.

Facebook a Twitter dokonale integrované s ostatními aplikacemi v mobilním telefonu jsou ta nejlepší technologická věc pro rok 2010.

Mrzne vám Internet Explorer 8? Pravděpodobně za to může Apple...

Internetový prohlížeč je aplikace, která neexistuje téměř nikdy samostatně a v té podobě, jakou ji tvůrce naprogramoval. Většinou je vylepšována desítkami dalších rozšření třetích stran. V případě Internet Exploreru 8 má uživatel těchto rozšíření často instalovaných desítky, aniž o tom něco tuší.

Tyto rozšíření můžete snadno spravovat, zakazovat a povolovat v menu Nástroje / Spravovat doplňky, poté si vlevo dole zvolte Všechny doplňky.

Internet Explorer 8 mi občas zamrzal. To je fakt. Zkoumal jsem proč, a na vině je Apple. Přesněji řečeno, jeho neuvěřitelně bugový, pomalý a nestabilní software QuickTime / iTunes, který se bez ptaní nacpe i do takové činnosti jako je zobrazování PNG obrázků v IE8. Proč, proboha? Zobrazování PNG je poté extrémně pomalé a občas QuickTime "sekne" celý IE8.

Odinstalujte či zakažte QuickTime / iTunes, prostě vyhoďte to nestabilní Apple smetí, a prohlížeč od Microsoftu bude zase v nejlepší kondici :-)

Apple je výrobce řady chybového software

Související: QuickTime stealing file associations a Quicktime is a whore

Firefox i Google Chrome mají podobnou chybu při inicializaci pluginů

Firefox i Google Chrome trpí jednou nepříjemnou chybou při podpoře pluginů, kterou Internet Explorer nemá. Zkuste si do stránky vložit objekt XStandard WYSIWYG editoru. Napište do editoru nějaký text. Následně na tomto objektu zavolejte display:none a poté display:block a onen text zmizí.

Oba prohlížeče, naprosto stupidně, zavolají znovu inicializaci daného pluginu (editoru) a tím samozřejmě přijdete i o editovaný obsah.

Pochopitelně, dá se to obejít, namísto display:none používat nastavení height:1px; width:1px, ale to je nesystémový opruz.

Znovu a znovu volaná inicializace pluginu je už 8 roků ve Firefoxu uznaná jako chyba, ale dosud neopravená. Je možné, že Google Chrome na Windows zkopíroval Netscape API, a tak tuto chybu "implementuje" také. Uvedená chyba také drasticky snižuje výkon webů, které skrývají a odkrývají části webu a kde se pro renderování používají pluginy (typicky Flash).

Tedy další důvod, proč používat bezpečný IE8.