<!--
CO_OP_TRANSLATOR_METADATA:
{
  "original_hash": "5a764667bbe82aa72ac0a67f4c97ff4a",
  "translation_date": "2025-10-03T09:48:52+00:00",
  "source_file": "3-terrarium/1-intro-to-html/assignment.md",
  "language_code": "el"
}
-->
# Άσκηση Πρακτικής HTML: Δημιουργία Μακέτας Blog

## Στόχος

Σχεδιάστε και γράψτε τον HTML κώδικα για τη δομή μιας αρχικής σελίδας προσωπικού blog. Αυτή η άσκηση θα σας βοηθήσει να εξασκηθείτε στη χρήση της σημασιολογικής HTML, στον σχεδιασμό διάταξης και στην οργάνωση του κώδικα.

## Οδηγίες

1. **Σχεδιάστε τη Μακέτα του Blog σας**
   - Δημιουργήστε ένα οπτικό σχέδιο της αρχικής σελίδας του blog σας. Συμπεριλάβετε βασικές ενότητες όπως κεφαλίδα, πλοήγηση, κύριο περιεχόμενο, πλαϊνή στήλη και υποσέλιδο.
   - Μπορείτε να χρησιμοποιήσετε χαρτί και να σκανάρετε το σχέδιό σας ή να χρησιμοποιήσετε ψηφιακά εργαλεία (π.χ., Figma, Adobe XD, Canva ή ακόμα και PowerPoint).

2. **Καθορίστε τα HTML Στοιχεία**
   - Καταγράψτε τα HTML στοιχεία που σκοπεύετε να χρησιμοποιήσετε για κάθε ενότητα (π.χ., `<header>`, `<nav>`, `<main>`, `<article>`, `<aside>`, `<footer>`, `<section>`, `<h1>`–`<h6>`, `<p>`, `<img>`, `<ul>`, `<li>`, `<a>` κ.λπ.).

3. **Γράψτε τον HTML Κώδικα**
   - Γράψτε τον HTML κώδικα για τη μακέτα σας. Εστιάστε στη σημασιολογική δομή και στις βέλτιστες πρακτικές.
   - Συμπεριλάβετε τουλάχιστον 10 διαφορετικά HTML στοιχεία.
   - Προσθέστε σχόλια για να εξηγήσετε τις επιλογές και τη δομή σας.

4. **Υποβάλετε τη Δουλειά σας**
   - Ανεβάστε το σχέδιο/μακέτα σας και το αρχείο HTML.
   - Προαιρετικά, γράψτε μια σύντομη ανάλυση (2–3 προτάσεις) για τις σχεδιαστικές σας αποφάσεις.

## Κριτήρια Αξιολόγησης

| Κριτήριο         | Εξαιρετικό                                                                                 | Επαρκές                                                                         | Χρειάζεται Βελτίωση                                                             |
|------------------|--------------------------------------------------------------------------------------------|----------------------------------------------------------------------------------|---------------------------------------------------------------------------------|
| Οπτική Μακέτα    | Καθαρή, λεπτομερής μακέτα με ονοματισμένες ενότητες και προσεγμένη διάταξη                  | Βασική μακέτα με ορισμένες ονοματισμένες ενότητες                                | Ελάχιστη ή ασαφής μακέτα· λείπουν οι ονομασίες των ενοτήτων                     |
| HTML Στοιχεία    | Χρήση 10+ σημασιολογικών HTML στοιχείων· δείχνει κατανόηση της δομής και των βέλτιστων πρακτικών | Χρήση 5–9 HTML στοιχείων· κάποια σημασιολογική δομή                              | Χρήση λιγότερων από 5 στοιχείων· έλλειψη σημασιολογικής δομής                   |
| Ποιότητα Κώδικα  | Καλά οργανωμένος, ευανάγνωστος κώδικας με σχόλια· ακολουθεί τα πρότυπα HTML                 | Κυρίως οργανωμένος κώδικας· λίγα σχόλια                                          | Ανοργάνωτος κώδικας· έλλειψη σχολίων                                           |
| Ανάλυση          | Εμπεριστατωμένη ανάλυση για τις σχεδιαστικές επιλογές και τις προκλήσεις                    | Βασική ανάλυση                                                                   | Χωρίς ανάλυση ή έλλειψη συνάφειας                                              |

## Συμβουλές

- Χρησιμοποιήστε σημασιολογικές HTML ετικέτες για καλύτερη προσβασιμότητα και SEO.
- Οργανώστε τον κώδικα σας με εσοχές και σχόλια.
- Ανατρέξτε στο [MDN HTML Elements Reference](https://developer.mozilla.org/en-US/docs/Web/HTML/Element) για καθοδήγηση.
- Σκεφτείτε πώς η διάταξή σας θα μπορούσε να επεκταθεί ή να μορφοποιηθεί σε μελλοντικές ασκήσεις.

---

**Αποποίηση ευθύνης**:  
Αυτό το έγγραφο έχει μεταφραστεί χρησιμοποιώντας την υπηρεσία αυτόματης μετάφρασης [Co-op Translator](https://github.com/Azure/co-op-translator). Παρόλο που καταβάλλουμε προσπάθειες για ακρίβεια, παρακαλούμε να έχετε υπόψη ότι οι αυτόματες μεταφράσεις ενδέχεται να περιέχουν λάθη ή ανακρίβειες. Το πρωτότυπο έγγραφο στη μητρική του γλώσσα θα πρέπει να θεωρείται η αυθεντική πηγή. Για κρίσιμες πληροφορίες, συνιστάται επαγγελματική ανθρώπινη μετάφραση. Δεν φέρουμε ευθύνη για τυχόν παρεξηγήσεις ή εσφαλμένες ερμηνείες που προκύπτουν από τη χρήση αυτής της μετάφρασης.