Programming.pun.pl

Rameau · 2010-10-04 14:04:20

Tło obrazkowe

Spoiler:
<body background="ścieżka dostępu do obrazka">...</body>

lub

Spoiler:
<body background="ścieżka dostępu do obrazka" bgproperties="fixed">...</body>

(tło nieruchome - znak wodny - nie obsługuje Firefox!)
gdzie jako "ścieżka dostępu do obrazka" należy podać lokalizację, gdzie znajduje się obrazek, który chcemy umieścić w tle.
Jeśli znudziły Ci się już strony o jednolitym kolorze, możesz umieścić w tle dowolny obrazek. Dzięki temu strona może wyglądać dużo lepiej. Ponadto drugie z podanych poleceń pozwala zdefiniować tło obrazkowe które jest nieruchome, tzn. nie przesuwa się wraz z tekstem, gdy przewijamy zawartość okna.

Pamiętaj jednak, że obrazki o dużych rozmiarach spowalniają wczytywanie strony. Dlatego staraj się używać pliki tylko w formacie *.jpg (dla zdjęć wielokolorowych) lub *.gif (dla rysunków). Są to formaty skompresowane, zajmujące dużo mniej miejsca niż zwykłe mapy bitowe *.bmp. Trzeba również pamiętać, aby obrazek w tle nie był zbyt jaskrawy - spowoduje to tylko zaciemnienie zawartości strony i utrudni czytanie.

Zauważ, że nie ma potrzeby stosowania obrazka tła o rozmiarze takim jak strona, ponieważ jego kopie są ustawiane obok siebie tak, że zajmują cały obszar strony. Dlatego wystarczy wyciąć mały powtarzający się wzór, który zostanie następnie powielony przez przeglądarkę.

Należy unikać stosowania w tle dużych obrazków wyciętych ze zwykłych zdjęć. Tło powinno: mieć łagodne kolory (pastelowe, blade albo całkiem ciemne, ale nie jaskrawe; szczególnie odradza się jednoczesnego stosowania barw jasnych oraz ciemnych, ponieważ uniemożliwia to dobranie odpowiednio czytelnego koloru tekstu), składać się z powtarzalnych wzorów o niezbyt wielkich rozmiarach oraz być nieco rozmyte - nieostre (można to uzyskać w dowolnym bardziej rozbudowanym programie graficznym - odpowiedni efekt nazywa się zwykle: Rozmywanie albo Blur). Dobrym pomysłem są tła imitujące strukturę jakiejś powierzchni.

Jeśli nie masz zacięcia artystycznego, nie musisz samodzielnie rysować obrazków tła. W Internecie na pewno znajdziesz wiele stron, gdzie możesz je darmowo pobrać. Często są one dostępne również w edytorach HTML (np.: FrontPage) oraz programach graficznych.

Równocześnie z atrybutem background="..." często podaje się dodatkowo zwyczajny kolor tła strony. W takim przypadku, jeśli obrazek będzie niedostępny lub użytkownik wyłączy wyświetlanie obrazów, tło przyjmie podany kolor. Ponadto jeżeli obrazek posiada przezroczystość (np. format *.gif), zostanie ona zastąpiona podanym kolorem.

Jeśli ustalimy kolor tekstu strony (text="...") zbliżony do domyślnego koloru tła (zwykle biały), wskazane jest podanie dodatkowo takiego koloru tła (bgcolor="..."), aby tekst był na nim czytelny. Jeżeli tego nie zrobimy, a obrazek nie zostanie wyświetlony, może wystąpić sytuacja typu: "biały tekst na białym tle".

Może się to zdarzyć np. gdy obrazek w tle strony jest dość ciemny. Wtedy określa się zwykle jasny kolor tekstu, zapominając o ustaleniu równocześnie ciemnego koloru tła - jako zabezpieczenie. Dopóki obrazek jest widoczny, wszystko jest w porządku, lecz jeśli nie zostanie on wyświetlony, tło przyjmie najczęściej kolor biały (jako domyślny) i w ten sposób otrzymamy stronę, której nie można przeczytać :-(

Atrybut BACKGROUND jest zdeprecjonowany przez specyfikację HTML 4.01 - zaleca się stosowanie stylów.

Atrybut BGPROPERTIES nie wchodzi w skład specyfikacji HTML 4.01 - zaleca się stosowanie stylów.

kurs by kurshtml

Programming.pun.pl

#1 2010-10-04 14:04:20

04. Nagłówek i Treść - Tło obrazkowe

Spoiler:

Spoiler:

Stopka forum