Melyek a weboldal fő elemei? Weboldalak alapelemei. HTML nyelvi szerkezet: címkék

Bármely weboldal tartalmaz egy bizonyos szabványos elemkészletet, amelyek az egyes erőforrások kötelező összetevői Internetes hálózatok. Az ilyen elemek elrendezése, egymáshoz viszonyított helyzetük kialakítása a webmester egyik fő feladata.

A weboldal első eleme az cím. Készülhet szöveges vagy grafikus formában is, de mindkét esetben a dokumentum tetején kell elhelyezni. Néha a címmel kombinálva Cirill kódolás kiválasztási menüÉs gombokkal válthat az oldal oroszról angol verziójára, ha ez a webes erőforrás két nyelven jelenik meg.

Rendszerint közvetlenül a dokumentum alcímében van az elhelyezésre kijelölt hely reklám banner. A banner elhelyezése a weboldal tetején a legtöbb esetben előfeltétele egy webhely regisztrációjának a bannercsere szolgáltatásokban - olyan rendszerekben, amelyek reklámozzák az Ön által létrehozott erőforrást, cserébe a bannercsere-hálózat más résztvevőinek hirdetéseit megjelenítik az oldalakon. te oldalad.

A dokumentum fő részét az ún szöveges mezőben- az a terület, ahol az oldal szemantikai tartalma található: tartalom információs szövegés illusztrációk. A felsorolt ​​elemeket „tartalomnak” is nevezik (angol nyelvből tartalom). A szövegmező helye elsősorban attól függ, hogy a webtervező hogyan helyezi el a dokumentum többi elemét.

A weboldal következő kötelező összetevője az navigációs elemek- összekötő hiperhivatkozások ez a dokumentum a webhely többi részével. A navigációs elemek készülhetnek szöveges karakterláncok, grafikus objektumok, azaz gombok vagy aktív komponensek formájában.

nents, például Java kisalkalmazások. Utóbbiak ugyanazok a gombok, amelyek a „hagyományos” testvéreikkel ellentétben képesek reagálni az egér mozgására, néhány egyszerű műveletet végrehajtva, amikor a kurzort föléjük viszi (a háttérvilágítás bekapcsolása, „kattintás” effektus létrehozása, alakváltás stb.). d.).

A legelterjedtebb megközelítés a navigációs elemek elhelyezése az oldal bal szélén.

A dokumentum alján szokás közzétenni információkat az oldal fejlesztőiről és címéről Email , amelyen keresztül a látogatók válaszaikat, javaslataikat, kívánságaikat küldhetik el az oldal tulajdonosainak.

Ha a weboldal kezdődokumentum, akkor annak aljára is kerül hit counter- egy kis szkript, amely meghív egy, a szerverre telepített CGI szkriptet, amely minden egyes dokumentum megnyitását rögzíti a felhasználói böngészőben, megváltoztatva a számláló jelző értékét. Nem ajánlott több különböző számlálót egy oldalon elhelyezni.

A weboldalak különböznek egymástól:

Méretek (több oldaltól a gigabájtnyi információt tartalmazó webszerverekig).

Tervezés (általános színséma, betűformátum, használt illusztrációk stb.).

Struktúra (hivatkozások rendszere, oldalak összekapcsolása az oldalon belül, valamint kapcsolat más oldalakkal).

Ugyanakkor bármely weboldal szabványos elemekből épül fel, amelyek két csoportra oszthatók:

Passzív (szemléltető) elemek

• élénkség

Aktív elemek

• beviteli mezők

  kapcsolók

Keretekkeret- keret, keret) egy olyan technológia, amely lehetővé teszi egy weboldal több részre (ablakra) való felosztását, és lehetővé teszi az egyes részek tartalmának megváltoztatását a többi résztől függetlenül. Így egy webhely tartalomjegyzéke gyakran egy megváltoztathatatlan keretbe kerül, a tartalom pedig egy másikba.

9. témakör Elektronikus kommunikáció. Email címek

Az elektronikus levelezés (e-mail) a hálózati szolgáltatás fő típusa. Az üzenetküldés a rendszeren keresztül történik levelezőszerverek.

