9
Egyszerűen használható weblapok készítése Ha azt szeretnénk, hogy a látogatók rendszeresen visszatérjenek a webhelyünkre, a webhelynek könnyen használhatónak kell lennie. Ha nehéz rajta megtalálni az információkat, a látogatók nem fognak sokat vacakolni vele. Az egyszerű használathoz jól átlátható navigációs rendszer kell – annyira kézenfekvő és egyértelmű, hogy pillanatok alatt rá lehessen jönni a használatára, ne kelljen hosszú időt tölteni a kibogozásával. Azt, hogy mitől könnyű egy webhelyet használni, sokan tanulmányozták már, köztük olyan szakértők is, mint Jakob Nielsen (www.useit.com), Steve Krug (www.sensible.com) és Keith Instone (www.user-experience.org). Az ő tesztjeik feltárták, hogy vannak olyan alapvető jellemzők, amelyekkel a webhelynek rendelkeznie kell, hogy könnyű legyen böngészni. Minden webhelynek rendelkeznie kell azonosító webhelynévvel, minden weblapon egységes navigációs rendszerrel, és minden weblapnak külön weblapazonosítóval. A nagy kereskedelmi webhelyeket el kell látni az egyes kisebb webhelyrészekhez tartozó navigációs rendszerrel is, valamint olyan kiegészítő szolgáltatásokkal, mint a keresés, a bevásárlókocsi, valamint a számla megtekintésére szolgáló hivatkozások. A nagy webhelyek belső weblapjaihoz létre kell hozni olyan résznavigációs rendszert, amely konkrétan arra a weblapra vonatkozik, amelyet éppen látunk. A kis webhelyeken (50 weblap alatt) keresőre és kiegészítő szolgáltatásokra nem mindig van szükség, de webhelynév-azonosítóra, egységes navigációs rendszerre és weblapnév- azonosítóra igen, pontosan ugyanúgy, mint a nagy webhelyek esetében. A felhasználók navigációval kapcsolatos három jellegzetes kérdése a következő: „Hol vagyok most?”, „Mivel foglalkozik ez a weblap?” és „Hová tudok innen továbblépni?”. Az itt példaként bemutatott webhelyek gondosan megválaszolják mindezeket az alapkérdéseket minden egyes weblapjukon.

Egyszerűen Használható Weblapok Készítése

Embed Size (px)

DESCRIPTION

Webfejlesztész

