Poprawne szablony dla Joomla! Cz. I

W tej serii artykułów, będziemy tworzyć poprawny szablon dla Joomla/Mambo. Po zapoznaniu się z całym cyklem artykułów, będziesz umieć samodzielnie zaprojektować spełniający standardy projektowania stron WWW szablon dla swojego serwisu.

Opracowanie to zostało oparte na cyklu artykułów publikowanych w serwisie www.compassdesigns.net.

Joomla w zgodzie ze standardami WWW

Zapewne nieraz spotkasz się z określeniami: "standardy www" albo "standardy sieciowe" [ang. web standards], "CSS" "dostępność" [ang. accessibility]. I na pewno spotkasz się z zaleceniami, by przestrzegać standardów, by korzystać z CSS, by zadbać o zachowanie reguł dostępności. O co tutaj chodzi? Dlaczego trzeba stosować się do standardów? Dlaczego korzystać z CSS?

Czym są standardy sieciowe i co daje ich zachowanie?

Słowo "standard" jest wieloznaczne. Gdy mówimy o standardach projektowania stron WWW, mamy na myśli pewien zestaw wymagań czy też zaleceń, których spełnienie zapewnia odpowiedni poziom jakości, ułatwia zarządzanie, przynosi oszczędności, gwarantuje, że strona będzie poprawnie odczytywana przez różne przeglądarki internetowe, niezależnie od systemu komputerowego, na którym strona jest wyświetlana.

Wprowadzenie standardów było konieczne, choćby dlatego, że początkowo producenci przeglądarek internetowych stosowali własne standardy, co powodowało z kolei, że projektanci stron WWW byli zmuszeni tworzyć kilka wersji strony dla różnych przeglądarek.

Ustanawianiem standardów tworzenia i przesyłania stron WWW zajmuje się World Wide Web Consortium, w skrócie W3C, organizacja założona 1 października 1994 roku przez Tima Berners-Lee, twórcę WWW oraz autora pierwszej przeglądarki internetowej i serwera WWW. Zrzesza ona obecnie ponad 360 organizacji, firm, agencji rządowych i uczelni z całego świata.

Dzięki standardom Internet rozwija się racjonalnie, w sposób bardziej przyjazny i dla internautów, i dla projektantów witryn internetowych, staje się w większym stopniu dostępny dla wszystkich użytkowników, strony WWW są niemalże jednakowo odwzorowywane przez różne przeglądarki.

Warto jeszcze w tej skrótowej charakterystyce podkreślić, że stosowanie standardów nie wyklucza stosowania na stronach WWW zaawansowanych technologii i osiągania atrakcyjnych efektów - wręcz przeciwnie. Standardy W3C pozwalają na korzystanie z pełnego wachlarza multimediów: XHTML (oznakowanie strukturalne), CSS (arkusze stylów), SVG (dwuwymiarowa, wektorowa animacja graficzna) oraz SMIL (synchroniczne multimedia).

Co to takiego CSS i dlaczego używamy ich w Joomla?

Skrót CSS jest akronimem angielskiego określenia Cascading Style Sheets, tłumaczonego na język polski jako kaskadowe arkusze stylów. CSS to język opisu sposobu przetwarzania [renderowania] stron WWW, czyli prezentowania informacji zawartych w dokumentach WWW.

Arkusze CSS umożliwiają precyzyjne definiowanie sposobów wyświetlania elementów stron WWW, pozwalają oddzielić tzw. warstwę logiczną dokumentu od jego wyglądu, dzięki czemu kod ulega znacznemu uproszczeniu, dzięki czemu zajmuje znacznie mniej miejsca, jest szybciej przesyłany do przeglądarek internetowych, a ponadto łatwy w konserwacji, dając możliwość zmiany wyglądu wielu stron na raz.

Aktualnie funkcjonują dwa oficjalne standardy CSS: CSS 1 i CSS 2. Trwają prace nad CSS3. CSS1 jest w pełni obsługiwany przez Mozillę i inne przeglądarki oparte na jej silniku - Gecko, Operę, Safari oraz Konquerora. Prawie w pełni jest obsługiwany przez Internet Explorer 6 (do wersji 5.5 obsługa była niekompletna i pełna błędów). Niestety, obsługa CSS2 przez IE nadal pozostawia wiele do życzenia.

Joomla posługuje się CSS, dzięki czemu projektowanie strony graficznej serwisu jest bardzo elastyczne i łatwe. Wszystkie reguły zawarte są w jednym pliku. Wspomniane wcześniej oddzielenie warstwy logicznej od warstwy prezentacji w Joomla nie jest jeszcze w pełni przeprowadzone. To nieco inny problem. Powrócimy do niego w odpowiednim momencie. Teraz ważne jest, abyś uprzytomnił sobie, że stosowanie CSS jest kluczem do tworzenia poprawnych, zgodnych ze standardami W3C serwisów opartych na Joomla.