A levelezőszerveren minden felhasználóhoz külön tartozik Postafiók az a hely a szerverlemezen, ahol az e-mail üzeneteket tárolják. Az e-mail cím regisztrációs folyamatának befejezésekor a felhasználó bejelentkezési nevet és jelszót kap, amelyek segítségével hozzáférhet postafiókjához. A postafiók nevét (bejelentkezési nevét) maga a felhasználó adja meg. A szerver csak arról gondoskodik, hogy a név egyedi legyen.

Az e-mail cím két részből áll, amelyeket a @ jel választ el (ezt a jelet általában „kutyának” nevezik):

Név postafiók felhasználó (a példánkban ő választotta ki - irina).

Domain név levelezőszerver(példánkban - levél. ru) .

Például, irina@ levél. ru

Az e-mail címeket szóközök nélkül írjuk latin betűkkel, számokkal vagy szimbólumokkal (használata megengedett).

A felhasználó számítógépén található e-mail cím regisztrációs adatai alapján afiók , amely a levelezési szolgáltatással való kapcsolatfelvételhez szükséges információkat tartalmazza, beleértve a felhasználónevet (Belépés) és jelszót.

E rekord alapján a szerver azonosítja a felhasználót.

Internetbiztonsági tervezés a védelem érdekében

A támadás célpontja lehet a hálózaton keresztül továbbított információ és egy internetre csatlakozó számítógép is.

Az internet használata során lehetetlen teljes biztonságot biztosítani, de az előzetes biztonsági tervezés jelentősen csökkenti a támadások valószínűségét. Mivel az internet folyamatosan fejlődik, folyamatosan új biztonsági problémák merülnek fel, így a biztonsági eszközök frissítése elengedhetetlen része a számítógépes rendszer egészségének megőrzésének.

Védelmi vonalak:

Lehetséges támadások blokkolása:

Használjon speciális szoftvert és hardvert, amely blokkolja a nem biztonságos és szükségtelen adatokat.

Használjon hitelesítést és titkosítást.

A kockázati források csökkentése:

Csak azokat az internetes szolgáltatásokat használja, amelyekre valóban szüksége van.

Használjon hibamentes szoftvert, és rendszeresen frissítse.

Állítsa be megfelelően a szoftvert (minél kevesebb megengedett, annál nagyobb a biztonság).

Ne hirdessen információkat magáról az interneten.

Korlátozza a hozzáférést a számítógép erőforrásaihoz.

Felkészülés a támadásból való felépülésre:

Rendszeresen hozzon létre és frissítsen biztonsági mentések munkaadatok.

Mindig legyen kéznél szoftverelosztó készlet.

Hitelesítés (tólrpökológiaiautentikus- hitelesség) – az eredetiség megerősítése.

Mindannyian rengeteg cikket olvastunk a kulcsszavak kiválasztásáról és azok helyes listájának összeállításáról, valamint arról, hogyan lehet kulcsszavakkal létrehozni egy webhelyet, amely releváns bizonyos keresési lekérdezések számára. Nézzük meg közelebbről a kulcsszavak weboldalakon való elhelyezését.

Ha tudja, hol és hogyan kell elhelyezni a kulcsszavakat egy weboldalon, akkor SEO cége megszakadhat.

Minden weboldalon 5 elem található, ahol el kell helyeznie a kulcsszavait:

1. Oldal címe (title tag)
2. Oldal kulcsszavai (Meta tag kulcsszavak)
3. Oldalleírás (Meta description tag)
4. Alternatív szöveg a képekhez (Alt címke)
5. Weboldal tartalma (body tag)

A weboldal fenti elemei közül a legfontosabb az oldal tartalma (5. pont). Erről bővebben alább.

Egyelőre nézzük meg ezt a listát sorban.

1. elem. Oldal címe (title tag)

Először nézzük meg az oldal címét (title tag). Ez az elem az első és legfontosabb bármely weboldal fejblokkjában található összes többi elem közül.

