<!--
CO_OP_TRANSLATOR_METADATA:
{
  "original_hash": "5a764667bbe82aa72ac0a67f4c97ff4a",
  "translation_date": "2025-10-03T10:34:38+00:00",
  "source_file": "3-terrarium/1-intro-to-html/assignment.md",
  "language_code": "hu"
}
-->
# HTML Gyakorló Feladat: Blog Mockup Készítése

## Célkitűzés

Tervezd meg és kézzel kódold le egy személyes blog kezdőlapjának HTML szerkezetét. Ez a gyakorlat segít a szemantikus HTML, az elrendezés tervezése és a kód szervezésének gyakorlásában.

## Útmutató

1. **Tervezd meg a Blog Mockupot**
   - Készíts egy vizuális vázlatot a blog kezdőlapjáról. Tartalmazza a főbb szekciókat, mint például fejléc, navigáció, fő tartalom, oldalsáv és lábléc.
   - Használhatsz papírt és beszkennelheted a vázlatot, vagy digitális eszközöket (pl. Figma, Adobe XD, Canva, vagy akár PowerPoint).

2. **Azonosítsd a HTML Elemeket**
   - Sorold fel azokat a HTML elemeket, amelyeket az egyes szekciókhoz használni tervezel (pl. `<header>`, `<nav>`, `<main>`, `<article>`, `<aside>`, `<footer>`, `<section>`, `<h1>`–`<h6>`, `<p>`, `<img>`, `<ul>`, `<li>`, `<a>`, stb.).

3. **Írd meg a HTML Markupot**
   - Kézzel kódold le a mockup HTML-jét. Koncentrálj a szemantikus szerkezetre és a legjobb gyakorlatokra.
   - Használj legalább 10 különböző HTML elemet.
   - Adj hozzá megjegyzéseket, hogy magyarázd a választásaidat és a szerkezetet.

4. **Küldd be a Munkádat**
   - Töltsd fel a vázlatot/mockupot és a HTML fájlt.
   - Opcionálisan írhatsz egy rövid reflexiót (2–3 mondat) a tervezési döntéseidről.

## Értékelési Szempontok

| Kritérium        | Kiemelkedő                                                                                 | Megfelelő                                                                       | Fejlesztésre Szorul                                                            |
|------------------|--------------------------------------------------------------------------------------------|---------------------------------------------------------------------------------|--------------------------------------------------------------------------------|
| Vizuális Mockup  | Tiszta, részletes mockup címkézett szekciókkal és átgondolt elrendezéssel                  | Alapvető mockup néhány címkézett szekcióval                                     | Minimális vagy nem egyértelmű mockup; hiányoznak a szekció címkék               |
| HTML Elemek      | 10+ szemantikus HTML elem használata; szerkezet és legjobb gyakorlatok megértése látható   | 5–9 HTML elem használata; némi szemantikus szerkezet                           | Kevesebb mint 5 elem használata; hiányzik a szemantikus szerkezet              |
| Kód Minőség      | Jól szervezett, olvasható kód megjegyzésekkel; követi a HTML szabványokat                   | Többnyire szervezett kód; kevés megjegyzés                                      | Szétszórt kód; hiányoznak a megjegyzések                                       |
| Reflexió         | Érdemi reflexió a tervezési döntésekről és kihívásokról                                    | Alapvető reflexió                                                              | Nincs reflexió vagy nem releváns                                               |

## Tippek

- Használj szemantikus HTML tageket a jobb hozzáférhetőség és SEO érdekében.
- Szervezd a kódodat behúzásokkal és megjegyzésekkel.
- Nézd meg az [MDN HTML Elemek Referenciát](https://developer.mozilla.org/en-US/docs/Web/HTML/Element) útmutatásért.
- Gondolj arra, hogyan lehetne az elrendezést bővíteni vagy stílusozni a jövőbeli feladatok során.

---

**Felelősség kizárása**:  
Ez a dokumentum az [Co-op Translator](https://github.com/Azure/co-op-translator) AI fordítási szolgáltatás segítségével került lefordításra. Bár törekszünk a pontosságra, kérjük, vegye figyelembe, hogy az automatikus fordítások hibákat vagy pontatlanságokat tartalmazhatnak. Az eredeti dokumentum az eredeti nyelvén tekintendő hiteles forrásnak. Kritikus információk esetén javasolt professzionális emberi fordítást igénybe venni. Nem vállalunk felelősséget semmilyen félreértésért vagy téves értelmezésért, amely a fordítás használatából eredhet.