# HTML Gyakorló Feladat: Blog Mockup Készítése ## Tanulási Célok Alkalmazd HTML tudásodat egy teljes blog kezdőlapjának megtervezésével és kódolásával. Ez a gyakorlati feladat megerősíti a szemantikus HTML koncepciókat, az akadálymentességi legjobb gyakorlatokat, valamint a professzionális kódolási szervezési készségeket, amelyeket webfejlesztési pályafutásod során használni fogsz. **A feladat teljesítésével:** - Gyakorolhatod a weboldal elrendezésének tervezését kódolás előtt - Megfelelően alkalmazhatod a szemantikus HTML elemeket - Akadálymentes, jól strukturált jelölést hozhatsz létre - Fejlesztheted a professzionális kódolási szokásokat kommentekkel és szervezéssel ## Projekt Követelmények ### 1. Rész: Tervezés (Vizuális Mockup) **Készíts egy vizuális mockupot a blog kezdőlapjáról, amely tartalmazza:** - Fejlécet a weboldal címével és navigációval - Fő tartalmi területet legalább 2-3 blogbejegyzés előnézettel - Oldalsávot további információkkal (bemutatkozó rész, legutóbbi bejegyzések, kategóriák) - Láblécet kapcsolati információkkal vagy linkekkel **Mockup Készítési Opciók:** - **Kézzel rajzolt vázlat**: Használj papírt és ceruzát, majd fotózd le vagy szkenneld be a tervet - **Digitális eszközök**: Figma, Adobe XD, Canva, PowerPoint vagy bármely rajzoló alkalmazás - **Wireframe eszközök**: Balsamiq, MockFlow vagy hasonló wireframing szoftverek **Címkézd fel a mockup szekcióit** azokkal a HTML elemekkel, amelyeket használni tervezel (pl. "Fejléc - `

`", "Blogbejegyzések - `

`"). ### 2. Rész: HTML Elemtervezés **Készíts egy listát, amely összekapcsolja a mockup minden szekcióját konkrét HTML elemekkel:** ``` Example: - Site Header →

- Main Navigation →