Az internetböngésző legfelső sorában láthatja a weboldal címét. Ennek ellenőrzéséhez indítson el egy böngészőt, például internet böngésző, Opera ill Mozilla Firefox, keresse fel bármelyik webhelyet, és hasonlítsa össze a title címke tartalmát az adott böngészőben a legfelső sorral. A keresőmotorok ezt a címkét saját céljaikra használják – információkat gyűjtenek a webhelyről és meghatározzák annak tárgyát, valamint a keresőmotorok eredményeiben (SERP) használják a weboldal neveként.

Emlékezik! Egy weboldal címe az Rövid leírás.

A fentieken túlmenően a title tag tartalma a weboldal címeként kerül felhasználásra, amikor azt az Internet böngésző Kedvencek közé adjuk.

2. számú elem. Oldal kulcsszavai (Meta tag kulcsszavak)

Most beszéljünk a kulcsszavakról és a leírás metacímkéiről. Néhány évvel ezelőtt a Meta kulcsszavak címkét használták, amikor webhelyet adtak a keresőmotor indexéhez. De azok az idők elmúltak. A keresőmotorok most egyszerűen figyelmen kívül hagyják ezt a címkét, mert... gyakran előfordul, hogy „piszkos” célokra használják. Egyes keresőmotorok figyelmet fordítanak erre a címkére a webhely tárgyának meghatározásához.

Az elmondottakból az következik, hogy ez a címke nem kötelező, de kizárólag a rendeltetésének megfelelően használhatja.

A kulcsszavakat vesszővel kell elválasztani. A legfontosabb kulcsszavakat helyezze a lista elejére, majd csökkenő fontossági sorrendbe. A keresőmotorok már nem figyelnek arra, hogy milyen kis- és nagybetűket írnak be a kulcsszavak, így most már minden kulcsszó kisbetűvel írható.

3. számú elem. Oldalleírás (Meta description tag)

A leírás metacímke egy másik webhelyelem, amelyben a kulcsszavakat el kell helyezni. A keresőmotorok átvizsgálják ezt a címkét kulcsszavak jelenlétére, és összehasonlítják a tartalmát magának a webhelynek a tartalmával (a body címke tartalmával). Nagyon fontos körülmény, hogy a keresőmotorok a leírás címke tartalmát a weboldal leírásaként használják a keresési eredményekben (SERP).

Ennek a címkének tartalmaznia kell a weboldal rövid leírását, de legfeljebb 50 szót.

4. számú elem. Alternatív szöveg a képekhez (Alt címke)

Az Alt címkék a kép tartalmának szöveges leírása, azaz. Ha valamilyen oknál fogva a kép nem töltődik be, és a képen van alt szöveg, akkor ez a szöveg jelenik meg a kép helyett.

Ha a kép be van töltve, és a képen van alt szöveg is, akkor azt láthatjuk, ha a kép fölé visszük az egeret. Az Alt címkéket azon internetfelhasználók kényelmére használják, akik valamilyen okból nem jelenítenek meg grafikát.

Sok keresőmotor indexeli a címke tartalmát, így kulcsszavakat tartalmazhat. Ne feledje, hogy az alternatív szövegnek meg kell felelnie a képnek, le kell írnia, és szöveges megfelelőjének kell lennie. Ne használja az alt címkét jelölőképekhez, például elválasztó vonalakhoz, golyókhoz...

5. számú elem. Weboldal tartalma (body tag)

Így végre elérkeztünk a webhely legalapvetőbb eleméhez - a body taghez, amelyhez a tartalma a leginkább érdekes az internetezők számára. A nagy keresőmotorok már nem adják meg az első helyet a SERP-ben, csak azért, mert a webhely egy oldalán többször ismétlődik egy kulcsszó. Csak a leginkább releváns egy adott keresési lekérdezés honlap.

Ennek eléréséhez a kiválasztott kulcsszavakat be kell illeszteni a weboldalak kódjába, ügyelve az ismétlődésük gyakoriságára. A következőképpen járjon el: minden oldalhoz válasszon ki 1-2 kulcsszót, és optimalizálja hozzájuk a megfelelő oldalt.

