Kurs html dla początkujących (2) - budowa strony www

Kurs html część druga – jak zrobić stronę internetową w notatniku

Z czego składa się strona www

Strona www ma swój wygląd zewnętrzny, który widzimy w przeglądarce oraz źródło, które jest zwykłym plikiem tekstowym zawierającym elementy strony opisane znacznikami. Do tego dochodzi plik stylów oraz ewentualnie różne dodatkowe pliki oprogramowania, które tworzą stronę dynamiczną.

Jakie elementy zawiera strona www

Na stronie www można umieścić:

  • tekst + linki
  • obrazki + animacje np. flash
  • multimedia – dzwięk, filmiki itp – zdecydowanie lepiej umieszczać to na Youtube, a na stronie tylko link do nich
  • skrypty

Jak wygląda szkielet strony www

Strona www dzieli się na dwie części czyli haed i body i otoczona jest znacznikiem html.

Podstawowy szkielet strony wygląda tak:

<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd”>
<html xmlns=”http://www.w3.org/1999/xhtml”>
<head>
<meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ />
<title>Bez tytułu 1</title>
</head>
<body>
</body>
</html>

Cwiczenie 3
Skopiuj powyższy kod do swojego pliku index.htm tak aby tekst znalazł sie pomiędzy znacznikami <body> a </body>. Wyświetl stronę. Nic się nie zmieniło. Wygląda tak jak poprzednio. Ale jest to już prawdziwa strona www.

Z czego składa się szkielet strony www

  1. <!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd”> – Doctype umieszcza się na początku kodu strony, określa jakim językiem jest zrobiona strona. Musi być na samym początku. Nie może być żadnego znaku ani spacji przed tym.
  2. <html xmlns=”http://www.w3.org/1999/xhtml”> – znacznik <html> i </html> otaczają całą stronę
  3. <head> i </head> są wewnątrz znaczników <html> i stanowią nagłówek. Nie jest on wyświetlany i użytkownik tego nie widzi. Wewnątrz wstawia się różne informacje dla przeglądarki i dla wyszukiwarek.
  4. <meta http-equiv=”Content-Type” content=”text/html; charset=utf-8″ /> – meta tag określjący kodowanie polskich liter
  5. <title>Bez tytułu 1</title> – tylut strony. Jest to bardzo ważne, gdyż ten tytuł pokazuje się w wynikach wyszukiwania oraz na górnym pasku przeglądarki
  6. </head> – kończący znacznik head
  7. <body> i </body> – właściwa część strony. To co znajduje się pomiędzy tymi znacznikami zostanie wyświetlone przez przeglądarkę
  8. </html> – końcowy znacznik html

 

Leave a reply

Twój adres email nie zostanie opublikowany. Pola, których wypełnienie jest wymagane, są oznaczone symbolem *

This site uses Akismet to reduce spam. Learn how your comment data is processed.