Hogyan írj HTML oldalakat? És minek?!






Hogyan írj HTML oldalakat? És minek?!

Ez az oldal egy rövid ismertető akar lenni a címben foglalt témáról. Ha már van fogalmad arról hogy mi a HTML, mire jó, és tudsz is írni egyszerűbbeket (neadj isten írtál is már) akkor nyugodtan átugorhatod.
Nézzünk egy tartalomjegyzéket, azaz miről is fog szólni ez a lap:
  • Mire jó ez az egész, minek írjak én HTMLt ?
    (az elektronikus névjegy, illetve homepage fogalma)
  • Hogyan csinálok HTML fileokat ?
    (alapvető tudnivalók)
  • Hogyan tehetem elérhetővé a saját oldalaimat ?
  • Mit érdemes egy homepage-be leírni ?
  • Több HTML oldal kapcsolata, és ezek megnyilvánulása a szerkesztésben
  • HTML trükkök
  • Mit lehet MÉG kihozni a HTMLből?

Mire jó ez az egész, minek írjak én HTMLt ?

(az elektronikus névjegy, illetve homepage fogalma)

Elősször is mi az a HTML ?

A HTML (HyperText Markup Language) egy formátum. Arra jó, hogy szövegesen leírhass különböző multimédia eszközöket, például szöveget :-), de szövegformázási módokat, képek és hangok beillesztését, és még sokkal bonyolultabb dolgokat is. A HTML célja az, hogy mindezeket a dolgokat egyszerűen, olvashatóan (azaz nem bináris adatként), és így könnyen szerkeszthetően, és főleg szabványosan írd le. Akik tudják mi az a gopher azoknak mondom, hogy a HTML tulajdonképpen azt váltotta fel, csinosította ki.
Egy HTML oldal legfőbb ismérve hogy információt tartalmaz. Ez az információ bármi lehet, legyen az egy könyv egy oldala, bármilyen ismertető szöveg, vagy éppen hanganyag vagy animáció, esetleg egy fényképalbum, vagy hirdetés. A dolog legnagyobb előnye a nyilvánosság, azahogy bárki teljesen egyszerűen és hétköznapi módon hozzáférhet más által írt HTML oldalakhoz, és bárki írhat HTML oldalakat.
Ahhoz, hogy írjál HTML oldalakat nem kell semmi más, csak egy szövegszerkesztő, ugyanis mint fent említettem puszta szöveget kell csak editálnod. Ahhoz pedig, hogy a te általad írt oldalakat hozzáférhetővé tedd a nagyvilág számára csupán egy account kell valamely munkaállomáson, ami futtat ún. WWW servert (ha nem tudod, hogy a gép ahol accountod van futtat-e ilyet, kérdezd a superusertől). Elárulom hogy az ELTEn általában minden UNIX és VMS oprendszert futtató gép tud ilyet.

Miért jó nekem, ha HTML oldalakat írok? Nem elég csak olvasni?

Visszakérdezek: szoktál-e .plan filet csinálni? Ha igen, akkor már te is tudod, milyen előnyös ha az ember a publikus információit hozzáférhetővé teszi mindenki számára. Amikor valaki lefingerel, és megtudhatja az érdeklődési területeidet. Rentgeteg érdekes kapcsolat jöhet létre így.
A homepage nem más, mint a .plan file egy sokkal több lehetőséget nyújtó változata - egy elektronikus névjegy, amit bárki elolvashat, megnézheti a családi albumod azon részeit, amik érdeklik, vagy elolvashatja azokat a más HTML oldalakat, amelyeket te a figyelmébe ajánlasz.
Remélem sikerült kedvet csinálni ahhoz, hogy meg nézd...

Hogyan csinálok HTML fileokat ?

(alapvető tudnivalók)
Ez a fejezet arról szól, hogy hogyan hozod létre azt a filet, amiből utánna rejtélyes módokon HTML oldal lesz. A dolghoz elősször is azt kell tudni, hogy egy HTML file a világ legyeszerűbb fileja - szövegfile. Sőt, továbbmegyek, egy kommersz szövegfile, értelmezhető HTMLként is. Ez annyit jelent, hogy ha nincs kedved semmit csinálni, de van .plan-od, akkor az a file minden átírás nélkül megteszi pl homepage-nek, csak legfeljebb nem lesz olyan igényes.
Ha ennél többet akarsz, akkor tarts velem, és nézzük át azt a szintakszist, amivel HTML oldalakat lehet írni.
Íme, ez egy HTML file...
<HTML>
<TITLE>Első HTML oldalam</TITLE>