Képzelje el, hogy új webhelyének vagy termékének bemutatóját készíti elő. Aztán például a diákjait PowerPoint prezentációk– bekezdések. Rövidnek és világosnak kell lenniük. Csakúgy, mint egy PowerPoint-prezentációban, listák segítségével felsorolhatja webhelye vagy terméke előnyeit, minden alkalommal a kiválasztott kulcsszavakra összpontosítva.

Illessze be a kiválasztott kulcsszavakat az egyes weboldalak fenti 5 elemébe, és nagymértékben javítja jelenlegi helyezéseit és eredményeit.

HTML nyelv

A weboldalak bármilyen formátumban létezhetnek, de a szabvány a Hyper Text Markup Language, egy hiperszöveg jelölőnyelv, amelyet arra terveztek, hogy gazdag szöveget hozzon létre képekben, hangokban, animációkban, videoklipekben és hipertext hivatkozásokban, amelyek a weben szétszórtan találhatók más dokumentumokra. ugyanazon a szerveren található, vagy ugyanannak a webprojektnek szerves része.

Tudás nélkül is dolgozhat a weben HTML nyelv, hiszen a HTML szövegek különféle speciális szerkesztőkkel és konverterekkel hozhatók létre. De közvetlenül HTML-ben írni nem nehéz. Még egyszerűbb is lehet, mint megtanulni egy HTML-szerkesztőt vagy konvertert, amelyek képességei gyakran korlátozottak, hibásak, vagy gyenge HTML-kódot állítanak elő, amely nem működik minden platformon.

A HTML nyelvnek többféle változata létezik, és folyamatosan fejlődik, de a HTML konstrukciókat valószínűleg a jövőben is használni fogják. A HTML elsajátításával és mélyebb megértésével, a HTML tanulás kezdetén egy dokumentum létrehozásával és a lehető legszélesebbre terjesztve sokak által megtekinthető weboldalakat tudunk létrehozni. Webböngészők, most és a jövőben is. Ez nem zárja ki más módszerek, például a Netscape Navigator, az Internet Explorer vagy néhány más program által biztosított speciális módszer alkalmazásának lehetőségét.

A HTML-lel való munka egy módja annak, hogy megtanulja a dokumentumok szabványos nyelven történő létrehozásának csínját-bínját, csak akkor használjon bővítményeket, ha valóban szükséges.

A HTML-t a World Wide Web Consortium ratifikálta. Számos széles körben használt böngésző támogatja, és valószínűleg szinte mindennek ez lesz az alapja szoftver, amely a webhez kapcsolódik.

Weboldal készítésének elvei, weblap alapelemei

Weboldalak létrehozásához egy speciális nyelvet, a HTML-t (HyperText Markup Language) használnak. Ez a nyelv speciális, címkéknek nevezett parancsokat határoz meg, amelyek a weboldal egyes elemeinek formázásának vagy céljának meghatározására szolgálnak. A weboldalakon való elhelyezéshez speciális címkéket használnak grafikus képek, hang- és videoklippek és egyéb úgynevezett beágyazott objektumok.

A weblapok hétköznapiak szöveges fájlok ben jött létre szabványos Jegyzettömb vagy egy hasonló egyszerű szövegszerkesztő. És szöveget tartalmaznak, ugyanazt a szöveget, amelyet az oldalakra szeretnél tenni, csak speciális módon megjelölve. Azért, hogy különféle programok Ahhoz, hogy a webböngészők ugyanazt a weboldalt helyesen jelenítsék meg, a HTML-t szabványosítani kell.

A gyakorlatban a HTML szabványt nagymértékben befolyásolja a leghíresebb böngészők, például a Microsoft Internet Explorer és a Google Chrom által javasolt és támogatott címkék jelenléte. Ezek a címkék benne vannak Ebben a pillanatban lehet, hogy része a jelenlegi HTML specifikációnak.

