Szablonem strony internetowej przyjęło się nazywać grafikę, która, pocięta na odpowiednie fragmenty, jest ponownie poskładana w kodzie HTML i CSS, tworząc wygląd witryny WWW. Szablony stron WWW powstają więc przed witryną. Mając szatę graficzną, tworzymy podstrony, następnie podpinamy CMS lub wklejamy treść.
Jeśli chcemy mieć nowy szablon dla swojej witryny, możemy znaleźć darmowy template w Internecie. Takie rozwiązanie niesie jednak za sobą pewne ryzyko i niedogodności. Co prawda taki darmowy szablon został przetestowany i sprawdzony, ale jest też używany przez tysiące ludzi (darmowe znaczy popularne), a więc nie jest unikalny (a wiadomo, że wszelkie roboty internetowe lubią unikalność). Poza tym - jeśli taki template posiada wady, niedoskonałości, a nawet dziury (czasem umożliwiające ataki na witryny internetowe), to w związku z jego popularnością - są one szeroko znane, a więc więcej osób wie jak zepsuć lub zhackować Twoją stronę.
Aby uniknąć powyższych przykrości, pozostaje nam jedno - stworzyć unikalny, dedykowany szablon dla strony internetowej od nowa.
Wbrew pozorom, tworzenie szablonów nie jest zadaniem trudnym. Składa się z kilku etapów: Najpierw należy przygotować grafikę, potem odpowiednio ją pociąć. Następnie piszemy kod HTML, a potem kod CSS. Ostatnim etapem są poprawki wg reguł użyteczności i optymalizacji.
Podczas tworzenia szablonów stron, należy zwracać baczną uwagę na każdy etap "produkcji" - bowiem każdy szczegół ma znaczenie. Niedbale wykonana grafika będzie odstręczała gości strony. Słabe pocięcie grafiki odbije się na długim czasie wczytywania witryny. Nieodpowiednio napisany kod HTML i CSS może spowodować nawet rozsypanie się witryny w pewnych przeglądarkach, a więc de facto jej zniszczenie.
Aby tworzyć od podstaw dobre szablony stron www, należy więc posiadać pewną wiedzę. Jak ją zdobyć? Nic prostszego - w Internecie roi się od dokładnych tutoriali i szczegółowych opisów.
Gdy mamy już wiedzę - uzbrajamy się w cierpliwość. Niektóre etapy tworzenia szablonu są żmudne i wymagają czasu. Czasem trzeba powtarzać tą samą czynność wielokrotnie (na przykład podczas cięcia grafiki).
Oto kilka złotych rad, które powinniśmy mieć na uwadze podczas tworzenia szaty graficznej i kodu HTML/CSS:
1) Projektując grafikę dla szablonu cały czas myśl o tym, jak będzie zbudowana strona. Wszystko jest możliwe, ale niektóre układy wymagają naprawdę sporych kombinacji w kodzie CSS.
2) Podczas optymalizacji pociętej grafiki zwracaj uwagę na liczbę kolorów, jaki zawiera każdy fragment (jeśli liczba kolorów jest mała - zapisuj go jako GIF). Tam, gdzie się da, używaj powtarzalny gradientów i wypełnień jednokolorowych (bez grafiki).
3) Projektując szkielet HTML pamiętaj o odpowiednio opisanych tagach META, wykorzystaniu nagłówków H1-H6. Programuj tak, żeby dokument był zgodny ze specyfikacją DOCTYPE. Staraj się używać nowych, semantycznych tagów w szablonie HTML.
4) Opisując style CSS korzystaj jak najmniej z "hacków" - staraj się nie opisywać tych samych własności dla kilku elementów (będzie w przyszłości łatwiej modyfikować stronę).
Jeśli zależy Ci na Twojej stronie internetowej - zmieniaj Twój szablon, także podczas działania strony. Dostosowuj wygląd i kod do nowych potrzeb i funkcjonalności.
Wsłuchaj się w narzekania użytkowników - często dostarczają oni przydatnych informacji na temat użyteczności witryny.
Pamiętajmy jednak, że sukces witryny internetowej zależy głównie od jej zawartości - szablon (zarówno pod względem wyglądu jak i optymalizacji oraz poprawności kodu) może tylko podkreślać i uwypuklać tę treść.
Jeśli chcemy mieć nowy szablon dla swojej witryny, możemy znaleźć darmowy template w Internecie. Takie rozwiązanie niesie jednak za sobą pewne ryzyko i niedogodności. Co prawda taki darmowy szablon został przetestowany i sprawdzony, ale jest też używany przez tysiące ludzi (darmowe znaczy popularne), a więc nie jest unikalny (a wiadomo, że wszelkie roboty internetowe lubią unikalność). Poza tym - jeśli taki template posiada wady, niedoskonałości, a nawet dziury (czasem umożliwiające ataki na witryny internetowe), to w związku z jego popularnością - są one szeroko znane, a więc więcej osób wie jak zepsuć lub zhackować Twoją stronę.
Aby uniknąć powyższych przykrości, pozostaje nam jedno - stworzyć unikalny, dedykowany szablon dla strony internetowej od nowa.
Wbrew pozorom, tworzenie szablonów nie jest zadaniem trudnym. Składa się z kilku etapów: Najpierw należy przygotować grafikę, potem odpowiednio ją pociąć. Następnie piszemy kod HTML, a potem kod CSS. Ostatnim etapem są poprawki wg reguł użyteczności i optymalizacji.
Podczas tworzenia szablonów stron, należy zwracać baczną uwagę na każdy etap "produkcji" - bowiem każdy szczegół ma znaczenie. Niedbale wykonana grafika będzie odstręczała gości strony. Słabe pocięcie grafiki odbije się na długim czasie wczytywania witryny. Nieodpowiednio napisany kod HTML i CSS może spowodować nawet rozsypanie się witryny w pewnych przeglądarkach, a więc de facto jej zniszczenie.
Aby tworzyć od podstaw dobre szablony stron www, należy więc posiadać pewną wiedzę. Jak ją zdobyć? Nic prostszego - w Internecie roi się od dokładnych tutoriali i szczegółowych opisów.
Gdy mamy już wiedzę - uzbrajamy się w cierpliwość. Niektóre etapy tworzenia szablonu są żmudne i wymagają czasu. Czasem trzeba powtarzać tą samą czynność wielokrotnie (na przykład podczas cięcia grafiki).
Oto kilka złotych rad, które powinniśmy mieć na uwadze podczas tworzenia szaty graficznej i kodu HTML/CSS:
1) Projektując grafikę dla szablonu cały czas myśl o tym, jak będzie zbudowana strona. Wszystko jest możliwe, ale niektóre układy wymagają naprawdę sporych kombinacji w kodzie CSS.
2) Podczas optymalizacji pociętej grafiki zwracaj uwagę na liczbę kolorów, jaki zawiera każdy fragment (jeśli liczba kolorów jest mała - zapisuj go jako GIF). Tam, gdzie się da, używaj powtarzalny gradientów i wypełnień jednokolorowych (bez grafiki).
3) Projektując szkielet HTML pamiętaj o odpowiednio opisanych tagach META, wykorzystaniu nagłówków H1-H6. Programuj tak, żeby dokument był zgodny ze specyfikacją DOCTYPE. Staraj się używać nowych, semantycznych tagów w szablonie HTML.
4) Opisując style CSS korzystaj jak najmniej z "hacków" - staraj się nie opisywać tych samych własności dla kilku elementów (będzie w przyszłości łatwiej modyfikować stronę).
Jeśli zależy Ci na Twojej stronie internetowej - zmieniaj Twój szablon, także podczas działania strony. Dostosowuj wygląd i kod do nowych potrzeb i funkcjonalności.
Wsłuchaj się w narzekania użytkowników - często dostarczają oni przydatnych informacji na temat użyteczności witryny.
Pamiętajmy jednak, że sukces witryny internetowej zależy głównie od jej zawartości - szablon (zarówno pod względem wyglądu jak i optymalizacji oraz poprawności kodu) może tylko podkreślać i uwypuklać tę treść.
Licencja: Creative Commons