<BODY>
<P&gtEz az én HTML oldalam ami az enyém, mert én írtam, és nem adok belőle
senkinek</P>
</BODY>
</HTML>

Anchorok

Megnézve ezt a szöveget, rögtön érdekes dolgokba botlunk. Észrevehetjük, hogy ami szöveget beírtunk az mind megjelenik kivéve a < és > közé írt szöveget, aminek viszont valami speciális jelentése van a szöveg megjelenítése szempontjából.
Hagyományosan minden ilyen speciális szövegrész (úgynevezett anchor) blokk szerkezetű, azaz valahol kezdődik, és valahol végetér. A kezdetet a <blokknév> anchorral jelöljük, a blokk végét pedig ugyanazzal, de a név elé beszúrunk egy /-t, ilyenformán: </blokknév>.
Ugyancsak hagyomány, hogy minden HTML lapot egy ún. HTML blokkba írunk azaz a szöveg elé egy <HTML> anchort rakunk a végére pedig egy </HTML> anchort. Ezen belül minden HTML lap két további blokkra, a TITLE és a BODY blokkokra tagolódik. A TITLE blokkban található szöveg lesz a lap címe, az, ami pl. a Netscape ablakának fejlécén megjelenik, amikor olvasol egy oldalt. A BODY blokkban található szöveg kerül megjelenítésre.

Szöveg tördelése

A HTML oldalak egyik érdekessége, hogy a beírt szöveg tördelését semmiféleképpen nem veszi figyelembe a megjelenítö, azaz akárhogy tördeltük volna a fenti példában az "Ez az én HTML oldalam ami az enyém, ..." kezdetű szöveget, annak a megjelenése mindig ugyanúgy a megjelenítő ablakméretéhez lett volna tördelve. Példával megfogalmazva, a
Ez az én
HTML oldalam ami az enyém,
mert én írtam, és nem adok belőle



senkinek
pont ugyanúgy lesz tördelve mint a
Ez az én HTML oldalam ami az enyém, mert én írtam, és nem adok belőle
senkinek
méghozzá így:
Ez az én HTML oldalam ami az enyém, mert én írtam, és nem adok belőle senkinek.
Vegyük észre, hogy a szöveg úgy tördelődik, hogy a rendelkezésre álló helyet maximálisan kihasználja, és nem veszi figyelembe a sorvége jeleket. Ez azért jó, mert így mindenhol úgy jelenik meg a szöveg, ahogy az ott éppen jól néz ki.
Természetes igény azonban az, hogy mi magunk is beleszólhassunk a lapunk megjelenési formájába. Ezért csinálhatunk ún. paragrafusokat azaz bekezdéseket. A bekezdés blokkot a <P> anchorral kezdhetjük, és ennek megfelelően a </P> anchorral zárhatjuk le. Ezután a megjelenítő a különböző paragrafusokat egymástól szépen elvállasztva jeleníti meg.
Másik lehetöség a tördelésre a <BR> anchor. Ez egy darab soremelést szúr be a megfelelő helyre, azaz az elötte és az utánna megjelenő szöveg nem egymástól elkülönítve, csak éppen külön sorban lesz. A <BR> anchor töri meg a hagyományt, miszerint egy anchor egy blokkot ír le, hisz a <BR>-t csak egyszer használjuk, értelem szerint ott ahova a soremelést akarjuk. Megjegyzem, hogy ennek megfelelően mára már a <P> blokkoknak is elég csak az elejét jelölni, hisz a következő paragrafus eleje úgyis lezárja az elöző paragrafust.
Ha ellenkezően az <BR> anchorral, jobban akarjuk elkülöníteni a két szövegrészünket, akkor húzhatunk egy vízszintes vonalat a <HR> anchorral.

Egy példa homepage

Ezek segítségével írjunk egy nagyon egyszerű homepage-et!
<HTML>
<TITLE>Nagy Alma Homepage-dzse</TITLE>

<BODY>
<P>Kedves olvasó!
<P>Te most Nagy Alma homepage-dzsét olvasod! Tudnod kell rólam, hogy a
Nevenincs Egyetemre járok Nekeresd városában és most végzem a hetvenedik
félévemet. Amúgy kr. u 7-ben születtem, szőke a szemem, és zöld a hajam.
<HR>Érdeklődési köröm:
<BR>Buvárkodás
<BR>Autóversenyzés
<BR>Thomas Mann
<BR>Garfield
<P>Ha téged is érdekel valami ezekből, akkor írj nekem egy levelet!
<P>Üdvözlettel : N A G Y   A L M A
</BODY>
</HTML>
Ez az oldal így jelenik meg:

Kedves olvasó!
Te most Nagy Alma homepage-dzsét olvasod! Tudnod kell rólam, hogy a Nevenincs Egyetemre járok Nekeresd varosában és most végzem a hetvenedik félévemet. Amúgy kr. u 7-ben születtem, szőke a szemem, és zöld a hajam.

Érdeklődési köröm:
Buvárkodás
Autóversenyzés
Thomas Mann
Garfield

Ha téged is érdekel valami ezekből, akkor írj nekem egy levelet!
Üdvözlettel : N A G Y A L M A

Ez már kezd hasonlítani egy szép homepage-re, de nem az igazi. Kéne még, hogy a cím (Kedves olvasó!) ki legyen emelve, a név a végén vastagon legyen szedve, ahelyett, hogy a gépírasnál szokásos nagybetűs-spaces elrendezéssel emelnénk ki, egyszóval csinosítani kéne.
Hát csinosítsuk!

Fejlécek, kiemelés

Az első amit megtehetünk a fejléc kiemelése. Erre a HTML szabvány egy jó lehetőséget a címszedést adja. Sorban a <H1> , <H2> ... anchorokkal egyre kissebb mélységű címeket tudunk kiszedni. Csináljuk meg, hogy a "Kedves olvasó !" felirat jelenjen meg a lehető legnagyobb címmel:
<H1>Kedves olvasó!</H1>
.
.
.
Ami majd így fog megjelenni:

Kedves olvasó!


Most emeljük ki a végén a nevet vastag betűkkel. Ezt a <STRONG> anchorral tehetjük meg.
.
.
.
<P>Üdvözlettel : <STRONG>Nagy Alma</STRONG>
Ez így fog kinézni:

Üdvözlettel : Nagy Alma

Linkek

No ez már eléggé pofás, a probléma az, hogy itt korántsem érnek véget a HTML nyelvi lehetőségei. Módunk van ugyanis a szövegbe ún. linkeket elhelyezni. Ezek a linkek mutatók, amelyek más HTML oldalakra mutogatnak. Amikor az olvasó kiválaszt egy ilyen linket (pl rákattint az egérrel NetScape alatt) akkor a megjelenítőprogram betölti azt az oldalt ahová a mutató mutogat.

Mi az az URL?

Ahhoz, hogy linkeket csináljunk, tudnunk kell ezt-azt az ún. URLekről, azaz a HTMLben használatos címekről. Egy ilyen URL maga a mutató, ami mutathat bármire, péládul HTML oldalakra is (nem csak arra!). Az URL természetesen szintén szöveg formátumban van megadva. Ennek a szövegnek az első szava határozza meg, hogy mire mutogatunk vele. Így pl a "http" határozza meg, hogy HTML oldalakra akarunk mutogatni. HTML oldalak esetében a "http" után a gépnek a neve jön, ahol az adott HTML oldal van, utánna pedig a file neve, amiben a HTML oldal megtalálható.
Egy cím pl így nézhet ki:
http://www.cs.elte.hu/~zape/home.html
Ezt értelmezve a következő jelentést kapjuk:
A HTML oldalunkba ilyen URLeket az <A> anchorral tudunk berakni, mégpedig a következő módon:
<A HREF="http://www.cs.elte.hu/">Ez az egervary homepage-dzse</A>
Ezután az "Ez az egervary homepage-dzse" szöveg másképp (pl NetScapeban kékkel) fog megjelenni, és ha rákattintasz, akkor az egervary nevű gép homepage-dzsét fogja behozni a megjelenítő. Így:
Ez az egervary homepage-dzse
Figyelem! Nagyon fontos!
Miután az URLbe sima címet kell írni, ezért tökéletesen korrekt dolog ilyen URLt megadni:
http://augusta/
Ezt ha kipróbálod, kiválóan működik majd, az augusta homepage-dzsére fog mutatni, így látszólag mindenki happy. Egészen addig, amíg valaki más, pl. Ausztráliából próbálja majd megnézni a mutató által mutogatott címet. Miután az
augusta
név önmagában nem egyértelmű, ezért amikor keresi a gépet a megjelenítő hozzáteszi a saját domainjét, ami itt az eltén
elte.hu
Ausztráliában azonban egészen más domaint fog hozzátenni, így szerencsétlen fickó egy nemlétező gép egy nemlétező homepage-dzsét akarja majd nézegetni.
Ezért érdemes odafigyelni arra, hogy az URLknel mindíg a teljes címet adjuk meg!