Vannak kifejezetten ehhez tervezett szerkesztőeszközök HTML írás. Időt takarítanak meg, mert kulcsokat tartalmaznak gyors hozzáférés ismétlődő műveletek végrehajtásához, például kezdeti beállítások megadásához dokumentumokhoz, táblázatokhoz vagy egyszerűen stílusok alkalmazásához a szöveghez. A HTML-szerkesztők abban különböznek a WYSIWYG szerzői eszközöktől, hogy ismerni kell a HTML kézi fordításának szabályait; a szerkesztők csak leegyszerűsítik és felgyorsítják ezt a folyamatot. A WWWC-szabványos HTML-címkéken (standard címkéken) kívül a webböngészők számos nem szabványos címkét is támogatnak. Ezeket a címkéket egy adott webböngésző program fejlesztői vezették be, hogy előnyt szerezzenek a versenytársakkal szemben. Remélték, hogy ezek a szabadalmaztatott kiterjesztések később a HTML szabvány részévé válnak, de ezek a remények soha nem váltak valóra. A címkék azonban megmaradnak, és továbbra is támogatottak.

Weboldalak létrehozásához bármilyen böngészőre lesz szüksége - Internet Explorer vagy Google Chrome Mozilla Firefox, vagy még jobb mindkettő, mivel sok HTML elemek eltérően jelennek meg a különböző megtekintési programokban, és nagyon kívánatos ezt a különbséget szabályozni.

Ezen kívül szükség van bármilyen szövegszerkesztőre, például HTML-fájlok előkészítésére, valamint böngészőre az elvégzett műveletek megtekintéséhez és vezérléséhez.

Weboldal létrehozásához az első lépés egy webhelystruktúra létrehozása. A weboldal egy egyedi névvel és állandó címmel rendelkező szerver, amely fizikailag kapcsolódik a WWW-hez, vagy virtuálisan egy másik, nagyobb szerveren található.

A webhelystruktúra létrehozása után futtassa szöveg szerkesztő Szólj, alkoss új dokumentumotés mentse el weblapként, majd folytassa a weblap létrehozásával. Ez megkönnyíti és jobbá teszi a munkánkat. Ebben meghatározzuk a webhely létrehozásának időpontját, hibakeresését, tárgyát, valamint kitöltését.

Számos egyszerű szabály létezik, amelyek lehetővé teszik, hogy a látogató megértse az oldal felületét [10. sz.].

1. Az oldal ne tartalmazzon haszontalan információkat, a betűtípus legyen jól olvasható. A grafikai elemeknek világosnak, kifejezőnek és gyorsan betölthetőnek kellett lenniük.

2. Az emberi szem felülről lefelé szkenneli a webhely oldalait. A legnagyobb figyelem az oldal bal felső részére összpontosul. Ezért a webhely oldalának tetején általában a legtöbb fontos információ: cégnév, logó, weboldal neve stb.

3. Az oldal látogatójának könnyen meg kell találnia az őt érdeklő információkat, és képesnek kell lennie átfogó információkhoz (szöveges leírás és több fénykép).

4. Az információkat csoportok között kell elosztani. Lehetőség van termékkeresésre név és leírás alapján.

5. A webhelynek tartalmaznia kell információs részeket:

a céggel kapcsolatos információkkal (tevékenységi terület, cím, elérhetőségek stb.);

A weboldalak alapvető elemei:

1. Fejléc/embléma (fejléc)

3. Tartalom/Tartalom (szövegmező)

4. Navigációs elemek

5. Információ az oldal fejlesztőiről

Bármely weboldal tartalmaz egy bizonyos készletet szabványos elemek, amelyek minden internetes forrás kötelező összetevői.

A weblap első eleme, amelyet meg kell néznünk, a címe. Az oldal logója vagy neve ugyanazt a szerepet tölti be, mint egy tábla bármely intézmény bejáratánál. Az internet más kérdés: itt a fő mozgási módszer a teleportálás, ezért minden oldalon látni kell ezt a „jelet”.

A dokumentum fő részét az úgynevezett szövegmező foglalja el - az a terület, ahol az oldal szemantikai tartalma található: értelmes információs szöveg és illusztrációk.

A felsorolt ​​elemeket „Tartalomnak” is nevezik (angolul tartalom - Tartalom). A szövegmező elhelyezése elsősorban attól függ, hogy a webdesigner hogyan helyezi el a dokumentum többi elemét.