Co to jest dostępność?

Dostępność [ang. accessibility], niekiedy mylona z użytecznością [ang. usability, web-usability] oznacza takie właściwości strony WWW, że może ona być wykorzystywana przez jak najszersze grono odbiorców, wszystkich odwiedzających bez względu na ich ograniczenia fizyczne (osoby niepełnosprawne stale i czasowo, w tym niedowidzące i niewidzące) lub techniczne (starsze oprogramowanie, czytniki tekstu dla osób niepełnosprawnych, palmtopy itp.). Standardy określające dostępność dla użytkowników niepełnosprawnych to WAI (wydany przez W3C) oraz Section 508 (obowiązujący zgodnie z prawem USA).

W stosowaniu się do wymagań określonych w standardach Joomla! wspiera projektantów WWW - administratorów, redaktorów, grafików. Nie wszystkie jednak standardy są możliwe do spełnienia. Projektanci z Centrum Rozwoju Joomla zmierzają aktualnie do osiągnięcia zgodności Joomla ze standardami dostępności.

Wraz z tym cyklem artykułów możesz podjąć próbę stworzenia szablonu dla Joomla w jak największym stopniu zachowującego zaprezentowane powyżej krótko standardy.

Krótki przegląd projektowania szablonu dla Joomla

Nie ma jednej drogi tworzenia poprawnego szablonu dla serwisu. To zależy od projektanta. Grafik preferować będzie na przykład stworzenie najpierw projektu graficznego - obrazu w Photoshopie, a następnie podzieli go na wycinki, skorzysta z generatora kodu HTML, który później podda obróbce. Projektanci nastawieni bardziej na kwestie techniczne rozpoczną od kodowania arkusza CSS.

Ponieważ celem tego cyklu jest pokazać proces tworzenia szablonu w sposób maksymalnie przejrzysty, podzielimy nasza pracę na dwie części:

• Zainstalujemy "surowe" Joomla z pewną zawartością; normalnie byłoby to jedno z ostatnich stadiów w procesie projektowania serwisu.
• Stworzymy w CSS 3-kolumnowy szablon, a potem przystosujemy go do naszych potrzeb; uczynimy tak, aby zaprojektować możliwie uniwersalny układ, a następnie zobaczyć, jak można go dostosować do konkretnych założeń.

Poniżej jest zmodyfikowany plan naszej pracy, uwzględniający te dwa punkty:

1. Opracowanie szkicu i rozważenie założeń witryny
2. Zainstalowanie Joomla bez żadnego arkusza stylów, żadnego szablonu
3. Stworzenie prostego, opartego na CSS, 3-kolumnowego układu strony
4. Dostosowanie 3-kolumnowego szablonu opartego na CSS do wymagań Joomla i określenie niezbędnych właściwości stylów
5. Przystosowanie tego projektu do potrzebnej funkcjonalności serwisu
6. Wykorzystanie komentarzy uczestników wspólnoty do artykułów z tego cyklu i opracowanie szczegółowego przewodnika tworzenia poprawnych szablonów dla Joomla

Pod adresem: http://livesite.compassdesigns.net znajduje się "czysta" instalacja Joomla. Wykorzystamy ten serwis, aby ilustrować proces tworzenia szablonu. Udostępniamy także możliwość komentowania artykułów z tego cyklu, aby zebrać uwagi z doświadczeń wspólnoty użytkowników. Jeśli dobrze pójdzie, będzie to pouczające doświadczenie dla nas wszystkich.

Podsumowanie:

• Joomla jest darmowym, doskonałym systemem zarządzania treścią. Wykorzystamy go, tworząc dla Joomla szablon spełniający standardy W3C.
• Standardy projektowania stron WWW to zestaw reguł dla wszystkich przeglądarek internetowych, gwarantujących poprawne wyświetlanie zawartości stron. CSS to protokół, który zapewnia dostosowanie stron do standardów.
• Dostosowanie projektu szablonu dla Joomla do standardów W3C i uzyskanie poprawnych (walidowanych) stron może być trudne.
• Obsługa standardów we wcześniejszych wersjach przeglądarki Microsoft Internet Explorer była pełna błędów i niekompletna. Nie będziemy ich zatem brać pod uwagę.

Tłum. Stefan Wajda [aka zwiastun]
Źródło: Tutorial 1: Creating a W3C valid Joomla template for your Joomla website
Przedruk tylko za zgodą autora i redakcji