معرفی HTML

HTML (مخفف HyperText Markup Language) زبان استانداردی برای ساخت صفحات وب است. این زبان به مرورگر می‌گوید که هر بخش از صفحه چگونه نمایش داده شود. اگر می‌خواهی یادگیری طراحی وب را شروع کنی، HTML اولین قدم توست! 😊

📌 فهرست مطالب

HTML چیست؟
ساختار کلی یک سند HTML
عناصر اصلی HTML
مرورگرهای وب چطور HTML را نمایش می‌دهند؟
تاریخچه HTML

HTML چیست؟ 💡

HTML زبانی است که برای طراحی صفحات وب استفاده می‌شود. این زبان از المان‌ها (Elements) تشکیل شده که مشخص می‌کنند هر بخش از محتوا چگونه نمایش داده شود.

🔹 مثلاً: وقتی در HTML می‌نویسی <h1>این یک عنوان است</h1>, مرورگر متوجه می‌شود که این متن باید به‌صورت عنوان بزرگ نمایش داده شود.

ساختار کلی یک سند HTML 📄

هر صفحه HTML از چند بخش مهم تشکیل شده است:

🔹 مثال یک سند ساده HTML:

<!DOCTYPE html>
<html>
<head>
    <title>عنوان صفحه</title>
</head>
<body>
    <h1>اولین عنوان من</h1>
    <p>اولین پاراگراف من.</p> <script data-optimized="1" src="https://fahmidani.com/wp-content/litespeed/js/f3c5549225b2854d6475d8d5eeb507f4.js?ver=29020"></script></body>
</html>

✅ توضیح کد:

<!DOCTYPE html> → مشخص می‌کند که این یک سند HTML5 است.
<html> → کل محتوای صفحه در این تگ قرار می‌گیرد.
<head> → شامل اطلاعاتی درباره صفحه مثل عنوان (title) است.
<title> → متنی که در تب مرورگر نمایش داده می‌شود.
<body> → تمام محتوای قابل مشاهده صفحه (مثل متن، تصاویر و لینک‌ها) در این قسمت قرار می‌گیرد.
<h1> → عنوان اصلی صفحه.
<p> → یک پاراگراف متنی.

💡 تمرین:
یک صفحه HTML بساز و درون آن یک عنوان، یک پاراگراف و یک لیست از 3 مورد موردعلاقه‌ات اضافه کن.

عناصر اصلی HTML 🏗️

هر عنصر HTML شامل سه بخش است:

<نام_تگ> محتوای موردنظر </نام_تگ>

🔹 مثال:

<h1>این یک عنوان است</h1>
<p>این یک پاراگراف است</p>

📌 برخی از مهم‌ترین تگ‌های HTML:

تگ	توضیح
<h1> تا <h6>	عنوان‌های مختلف از بزرگ‌ترین تا کوچک‌ترین
<p>	پاراگراف متنی
<a>	لینک به صفحات دیگر
<img>	نمایش تصویر
<ul>	لیست نامرتب (با نقطه)
<ol>	لیست مرتب (با شماره)
<li>	یک مورد در لیست
<br>	ایجاد یک خط جدید

💡 نکته: بعضی از تگ‌ها مثل <br> تگ پایانی ندارند چون فقط یک وظیفه دارند (مثل رفتن به خط بعدی).

📌 تمرین:
یک لیست نامرتب (<ul>) از 5 غذای موردعلاقه‌ات درست کن. 😋

مرورگرهای وب چطور HTML را نمایش می‌دهند؟ 🖥️

مرورگرها (مثل Chrome, Firefox, Edge, Safari) کدهای HTML را دریافت و آن‌ها را به شکلی قابل مشاهده برای کاربران نمایش می‌دهند.

🔹 مثلاً کد زیر:

<h1>سلام دنیا!</h1>
<p>این اولین صفحه HTML من است.</p>

در مرورگر این‌طور دیده می‌شود:

سلام دنیا!
این اولین صفحه HTML من است.

✅ نکته: مرورگرها تگ‌های HTML را نشان نمی‌دهند، بلکه فقط محتوای داخل آن‌ها را نمایش می‌دهند.

تاریخچه HTML 📜

HTML اولین بار توسط تیم برنرز لی (Tim Berners-Lee) در سال 1991 اختراع شد و تاکنون چندین نسخه مختلف داشته است.

سال	نسخه
1991	HTML اولیه توسط Tim Berners-Lee
1995	HTML 2.0 منتشر شد
1997	HTML 3.2 توسط W3C تأیید شد
1999	HTML 4.01 استاندارد شد
2008	اولین نسخه HTML5 منتشر شد
2014	HTML5 به استاندارد رسمی تبدیل شد

🔹 امروزه HTML5 جدیدترین نسخه HTML است که امکاناتی مثل ویدیو، صدا و گرافیک را مستقیماً در مرورگر پشتیبانی می‌کند.

💡 سوال:
چرا به نظر تو HTML5 از نسخه‌های قبلی بهتر است؟ 🤔

نتیجه‌گیری 🎯

HTML پایه و اساس طراحی صفحات وب است. یادگیری آن بسیار ساده است و اگر می‌خواهی طراحی سایت یاد بگیری، HTML اولین قدم مهم توست. 💪🚀

✅ چالش:
یک صفحه HTML طراحی کن که شامل:

یک عنوان (h1)
دو پاراگراف (p)
یک تصویر (<img>)
یک لیست از علاقه‌مندی‌هایت (<ul>)