1. ábra. Példa a webhely tartalmára

A weboldal következő kötelező összetevője a navigációs elemek – hiperhivatkozások, amelyek összekötik ezt a dokumentumot a webhely más részeivel. A navigációs elemek készülhetnek szöveges karakterláncok, grafikus objektumok, azaz gombok vagy aktív összetevők, például Java kisalkalmazások formájában.

A dokumentum alján szokás közzétenni az oldal fejlesztőivel kapcsolatos információkat és egy e-mail címet, amelyre az erőforrás látogatói elküldhetik válaszaikat, javaslataikat, kívánságaikat az oldal tulajdonosainak. (2. ábra)

2. ábra Elérhetőségi adatok

Mielőtt elkezdené webhelye létrehozását, nagyon felelősségteljesen közelítse meg az oldalelemek elrendezésének problémáját. Általában egy weboldalt oldaltartalomra, navigációra és kapcsolódó információkra osztanak fel. Ezek az elemek kisebb elemekre oszlanak.

Ennek eredményeként a webhely fejlesztéséhez szükséges műveletsor a következő egyszerű algoritmushoz vezet:

1. Célok kitűzése és főbb feladatok meghatározása.

2. A jövőbeni tematikus szekciók listájának készítése.

3. Az erőforrás logikai és fizikai szerkezetének kialakítása.

4. Tervvázlat, helyszínrajz, láthatatlan elrendezési táblázat készítése.

5. Szöveges anyagok készítése.

6. Grafikai anyagok készítése vektoros formában.

7. Vektoros rajzok exportálása raszteres formátumba.

8. Az összes kép optimalizálása.

9. Weboldal sablonok készítése.

10. Weboldalak összeállítása és hibakeresési kód.

11. Különböző képernyőfelbontású és színpalettákkal, valamint különböző böngészőkkel rendelkező weboldalak megjelenítési azonosságának ellenőrzése.

Bármely weboldal tartalmaz bizonyos szabványos elemeket, amelyek minden internetes erőforrás kötelező összetevői. Természetesen az ilyen objektumok köre és száma változhat a webhely tematikus fókuszától, a rajta közzétett anyagok mennyiségétől, valamint attól függően, hogy az erőforrás létrehozója milyen célokat és célkitűzéseket tűz ki maga elé. Az ilyen elemek elrendezése, egymáshoz viszonyított helyzetük kialakítása a webmester egyik fő feladata.

A weboldal első eleme, amelyet meg kell néznünk, a címe. Készülhet szöveges vagy grafikus formában is, de mindkét esetben a dokumentum tetején kell elhelyezni. Néha a fejlécet egy menüvel kombinálják a cirill kódolás kiválasztásához és gombokkal az orosz nyelvről az angol verzióra való váltáshoz, ha ez a webes erőforrás két nyelven jelenik meg. Közvetlenül a dokumentum alcíme alatt általában a reklámszalag elhelyezésére szánt hely van. A banner elhelyezése a weboldal tetején a legtöbb esetben előfeltétele egy webhely regisztrációjának a bannercsere szolgáltatásokban - olyan rendszerekben, amelyek az Ön által létrehozott erőforrást hirdetik, cserébe a bannercsere-hálózat más résztvevőinek hirdetéseit megjelenítik az oldalakon. te oldalad. A dokumentum címe alatt közzétett bannerek szabványos mérete általában 468x60 pixel. Ha statikus oldalelrendezést használ, a dokumentum fejlécszélessége körülbelül 640 pixel lesz, elsősorban annak biztosítása érdekében, hogy a dokumentum megfelelően jelenjen meg a 640x480 képpontos monitorokon, és elkerülje a vízszintes görgetősávot, amely megnehezíti a megjelenítést. Nyilvánvaló, hogy ebben az esetben a banner szélessége lényegesen kisebb lesz, mint a fejléc szélessége, ami miatt az oldal azon részén, ahol hirdetési helyet tervez, üres hely jelenik meg, amelyet a a webhelyet birtokló cég logója vagy a webet megvalósító szerverre mutató hivatkozás. Természetesen nem mindig szükséges a logó: általában csak akkor szerepel a weboldalon, ha az oldal kereskedelmi célú.

