Weblapkészítés dióhéjban

2025. október 4., 14:00 (második óra)

Hogyan épül fel a weblap (és hogy működik a világháló)?

Tűt keresünk a szénakazalban:

Em Griffin: Bevezetés a kommunikációelméletbe ➡️ Szj: IV.15.23 / Általános olvasó IV.
~
Domain név ➡️ IP cím

A tűtől a szénakazalig:

0,1 ➡️ HTML, CSS, PHP ➡️ Weboldal (pl. Honlap) ➡️ Weblap ➡️ Portál ➡️ Internet

HyperText Markup Language

<b>vastag</b>

<p>bekezdés, normál méretű szöveggel</p>

<h1>címsor</h1>

<a href=”https://reformatus.hu/”>reformatus.hu</a>

Cascading Style Sheets

Amit HTML-ben hosszú kóddal kell egyesével formázni...

...azt a CSS leegyszerűsíti.

Webfejlesztés

Webergonómia

Mit várunk el a honlapunktól?

- - funkcionalitás (működjön stabilan minden, amit elvárunk tőle)
  - esztétikum (ez a digitális névjegyünk, keltsen jó benyomást)
  - webergonómia (felhasználói igényekhez igazítás)

Az elégedetlen felhasználó keres egy másik weboldalt.

Jakob Nielsen nyomán

A webergonómia célja a használhatósági tényezők és a látogatók viselkedésének figyelembevételével egy olyan

- - átlátható,
  - könnyen kezelhető,
  - vonzó

honlap kialakítása, ami a felhasználók igényeinek a lehető legnagyobb mértékben megfelel.

A használhatóságot öt minőségi komponens határozza meg:

1. 1. Tanulhatóság: mennyire könnyen sajátítják el a felhasználók az alapvető feladatokat első alkalommal, amikor találkoznak a megtervezett modellel?
  2. Hatékonyság: miután megtanulták a modellt, milyen gyorsan hajtják végre a rájuk váró feladatokat?
  3. Megjegyezhetőség: ha a felhasználók egy ideig nem használják, majd visszatérnek a modellhez, milyen könnyen tudják helyreállítani a jártasságukat?
  4. Hibák: mennyi hibát vétenek a felhasználók, hányfélét, és milyen könnyen tudnak felülkerekedni rajtuk?
  5. Elégedettség: mennyire kellemes a modell használata?

Szempontok weblapunk jobb használhatóságához

Egyszerűség / átláthatóság

megfelelő domain név,

időfaktor,

könnyű áttekintés, nem túlbonyolított, nem fárasztó, de hasznos,

vannak zavaró hirdetések?,

ne legyen túlzsúfolt, 80-20%,

letapogató olvasás,

közcímekkel és kiemeléssel tagolás,

lehetőleg kevés görgetés,

legfontosabb tartalom bal felülre (mobil nézetben középre?)

zavaró intróoldal

Struktúra

felhasználóközpontú!

milyen mély az oldal?

vannak funkcionálisan elkülönülő oldaltípusok?

a nyitólap milyen szerepet tölt be?

ugyanaz az elem ugyanazt a funkciót tölti be következetesen?

Navigáció

fejléc,

menü,

oldalcím,

hierarchikus oldalaknál kenyérmozsamenü,

oldalon belüli horgonyok,

vissza az oldal tetejére gomb,

korábban megnézett termékek listája

megfelel a célnak, struktúrának, kézre áll a felhasználónak?

Kereshetőség

saját kereső,

SEO optimalizálás,

címkék, kategóriák,

részletes keresés,

találati lista sorrendje, relevanciája

Tartalom

webes, hiperlinkes logikával

egyedi és kontextus nélkül is beszédes cím

fordított piramis az egész oldalon és bekezdésenként

1 bekezdés = 1 gondolat

közcímek

felsorolások

egyszerű nyelvezet

Hipertextualitás

milyen linkeket használ?

hogyan ajánlja további tartalmait?

vannak kapcsolódó oldalak?

fejléc, lábléc mindig velünk van?

a szöveget megtöri linkekkel? azok relevánsak, érthetőek?

új ablak vs. azonos ablak

linkek: beágyazott, strukturális, asszociatív, relatív linkelés

oldaltérkép

Multimédia

túl kicsi képek

lassan betöltődők, eszik a mobilnetet

videó elindul automatikusan hanggal?

felirat?

saját vagy stockfotók

minőségi kompozíció és kidolgozás?

Interaktivitás

chat,

kommentelés,

megosztás

üzenetküldő formok,

fórumok,

regisztráció (tényleg kell? kényelmes? gyors? milyen pluszt ad?)

hírlevelek

közösségi média

Tipográfia

könnyen olvasható betű,

erős betű- és háttérszínkontraszt,

ne túl sokféle variációt

oldaltípusokon átívelő stílusok (arculat)

a letisztult grafika hitelességet ad,

olvashatóság (idősek és gyengénlátók)

A KAPITÁLIST és a túl sok háttérszínt kerüljük (csak kiemelni kell, nem térképet rajzolni)

Reszponzivitás

felbontásfüggetlen,

okostelefontól 4K TV-ig,

relatív pozicionálás és méretezés,

felbontástartományok,

arra tervezzünk, ahonnan a legtöbb látogatót várjuk

Google Analytics

böngészőkompatibilitás

Sebesség

milyen gyorsan tölt be az oldal?

van unalmas várakozás?

0,1 s, 1 s, 10 s,

várakoztató animáció,

folyamatanimáció

Miért jönnek vissza a felhasználók?

Minőségi tartalmat kapnak.

Elég gyakran frissül az oldal.

Sebessége jó.

Egyszerűen használható.

Dióhéjban a jó weboldal:

- - hatékony,
  - látogatói elégedettek annak felépítésével és tartalmával,
  - könnyen kezelhető,
  - megragadja a figyelmet,
  - visszatérő látogatókat generál
  - és folyamatosan aktualizált.

Page updated

Google Sites

Report abuse