Mateusz Ryfka 06.04.2013r.
klasa 1 - Informatyka
semstr II
Witryny i aplikacje internetowe
Struktura strony internetowej.
Budowa dokumentu HTML i XHTML składa się z dwóch głównych części: znacznika otwierającego i zamykającego head, oraz znacznika otwierającego i zamykającego body, natomiast całość jest zawarta w znaczniku html, nad którym jest umieszczony DTD (Document Type Definition - Definicja Typu Dokumentu), oraz w przypadku XHTML tzw. prolog.
- Dla dokumentów HTML wyróżniamy 2 rodzaje DTD:
Transitional (przejściowa)
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
Frameset (ramkowa)
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd">
- Dla dokumentów XHTML 1.0:
Strict (ścisła)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
Transitional (przejściowa)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
Frameset (ramkowa)
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
- Dla dokumentu XHTML 1.1:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
Pomiędzy znacznikami head (ang. głowa) umieszczamy takie informacje jak: kodowanie strony (właściwym kodowaniem strony dla naszego języka jest ISO-8859-2), tytuł strony, opis strony, słowa kluczowe, sposób indeksowania przez wyszukiwarki, arkusz styli, etc. Natomiast pomiędzy znacznikami body (ang. ciało) umieszczamy główną zawartość, a więc to co chcemy aby widziały osoby przeglądające naszą stronę.
- Poprawna budowa dokumentu HTML:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-type" content="text/html; charset=iso-8859-2">
<title>Tytuł strony</title>
<meta name="description" content="opis strony">
<meta name="keywords" content="slowa kluczowe">
<meta name="author" content="autor strony">
<meta name="robots" content="all">
<link rel="stylesheet" href="lokalizacja arkusza styli" type="text/css">
</head>
<body>
<p>Zawartość strony</p>
</body>
</html>
- Poprawna budowa dokumentu XHTML:
<?xml-stylesheet href="lokalizacja.css" type="text/css"?>
<?xml version="1.0" encoding="iso-8859-2"?>
<!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" xml:lang="pl" lang="pl">
<head>
<meta http-equiv="Content-type" content="text/html; charset=iso-8859-2" />
<title>Tytuł strony</title>
<meta name="description" content="opis strony" />
<meta name="keywords" content="slowa kluczowe" />
<meta name="author" content="autor strony" />
<meta name="robots" content="all" />
<link rel="stylesheet" href="lokalizacja.css" type="text/css" />
</head>
<body>
<p>Zawartość strony</p>
</body>
</html>
Podczas budowania strony należy pamiętać o kilku istotnych rzeczach:
- Staraj się przenosić całe formatowanie tekstu do zewnętrznego arkusza styli, a w dokumencie .htmlodwoływać się do niego poprzez class (klasy).
- Kod JS (JavaScript) dłuższy niż kilka linijek przenieś do zewnętrznego dokumentu i odwołuj się do niego poprzez kod:
<script type="text/javascript" src="lokalizacja.js"></script>
- Wszystkie znaczniki, oraz atrybuty pisz z małej litery.
- Zawsze zamykaj znaczniki w odwrotnej kolejności do otwieranych, przykład:
Dobrze:
<p><b><em>jakiś tekst</em></b></p>
Źle:
<p><b><em>jakiś tekst</b></p></em>
- Zawsze ujmuj wartości atrybutów w cudzysłów.
- Dla dokumentów pisanych w XHTML pusty znacznik musi się kończyć />, przykład:
<br /><hr />
- Używaj odpowiednich znaczników do tego co masz zamiar przedstawić,
a więc np.
* Dla menu, oraz nieuporządkowanych używaj znacznika <ul />.
* Dla nagłówków używaj znaczników <hx /> gdzie x oznacza cyfrę od 1-6.
* Dla akapitów używaj znacznika <p /> a dla krótkich wyróżnień tekstu znacznika <span />.
Wyszukiwarka
Podobne podstrony:
znaczniki html5, Prace kontrolne
Opis oprogramowania wspomagające analizę komponentów systemu komputerowego, Prace kontrolne
Podstawowe zasady prawa konstytucyjnego, Prace Kontrolne Technik Administracji
Projekt strony internetowej
prace kontrolne 2
0001 Ważne strony internetowe
promienie laserowe, Kosmetologia, Prace kontrolne, fizykoterapia
Informacje na temat strony internetowej Stwórców Skrzydeł
WPŁYW CZYNNIKÓW NA SKÓRĘ, Kosmetologia, Prace kontrolne, dermatologia
Przydatne strony internetowe
prace kontrolne dla inżynierów
Lista osób które oddały prace kontrolną
Kosztorys stanowiska komputerowego, Prace kontrolne
Podaj formę organizacji przedsiębiorstw w gospodarce rynkowej, Prace Kontrolne Technik Administracji
UZYTECZNE STRONY INTERNETOWE, Informacja zawodowa
Struktura, Studia, STUDIA PRACE ŚCIĄGI SKRYPTY
Zasady BHP podczas prac na wysokościach(1), Prace Kontrolne
Praca kontrolna 2 rozwiązanie moje, zzz KKZ dla szkoły, sem 1-2, prace kontrolne
Kuloodporne strony internetowe Jak poprawic elastycznosc z wykorzystaniem XHTML a i CSS kulood
więcej podobnych podstron