A dokumentum fő részét az úgynevezett szövegmező foglalja el - az a terület, ahol az oldal szemantikai tartalma található: értelmes információs szöveg és illusztrációk. A felsorolt ​​elemeket „tartalomnak” is nevezik (angol nyelvből tartalom). A szövegmező helye elsősorban attól függ, hogy a webtervező hogyan helyezi el a dokumentum többi elemét.

A weboldal következő kötelező összetevője a navigációs elemek – hiperhivatkozások, amelyek összekötik ezt a dokumentumot a webhely más részeivel. A navigációs elemek készülhetnek szöveges karakterláncok, grafikus objektumok, azaz gombok vagy aktív összetevők, például Java kisalkalmazások formájában. Utóbbiak ugyanazok a gombok, amelyek a „hagyományos” testvéreikkel ellentétben képesek reagálni az egér mozgására, néhány egyszerű műveletet végrehajtva, amikor a kurzort föléjük viszi (a háttérvilágítás bekapcsolása, „kattintás” effektus létrehozása, alakváltás stb.). d.). Ahogy azt a „Webdizájn alapvető „posztulátumai” című részben már említettem, a navigációs elemeket úgy kell elhelyezni, hogy mindig „szemben legyenek”, „kéznél legyenek”, vagyis hogy a felhasználó ne az oldal „visszatekeréséhez” , ha a szövegmező több fizikai képernyőt foglal el magasságban, akkor sokáig keressen más szakaszokra mutató hivatkozásokat. A legelterjedtebb megközelítés a navigációs elemek elhelyezése az oldal bal szélén.

A dokumentum alján szokás közzétenni az oldal fejlesztőivel kapcsolatos információkat és egy e-mail címet, amelyre az erőforrás látogatói elküldhetik válaszaikat, javaslataikat, kívánságaikat az oldal tulajdonosainak. Ha a weboldal a kezdődokumentum, akkor annak aljára egy látogatásszámláló is kerül - egy kis szkript, amely meghív egy, a szerverre telepített CGI szkriptet, amely rögzíti a dokumentum minden megnyitását a felhasználói böngészőben, megváltoztatva a a számlálójelzőt. Ennek köszönhetően a webmester könnyen meg tudja határozni, hány látogató kereste fel az oldalát egy adott időszak alatt. Megjegyzem, hogy a látogatásszámláló csak az oldal elérésekor meghívott első oldalon kerül telepítésre, az erőforrás egyéb dokumentumaiban nincs jelen.

Tehát megvizsgáltuk egy weboldal összes fő összetevőjét és azok egymáshoz viszonyított lehetséges elhelyezkedését. A fent leírt komponensek teljes készletét tartalmazó webhely-elrendezés példája látható az 1. ábrán. 3.6. Kijelöli a dokumentum bal széle mentén elhelyezendő navigációs elemeket.

Rizs. 3.6. Példa egy weboldal elrendezésére a navigációs elemek bal oldali elhelyezésével

A gyakorlatban gyakran találkozunk olyan weboldalakkal, amelyeken a navigációs elemek kialakítása a képernyő jobb széle mentén helyezkedik el. Ebben az esetben a szövegmező balra tolódik el, a dokumentum többi komponense kombinációjuk maximális esztétikája elve alapján kerül elrendezésre. ábra egy ilyen webhely-megvalósításra mutat példát. 3.7.

Rizs. 3.7. Példa egy weboldal elrendezésére a navigációs elemek jobb oldali elhelyezésével

Amint az ábrán látható, ebben az esetben a logó a dokumentum címével egy szintre, a reklámszalag pedig az oldal közepéhez képest kerül elhelyezésre. Ezzel a megközelítéssel ajánlatos a fejléc, a logó és a hirdetési mező grafikai kialakítását egyetlen színben és művészi stílusban megőrizni - akkor ezen objektumok helyzetének aszimmetriája nem lesz olyan nyilvánvaló, és nem "bántja a szemet" ” a szigorú, „táblázatos” tervezési esztétika híveinek.