Mailto URLek

Egy másik hasznos dolog amit az URLekkel kapcsolatban tudni érdemes, a mailto cím. Ennek segítségével úgy adhatod meg mások email-címeit, hogy az olvasónak csak rá kelljen klikkelnie, és már írhassa is a levelet, anelkül, hogy meg kéne jegyeznie a címet magát. Pl. berakhatod a saját email címedet azzal a megjegyzéssel, hogy ha bárki kapcsolatba akar lépni veled, akkor oda kattintson. Mindezt úgy teheted meg, hogy az URL első szavának a "mailto:" azonosítót adod meg. Nézzünk egy példát rá:
<A HREF="mailto:zape@cs.elte.hu">Ha akarsz íjr nekem levelet!!!</A>
Ez így fog majd kinézni:

Képek beillesztése

Mint mondtam, a HTML formátum azért olyan jó, mert nem csak szöveget lehet vele leírni (mint a gopherben) hanem barmilyen multimédia eszközt, így képeket is. A képek beillesztésére két módszer is van, a legegyszerűbb az, hogy egy ismert formatumú (pl gif, jpeg, tiff) kép önmagában szintén kiválóan értelmezhető HTML fileként. A http://gépnév/valami.gif cím tehát egy korrekt cím, aminek a tartalmát a megjelenítő meg fogja jeleníteni (ha tudja). Így tehát berakhatunk linkeket a homepage-ünkbe képekre, amiket az olvasó egy klikkentéssel meg tud nézni.
A másik, sokkal szebb megoldás, hogy az <IMG> anchort használjuk. Ennek az anchornak vagy egy filenevet, vagy egy URL-t kell megadni, és az abban a fileban levő ill. azon az URL-en megtalálható képet beszúrja a dokumentumba. Nézzünk erre egy példát:
Ez egy szöveg, és ide <IMG SRC="http://www.cs.elte.hu/~zape/ikonok/xterm.gif">
rakja be
Ez így jelenik majd meg:

Ez egy szöveg, és ide rakja be

Egy alapvető jótanács, hogyha más érdekes dolgokat akarsz tanulni HTML írásról, azt úgy tudod a leghatékonyabban megtenni, ha sok HTML oldalt olvasol, es ha olyat találsz bennük, amiről még nem tudod hogyan kell megcsinálni, akkor megnézed a HTML forrását. Erre a legtöbb (az összes általam ismert) HTML browser lehetöséget nyújt (pl. NetScape View menüjében található a Source... parancs)
Nos, most már bárki tud írni egy homepage-et, vagy egyébb HTML oldalt bármilyen témában. Nézzük most hogy mihez is kezdhetünk a HTML oldalainkkal, azaz

Hogyan tehetem elérhetővé a saját oldalaimat ?

Ott tartunk, hogy megírtuk a saját homepage-ünket. Hogyan tovább. Attól, hogy megírtuk, még más nem tudja megnézni. Aki írt már .plan-t, az sejtheti, hogy a megoldás az lesz, ha a filet egy specifikus filenévvel menjük el. Nos majdnem.
Ahhoz hogy egy tetszőleges HTML oldalt úgymond láthatóvá tegyünk, be kell másolni egy meghatározott nevű directoryba a homedirectorydon belül. Ez a meghatározott név gépfüggő, egész pontosan rendszergazdafüggő, megpontosabban WWW serverfüggő. Íme egy kis táblázat arról, hogy melyik gépen milyen nevű directoryba kell raknod a HTML filejaidat:
Gépnév Directorynév
turan.cs.elte.hu html
augusta.inf.elte.hu public_html
digo.elte.hu www

