پویش تِک وب، تکنولوژی، آی تی 
با عرض سلام و خداقوت خدمت کاربران و بازدیدکنندگان گرامی سایت پویش تِک. بنده سید هانی سیدی مدیر و موسس سایت پویش تک هستم. به یاری خداوند سعی دارم در این مقاله به صورت خیلی خوب و کاربردی به آموزش HTML بپردازم. امیدوارم که بتونم به صورت خیلی آسان، ساده و راحت در این دوره HTML رو به شما یاد بدم. به همبن دلیل اسم این دوره رو ( HTML به زبان ساده ) گذاشتم. پس بیش از این شما رو منتظر نمی‌گذارم و از شما دعوت می‌کنم که در این آموزش با من همراه باشید.
HTML چیست ؟
کلمه‌ی HTML مخفف جمله “HyperText Markup Language” یا “زبان نشانه‌گذاری ابرمتنی” هست. به عبارت دیگر HTML یک زبان استاندارد نشانه‌گذاریست که بوسیله‌ی آن می‌تونید صفحات اینترنتی ایجاد کنید. البته ناگفته نمونه که باید حتما در کنار اون یک زبان برنامه نویسی مثل : php یا asp و . . . رو بلد باشید که بشه یک سایت جامع و کاملی ایجاد کرد. در واقع با HTML بدنه‌ی اصلی سایت رو می تونید ایجاد کنید و با CSS به اون رنگ و لعاب می‌دید.
یک توضیح ساده‌تر از HTML !
بزادید اچ تی ام ال رو کمی ساده تر براتون شرح بدم. در یک پروژه‌ی ساختمانی اول نیازه که اسکلت و بدنه‌ی اصلی ساختمان ایجاد بشه و بعد بر روی آن بدنه مصالح و سایر موارد دیگه رو اضافه می‌کنند. می‌شه HTML رو به همون بدنه یا اسکلت اصلی ساختمان تشبیه کرد.
بریم سر اصل مطلب :
یکسری توضیحات کلی در مورد HTML خدمتتون ارائه می‌دم که ذهنتون برای دریافت مطالب بعدی بازتر بشه و بهتر بتونید مطالب رو درک کنید.
دستورالعمل‌های این زبان، برچسب یا به انگلیسی (Tag) نام دارند که محتوای یک صفحهٔ وب، با همین تگ‌ها، نشانه‌گذاری می‌شوند و بوسیله‌ی همین برچسب‌ها نحوهٔ نمایش اون صفحه برای مرورگرهای وب، توصیف می‌شه. این یعنی چی؟ یعنی اینکه ما با قرار دادن تگ‌ها ، تعیین می‌کنیم که شکل نوشته‌ها، سربرگ، جدول‌ها و … به چه صورت باشه و چه ساختاری داشته باشه.
نمونه یک سند HTML ساده :
<!DOCTYPE html> <html> <head> <title>عنوان صفحه</title> </head> <body> <h1>عنوان برجسته</h1> <p>این متن یک پاراگراف است.</p> </body> </html>
- اعلام یا اعلان <!DOCTYPE html> مشخص می‌کنه که این سند طبق آخرین نسخه HTML یعنی (HTML5) هست.
- هر آنچه در یک سند HTML واقع می‌شه رو باید بین دو تک <html></html> قرار داد. مثل نمونه بالا.
- هر چیزی که در تگ <head> قرار بگیره، در مرورگر نمایش داده نمی‌شه. به عبارتی شامل یکسری اطلاعات در مورد سند هست.
- آنچه که می‌خواهیم کاربر اون رو ببیننه ، باید در تگ <body> قرار بدهیم.
- تک <h1> یک عنوان برجسته و بزرگ تعریف می‌کنه.
- تک <p> یک پاراگراف تعریف می‌کنه.
تگ‌های HTML :
تگ‌ها یکسری عناصر هستند که در بین علامت <> ، “کوچگتر بزرگتر” محصور شده اند. تصویر زیر رو ببینید:
- تگ‌ها در HTML معمولا به صورت جفتی قرار می گیرند . مانند : <p> و </p>
- تگ اولی به معنی شروع بوده و تگ دوم هم نشان دهنده پایان آن تگ است.
- تگ پایان دقیقا همنام تگ شروع است با این تفاوت که قبل از تگ پایان یک علامت اسلش ” / ” قرار می گیره.
نکته : توجه داشته باشید که تگ‌های شروع و پایان به عنوان تگ باز و بسته هم نامیده می‌شوند.
ساختار صفحه HTML :
در زیر می‌تونید ساختار کلی یک صفحه HTML رو مشاهده کنید.
توجه : فقط محتوای موجود در قسمت <body> نمایش داده می شود. به عبارت دیگه، بخش سفید در تصویر بالا فقط در مرورگر به نمایش در میاد.
یک توضیح مختصر در مورد <! DOCTYPE> :
- اعلام <! DOCTYPE> نشان دهنده نوع سند هست و به مرورگر کمک می‌کنه تا صفحات وب به درستی نمایش داده شوند.
- توجه داشته باشید که <! DOCTYPE> فقط یک بار باید در بالای صفحه ظاهر بشه (قبل از تگ HTML).
- اعلام <! DOCTYPE> برای HTML5 به صورت زیر باید در سند نوشته بشه :
<!DOCTYPE html>
نسخه های مختلف HTML :
نسخه های مختلفی از HTML تا به امروز وجود داره که می تونید در زیر همه اونها رو مشاهده کنید.
خوب ! امیدوارم تا حدودی، یک چیزهایی در مورد HTML یاد گرفته باشید . دوست دارم این مطلب آموزشی رو با جدیت دنبال کنید تا ان شاءالله بعد از این دوره، به HTML و مفاهیم اون کاملا تسط پیدا کنید.
با ما همراه باشید : آموزش HTML به زبان ساده (درس۲)
رتبه و امتیاز
آراء کاربران
امتیازات ارزشمند شما باعث پیشرفت و بهبود کیفیت مطالب ما خواهد بود. ممنون می‌شویم اگر امیتاز خودتان را با ستاره دادن به این مطلب ثبت کنید.
