2. Mi a HTML? Mi a böngésző?
Mi az internet?
Az internet — magyar nevén a világháló — tulajdonképpen nem más, mint számítógépek világméretű hálózata. Sőt, ha pontosak akarunk lenni, azt mondjuk, hogy hálózatok hálózata: kisebb, helyi hálózatok vannak egy nagy hálózatba kötve. A számítógépek hálózatba kötésének az a célja, hogy az egyik számítógépről a másikra közvetlenül vihessünk át adatokat (azaz ne kelljen CD-re, floppyra vagy más adathordozóra írni, és onnan lemásolni). A világméretű hálózat segítségével nagyon gyorsan hozzáférhetünk a világ másik felén található adatokhoz. Fontos azonban megérteni, hogy akár szomszédos, akár távoli gépről van szó, mi nem azt látjuk, ami a távoli gépen van, hanem állományokat (fájlokat) kapunk a távoli géptől. Ezek az állományok általában a másik gép állományainak másolatai, de lehet például a másik gép egy könyvtárának tartalomjegyzéke, vagy egy számunkra (a megadott szempontok alapján) összeállított fájl is. Mindebből számunkra az a fontos, hogy amikor „internetezünk”, „böngészünk”, „szörfölünk”, akkor különböző állományokat kapunk egy másik géptől. Ezeket az állományokat a mi gépünk elhelyezi egy mappába, és a böngészőnk onnan nyitja meg. Számunkra ez azért fontos, mert olyan fájlokat, amilyeneket más gépektől kapunk, mi magunk is készíthetünk. Böngészőnkkel tehát megnézhetjük a saját gépünkön található állományokat is. Amikor saját honlapunkat elkészítjük, így fogunk tenni. Amikor lapunkat késznek érezzük, felrakhatjuk egy olyan helyre, ahonnan mások is elérhetik. Addig azonban még hosszú az út.
Mi a böngésző?
Igen valószínűtlen, hogy ha az olvasó ezt az oldalt nézi, ne éppen egy böngészőt használjon. A böngésző egy olyan program, amelyet kifejezetten arra terveztek, hogy internetes oldalakat lehessen velük nézegetni. Ennek megfelelően általában meg lehet adni, hogy milyen címről töltsön le egy oldalt. Az ilyen címet URL-nek hívják. Az URL segítségével lehet a világhálón a keresett állományt megtalálni. Mint azonban arra felhívtuk a figyelmet, az URL nem csak távoli cím lehet, hanem a saját gépünkre is mutathat.
A Windows rendszereken három böngésző elterjedt. A legelterjedtebb az Internet Explorer, amelyet a Microsoft „ingyen” ad a Windowshoz. (Az olvasó bizonyára hallott már a Microsoft ellen folyó trösztellenes perről: ez éppen amiatt idult, mert a Microsoft berakta az Internet Explorert a Windowsba.) Szintén elterjedt a korábban népszerűbb Netscape Navigator, illetve az újabban egyre népszerűbb Opera. Fontos tudni, hogy a különböző böngészők kicsit másként viselkednek: ugyanazt a honlapot kissé másképp jelenítik meg, és az is előfordul, hogy az egyik nem ismer egy olyan utasítást, amilyet a másik igen. Éppen ezért, amikor honlapot készítünk, célszerű mindegyik böngészőn tesztelni. E sorok írója tesztelésre a Netscape Navigatort ajánlja, mert az a legérzékenyebb a különböző hibákra. Ha nincs meg mindhárom böngésző, célszerű őket letölteni. Próbálkozzunk a következő címeken:
Fel kell azonban hívnunk a figyelmet arra, hogy a böngészők különböző verziói is eltérnek egymástól. Érdemes ezért mindig a legegyszerűbb megoldást választani.
A fenti böngészőkőn kívül érdemes megemlíteni a Mozillát is, ami lényegében a Netscape Navigator 6-os változatával azonos. Amikor ez a segédlet készült, még csak a 0.9-es verziónál tartott, de sokkal stabilabb volt a Netscape-nél. Könnyen lehet, hogy mire segédletünk az olvasóhoz kerül, ez lesz az egyik legnépszerűbb böngésző. Érdekességképpen említjük meg, hogy míg az Internet Explorer csak Windows és Mac OS alatt használható, addig a többi böngészőnek jóval több változata van: az Opera például hét operációs rendszeren is fut (BeOS, Epoc, Linux, Solaris, Mac OS, OS/2, Windows).
(Sokan talán most azt gondolják, hogy ha az Internet Explorer a legelterjedtebb, akkor elég úgy elkészíteni az oldalt, hogy azon szépen megjelenjen. Nem szabad azonban elfelejtenünk, hogy a világhálónak éppen az a célja, hogy mindenki hozzáférjen az ott elhelyezett információhoz. Gondoljunk arra, hogy mi sem örülnénk, ha egy izgalmasnak ígérkező oldalt csak azért nem tudnánk megnézni, mert más böngészőre készítették. De az sem érintene minket kellemesen, ha egy csinos leányzónak, barátunknak vagy főnökünknek megsúgnánk honlapunk címét, és legközelebb, amikor be akarnánk zsebelni a dícséretét, egy lesújtó pillantással közölné, hogy nem is látszik semmi. Ilyenkor nehéz lenne megmagyarázni, hogy ő a hibás, mert rossz böngészőt használ. Legyünk tehát körültekintőek, és lapunkat teszteljük legalább a három legelterjedtebb böngészőn.)
Mi a HTML?
A HTML a HyperText Markup Language (hipertext-leíró nyelv) rövidítése. A hipertext olyan szöveget jelent, mely hivatkozásokat tartalmaz más szövegekre (vagy dokumentumokra). Az ilyen hivatkozások a hagyományos könyvekben leginkább a lexikonokban, enciklopédiákban találhatóak (l. ezt és azt a címszót), de ilyen hivatkozássornak tekinthető a könyvek tartalomjegyzéke vagy tárgymutatója is. A honlapokon nem láthatjuk mindig, hogy pontosan hova „lapozunk”, és nem is kell nekünk beírni, hogy hova jutunk. Elég, ha rákattintunk egy elemre (ez általában a többitől eltérő színű felirat, esetenként pedig egy kép), és a böngésző kívánt oldalra visz minket. Az ilyen elemeket hívjuk hivatkozásnak. Ezen az oldalon az olvasó több ilyen hivatkozást is talál. Az oldal tetején, illetve alján előre és hátra lapozhat, vagy visszatérhet a tartalomjegyzékhez. Az előbb viszont két olyan hivatkozást láthattunk, mely távolabbi honlapokra mutat. (Ezek ugyan magyar honlapok, de lehetnének a világ másik végén is.) Ide kattintva viszont a felhasználó megnézheti, hogy mi található a C: könyvtárban — a saját gépén! (Ez természetesen csak Windows alatt működik!)
A HTML-t eredetileg arra találták ki, hogy egy dokumentum szerkezetét leírják. A legrégebbi utasítások tehát nem arra vonatkoztak, hogy miképp nézzen ki a dokumentum, hanem azt mutatták meg, hogy mi a dokumentum címe, hol kezdődik és hol fejeződik be egy-egy bekezdés, hol vannak felsorolások (listák) stb. Később megjelentek az olyan utasítások, amelyek azt határozták meg, hogy hol legyen dőlt, aláhúzott vagy vastag a szöveg. Így elvileg bármilyen böngészőn, bármilyen számítógéppel nézzük a HTML-dokumentumot, ugyanazt kell látnunk. Ez — mint fentebb említettük — csak részben igaz, de a legtöbb utasítást a böngészők mégis hasonlóképpen értelmezik.
Milyen dokumentumokat jelenít meg a böngésző?
Az eddigiekből nyilvánvaló, hogy a böngészőt arra találták ki, hogy HTML-dokumentumokat jelenítsen meg. De milyen is egy HTML-dokumentum? Könnyen megtudhatjuk. Helyezzük az egeret a honlap fölé, és nyomjuk meg az egér jobb gombját! Akármelyik böngészőt is használjuk, egy kis menü fog megjelenni. Keressük meg ebben a Forrás megtekintése – angolul View source – feliratot (lehet, hogy kicsit más formában, de biztos megtaláljuk), és kattintsunk rá az egér bal gombjával! A böngésző egy új ablakot fog megnyitni, ahol ennek az oldalnak a forrása jelenik meg. (Forrásnak azt a kódot hívjuk, amely az oldal megjelenítési módját írja elő.)
Láthatjuk, hogy a dokumentum a <HTML> utasítással kezdődik. Az is bizonyára feltűnik, hogy az utasítások <> jelek közé kerülnek: az ezeken kívül olvasható szöveg nagyjából megegyezik azzal, amit a lapon olvashatunk. (Ha az olvasónak van kedve alaposan megnézni a lapot, bizonyára maga is rájön néhány parancs jelentésére.)
A böngésző azonban nem csak HTML-dokumentumok megjelenítésére alkalmas. Az előbb láthattük, hogy a C: könyvtár tartalmát is megjelenítette. Nézzük meg ismét a C: könyvtárat, és mászkáljunk a könyvtárak között! (Az alkönyvtár nevére kattintva az alkönyvtárba léphetünk, az alkönyvtárból pedig a .. „könyvtárnévre” kattintva léphetünk egy szinttel feljebb. Ha meguntuk a járkálást, az egyes fájlok nevére kattintva próbáljuk meg megnyitni őket! Jó eséllyel próbálkozhatunk a .txt, .jpg, .gif fájlokkal. Az előbbi egyszerű szövegfájlokat, az utóbbi kettő képeket jelent. Ha más kiterjesztésű fájlokat próbálunk megnyitni, akkor a böngésző megkérdezi, hogy le akarjuk tölteni a fájlt, vagy inkább meg akarjuk nyitni. Mivel a fájlok gépen belüli másolásának egyszerűbb módja is van, ezt ne válasszuk. Ha meg akarjuk nézni a választott dokumentumot, akkor a böngésző megnyitja nekünk azt a programot, amivel azt megtehetjük (pl. .doc esetén elindítja a Wordöt), de választhatjuk a visszalépést is. Vannak esetek, amikor a böngésző megpróbálkozik egy fájl megjelenítésével, de csak krixkraxokat látunk. Nem kell megijedni, ez semmilyen kárt nem okozhat. Azt is észrevehetjük, hogy ha .htm, .html kiterjesztésű fájlt nyitunk meg, akkor a böngésző megjeleníti: ezek ugyanis a HTML-fájlok. (A két kiterjesztés közül az utóbbi a Unixon használatos, de mivel ott nincs kiterjesztés, egyszerűen a név része. A Windowson a DOS-os hagyománynak megfelelően a hárombetűs kiterjesztést találjuk, a gyakorlatban azonban nincs különbség közöttük: mind a kettő használható mindkét rendszeren.)
Mivel készítsünk HTML-dokumentumokat?
A HTML-források elkészítésére tökéletesen megfelel a Windowshoz adott NotePad (Jegyzettömb) is. Ez a kétségtelenül primitív eszköz nagyon jól megfelel az egyszerűbb oldalak elkészítéséhez. Ha azonban nagyobb honlapon dolgozunk, előfordulhat, hogy egyszerre több lapon is szeretnénk dolgozni. Természetesen elindíthatjuk a Jegyzettömböt több példányban is. Es sorok írója mégis előnyben részesíti a NoteTab Light című programot, mely ingyenesen letölthető a készítők honlapjáról. Ez számos eszközzel segíti a forrás szerkesztését (pl. csere, keresés). Vannak olyan szerkesztők is, melyek ennél is több szolgáltatást nyújtanak: különböző színekkel jelölik a parancsokat, melyeket akár menüből, kattintással is beszúrhatunk, és súgójukban információt, tippeket és trükköket találhatunk. A legjobb ilyen szerkesztő, a 1st Page szintén ingyenes, és letölthető a gyártó Evrsoft honlapjáról.
Vannak azonban még többet tudó, ún. WYSIWYG-szerkesztők is. A rövidítés (What You See Is What You Get) azt jelenti: Amit Látsz, Azt Kapod. Az ilyen szerkesztőknél néhány egérkattintással összeállíthatjuk a lapot, anélkül, hogy a HTML-forrást valaha látnánk. Akkor miért van szükség a HTML ismeretére? Azért, mert ha az ilyen szerkesztő hibázik, és nem ismerjük a HTML-t, akkor sosem fogjuk tudni kijavítani a hibát. (Sokan, akik ilyen szerkesztőt használnak, még azt sem tudják, hogyan kell beállítani a magyar betűket. Mi ezt már a következő fejezetben megtanuljuk!) Az ilyen szerkesztőket majd akkor lesz érdemes használnunk, amikor jól ismerjük a HTML-t, és nagyon gyorsan kell egy oldalt összerakni. A HTML-t azonban ilyen szerkesztőn nem lehet. Mégis felhasználhatjuk az ilyen szerkesztőket a tanuláshoz: ha nem tudjuk, hogy valamit hogy kell megoldani, akkor csináljuk meg WYSIWYG-szerkesztővel, mentsük ki és nézzük meg a forrást! Ilyen módszerrel sokat lehet tanulni!
Végezetül nem titkolhatjuk el, hogy van a honlapkészítésnek egy még egyszerűbb módja. Ha van egy word-dokumentumunk, akkor a word-ből azt is elmenthetjük HTML-formátumban. Ez azonban több szempontból sem ajánlott. Először is, közel sem biztos, hogy azt kapjuk, amit szerettünk volna (különösen, ha a dokumentumban több betűkészletet is használtunk). Másodszor, ha az eredmény jó is, a Word rengeteg fölösleges utasítást tesz a dokumentumba, így az sokkal hosszabb lesz, mint kellene. Ma Magyarországon viszonylag lassú az internet, ezért nem mindegy, mekkorák a letöltendő állományok. Nem mindegy akkor sem, ha korlátozott a rendelkezésünkre álló hely. Vegyük tudomásul: a Word nem arra van, hogy honlapot készítsünk vele. Ha már semmiképpen nem akarunk HTML-ben írni honlapot, válasszunk egy WYSIWYG-szerkesztőt!
A HTML-dokumentumot a szerkesztőből elmenthetjük, és a böngészőből megnyitva ellenőrizhetjük. Ha hibát tapasztalunk, javítsuk ki, mentsük el, és nézzük meg újra (Újratöltés, Frissítés). Mindezt addig folytathatjuk, míg a lap olyan nem lesz, amilyennek szeretnénk. A következő fejezetben már elkészítünk néhány nagyon egyszerű lapot.
Feladatok
- Megszokott böngészőnk helyett indítsunk el egy másikat! (Ha csak egy böngészőnk van, töltsünk le újabbakat!) Nézzük meg kedvenc honlapjainkat. Milyen furcsaságokat észlelünk?
- Indítsunk el egyszerre több böngészőt, és nézzük meg velük ugyanazokat az oldalakat! A böngészőket váltogatva állapítsuk meg a legfontosabb különbségeket!
- Ha ismerőseinknek van saját, otthon készített honlapjuk, nézzük meg mind a három böngészővel. Találunk valami érdekes hibát?
- Nyissuk meg ugyanazt a
.txt kiterjesztésű fájlt mindhárom böngészővel! Milyen különbségeket látunk?
- A közismert böngészőkön kívül még egyet érdemes megismerni: a Lynxet. Ez egy olyan böngésző, mely csak a puszta szöveget képes megjeleníteni (színeket, képeket nem). Töltsük le, és próbáljunk meg megnézni vele néhány jól ismert lapot. Nem biztos, hogy a kedvencünk lesz, de sajátos szemmel láthatjuk vele az internet világát. Amikor az olvasó elkészíti első honlapját, éredemes lesz megnézni ezzel is!