Mire kell vigyázni?

  1. hogy az UNIX oprendszerben a fileneveknél (és nem csak a fileneveknél) NEM MINDEGY hogy kis- vagy nagybetűt írsz!
  2. hogy a directory, es minden benne levő (szándékod szerint) publikus file valóban publikus legyen, azaz egy kommersz usernek is joga legyen elolvasni.
    Hogyan tudod ezt megtenni?
    Elősször is a homediretoryra mindenkinek x jogot kell adnod, majd a htmleket tartalmazó directoryra is x és r jogokat, valamint minden html filera, amit közkincsé akarsz tenni r jogot. Ezt az alábbi három utasítással teheted meg:
    chmod a+x homedirnév
    chmod a+xr htmldirnév
    chmod a+r htmldirnév/htmlfilenév
    Arra vigyázz, hogyha egy html fileba beraksz egy képet, akkor a képet tartalmazó filera szintén olvasási jogot kell adnod mindenkinek. Ezért (pláne ha aldirectoryjaid is vannak a html homerdirectorydban) az utolsó két chmodot érdemes kicserélni a
    chmod -R a+rX htmldirn&eacutev
    parancsra. Vigyázz! A fent megadott parancsban a kis és nagybetűk között különbség van!
  3. hogy ha a turánon csinálsz html directoryt, azt várakozásaiddal ellentétben nem a http://turan.cs.elte.hu/... címen, hanem a http://www.cs.elte.hu/... címen találod majd. Ennek az oka arra vezethető vissza, hogy a turánnak és még sok gépnek egy közös www servere van (megfigyelhetted már, hogy ugyanez igaz a finger daemonra is, azaz ha megfingereled a turánt, akkor nem csak a turánon bejelentkezett usereket írja ki)
Ezek után megadhatod ismeröseidnek, hogy (például) a http://www.cs.elte.hu/~alma/home.html nevű fileban találhatják meg a homepage-edet. Mi történik azonban, ha valaki hiányosan adja meg a címet a megjelenítőjének (szándékosan vagy sem) és csak ezt írja be: http://www.cs.elte.hu/~alma/? Nos ekkor egy directory listát kap a ~alma/html directoryról. Minden file egy link lesz benne, es rákattintva mindet megnézheti, vagy letöltheti, pont úgy, mint amikor mondjuk egy ftp-siteon nezelődünk.
Meglehet, hogy te nem szereted, ha minden fileodat megnézegethetik, és jobb szereted a HTML lapjaidat olvasókat kordában tartani (csak azt mutatni nekik, amire a home.html-ből link van). Ekkor nevezd át a home.html-t index.htmlre. A WWW server ezután a http://www.cs.elte.hu/~alma/ címeket automatikusan a http://www.cs.elte.hu/~alma/index.html címre írja át.

Csináljunk-e index.html-t?

PRO KONTRA
Mindenki csak azt nézheti meg amire te beraksz egy linket az index.html-be Ha felraksz egy új filet, amit mondjuk valaki kért, akkor mindig updatelni kell az index.html-t. Meglehet hogy ez elfelejted
Aki a te homepage-edet keresi puszta talalgatás alapján is egyböl megtalálhatja, hiszen csak a gép nevét és az ottani useridet kell tudnia hozzá, a html file neve adott (maga az index.html), vagy megtalálhatja az index.html-ben szépen kommentezve. Ha valaki keresi a homepage-edet, es nincs index.html-ed, akkor a default címre egy directory listát kap. Ha ebben elhelyezel egy beszédes nevű filet (pl home.html) akkor ha van egy kis esze, akkor megtalálja.
Ha csinálsz index.html nevű filet, akkor ez a tény (hogy van homepage-ed) még aznap éjszaka bekerül a finger infodba (a turánon), azaz ha legközelebb lefingerelnek nem csak mail címed, hanem a homepage-ed címe is olvasható lesz. Ráadásul, ha a compsci homepage-en a Felhasználóink menüpont alatt megtalálják a nevedet, akkor onnan egy kattintással a homepage-edre ugorhatnak. Meglehet, hogy te a homepage-edet csak szűk körben szeretnéd terjszteni, azaz mondjuk nem akarod mindenkinek megmutatni hogy van (persze azt nem tudod megakadályozni hogy megnézze). Ekkor a finger infoban levő hirdetés kimondottan rosszul jön.
Ezek alapján döntsd el, hogy
  1. nem csinálsz index.html-t. Ekkor érdemes a homepage-ednek beszédes nevet adni, pl home.html, vagy hasonló.
  2. a homepage-edet index.html-nek nevezed.
  3. csinálsz index.html-t, és a homepage-edre (más dolgok között) innen csinálsz egy linket.
Megjegyzem, hogy a compscis gépeken érdemes index.html file-t létrehozni, feltéve hogy publikus homepage-et akarsz csinálni, mert ekkor azért a kis kényelmetlenségért cserébe, hogy szerkesztened kell egy indexet (ami jó esetben maga a homepage-ed) a homepage-edet sokkal nagyobb valószinűséggel találják meg más emberek.
Ha már ennyire érintettük a homepage szerkesztésének módszereit, akkor nezzük

