HTML
Spis treści |
HTML - co to takiego?
HTML to skrót od angielskiego HyperText Mark-up Language Jest to swoisty język programowania, który służy do "opisu stron". "Opis stron" to reguły określania wyglądu tekstu (wielkość, czcionka, pogrubienie, kursywa itd.). Najważniejszą cechą HTML jest to, że jest on kompatybilny z każdym systemem operacyjnym (Windows, MacOS, OS/2, rożne odmiany Unixa, itd.). Choć HTML jest językiem programowania, to jest on o niebo łatwiejszy od TurboPascala, czy C++ i można go opanować w kilka dni. Pierwsza, publicznie dostępna, specyfikacja języka HTML, nazwana HTML Tags (pol. Znaczniki HTML), została zamieszczona w Internecie przez Bernersa-Lee w 1991. Zawiera 22 znaczniki, tworzące początkowy, prosty szkielet HTML-a. Trzynaście z tych elementów istnieje do tej pory w specyfikacji HTML To wszystko, co powinieneś wiedzieć w skrócie o html'u
Komponenty języka HTML
| Co to jest Komponent |
|
niezależnie wytworzony, skompilowany (z ukrytymi szczegółami implementacyjnymi) moduł programowy, udostępniający swą funkcjonalność za pomocą jednoznacznie zdefiniowanego interfejsu, zdolny do współdziałania z większą całością (systemem) oraz innymi komponentami. |
Język HTML składa się z kilku kluczowych komponentów:
- znaczników i ich atrybutów
- odwołań w postaci encji
- deklaracji typu dokumentu
- typów danych
- referencji znakowych
Znaczniki
Poza zwykłym tekstem, na stronę możesz wprowadzić znaczniki. Znacznik jest to specjalny tekst, umieszczony w nawiasach ostrych, np:<b> <u> <i>etc... Jest on częścią składni języka HTML i pozwala sterować wyglądem strony. Dzięki niemu możesz np:
- ustalić kolor tła
- tabelę
- rodzaj formatowania tekstu
- wstawić obrazek
Znacznik nie jest widoczny na ekranie, widoczne są tylko efekty jego działania. Istnieją znaczniki otwierające (np.: < b >) oraz zamykające (np.: < /b >). Zauważ, że znacznik zamykający rozpoczyna się ukośnikiem (czyli znakiem: "/") i ma taką samą nazwę jak otwierający. Pomiędzy znacznikami otwierającym i zamykającym może znaleźć się jakiś tekst, który chcemy np. poddać formatowaniu (w tym przypadku będzie to wytłuszczenie tekstu i podkreślenie), np:
<b>Ten tekst zostanie wytłuszczony.</b>
<u>Ten tekst został podkreslony.</u>
| UWAGA |
|
W języku XHTML wszystkie znaczniki muszą być pisane obowiązkowo małymi literami. |
Jak wygląda typowy dokument HTML
Stronę WWW tworzy się podobnie jak zwykły dokument tekstowy: po otwarciu edytora HTML, należy wybrać opcję z menu: Plik/Nowy. Teraz można już zacząć pisanie strony. ednak ponieważ dokument HTML nie jest całkowicie zwykłym plikiem tekstowym (zawiera hipertekst, osadzone obrazki i musi być poprawnie wyświetlany w różnych systemach operacyjnych dlatego wymyślono specjalny szablon dokumentu HTML, który powinien być przestrzegany.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="pl" lang="pl"> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-2" /> <meta name="Description" content="Tu wpisz opis zawartości strony" /> <meta name="Keywords" content="Tu wpisz wyrazy kluczowe rozdzielone przecinkami" /> <title>Tu wpisz tytuł strony</title> </head> <body> Tu wpisuje się treść strony </body> </html>
Większość edytorów HTML przy tworzeniu nowego dokumentu automatycznie wpisuje swój własny szablon - zbliżony do powyższego. Jeśli chcesz, możesz z niego skorzystać, modyfikując opisane poniżej fragmenty. Proponuję jednak zastąpić go szablonem przedstawionym w tym rozdziale. Również w tym przypadku wszystkich zmian należy dokonywać bezpośrednio w trybie edycji kodu źródłowego HTML! Jeśli posiadasz edytor graficzny, musisz się do niego przełączyć, natomiast edytory tekstowe najczęściej posiadają tylko taki tryb - wtedy nie trzeba nic przełączać.
Co to są podstrony?
Praktycznie wszystkie serwisy internetowe składają się z pewnej liczby podstron, a nie tylko z jednej, bardzo długiej, strony głównej. Każda podstrona to po prostu osobny plik (z rozszerzeniem *.html lub *.htm), który tworzy się w taki sam sposób, jak stronę główną (przy użyciu szablonu przedstawionego powyżej) ułatwia to użytkownikowi nawigację oraz zapobiega niepotrzebnemu wczytywaniu całego serwisu od razu, co trwałoby prawdopodobnie bardzo długo.
| W nazwach plików lepiej nie używać: |
|
Jeśli nie zastosujesz się do tych zaleceń, może się okazać, że po wprowadzeniu strony do Internetu, pliki takie nie wczytają się
Co zrobić aby czytało Polskie znaki?
Wiele osób tworząc własne strony internetowe zapomina o prostej rzeczy, która jest bardzo przydatna przy pisaniu poradników, artykułów czy różnych bajerów dla użytkowników
Jak to zrobić ? W swoim edytorze HTML utwórz nową stronę i wklej na niej cały poniższy kod
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <HTML> <HEAD> <META HTTP-EQUIV="content-type" CONTENT="text/html; charset=iso-8859-2"> </HEAD> <BODY> ą ć ę ł ń ó ś ź ż Ą Ć Ę Ł Ń Ó Ś Ź Ż </BODY> </HTML>
| UWAGA! |
|
Polskie litery, które znajdują się w trzeciej linijce od dołu, powinny być wpisane ręcznie z klawiatury a nie wklejone, ponadto należy pamiętać, że w niektórych edytorach HTML konieczne jest wybranie kodowania ISO-8859-2 |
Odsyłacz do podstrony
Praktycznie na każdej stronie WWW spotyka się odsyłacze. Najczęściej stanowi je specjalnie wyróżniony krótki tekst (lub obrazek), po kliknięciu którego, następuje przeniesienie do innej strony. Każda podstrona jest osobnym plikiem HTML (z rozszerzeniem *.html lub *.htm) i zawiera treść
Aby umożliwić użytkownikowi swobodne przechodzenie pomiędzy podstronami naszego serwisu, trzeba je w jakiś sposób połączyć między sobą. Należy umieścić w wybranym miejscu odsyłacze do wszystkich podstron. Zwykle przeznacza się na to osobną stronę, która stanowi spis treści i zawiera ułożone kolejno odsyłacze do wszystkich podstron serwisu.
Kod:
<a href="ADRES STRONY NA JAKĄ MA PRZEKIEROWAĆ">OPIS STRONY</a>
Przykład:
<a href="http://hlds.pl/HTML">HTML dla zielonych</a>
| PAMIĘTAJ |
|
Adres strony internetowej zawsze musi rozpoczynać się od http:// |
Wstawianie adresu E-MAIL
Jest to opcja dośc podobna do przekierowywania stron wystarczy dodac tylko jedno słowo mailto
<a href="mailto:adres poczty e-mail">opis</a>
Pamiętaj, że podanie swojego adresu na stronie WWW, może spowodować, że zaczną do Ciebie przychodzić niechciane wiadomości
