GRAFIKA STRON WWW
Podstawowy element graficzny to kolor tła kolumn. Tło może być jednolite, gradientowe, deseniowe, kafelkowe, z znakami wodnymi lub delikatnie zarysowanym rysunkiem. Kolor tła kolumn powinien harmonizować z kolorem nagłówka i być w tej samej dużo jaśniejszej pastelowej tonacji. Najłatwiejsza realizacja tła jest na stronach o stałej szerokości. Strony płynne i elastyczne wymagają specjalnych rozwiązań. Podstawy grafiki nagłówków to wycinanie fragmentów zdjęć, rozjaśnianie, kopiowanie, wklejanie i umieszczanie napisów na zdjęciach. Jak dotąd brak było na rynku książki z rozdziałem o praktycznym tworzeniu grafiki na stronach www. Dopiero w czerwcu 2009r w czasie kończenia BIBLIOTEKI ukazała się pierwsza tego typu książka Grafika w Internecie autor Shelly Powers, więcej o niej na stronie CO DALEJ .
GRAFIKA KOLORÓW TŁA
Jednolite tło dwóch, trzech kolumn można uzyskać programowo. W tym celu kolor tła najszerszej kolumny, określamy deklaracją CSS background: #ddffcc; umieszczoną w selektorze #opakowanie, obejmującym całą stronę z kolumnami. W celu zmiany koloru tła w prawej kolumnie umieszczamy w selektorze #sidebar, obejmującym prawą kolumnę, deklarację CSS background: #edffcc;. Jednak tak uzyskane tło nie dochodzi do stopki kończąc się poniżej ostatniego wiersza kolumny. Poniżej tej granicy wlewa się tło z lewej kolumny. Wadę tą można usunąć wpisując pod tekstem prawej kolumny znaczniki <pre> ... </pre> pozostawiając między znacznikami tyle pustych wierszy ile wystarczy aby tło oparło się o stopkę. W opisywanym wypadku wystarczy 20 pustych wierszy.
Proponowane rozwiązanie jest jednak kłopotliwe zwłaszcza gdy istnieje wiele stron o różnym wypełnieniu tekstem, co zmusza do wpisywania na każdej stronie znaczników <pre> ... </pre> z różną ilością pustych wierszy, korygowaną po każdej zmianie tekstu. Metoda ta może być stosowana na stronach o stałej szerokości z czcionką w pikselach.
METODY SZTUCZNYCH KOLUMN i ROZWIJANEGO TŁA
Problem dwukolorowego tła sięgającego z góry do dołu rozwiązał Dan Cederholm z pomocą tzw. sztucznych lub fałszywych kolumn. Wykonał w programie graficznym obrazki kolorowych pasków o wysokości rzędu 10px i szerokości odpowiadającej projektowanym kolumnom. Następnie w arkuszu CSS umieścił selektor z deklaracją powielania obrazka w pionie, a w kodzie XHTML zamieścił odwołanie do tego selektora. Metoda tworzenia takiego obrazka oprócz stworzenia dwóch pasków o żądanych kolorach i szerokości wymaga jeszcze połączenia ich w jeden pasek jak przy tworzeniu panoramy. Podobnie rozwiązuje się ten problem dla trzech kolumn.
Autor strony opracował prostrzą i bardziej uniwersalną metodę z rozwijanym tłem jednej kolumny tj. z obrazkiem jednego koloru dającego tło w węższej kolumnie umieszczanej z lewej lub prawej strony. Kolor tła szerszej kolumny można łatwo zmieniać jedynie deklaracją background:kolor. Metodę tą można stosować także w układzie 3-ech stałych kolumn. Sposób tworzenia takiego paska w programach graficznych GIMP i PSPX2 opisany jest na dalszych stronach.
Można jeszcze zmienić kolor białego tła po obu bokach kolumn strony. W tym celu wpisujemy w selektorze body deklaracje CSS background: #ffff99; uzyskując w miejsce białego tła, żółte. Stosowanie kolorowego tła zawęża tekst strony, co wymaga nowych marginesów na kolorze tła.