Mit érdemes egy homepage-be leírni ?

Ebben a fejezetben arról lesz szó, hogy hogyan érdemes elrendezni egy homepage-et (azaz mostmár nem általában HTML oldalakról van szó), mit érdemes belerakni, mit illik, és mit nem illik, és mit kifejezetten tilos.

Mi az ami mindig szerepelni szokott egy homepage-ben ?

Elsö sorban azok a személyi adataid, amiket publikussá akarsz tenni. Így a neved, korod, rövid életrajzod, melyik egyetemen tanulsz és mit, stb. Ha akarod a bankszámlaszámodat is beírhatod, de nem muszály. Ha valaki nem akarja, hogy tudják a nevét, az ne írja le. Tartsd szem előtt, hogy a homepage-et nem csak a barátaidnak írod, hanem mindenkinek aki elolvassa.
Írhatsz azokról a hobbyjaidról, érdeklödési területeidről, amikkel kapcsolatban szívesen leveleznél másokkal. Magyarul ide nem muszály minden hobbydat leírni, hanem csak azokat, amitől nem leszel ideges, ha egy szép napon egy teljességgel ismeretlen embertöl kapsz egy levelet hogy "nahát, te is ezzel foglalkozol? Képzeld én is, nem tudod, hogy hogyan kell ...".
A homepage-edbe belevehetsz linkeket ismerőseid homepage-dzsére, valamiféle "Akiket érdemes meglátogatni" fejezetben. Szintúgy berakhatsz egy listát azokra a HTML oldalakra, amik megnyerték a tetszésedet, és amiket másoknak is ajánlasz.
Ha van rá módod, feltétlenül rakd be a homepage-edbe a képedet is. Ugyanígy nagyon szép es elegáns, ha az ismerőseid homepage-dzsére olyan linkeket csinálsz, amik az ismerőseid képét tartalmazzák. Ez azonban akkor az igazi (és a leginkabb quota-kimélö), ha nem lemásolod az ismerősöd képét, hanem egyszerűen egy IMG linket raksz be rá, persze megfelelöen lekicsinyítve a képet a WIDTH és a HEIGHT anchorokkal. (***) Azonban ha magadról raksz be képet, ugyanígy számíts rá, hogy más is kölcsönveszi így a te képedet. Ez nem baj, de ügyelj rá, hogy ha lecseréled a képedet, akkor az előző nevével egy néven rakd fel.
Csinálhatsz egy listát az általad használt softwarekről, aminek az elemei linkek olyan helyekre, ahol a softwarenak homepage-dzse van, vagy ftp-siteokra, ahonnan le lehet tölteni a softwareket.

Mit nem érdemes vagy tilos egy homepage-be leírni

Nagyon vigyázz arra, hogy a homepage-ed teljesen nyilvános, azaz bárki elolvashatja. Ezert ne rakjál a homepage-edbe sértő megjegyzéseket másokról, ne kritizáld a tanáraidat, ismeröseidet, csak ha az egyértelműen jóindulatú paródia.
Ugyanígy ne rakjál be hivatkozásokat kalóz ftp-siteokra, mert ezzel leleplezed őket :-).
Ne csinálj afféle "fiúk lányok, tegnap vettem meg a lehel piacon a Windows 95 új verzióját, ha akarjátok innen letölthetitek!!!" linkeket se, magyarán ne csinálj linkeket semmire sem, ami illegális. Ezzel nem csak magadat veszélyezteted, hanem a rendszergazdát is, vagy a gép üzemeltetőjet (nem mindig esik egybe). Erre nagyon vigyázz, mert kissebb balszerencsével az egyetemen kívül landolhatsz, ha nem teszed.
Ha valamilyen fizető szolgáltatást, vagy egyébb profitorientált dolgot akarsz reklámozni www-n, akkor is inkább kérd ki a root vélemenyét a dologról, hogy nem bánja-e. Freeware, shareware, vagy public access dolgok, oldalak reklamozása természetesen nem ebbe a kalapba tarozik.

Szerkesztési tanácsok

