A dokumentum fejrésze

 

 

Ebben a fejezetben a dokumentumok fejrészével (<HEAD> ... </HEAD>ismerkedünk meg.
Témák:


Amint azt már olvashattad, a dokumentumok fejrészében elhelyezkedő adatokat a böngésző nem jeleníti meg, azok szerepe:

  • hogy a böngésző címsorát megjelenítsék,
  • hogy a böngészőt a dokumentum olvasásához beállítsák (karakterkészlet, nyelv...),
  • hogy a internetes keresőrobotoknak lapunkról összefoglaló információt nyújtsanak,
  • valamint itt helyezhetjük el a dokumentum egészére vonatkozó stílusutasításainkat.

Az alábbiakban sorravesszük a főbb elemeket:

A dokumentum címe

Ide írjuk a dokumentum címét, így:

<TITLE> ez lesz a cím </TITLE>

A cím szövege fog megjelenni a böngészőablak címsorában (fent), valamint a windows-tálcán a böngészőablak aktiváló gombján.
A TITLE elemről bővebben itt olvashatsz...

fel...

A META elemek

Sokszor elhanyagolt, de fontos elemek. Több is lehet belőlük, mindegyik egy-egy utasítást ad. Segítségükkel lehet a látogató böngészőjét beállítani a dokumentum nyelvére, a használandó karakterkészletre. Itt lehet a kívánt kulcsszavakat megadni a keresőknek, valamint utasíthatják a keresőrobotokat a webhelyen további keresésre. Számos további információt is tartalmazhatnak, amelyeket csak a forráskód elolvasásával lehet megtudni.
Mindenképpen ajánlott legalább a karakterkészletre vonatkozó utasítást megadni, ez magyar nyelvű lapoknál a következő:

<META http-equiv="Content-Type" content="text/html; charset=iso-8859-2">
vagy
<META http-equiv="Content-Type" content="text/html; charset=windows-1250">
lehet.
A többi META elem használata opcionális.
A META elemekről bővebben itt olvashatsz...
Saját lapod meta elemeinek elkészítéséhez használhatod META GENERÁTORunkat.

fel...

Egyéb elemek

A többi itt használatos elem opcionális, csak szükség szerint alkalmazzuk.

  • Beágyazott stílusok <STYLE> </STYLE>
    A dokumentumunkba beágyazott stíluslap HTML kódja. Ennek az elemnek a tartalmával lehet - CSS (Cascading Style Sheet) parancsnyelven - dokumentumunknak a HTML lehetőségeinél szélesebb lehetőségekkel bíró formázási utasításokat adni.
    Itt fontos tudni, hogy beágyazott CSS stílus esetén az elem tartalmát "comment" jelek közé kell foglalni, különben a régi kiadású böngészők, amelyek még nem értik a CSS nyelvet, tévesen HTML utasításnak értelmeznék azt.
    Egy példa stílus használatára:

    <STYLE type=text/css>
    <!--
    A { text-decoration: none }
    -->
    </STYLE>


    Erre a lapon szereplő a linkeket aláhúzás nélkül fogja a böngésző megjeleníteni.
    A STYLE elemekről bővebben itt olvashatsz...
    Saját lapod stílusainak elkészítéséhez használhatod STÍLUS VARÁZSLÓnkat.

  • Kapcsolódás külső fájlhoz <LINK >
    Hozzáfüzhetünk a lapunkhoz más fájl-t, például stíluslapot vagy javascript parancsfájl-t. Ezeket a böngésző a LINK elem utasítására a dokumentumunk betöltődésekor lekéri a szerverről. A LINK elemben meghatározhatjuk a dokumentumunk és a külső fájl kapcsolatának irányát is.
    Egy példa: igy lehet az azonos könyvtárban található stilusok.css stílusfájl-t a LINK elemmel meghívni:

    <LINK href="stilusok.css" type="text/css" rel="StyleSheet">

    A LINK elemekről bővebben itt olvashatsz...

  • Beágyazott scriptek <SCRIPT>
    A kliens oldali javascriptek a weblapokat a HTML lehetőségein messze túlmenően dinamikusabbá, interaktívabbá teszik. HTML oldalba általában a HEAD részbe kell beilleszteni a <SCRIPT> elem nyitó és zárótagja közé a beágyazott scripteket. Külső scriptek itt is a LINK elem segítségével hívhatók meg. Beágyazott script használata esetén - a STYLE elemhez hasonlóan - el kell rejteni azt a régebbi böngészők elől. Fontos, hogy a beágyazott script mindig a dokumentum azon része előtt szerepeljen a forráskódban, amire vonatkozik.
    A SCRIPT elemekről bővebben itt olvashatsz...



A fejezet zárásaként egy képzeletbeli weblap forráskódján tanulmányozható a fejrész elemeinek elhelyezése:

<HTML>
<HEAD>
<TITLE> ez a cím </TITLE>
<META http-equiv="Content-Type" content="text/html; charset=iso-8859-2">
<META name="Keywords" content=" kulcsszó1, kulcsszó2 ">
<META name="Description" content=" ide kerül a lap rövid leírása. ">
<LINK href="stilusok.css" type="text/css" rel="StyleSheet">

</HEAD>
<BODY>
ide kerül a dokumentum tartalma
</BODY>
</HTML>
 



fel...
előző: A HTML dokumentum szerkezete...
következő: A szövegtest...
tartalom...


ThomasWebMűhely
(c)Katona Tibor
2001-2002