 |
|
Pozycjonowanie dzięki:
|  |
Wstęp - Kurs języka HTML
WprowadzenieDo przerabiania poszczególnych lekcji tego kursu będziesz potrzebował(a) edytor tekstu, który zapisuje pliki bez informacji o formatowaniu. Najprostszym programem tego typu jest np. Notatnik, który jest obecny w każdym systemie Windows. Można co prawda pisać stronę w edytorach pozwalających na formatowanie tekstu, jednakże przy zapisie należy przypilnować aby zapisywać dokument jako plik tekstowy bez formatowania, poprzez wybranie opcji "Zapisz jako" z menu i wybranie jako formatu zapisu "Plik tekstowy" lub coś w tym stylu. Zalecam jednak zaopatrzenie się w jeden wielu dostępnych specjalizowanych edytorów HTML, gdyż ich stosowanie upraszcza znacznie tworzenie stron. Edytory tego typu posiadają wiele funkcji mających na celu wspomaganie tworzenia stron WWW, jak:
Dostępnych jest bardzo wiele tego typu programów, jak np. Polski "Pajączek 2000" czy HomeSite. Większość z nich znajdziesz np. na witrynie Tucows (adres jednego z Polskich mirrorów: http://tucows.icm.edu.pl). Pierwsza strona WWWNo ale koniec tego wstępu, przechodzimy do zaprezentowania przykładowej prostej strony WWW: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <html> <head> <title>Moja Pierwsza Strona WWW</title> <meta http-equiv="Content-type" content="text/html; charset=iso-8859-2"> </head> <body> <p>Treść Mojej Pierwszej Strony WWW</p> </body> </html> Powyższy kod HTML musisz przepisać dokładnie, i następnie zapisać go w pliku z rozszerzeniem Przejdźmy jednak do analizy przedstawionego kodu. <tag parametr1="Wartość" parametr2 parametr3=15>fragment tekstu</tag> Nazwy tagów oraz parametrów i ich wartości mogą być pisane zarówno dużymi, jak i małymi literami - nie jest to istotne. Zalecane jest jednak pisanie ich wyłącznie małymi literami, ze względu na fakt że język XHTML (następca HTML) tego wymaga. Trzymanie się jednej wielkości znaków upraszcza także później analizę kodu strony. Wartości parametrów mogą być otoczone cudzysłowami lub apostrofami. Nie jest to wymagane gdy wartość jest pojedynczą liczbą lub słowem, ale zalecam branie wszystkich wartości w cudzysłów ze względu na fakt że kiedyś możesz zechcieć zastosować XHTML - wtedy będzie prościej. Dodatkowo w XHTML każdy parametr musi mieć przypisaną wartość (jeżeli któryś parametr nie ma wartości określonej w standardzie HTML, wtedy przypisuje się jako wartość nazwę tego parametru). Powyższy przykład po uwzględnieniu tych zaleceń powinien zatem wyglądać następująco: <tag parametr1="Wartość" parametr2="parametr2" parametr3="15">fragment tekstu</tag> Warto też wiedzieć że wstawianie większej ilości dodatkowych odstępów (np. spacji lub cudzysłowów) pomiędzy atrybutami nie ma znaczenia. Podobnie traktowane są też znaki nowej linii (Enter'y). Powyższy przykład może więc wyglądać też w taki sposób: <tag parametr1="Wartość" parametr2="parametr2" parametr3="15">fragment tekstu</tag> Tagi można zagnieżdżać, przy czym kolejność zagnieżdżania ma znaczenie - przy jej zmianie wynikowy dokument wyświetlony przez przeglądarkę jest zwykle inny. Przy umieszczaniu tagów zamykających (czyli rozpoczynających się od "/") należy pilnować kolejności w jakiej były otwierane, i zamykać je w odwrotnej kolejności (poczynając od najbardziej zagnieżdżonego). Chociaż przeglądarki obecnie starają się "na siłę" ignorować wszelkie pojawiające się błędy w kodzie wyświetlanej strony, to nieprzestrzeganie tej reguły może też powodować błędne wyświetlanie się strony. Wróćmy jednak do analizy przedstawionego powyżej przykładowego kodu strony. Pierwsza linia w powyższym kodzie zawiera znacznik <!DOCTYPE>, który określa tzw. DTD (Document Type Definition - definicja typu dokumentu). Linia ta określa m.in. której wersji języka HTML będziemy używać na stronie. Obecnie w użyciu są głównie HTML 4.01 oraz XHTML 1.0. Różnice pomiędzy tymi dwoma standardami są niewielkie - XHTML 1.0 jest to język HTML 4.01 do którego zastosowano reguły języka XML (główne zasady wymieniłem już powyżej - znaczniki i atrybuty muszą być pisane małymi literami, znaczniki muszą być pozamykane i każdy atrybut musi mieć przypisaną wartość). Dokładne omówienie różnic to jest jednak temat na osobny poradnik, dlatego tutaj będę się jedynie ograniczał do przedstawiania przykładów kodu HTML który jest także zgodny z XHTML. DOCTYPE/DTD czyli definicja typu dokumentuZnacznik <!DOCTYPE> znajdując się w pierwszej linii określa także dodatkowo jaką odmianę danej wersji języka chcemy zastosować - do wyboru są Ponieważ znaczniki i atrybuty z DTD Transitional są oznaczone jako niezalecane, w dalszej części kursu będę używał tego określenia i zachęcał będę do stosowania zamiast nich odpowiednich komend kaskadowych arkuszy stylów CSS. Standardy HTML 4.01 i XHTML 1.0 definiują następujące DTD które można używać: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd"> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd"> Znacznik <!DOCTYPE> można też oczywiście zapisać w jednej linii - tutaj podzieliłem go na dwie tylko po to aby ładnie się wyświetlił. Po linii określającej DTD, pojawia się tag <html>, zaś na końcu znajduje się zamykający go tag Po znaczniku Właściwa część strony, która jest wyświetlana wewnątrz okna przeglądarki, czyli tzw. ciało strony, umieszczone jest pomiędzy znacznikami <body> i Znaki specjalne w HTMLPrzy wpisywaniu tekstu musisz jednakże zwrócić uwagę na fakt, iż nie wszystkie znaki można wpisać bezpośrednio, gdyż zostały one już wcześniej zarezerwowane do określonych celów w języku HTML. Znaki te jednakże można uzyskać w utworzonym dokumencie podając w tekście dokumentu odpowiednie kody postaci
Dostępnych jest także wiele innych znaków które można uzyskać stosując podaną metodę, można także zlecić przeglądarce wyświetlenie znaku o określonym kodzie. Pełną listę takich znaków znajdziesz w artykule Znaki specjalne HTML. Wykop tą stronę! >>> 
Dodaj linka na swojej stronie! Po prostu skopiuj poniższy kod i wklej go na swojej stronie WWW. Gotowy link będzie wyglądał w taki sposób: | |
"Magazyn INTERNET" to miesięcznik poświęcony w całości globalnej sieci komputerowej. Prezentuje aktualności internetowe, praktyczne porady związane z sieciami komputerowymi, kursy dla webmasterów,...  Tylko dzisiaj! Zaoszczędzisz 30%!  Cena: 30.8 zł 44 zł  Cena: 117 zł  Cena: 69 zł  Cena: 89 zł | ||||||||||||||||||||||||||||||||||