Ha a homepage-edbe listát akarsz berakni ami hosszabb (nem pár sor), vagy bővebb életrajzot akarsz írni, esetleg nagyon sok témában akarsz írni, és nem akarod, hogy az oldal nagyon csapongónak tűnjön, akkor ezeket a részeket külön oldalakra írd, a homepage-ed pedig tartalmazzon linkeket ezekre az oldalakra. Arra azonban vigyázz, hogy ne törd túlságosan szét a homepage-edet. Azt tartsd szem elött, hogy a homepage mindenröl szólhat, de te vagy a középpontja, azaz amíg az adott téma is csak rajtad keresztül érdekes, addig maradjon a homepage-eden, de amint önnálló téma kezd lenni, inkább rakd át másik oldalra.
Például, ha a homepage-ed végére raksz egy listát az ismerőseidről, az jól néz ki, de ha már kész telefonkonyvet akarsz csinalni mindenkiről akit ismersz, témákra bontva, vagy mittudomén, akkor az már külön oldalra való.
Tördeld a témában különböző részeit a homepage-ednek szét egymástól. Húzzál közéjük vízszintes vonalat, esetleg csinálj fejezetcímeket, vagy hagyj ki nagyobb helyet. Ha az egyes témák csak egy-egy bekezdés hosszúak, akkor rakhatsz közéjük sima paragrafus-vége jelet, de ha valamelyik több bekezdés hosszú, akkor ennél nagyobb elhatarólás szükséges.
Vedd figyelembe, hogy az ember egy vizuális lény, használj sok-sok ikont! Az ikonok használatának egyik módja, hogy rajzolsz, lopsz, letöltesz ikonokat, és mindig olyan ikont használsz, ami jelképezi a link mögött levő oldal tartalmát. A másik módszer, hogy magáról az oldalról veszel ki egy jellegzetesebb képet, és azt ikonná kicsinyítve rakod be. Ennek egy tipikus példája, amikor valakinek a homepage-dzsére akarsz linket berakni. Ilyenkor természetesen az illető képe lesz az ikon. Arra az apróságra vigyázz, hogy hiába kicsinítesz le egy képet, attól még az egy nagy file marad, tehát a hálózaton sok byteot kell áttölteni. Ez nagyobb távolságokba esetleg lassú lehet. Ilyenkor érdemes az ikonnak kiszemelt képről xv-vel (vagy mással) csinálni egy kicsinyített másolatot, és azt berakni ikonnak.
Ha hátteret alkalmazol, figyelj rá, hogy a háttér egybefolyó minta legyen, és ne nyomja el a szöveget. Ez nem azt jelenti, hogy ne legyen túl sötét, mert azt még világos betűkkel korrigálni lehet (pl feketén fehér betűk). Inkább arra figyelj, hogy a legsötétebb és a legvilágosabb színek ne térjenek el egymástól nagyon fényerősségben. Ekkor ugyanis nem tudsz olyan fontot választani, ami mindenhol jól látszik. Tipikus rossz példa szerintem a háttér alkalmazására a Kőrösi Csoma Sándor Kollégium homepage-dzse(azóta kijavították). Ha van egy képed, és abból szeretnél hátteret csinálni, de nem felel meg a fentebb említett követelményeknek, akkor próbáld meg összemosni egy kicsit. Pl a fekete-fehér képet érdemes világosabbszürkére és sötétebbszürkére összemosni, így kiválló háttér lesz.

Több HTML oldal kapcsolata, és ezek megnyilvánulása a szerkesztésben

Mi van akkor, ha egy komplett, átfogó témáról akarsz írni HTML-t, mondjuk dokumentációt valamiről?
Valószínűleg ilyenkor fejezetekre akarod bontani a dokumentációt. Érdemes ezeket a fejezeteket külön HTML oldalakra írni, és írni mondjuk egy tartalomjegyzéket, ami nem más, mint linkek gyűjteménye. Ilyenkor a dokumentáció egyes fejezeteit bármikor ki tudjuk választani, és el tudjuk olvasni.
Érdemes azonban biztosítani a szekvenciális olvasás kényelmességét. Ezt azzal tehetjük meg, hogy minden fejezet végére és elejére rakunk egy-egy linket a következő és az előző lapra. Amikor pedig valamire hivatkozunk, ami egy másik lapon van, akkor érdemes a hivatkozás alá is egy linket tenni, ami a hivatkozott lapra mutasson. Ez megkönnyíti az olvasást, amikor valaki a hivatkozás alapján gyorsan el szeretné olvasni, hogy miről is volt ott szó, de aztán folytatná az olvasást ott ahol abbahagyta.
Ha mégis jobban szereted az egybetartozó dolgokat egy fileba írni, arra is van lehetőség. Ilyenkor el kell nevezned az oldal egyes fejezeteit a NAME paraméterrel az A anchoron belül. Erre utánna a #fejezetnév URLrel hivatkozhatsz. Ez azért jó, mert az olvasó egyszer tölti le az egész lapot, viszont sokat lapozgat benne, amihez nem kell új letöltés. Így a cache nélküli megjelenítők is megfelelő sebességgel lapoznak.

