msb-public
/
Web-Dev-For-Beginners
mirror of https://github.com/microsoft/Web-Dev-For-Beginners.git
1
0
Code Issues Projects Releases Wiki Activity
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.
Branches Tags
${ item.name }
Create tag ${ searchTerm }
Create branch ${ searchTerm }
from 'f199d71e9c'
${ noResults }
Web-Dev-For-Beginners/translations/ro/3-terrarium/1-intro-to-html/assignment.md

4.3 KiB
Raw Blame History Escape

HTML Practică: Crearea unui Mockup de Blog

Obiectiv

Proiectează și scrie manual structura HTML pentru pagina principală a unui blog personal. Acest exercițiu te va ajuta să exersezi HTML semantic, planificarea layout-ului și organizarea codului.

Instrucțiuni

  1. Proiectează Mockup-ul Blogului

    • Desenează un mockup vizual al paginii principale a blogului tău. Include secțiuni cheie precum antet, navigare, conținut principal, bara laterală și subsol.
    • Poți folosi hârtie și să scanezi schița, sau să utilizezi instrumente digitale (de exemplu, Figma, Adobe XD, Canva sau chiar PowerPoint).

  2. Identifică Elementele HTML

    • Listează elementele HTML pe care intenționezi să le folosești pentru fiecare secțiune (de exemplu, <header>, <nav>, <main>, <article>, <aside>, <footer>, <section>, <h1>–<h6>, <p>, <img>, <ul>, <li>, <a>, etc.).

  3. Scrie Codul HTML

    • Scrie manual codul HTML pentru mockup-ul tău. Concentrează-te pe structura semantică și cele mai bune practici.
    • Include cel puțin 10 elemente HTML distincte.
    • Adaugă comentarii pentru a explica alegerile și structura ta.

  4. Trimite Lucrarea

    • Încarcă schița/mockup-ul și fișierul HTML.
    • Opțional, oferă o scurtă reflecție (2–3 propoziții) despre deciziile tale de design.

Criterii de Evaluare

Criteriu Exemplară Adecvată Necesită Îmbunătățiri
Mockup Vizual Mockup clar, detaliat, cu secțiuni etichetate și layout bine gândit Mockup de bază, cu câteva secțiuni etichetate Mockup minim sau neclar; lipsesc etichetele secțiunilor
Elemente HTML Folosește 10+ elemente HTML semantice; demonstrează înțelegerea structurii și a celor mai bune practici Folosește 5–9 elemente HTML; structură semantica parțială Folosește mai puțin de 5 elemente; lipsă de structură semantică
Calitatea Codului Cod bine organizat, ușor de citit, cu comentarii; respectă standardele HTML Cod în mare parte organizat; puține comentarii Cod dezorganizat; lipsă de comentarii
Reflecție Reflecție profundă asupra alegerilor de design și provocărilor Reflecție de bază Fără reflecție sau lipsă de relevanță

Sfaturi

  • Folosește tag-uri HTML semantice pentru o mai bună accesibilitate și SEO.
  • Organizează codul cu indentare și comentarii.
  • Consultă MDN HTML Elements Reference pentru îndrumare.
  • Gândește-te cum layout-ul tău ar putea fi extins sau stilizat în viitoarele exerciții.

Declinare de responsabilitate:
Acest document a fost tradus folosind serviciul de traducere AI Co-op Translator. Deși ne străduim să asigurăm acuratețea, vă rugăm să fiți conștienți că traducerile automate pot conține erori sau inexactități. Documentul original în limba sa natală ar trebui considerat sursa autoritară. Pentru informații critice, se recomandă traducerea profesională realizată de un specialist. Nu ne asumăm responsabilitatea pentru eventualele neînțelegeri sau interpretări greșite care pot apărea din utilizarea acestei traduceri.