Citation preview

  • Egyszeren hasznlhat weblapok ksztse

    Ha azt szeretnnk, hogy a ltogatk rendszeresen visszatrjenek a webhelynkre, a

    webhelynek knnyen hasznlhatnak kell lennie. Ha nehz rajta megtallni az informcikat, a

    ltogatk nem fognak sokat vacakolni vele. Az egyszer hasznlathoz jl tlthat navigcis rendszer kell annyira kzenfekv s egyrtelm, hogy pillanatok alatt r lehessen jnni a hasznlatra, ne kelljen hossz idt tlteni a kibogozsval. Azt, hogy mitl knny egy webhelyet hasznlni, sokan tanulmnyoztk mr, kztk olyan

    szakrtk is, mint Jakob Nielsen (www.useit.com), Steve Krug (www.sensible.com) s Keith

    Instone (www.user-experience.org). Az tesztjeik feltrtk, hogy vannak olyan alapvet

    jellemzk, amelyekkel a webhelynek rendelkeznie kell, hogy knny legyen bngszni.

    Minden webhelynek rendelkeznie kell azonost webhelynvvel, minden weblapon egysges

    navigcis rendszerrel, s minden weblapnak kln weblapazonostval. A nagy kereskedelmi webhelyeket el kell ltni az egyes kisebb webhelyrszekhez tartoz navigcis rendszerrel is, valamint olyan kiegszt szolgltatsokkal, mint a keress, a bevsrlkocsi, valamint a szmla megtekintsre szolgl hivatkozsok. A nagy webhelyek bels weblapjaihoz ltre kell hozni olyan rsznavigcis rendszert, amely konkrtan

    arra a weblapra vonatkozik, amelyet ppen ltunk.

    A kis webhelyeken (50 weblap alatt) keresre s kiegszt szolgltatsokra nem mindig van szksg, de webhelynv-azonostra, egysges navigcis rendszerre s weblapnv-azonostra igen, pontosan ugyangy, mint a nagy webhelyek esetben. A felhasznlk navigcival kapcsolatos hrom jellegzetes krdse a kvetkez: Hol vagyok most?, Mivel foglalkozik ez a weblap? s Hov tudok innen tovbblpni?. Az itt pldaknt bemutatott webhelyek gondosan megvlaszoljk mindezeket az alapkrdseket minden egyes

    weblapjukon.

  • A Lands End (http://www.landsend.com/) egy ruhzati ruhz weblapja. A katalgusa meglehetsen nagy, s lehetsg van telefonos rurendelsre is, de nagyon hatkonyan

    hasznljk a Vilghlt is. A honlapjuk jl szemllteti, hogyan kell megfelelen hasznlni a

    webhelynevet, a webhely fbb rszeit, a webhely kisebb rszeit, a kiegszt szolgltatsokat

    s a weblapazonostt.

  • Ha a kezdlapon a Hand Sewn Mocs for Women (Kzzel varrt ni mokaszinok) hivatkozsra kattintunk, akkor egy bels weblapra jutunk. Figyeljk meg, hogy a webhely fbb rszeire mutat hivatkozsok s a webhelynv, valamint a kiegszt szolgltatsokat

    tartalmaz rszek megjelenskben egysgesek a honlapon lvvel. Ez a weblap kiegszl egy

    rszwebhely-navigcis svval, amely a Women (Nk) rszwebhelyre vonatkozik. A

    termkismertet rsz alatt van egy jl lthat mez, amelyben kivlaszthatjuk a cip mrett s

    sznt.

  • Ha a fenti weblapon a fekete sznt s a 8-as mretet vlasztjuk, erre a weblapra jutunk. A Lands

    End webhely bels weblapja a felhasznl minden figyelmt a cip megvsrlsra irnytja. A navigcis lehetsgek szma cskkent. A kiegszt szolgltatsok kizrlag a vsrlshoz kapcsoldnak. A rszwebhely-navigcis elemekkel azokra a weblapokra juthatunk el, ahol a vsrl a

    jtllsrl, a Vilghln t trtn vsrls biztonsgrl s az adatvdelemrl tjkozdhat. A vsrlst vgrehajt gombot is knny szrevenni.

  • Az Abstracts Manager (http://www.abstractsmanager.com) az XHTML s a CSS lapot hasznlja

    a weblap egyrtelm elrendezsre s termkei ismertetsre. Az Abstracts Manager cg

    webhelynek kezdlapjn szembetl a webhely neve, olvashat a webhely cljnak ismertetse (konferencik tartalmi kivonatainak kezelse), s tallhat itt egy knnyen hasznlhat navigcis sv is. A szembetl webhelyismertet javtja a webhely hasznlhatsgt s olvashatsgt.

    Az Abstracts Manager a bels weblapokon is hasznl weblapismertett, amely hasonl a kezdlapon lthat webhelyismertethz, s egyrtelmen lerja, hogy mi az adott weblap clja. A webhely neve a bels weblapokon mr kisebb mretben jelenik meg, mg a navigcis sv ugyanaz marad, mint ami a kezdlapon is lthat.

  • A Serco Transarctic Expedition, azaz a Serco szaki-sarki Expedci webhelyn Ben

    Saundersnek az szaki-sarkvidken t egyedl vgrehajtott strjrl olvashatunk, s

    lthatunk egy csom kpet. (www.sercotransarctic.com) A kezdlap egy listaelemekbl

    kialaktott s ignyesen formzott navigcis rendszert hasznl, s lerja, hogy milyen clt

    szolgl a webhely.

    A bels weblapokon a webhelynv s a f navigcis sv azonos a kezdlapon lthatval. Knny megmondani, melyik weblapon vagyunk, s lthatjuk azt is, milyen lehetsgeink vannak az adott terlet feldertsre.

  • A Sarbox Solutions, Inc. (http://www.sarboxsolutions.com/) olyan cg, amely abban segt az

    embereknek, hogy cgk az Amerikai Egyeslt llamok trvnyeinek megfelelen mkdjn.

    A weblapon begyazott listk segtsgvel alaktottak ki knnyen tlthat navigcis rendszert, amelyben lenyl listkrl vlaszthatunk. A listban lv elemek szma korltozott, s a kezdlap jelents terlett ldoztk arra, hogy elmagyarzzk, mire is szolgl a webhely.

  • Az brn egy begyazott listkkal ltrehozott lenyl lista lthat. A listban szerepl lehetsgek pontosan megfelelnek a f navigcis flekre kattintva megnyl lapokon lv rszwebhely- navigcis svokban tallhat elemeknek.

    Ugyanaz a Sarbox Solutions weblap, de a lenyl lista most nincs megnyitva. Figyeljk meg, hogy a kezdlapon s a bels weblapokon lv navigcis sv azonos, s egyrtelmen jelzi, hogy melyik weblapon vagyunk, s hov tudunk onnan tovbblpni.

    Vannak olyan egyszer szvegformzsi trkkk is, amelyek segtsgvel knnyen hasznlhat navigcis svokat hozhatunk ltre. A World Organization of Webmasters webhelyen lthatunk egy ilyet (http://webprofessionals.org), amelyet begyazott listkbl alaktottak ki. Ezekben a pldkban jl lthat, hogy hol vagyunk, mire szolgl az adott weblap, s hov lphetnk tovbb.

  • A kezdlapon megtallhat az elengedhetetlen webhely- s weblapnv. A f navigcis sv egy

    fentrl lefel fut lista a bal oldali hasbban. Figyeljk meg, hogy mg a tartalmi terleten lv hivatkozsokat az egyrtelmsg rdekben alhztk, a bal oldali oszlopban lv hivatkozslistban nincs szksg alhzsra.

    Az egyik bels, az oktatssal foglalkoz, Education nev weblapon figyeljk meg, hogy az Education sz pirossal jelenik meg a navigcis svban, jelezve, hogy ez az a weblap, amelyet ppen ltunk. Figyeljk meg azt is, hogy a rszwebhelyen belli barangolsra szolgl navigcis sv egy az Education elem al begyazott lista. Ez a rszwebhelyekhez tartoz navigcissv-kialaktsi sma az egsz webhelyen egysges. Ezenkvl figyeljk meg a Sponsored Links cm weblaprszen a sznek s szeglyek kifinomult hasznlatt jobbra, ami segt abban, hogy a felhasznlknak hamarabb feltnjn: ezek a hivatkozsok nem a WOW weblapjait nyitjk meg.

    /ColorImageDict > /JPEG2000ColorACSImageDict > /JPEG2000ColorImageDict > /AntiAliasGrayImages false /CropGrayImages true /GrayImageMinResolution 300 /GrayImageMinResolutionPolicy /OK /DownsampleGrayImages true /GrayImageDownsampleType /Bicubic /GrayImageResolution 300 /GrayImageDepth -1 /GrayImageMinDownsampleDepth 2 /GrayImageDownsampleThreshold 1.50000 /EncodeGrayImages true /GrayImageFilter /DCTEncode /AutoFilterGrayImages true /GrayImageAutoFilterStrategy /JPEG /GrayACSImageDict > /GrayImageDict > /JPEG2000GrayACSImageDict > /JPEG2000GrayImageDict > /AntiAliasMonoImages false /CropMonoImages true /MonoImageMinResolution 1200 /MonoImageMinResolutionPolicy /OK /DownsampleMonoImages true /MonoImageDownsampleType /Bicubic /MonoImageResolution 1200 /MonoImageDepth -1 /MonoImageDownsampleThreshold 1.50000 /EncodeMonoImages true /MonoImageFilter /CCITTFaxEncode /MonoImageDict > /AllowPSXObjects false /CheckCompliance [ /None ] /PDFX1aCheck false /PDFX3Check false /PDFXCompliantPDFOnly false /PDFXNoTrimBoxError true /PDFXTrimBoxToMediaBoxOffset [ 0.00000 0.00000 0.00000 0.00000 ] /PDFXSetBleedBoxToMediaBox true /PDFXBleedBoxToTrimBoxOffset [ 0.00000 0.00000 0.00000 0.00000 ] /PDFXOutputIntentProfile () /PDFXOutputConditionIdentifier () /PDFXOutputCondition () /PDFXRegistryName () /PDFXTrapped /False

    /Description > /Namespace [ (Adobe) (Common) (1.0) ] /OtherNamespaces [ > /FormElements false /GenerateStructure true /IncludeBookmarks false /IncludeHyperlinks false /IncludeInteractive false /IncludeLayers false /IncludeProfiles true /MultimediaHandling /UseObjectSettings /Namespace [ (Adobe) (CreativeSuite) (2.0) ] /PDFXOutputIntentProfileSelector /NA /PreserveEditing true /UntaggedCMYKHandling /LeaveUntagged /UntaggedRGBHandling /LeaveUntagged /UseDocumentBleed false >> ]>> setdistillerparams> setpagedevice