HTML trükkök

Ebben a fejezetben (teljesen rendszertelenül) azzal foglalkozok, hogy egyes dühítő problémákra milyen megoldásokat lehet kiagyalni. Ha valaki, aki a sorok olvastán lenézően elbigyeszti a száját: "Ugyan, ezt sokkal egyszerűbben is meg lehet oldani", az ugyanazzal a lendülettel kattintson ide és írja meg az egyszerűbb megoldását. Igérem publikálom.

Folyó szöveg problémák az oldalrarendezett képeknél

Ha valaki figyelmesen tanulmányozta a HTML referenciát, akkor tudja, hogy az ALIGN=LEFT vagy RIGHT opcióval a szöveget a kép mellé jobbra ill. balra folyatva tudja tördelni. Ez nagyon jól is működik. A probléma akkor kezdödik, amikor valaki olyat akar, hogy bal oldalt a kép, mellette jobbra a szöveg (mondjuk ami a képröl szól) alatta meg más szöveg. Aki már írt HTML oldalt látja, hogy mekkora problémát jelent az, ha a kép nagyobb mint a szöveg. Ekkor ugyanis nem tudjuk szabályozni, hogy mennyi szöveg kerüljön a kép mellé, és így sajnos hozzá fogja tördelni azt is, amit már a kép alá szerettünk volna.
A megoldás a clear=all paraméter. Vagyis, rakjuk be a képet, és a mellette levő szöveget ahogy szoktuk. Ezután rakjunk egy soremelést így:
<br clear=all>
A többi szöveg tutira a kép alá fog kerülni. Próbáld ki, ha ezt akartad, jó. Ekkor ugye a szöveg a kép mellett függőlegesen felülre lesz igazítva. Mi van azonban, ha középre akarjuk igazítani? Ekkor már sajnos nem ússzuk meg (jelenlegi ismereteim szerint) ilyen egyszerűen: táblázatot kell csinálnunk. A táblázat egyik oszlopában a kép, a másikban pedig a tőle jobbra levő szöveg. Ilyenkor (mint táblázatoknál mindig) a szöveg középre tördelődik (függőlegesen). Megjegyzem ez a módszer akkor is jó, ha az a baj, hogy a kép kicsi, és nem akarjuk, hogy a szöveg "aláfolyjon", vagyis a kép után is beljebb kezdődjön a szöveg. Ilyenkor persze a kép lesz középreigazítva.
Arra azonban nincs megoldásom, ha a képet vagy a szöveget lentre akarjuk igazítani. Erre várok konstruktív javaslatokat.

Nem proportionális betűkészlet

Ha forráskódot vagy hasonló szöveget akarunk idézni, akkor fontos lehet, hogy a szöveget ún. nem proportionális betűkészlettel jelenítse meg a megjelenítő, azaz minden betű egyforma széles legyen. Ezt a <pre> anchorral tehetjük meg.
A <pre> anchor arra is jó, ha valamilyen text formátumban már meglévő szöveget akarunk www-n keresztül elérhetővé tenni, és lusták vagyunk formázni, elég ha egy PRE blokkba tesszük, és a benne levő karakteres rajzok, táblázatok tuti nem fognak elcsúszni.

Mit lehet MÉG kihozni a HTMLből?

A HTML az itt felsoroltakon kívül még nagyon sok mindent tud.
Lehetőség van táblázatok szerkesztésére, amivel gyakorlatilag minden lényeges tördelési feladatot meg tudunk oldani. Minden táblázat tetszés szerinti vastagságú vonallal bekeretezhető. A táblázat cellákból áll, amelyek sorokba és oszlopokba sorolhatók, de minden cella lehet több sor magas vagy oszlop széles is.
Írhatunk még inputformokat is, radiobuttonokkal, checkboxokkal. Ennek a dolognak az egyetlen hátránya hogy az adatok fogadására a cgi-bin, vagy hasonló nevű directoryba kéne írnunk, ehhez pedig általában nincs jogunk
Újabb megjelenítők (NetScape2) képesek animáció megjelenítésére
 

Copyright 2008 All Rights Reserved Revolution Two Church theme by Brian Gardner Converted into Blogger Template by Bloganol dot com