Szablon mojej strony domowej (prawie) gotowy!
Opublikował/a tomekwojcik w dniu styczeń 29, 2008
Po długim i ciężkim boju, wielu godzinach użerania sie z Fotoszopą, przeczytaniu kilku kilometrów dokumentacji dotyczącej XHTML i CSS w końcu stworzylem szablon mojej przyszłej strony domowej.
Stworzyłem sobie layout na podstawie interfejsu aplikacji Mac OS X, który zaprojektowałem w Interface Builder’ze (taki Makowy edytor okienek dialogowych, część IDE Xcode). Layout’owi temu porobiłem stosowne screenshot’y, które później powycinałem w Photoshop’ie. HTML i CSS powstały w MacVim’ie i mojej głowie. Przyznam, że był to pierwszy projekt, który zrobiłem od strony szablonu i była to niezła szkoła. XHTML 1.0 Strict i CSS się walidują bez błędów, przeglądarki renderują stronę idealnie, więc jest super.
Małe sprostowanie co do przeglądarek - normalne przeglądarki (Firefox, Safari i Opera) renderują ten szablonik bez problemów. IE 6 się sypie na przezroczystości PNG’ów, pseudoklasach w przyciskach na pasku tytułu i padding’u menu. Jak wyświetla IE 7 nie wiem, bo nie mam jak w tej chwili tego sprawdzić. Nie zmienia to faktu, że nie zamierzam robić niczego, aby IE w którejkolwiek wersji wyświetlało dobrze tą stronę. IE to zła przeglądarka i nie zamierzam mojej prywatnej strony do niej przystosowywać.
Przyciski na pasku tytułowym się ladnie podświetlają po najechaniu na nie myszką. Po kliknięciu wykonują akcje - czerwony zamyka okno przeglądarki (nie działa przy zakładkach), żółty zwija okienko i zostaje tylko pasek tytułowy, zielony rozwija zwinięte okienko. Przyciski “Wstecz” i “Dalej” podświetlają się na niebiesko w momencie kliknięcia :).
Do zrobienia pozostało mi tło (zajmuje się tym Ewelina - graficzko[tfu!]-klawiszówka z zespołu), podpięcie JQuery (albo MooTools) do animowania zwijania i rozwijania okna (jak szaleć to szaleć!), dynamiczna wysokość okienka (zależna od rozdzielczości, przeglądarki i systemu operacyjnego [żeby uniknąć scroll'owania - od tego jest overflow w boksie z treścią strony i menu]) i cień (nad tym się zastanowie jak będę miał tło).
Kolejnym krokiem będzie podczepienie tego szablonu do CMS Made Simple, ale to pikuś będzie. Smarty znam bardzo dobrze, a XHTML’a i CSS’a średnio :).
Dla ciekawskich podgląd :).
