🌐

Ce este HTML?

Dupa aceasta lectie, vei intelege ce este HTML, cum functioneaza tag-urile si vei crea prima ta pagina web!

🎯 INCEARCA

Fara instructiuni - vezi cat poti singur!

Provocarea ta (5 minute):

1. Deschide Notepad (sau orice editor de text)

2. Scrie urmatorul cod exact:

<html>
  <body>
    <h1>Salut!</h1>
  </body>
</html>
                        

3. Salveaza fisierul ca prima-pagina.html

4. Deschide fisierul in browser (dublu-click)

💡 Nu stii cum sa salvezi ca .html? Click aici

In Notepad: File > Save As

La "Save as type" alege "All Files (*.*)"

Scrie numele cu extensia: prima-pagina.html

📚 INVATA

Ce este HTML si cum functioneaza?

HTML (HyperText Markup Language)

HTML este limbajul folosit pentru a crea structura paginilor web. Nu este un limbaj de programare - este un limbaj de marcare (markup).

Analogie: Daca o pagina web ar fi o casa, HTML ar fi scheletul (structura din beton si caramizi). CSS ar fi vopseaua si decoratiunile, iar JavaScript ar fi instalatia electrica si sistemele.

Tag-uri HTML

HTML foloseste tag-uri pentru a marca continutul. Un tag arata asa:

<numetag>continut</numetag>

<tag> = tag de deschidere
</tag> = tag de inchidere (cu /)
Textul dintre ele = continutul

Structura de baza a unei pagini HTML:

🛠 Anatomia unei pagini HTML

<html> - Radacina documentului

<head> - Informatii despre pagina (invizibile)

<title> - Titlul din tab-ul browserului

<body> - Continutul vizibil al paginii

<h1>, <p>, etc. - Elementele paginii

Exemplu complet

<!DOCTYPE html>
<html lang="ro">
<head>
    <meta charset="UTF-8">
    <title>Prima mea pagina</title>
</head>
<body>
    <h1>Bine ai venit!</h1>
    <p>Aceasta este prima mea pagina web.</p>
</body>
</html>
                

💡 Ce face fiecare element?

<!DOCTYPE html> - Spune browserului ca e HTML5
<html lang="ro"> - Radacina, limba romana
<meta charset="UTF-8"> - Permite caractere romanesti (a, i, s, t)
<title> - Textul din tab-ul browserului
<h1> - Titlu principal (heading 1)
<p> - Paragraf de text

⚠ Greseli frecvente

Uiti sa inchizi tag-ul: <h1>Text ❌ vs <h1>Text</h1> ✅

Inversi ordinea: <b><i>text</b></i> ❌ vs <b><i>text</i></b> ✅

Extensia gresita: Salvezi ca .txt in loc de .html

✅ VERIFICA

Hai sa vedem ce ai retinut!

1. Ce inseamna HTML?

High Tech Modern Language

HyperText Markup Language

Home Tool Markup Language

2. Care tag contine continutul vizibil al paginii?

<head>

<body>

<title>

3. Cum arata corect un tag de inchidere?

<tag>

</tag>

<tag/>

4. Ce extensie trebuie sa aiba un fisier HTML?

.txt

.html

.doc

🎉

Felicitari!

Ai terminat Lectia 1: Introducere in HTML

+50 XP

Acum stii ce este HTML si cum sa creezi o pagina web simpla!

Continua la Lectia 2 →