Archiwum z Marzec 2008

Tabelki w HTML – stosować czy nie?

niedziela, 23 Marzec 2008

Od dłuższego już czasu w środowisku webmasterskim toczy się swoista wojna zwolenników tabelek z ich przeciwnikami. Chodzi tutaj o rozstrzygnięcie czy strony powinno się robić na tabelkach, czy raczej pozbyć się zupełnie tabelek i tworzyć wszystko na <div>-ach. Zwolennicy divów argumentują że takie strony są bardziej semantyczne, są przyjaźniejsze dla wyszukiwarek i mniej ważą. Z kolei zwolennicy tabelek twierdzą że są one prostsze w użyciu.

Prawda pewnie leży gdzieś pośrodku – stosowanie divów pozwala na stworzenie mniejszej i badziej przyjaznej dla wyszukiwarek strony, ale z kolei jest to trudniejsze. Z tabelkami jest odwrotnie. Warto dlatego poznać obydwa zagadnienia – w przeciwnym wypadku będzie dochodzić do takich absurdów jak próba robienia planszy do gry online na divach bo tabelki są “złe”.

Jak pisać HTML żeby był maksymalnie kompatybilny z XHTML

niedziela, 23 Marzec 2008

W niektórych projektach może zajść konieczność takiego przygotowania kodu HTML, aby można go było łatwo zamienić na XHTML. Oczywiście można od razu tworzyć XHTML i taki kod dołączyć bezpośrednio do strony w HTML (będzie to działać bo przeglądarki potrafią poradzić sobie ze znacznie większymi błędami na stronach), ale można też zrobić to tak aby wilk był syty i owca cała.

Aby to osiągnąć, podczas tworzenia kodu HTML należy przestrzegać następujących reguł:

  • nazwy znaczników i atrybutów powinny być  pisane małymi literami;
  • każdy atrybut musi mieć wartość; jeżeli atrybut w HTML nie posiada wartości, jako wartość należy przypisać nazwę tego atrybutu;
  • wartości atrybutów muszą być otoczone cudzysłowami;
  • wartości atrybutów zdefiniowane w standardzie powinny być pisane małymi literami;
  • wszystkie znaczniki powinny być pozamykane (oprócz znaczników które w HTML nie są zamykane, czyli m.in. <br>, <img>, <meta>, <hr>, <link>, <input>);

Dzięki zastosowaniu tych reguł dokument HTML da się już łatwo przetworzyć na XHTML – wystarczy tylko pozamykać tagi wymienione w ostatnim punkcie. Można to zrobić np. za pomocą odpowiedniego wyrażenia regularnego.

Jak zamienić znacznik na CSS

środa, 19 Marzec 2008

Znacznik <font> jest jednym ze znaczników które zostały oznaczone jako deprecated (czyli do usunięcia w przyszłości) w standardzie HTML 4.01. Dlatego też niezwykle istotne jest aby tworząc strony internetowe być w zgodzie ze standardami i zamiast tego znacznika zastosować odpowiadające mu funkcjonalnie elementy kaskadowych arkuszy stylów CSS.

Znacznik <font> pozwalał na ustawienie trzech parametrów tekstu: nazwy używanej czcionki, jej rozmiar i kolor.

Nazwę czcionki ustala się  za pomocą komendy CSS font-family. Komenda ta ma tą zaletę że po dwukropku można podać kilka nazw czcionek, a przeglądarka postara się wybrać pierwszą dostępną z nich. Przykład:

font-family: Verdana, Arial, Helvetica;

Rozmiar czcionki podaje się za pomocą komendy CSS font-size. Po dwukropku można podać pewną predefiniowaną nazwę wielkości (jest ich siedem, podobnie jak rozmiarów czcionek w HTML, ale nie są one równoważne – największy predefiniowany rozmiar czcionki CSS odpowiada w przybliżeniu rozmiarowi 6 w HTML). Poza nazwą wielkości można też podać rozmiar w pikselach, procentach, punktach i kilku innych jednostkach. Odradzam stosowanie pikseli jako jednostki gdyż taki tekst nie da się później powiększyć w przeglądarce – niestety nie każdy ma taki super wzrok jak autor strony który potrafi odczytać nawet tekst o wielkości 4 pikseli ;) . Przykład zastosowania:

font-size: 10pt;

Kolor czcionki można natomiast podać za pomocą komendy CSS color. Po dwukropku można podać nazwę koloru albo jego kod szesnastkowy – tutaj nie ma zmian. Przykład:

color: #0000ff;

Jak kodować polskie znaki?

środa, 19 Marzec 2008

Obecnie w Internecie dominują trzy standardy kodowania polskich znaków: ISO-8859-2, Windows-1250 i UTF-8. Pierwszy z nich został wprowadzony przez normę ISO i jest ogólnie polecanym i zalecanym standardem kodowania polskich znaków na stronach internetowych. Jeżeli chcesz stworzyć nową stronę internetową,warto użyć właśnie jego, ew. standard UTF-8 który opisuję poniżej.

Drugim standardem jest Windows-1250. Standard ten wszedł do internetu niejako “tylnymi drzwiami” – ten system kodowania polskich znaków jest używany w polskich wersjach systemu Windows, i z tego powodu wiele stron tworzonych pod tym systemem używało tego właśnie kodowania. Przez długi czas standard ten nie był oficjalnie uznawany w Internecie. W pewnym jednak momencie został on jednak ustandaryzowany, pewnie dlatego że istniał już ogrom stron WWW które z niego korzystały. Standard ten jest jednak nadal odradzany jako standard kodowania polskich znaków na stronach WWW.

Trzecim standardem jest UTF-8. Standard ten opiera się na standardzie Unicode, zatem używając go można jednocześnie wykorzystywać na stronie polskie znaki i dowolne inne, np. cyrylicę. Zaletą tego standardu jest też to że znaki zajmują jak najmniej miejsca, tzn. znaki ASCII 7 są kodowane na 1 bajcie, a pozostałych większość znaków używanych na co dzień jest zapisywana na dwóch bajtach.

Aby ustawić standard kodowania na stronie, trzeba użyć odpowiedniego znacznika <meta>, np.

<meta http-equiv="Content-type" content="text/html; charset=utf-8" />

Metaznaczniki – czy warto je stosować?

środa, 19 Marzec 2008

W środowisku webmasterów często można usłyszeć głosy że nie warto już stosować znaczników <meta>, gdyż wyszukiwarki internetowe i tak je ignorują – po co zatem się przemęczać? To jednak nie jest do końca prawda – pewne znacznika meta warto jednak  dodać do strony.

Najważniejszym i jednocześnie najczęściej używanym znacznikiem jest znacznik określający Content-type. Za jego pomocą określa się także sposób kodowania polskich znaków: ISO-8859-2, Windows-1250 lub UTF-8. Przykładowy znacznik ustawiający standard UTF-8 jako standard kodowania polskich znaków wygląda następująco:

<meta http-equiv="Content-type" content="text/html; charset=utf-8" />

Drugim meta-znacznikiem który warto dodać to znacznik Description który opisuje krótko stronę. Wyszukiwarki internetowe mogą użyć jego wartości jako opisu strony na stronie wyników wyszukiwania, dlatego warto dodać też taki opis do swoich stron.

<meta name="Description" content="To jest strona o HTML" />

Trzecim meta-znacznikiem jest znacznik keywords. Kiedyś miał ogromne znaczenie gdyż podawał słowa kluczowe na podstawie których strona powinna być odnaleziona. Z tego właśnie powodu wiele osób wpisywało tam dodatkowo różne popularne ale niezwiązane z treścią słowa kluczowe, takie jak np. seks czy pokemony. Doprowadziło to ostatecznie do sytuacji takiej jak teraz, czyli ignorowania tego znacznika przez wiele wyszukiwarek. Jeżeli ktoś chce to może jednak ten znacznik sobie dodać.

<meta name="Keywords" content="HTML, XHTML, Artykuły" />

Poza tymi wymienionymi tutaj meta-znacznikami istnieją jeszcze inne. Nie będę ich tutaj jednak wymieniał ze względu na oszczędność miejsca – zainteresowanych odsyłam do innych źródeł.