آموزش HTML | قسمت اول + ویدئو
- تاریخ انتشار: 1403/03/24
آموزش HTML قسمت اول
سلام! خوش آمدید به دوره آموزشی HTML دیویژکد.
در این دوره، ما قصد داریم شما را با مبانی HTML آشنا کنیم و قدم به قدم به سمت ساخت صفحات وب حرفه‌ای هدایت کنیم. در این قسمت اول، به بررسی مفاهیم ابتدایی HTML و کاربردهای آن خواهیم پرداخت.
HTML که مخفف "HyperText Markup Language" است، زبان اصلی برای ساختاردهی و نمایش محتوا در وب است. این زبان نشانه‌گذاری به مرورگرهای وب می‌گوید که چگونه محتوا را نمایش دهند. در واقع، HTML ستون فقرات هر صفحه وب است.
تاریخچه HTML
HTML در اوایل دهه 1990 توسط تیم برنرز-لی، که از پیشگامان وب بود، ایجاد شد. هدف اصلی او ایجاد روشی ساده برای به اشتراک‌گذاری اسناد علمی بین محققان بود. اما به مرور زمان، HTML تکامل یافت و به ابزاری قدرتمند برای ساخت طراحی سایت ، طراحی سایت با وردپرس ، طراحی سایت با لاراول و طراحی سایت با فریمورک یا زبان های دیگ تبدیل شد.
عناصر HTML
HTML از عناصر یا تگ‌ها تشکیل شده است. هر تگ با یک علامت کمتر از (<) شروع و با یک علامت بیشتر از (>) پایان می‌یابد. تگ‌ها معمولاً به صورت جفت هستند: یک تگ آغازین و یک تگ پایانی. به عنوان مثال: <p>این یک پاراگراف است.</p>
در این مثال، تگ <p> برای آغاز پاراگراف و </p> برای پایان آن استفاده شده است.
ساختار پایه یک سند / فایل HTML
یک سند HTML با تگ <!DOCTYPE html> آغاز می‌شود که نوع سند را مشخص می‌کند.
سپس تگ‌های <html>, <head> و <body> می‌آیند:
<!DOCTYPE html> <html> <head> <title>عنوان صفحه</title> </head> <body> <h1>سلام، دنیا!</h1> <p>این یک نمونه پاراگراف است.</p> </body> </html>
تگ <html>: کل محتوای HTML را در بر می‌گیرد.
- تگ
<head>: شامل اطلاعاتی درباره سند مانند عنوان (که با تگ<title>مشخص می‌شود) و متا دیتا است. - تگ
<body>: شامل محتوای قابل نمایش صفحه وب مانند متن، تصاویر و لینک‌ها است.
تگ‌های رایج در HTML
در HTML، تگ‌های زیادی وجود دارند که هر کدام وظیفه خاصی دارند. برخی از تگ‌های رایج عبارتند از:
<h1>تا<h6>: برای عناوین و تیترها استفاده می‌شوند.<p>: برای پاراگراف‌ها.<a>: برای لینک‌ها.<img>: برای تصاویر.<ul>,<ol>,<li>: برای لیست‌ها.
شروع کار با HTML
برای شروع به کار با HTML، شما تنها به یک ویرایشگر متن ساده و یک مرورگر وب نیاز دارید. بسیاری از ویرایشگرهای متن رایگان و حرفه‌ای وجود دارند که کار شما را آسان‌تر می‌کنند، مانند Visual Studio Code، Sublime Text و
Notepad++. بعد از نصب و انتخاب یک ویرایشگر، کافی است یک فایل جدید با پسوند .html ایجاد کنید و کدهای خود را در آن بنویسید. سپس می‌توانید فایل را در مرورگر خود باز کنید تا نتیجه را مشاهده کنید.
اولین صفحه HTML خود را بسازید
برای اینکه بتوانید اولین صفحه HTML خود را بسازید، مراحل زیر را دنبال کنید:
- یک فایل جدید ایجاد کنید:
- در ویرایشگر متن خود، یک فایل جدید باز کنید.
- فایل را با نام
index.htmlذخیره کنید.
کد HTML پایه را وارد کنید:
<!DOCTYPE html> <html> <head> <title>صفحه اول من</title> </head> <body> <h1>سلام، دنیا!</h1> <p>این اولین صفحه HTML من است.</p> </body> </html>- فایل را در مرورگر باز کنید:
- فایل
index.htmlرا در مرورگر وب خود باز کنید. - شما باید صفحه‌ای را ببینید که شامل یک عنوان و یک پاراگراف است.
- فایل
نتیجه‌گیری
این اولین قدم شما در دنیای HTML بود. همانطور که مشاهده کردید، HTML بسیار ساده است و با کمی تمرین می‌توانید صفحات وب زیبایی ایجاد کنید. در قسمت‌های بعدی این دوره آموزشی، به بررسی تگ‌های پیشرفته‌تر، CSS برای استایل‌دهی به صفحات و JavaScript برای افزودن تعامل به وب‌سایت‌ها خواهیم پرداخت. با ما همراه باشید و مهارت‌های خود را در طراحی وب به سطح بالاتری برسانید.
تا جلسه بعدی، تمرین کنید و صفحات ساده‌ای با استفاده از تگ‌های پایه HTML بسازید. موفق باشید!
بخش نظرات