A navigációs elemek nem csak az oldal jobb és bal széléhez, hanem a dokumentum tetejéhez is elhelyezhetők. Ez az elrendezési lehetőség véleményem szerint a kezdőlapok készítésekor a legalkalmasabb: ebben az esetben az összes oldalobjektum harmonikusan „illeszkedik” a láthatatlan táblázat adott szélességébe, miközben maga a táblázat elkészítése jelentősen leegyszerűsödik. Ennek a megközelítésnek az egyetlen hátránya, hogy a navigációs elemeket a dokumentum alján kell megkettőzni, mivel az oldalon függőlegesen görgetve azok eltűnnek a képernyő felső szegélye mögé, és ahhoz, hogy elérjék őket, a felhasználónak „tekerje vissza” a képernyőt, ami, látja, nagyon kényelmetlen. A felső navigációs elemekkel rendelkező oldal tervezésére egy példa látható az ábrán. 3.8.

Rizs. 3.8. Példa egy weboldal elrendezésére a navigációs elemek felső elhelyezésével

Természetesen mindaz, ami ebben a részben elhangzott, nem csodaszer, hanem cselekvési útmutató. Csak azokat az általános elveket próbálom felvázolni, amelyeket a webhely szerkezetének kialakítása során alkalmaznak, de a végső döntés mindig a webmesteré. Végső soron függetlenül attól, hogy milyen dizájnt használ a jövőbeli projektje alapjául, munkája eredménye továbbra is megfelelő lesz: az interneten nincs sem cenzúra, sem olyan szabályozás, amely ilyen vagy olyan szigorú keretek közé kényszerítené az oldal készítőjét. A fenti kategóriák egyikébe sem esõ tervezési megoldásra példa az úgynevezett vegyes elrendezés, melynek hozzávetõleges diagramja a 2. ábrán látható. 3.9.

Amint az ábrán látható, ebben a példában néhány vezérlőelem közvetlenül az oldal fejlécébe van beépítve - arról beszélünk a webhely orosz és angol verziója közötti váltás gombjairól, valamint a navigációs gombokról: ez lehet egy hivatkozás az erőforrás-készítők e-mail címére, a dokumentum alján duplikálva, és egy hivatkozás az egyik tematikus rovatokat, például egy híroldalt. A navigációs elemek fő blokkja a dokumentum bal széléhez képest helyezkedik el, de a cirill kódolás kiválasztására szolgáló menü közvetlenül az oldal tetején található reklámszalag alatt található. A szövegmező két aszimmetrikus oszlopra van osztva, a jobb oldali pedig az erőforrást alkotó tematikus szakaszok rövid közleményeit tartalmazza, beleértve az ezekre a szakaszokra mutató hivatkozásokat is.

Nyilvánvalóan nagyon sokféle „vegyes elrendezés” lehet egy weboldalhoz: konkrét megoldások függ az erőforrást alkotó szakaszok számától, a webhelyen történő elhelyezésre előkészített szöveg mennyiségétől és végül magának a tervezőnek a képzeletétől. Csak az a fontos kinézet az oldal nem okozott panaszt a látogatók részéről. Végül csak neked, mint fejlesztőnek, neked és senki másnak van joga megmutatni minden képességedet és tehetségedet, és a saját ízlésed szerint rendezni az oldalt. Egyes honlapok készítői kétségek kínzása nélkül helyezik el a találati számlálót a dokumentum jobb felső sarkában, az oldal nevét kis, takaros betűtípussal írják és reklámszalag alatt teszik közzé, és valamilyen oknál fogva navigál elemek váratlanul megjelennek a szövegblokk kellős közepén, az önmagunkról szóló történet és a projekt szerzőjének szeretett kutyájáról készült fényképek között. Az ízlésnek és a színnek nincsenek elvtársak, ahogy mondani szokás. De személy szerint számomra ez a betegség gyógyíthatatlannak tűnik.

Rizs. 3.9. Példa „vegyes” weboldal-elrendezésre