HTML - اچ تی ام ال چیست؟

هدف مقاله
در این مقاله به صورت کامل و مفصل درباره زبان برنامه نویسی html می‌پردازیم و تمامی نکاتی را که یک برنامه نویس تازه کار برای ورود به دنیای طراحی وب و یادگیری این زبان لازم باشد را به صورت جامع در این مقاله پوشش داده ایم. پس هدف مقاله این است که شما در پایان این مقاله بصورت کامل هر آنچه که باید از زبان برنامه نویسی HTML را باید بدانید یاد خواهید گرفت و میتوانید آگاهانه برای شروع و ورود به این حوزه تصمیم بگیرید. پس با من همراه باشید.

دوره مرتبط با مقاله

دوره جامع آموزش HTML

تاریخچه html ؟

اولین طراح سایت

تیم برنرزلی بنیانگزار شبکه جهانی وب در سال ۱۹۹۰ با طراحی اولین وبسایت به عنوان نخستین طراح وبسایت محسوب می‌شود. در ابتدا صفحات وب با کدهای ساده html ایجاد می‌شدند و نیاز افراد را در آن زمان برآورده می کردند اما به مرور زمان به علت گسترش نیازها و به وجود آمدن تکنولوژی های مختلف در حوزه طراحی وب سایت و برنامه نویسی مبتنی بر وب استفاده تنها از html برای طراحی سایت جوابگوی نیاز کاربران نبود.

جهان گستر چیست؟

وب جهان گستر شبکه‌ای است که نسبت به محتوای اولیه خود در سال‌های آغازین دهه ۱۹۹۰ که به منظور حل یک مشکل خاصی ایجاد شده بود دچار دگرگونی های فراوانی شده است تحقیقات مدرن در سازمان های اروپایی پژوهشهای هسته‌ای در حال تولید حجم انبوهی از داده ها بودند و به دلیل حجم باورنکردنی این اطلاعات در عمل توزیع آنها میان دانشمندان انتخاب شده در قسمت های مختلف دنیا کنترل پذیر نبود در این زمان اینترنت با اتصال چند صد رایانه در حال کار بود بنابراین تیم برنرزلی یکی از اعضای تیم سِرن روشی برای حرکت بین رایانه ها با استفاده از چارچوب ابرمتن ابداع کرد که به نام پروتکل های انتقال ابرمتن یا http شناخته شد همچنین او با ایجاد یک زبان نشانه گذاری به نام html توانست این دو را با هم ترکیب کند ولی به علاوه اولین مرورگر و سرویس دهنده وب را ایجاد کرد و ابزارهایی که امروزه وجود آنها را بدیهی می پنداریم

امروز بدون توجه به ماهیت این ابزارها از آنها استفاده می‌کنیم در حالی که بیش از تولید آنها هرج و مرج اطلاعات بسیار زیاد بود تا آن زمان مدرن‌ترین نوع ارتباطی اتصال کاربران خانگی به صورت دیال آپ به منابع خبری بود که روی یک رایانه میزبانی می شد و تمام نقل و انتقال‌های تنها با کاربران آن نوع سرویس ها سرویس خواب صورت می‌گرفت به همین اساس برقراری ارتباط با دوستان و همکاران نیازمند عضویت در چندین منبع خبری بود اما ناگهان برنزلی تمام این ساختارها را تغییر داد و در اواسط دهه ۱۹۹۰ سه مرورگر وب گرافیکی برای جلب توجه ۵ میلیون کاربر با یکدیگر دست به رقابت زدند یکی از اندک مدتی نیاز پس از اندک مدتی به برخی از توانایی های نظیر صفحات ابرمتن گرافیک و متنی که کاربران را به صفحه‌های دیگر هدایت می‌کرد به وضوح احساس می‌شد اما دنیای رایانه و اینترنت از پتانسیل کافی به منظور توجه به نیاز کاربران و تغییر محتوا به صورت پویا برخوردار نبود در آن زمان استفاده از وب با وجود پیشرفت های امروزی در زمینه متن و تصاویر و انیمیشن بسیار بیرون و ساده بود خرید اینترنتی خرید های اینترنتی موتورهای جستجو و شبکه‌های اجتماعی نحوه استفاده ما از را تغییر دادند.

HTML | اچ تی ام ال چیست؟

زبان html مخفف کلمه Hyper Text Markup Language به معنای زبان ابر متنی است که در واقع یک نوع زبان نشانه گذاری است که اولین قدم برای ورود به دنیای طراحی وب، یادگیری این زبان است. یعنی اگر کسی قصد ورود به دنیای برنامه نویسی وب را داشته باشد بدون هیچ شکی ابتدا و در قدم اول باید این زبان برنامه نویسی را یاد بگید.
در واقع اگر بخواهم واضح بیان کنم که دقیقا کاربرد html در طراحی وب سایت چه چیزی است با یک مثال این موضوع را توضیح خواهم داد به این صورت بیان میکنم که دقیقا html حکم استخوان را در آناتومی بدن یک انسان دارد همان گونه که برای ایجاد و فرم دهی آناتومی بدن انسان استخوان و اسکلت بندی نقش بسیار زیادی را دارد به همان اندازه نیز برای طراحی یک وب سایت ابتدا باید آن وب سایت قالب خوبی داشته باشد. بدون قالب هیچ وب سایتی را نمیتوان پیاده سازی کرد، و در واقع برای ساخت یک قالب ابتدا باید با استفاده از زبان نشانه گذاری html چهارچوب و اسکلت وب سایت خود را پیاده سازی کنیم و در مرحله بعد با استفاده از CSS و JavaScript و همینطور فریمورک های مربوط به این دو زبان قالب html خود را طراحی و عملیات زیبا سازی را بر روی آن انجام دهیم. پس تا الان فهمیدیم که زبان نشانه گذاری شده html در واقعیت چه کاربردی دارد.

زبان های نشانه گذاری شده؟

همان طور که گفته شد زبان html یک زبان نشانه گذاری شده است و زبان های نشانه گذاری شده با زبان های برنامه نویسی تفاوت دارند. اگر ساده بخواهم بگویم زبان های برنامه نویسی از یک سری مقدماتی برخوردار هستند که زبان html فاقد این مقدمات است مقدماتی همچون استفاده از توابع، دستورات شرطی، حلقه ها، آرایه ها و...که html فاقد همه این موارد است پس نمیتوان آن را یک زبان برنامه نویسی دانست. حال به تعریف زبان های نشانه گذاری میپردازیم. در واقع زبان های برنامه نویسی به زبان هایی گفته میشوند که با استفاده از یک سری دستورات باعث میشوند که اطلاعاتی که از سمت سرور بر روی آن ها قرار میگیرند. و زبان برنامه نویسی html با استفاده از یک سری قواعد و قوانینی که به آن ها تگ میگویند این اطلاعات را با ظاهر و قالبی بهتر به کاربران نشان میدهد.

تگ ها در html؟

تگ ها یک سری قواعدی هستند که تقریبا تعداد آن ها کم هم نیست و برنامه نویسان و طراحان قالب با استفاده از این تگ ها صفحه و قالب خود را به وجود می‌آورند و در اصل این تگ ها هستند که لایه بندی سایت ما را انجام میدهند و هر چه برنامه نویس در استفاده از این تگ ها از تجربه و مهارت بالاتری برخوردار باشد قالب نهایی با کیفیت تر خواهد بود.
تگ ها در واقع یک سری دستورات هستند که در بین  کاراکتر های <> قرار میگیرند و با کاراکتر <> این تگ ها آغاز میشوند و </> نیز پایان دهنده این تگ به حساب می‌آیند اگر بخواهیم مثالی از تگ ها را بیان کنیم به به کد زیر توجه کنید.

<tagname>
your code    
</tagname>

همان طور که میبینید برای استفاده کردن از تگ ها باید همواره از کاراکترهای <> استفاده نماییم. و لایه بندی و اسکلت بندی سایت خود را با استفاده از این تگ ها پیاده سازی کنیم.

شروع کدنویسی html ؟

اگر قصد شروع برنامه نویسی html را دارید میتوانید در قسمت دوره های آموزشی دوره مربوط به آموزش جامع html را انتخاب کنید و استارت یادگیری برنامه نویسی خود را بزنید. همواره برای کدنویسی html شما باید این کدها را در قالب یک فایل با فرمت html. پیاده سازی کنید که میتوانید در ویرایشگرهای متن مختلف  دستورات html خود را وارد نمایید و آن را اجرا کنید، ویرایشگرهایی از جمله phpstorm , vscode , webstorm , notpad و... میتوانید دستورات خود را پیاده سازی کنید اما پیشنهاد من برای پیاده سازی کدها استفاده کردن از ویرایشگرهای قدرتمند، همچون phpstorm و vscode است. برای شروع کد نویسی html باید ابتدا یک سری دستورات را در سند html خود وارد کنید و در جایگاه خاصی از این کدها دستورات و تگ های مربوط به خود را پیاده سازی کنید که در قسمت پایین به صورت کامل این قسمت را توضیح دادیم.

<!doctype html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>title</title>
</head>
<body>

<tagname>   

your html code         

</tagname>   

</body>
</html>

html یا html5 ؟

همان گونه که میدانید تمامی زبان های برنامه نویسی و تکنولوژی های روز دنیا با گذشت زمان، خود را متناسب با نیاز های بشر بروز میکنند و مدام در حال پیشرفت هستند این موضوع برای زبان html نیز صدق میکند در ابتدا با معرفی نسخه ابتدایی html یک سری کاستی هایی در این زبان مشاهده شد و به مرور توسعه دهندگان این زبان نسخه هایی جدید برای این زبان منتشر کردند تا این زبان تقریبا بلوغ خود را طی کرد و در نهایت html نسخه 4 وارد بازار شد و تا مدتی برنامه نویسان و طراحان وب سایت کدهای خود را در بستر html4 پیاده سازی میکردند تا این که دنیای وب تصمیم به پیشرفت و معرفی web2.0 کرد در اینجا بود که html نیز باید خود را متناسب با این جهش بزرگ بروز میکرد و در نهایت بعد از گذشت 9 سال زبان html توسط دو شرکت بزرگ موزیلا و اپرا که هم اکنون دو مرورگر بزرگ هستند این زبان را بروزرسانی و با نام html5 منتشر کردند.
اما در این جا یک سوال پیش می‌آید و آن این است که html4 چه نواقصی داشت که برنامه نویسان نصمیم به بروزرسانی آن گرفتند. پاید پاسخ داد که زبان html نسخه 4 خیلی از قابلیت هایی همچون استفاده از apiها و همینطور برای استفاده کردن از ویدئو ها و صدا ها باید از افزونه های جانبی همچون flash استفاده نمود اما با بروزرسانی این زبان تمامی این مشکلات حل شد و بار دیگر زبان html بلوغ خود را پشت سر گذاشت.

با وجود تمام خاصیت هایی که به html نسخه ۴ اضافه شده بود همچنان نیازهای توسعه دهندگان بلندپرواز رفع نشده بود برای مثال هنوز روشهای ساده‌ای برای دستکاری گرافیک ها در یک مرورگر وب بدون استفاده از افزونه هایی نظیر فلش وجود ندارد و علاوه بر این ناسازگاری های مختلف در طی تکامل html برای آن به وجود آمد. بنابراین برای روشن تر شدن این موارد و ارتقا دادن اینترنت به آن سوی web 2.0 و به نسخه جدید آن استاندارد جدیدی برای html ایجاد شده است تا تمام این نقص ها را رفع کند نام استاندارد جدیدhtml5 است و توسعه آن از سال 2۰۰۴ هنگامی که اول پیش نویس و آن توسط بنیان‌گذاران موزیلا و اپراتور ارائه شد آغاز گشت اما تا اوایل سال ۲۰۱۳ که پیش‌نویس نهایی آن برای کنسرسیوم وب جهان گستر ارسال شد مرجع بین المللی برای استانداردهای وب نهایی نشد. از آنجا که توسعه html5 نُه سال طول کشید ممکن است تصور کنید که html۵ به تکامل خود رسیده است اما در اینترنت اینطور نیست. وب سایت ها با سرعت زیادی درآمد و رفت هستند اما نرم افزارهایی پایه به کندی و قدرت و دقت توسعه پیدا می‌کند بنابراین تنها پس از انتشار این نسخه که می‌توان انتظار یک توسعه پایدار را داشته اما تصور نکنید که کار به پایان است بلکه در اوایل سال ۲۰۱۵ ارتقای آن به نسخه ۵.۱ و بالاتر ادامه داشت و در واقع این چرخه توسعه هیچگاه پایان نمیابد هرچند در حالی که برنامه‌ریزی شده است که در html۵ پیشرفت‌های حاصل شود در حال حاضر نسخه html۵ به عنوان استاندارد جدیدی برای توسعه دهندگان به محسوب می شود و نیاز دارند با آن کار کنند و برای چندین سال به قوت خود باقی می‌ماند.

html سخت یا آسان؟

حال که با مقدماتی از زبان html آشنا شدیم نوبت به این میرسد که این زبان بسیار جذاب را یاد بگیریم. یکی از مشکلاتی که اکثر برنامه نویسان تازه کار با آن مواجه هستند این است که قصد دارند وارد حوزه ای شوند که هم آسان باشند و هم بتوانند با آن پول خوبی در بیارند باید به این افراد این را بگوییم که اگر قصد ورود به حوزه برنامه نویسی را دارید باید سختی های این راه را نیز پشت سر بگذارید این حوزه علاوه بر پول سازی ها و درآمد نسبتا بالایی که دارد خالی از چالش هم نیست و باید برای تبدیل شدن به یک برنامه نویس خوب با این چالش ها دست و پنجه نرم کنید و و این اتفاق نمی‌افتد مگر این که شما به این حوزه علاقهمند باشید و صبر و پشتکار بالایی داشته باشید.

خبر خوش

باید این را بگویم که برای برداشتن اولین قدم در طراحی سایت شما کار آن چنان سختی ندارید و زبان html از دسته زبان های نسبتا ساده ای است که میتوان با تلاش آن را در کمترین زمان ممکن یادگرفت پس اگر در همین ابتدا و برداشتن اولین قدم کار خود را در جهت یادگیری این زبان به درستی انجام دهید برای باقی مسیر به مشکل زیادی بر نمیخورید پس در ابتدا باید یک منبع خوب برای آموزش این زبان به صورت پروژه محور و جامع پیدا کنید و یادگیری خود را آغاز نمایید.

مزایای استفاده از HTML

html در موارد بسیار زیادی کاربرد دارد از جمله پیاده سازی قالب های وب سایت , پیاده سازی قالب های نرم افزار های دسکتاپ و همینطور پیاده سازی نرم افزار ها در بستر موبایل بسیار کاربرد دارد و با این که زبان نسبتا ساده ای است ولی در عین حال بسیار زبان مهمی است و حتما باید طراحان وب سایت رزومه خود را با تسلط بر این زبان بالاتر ببرند.
هشدار : بعضی از برامه نویسان با این دید طراحی وب سایت را آغاز میکنند که قرار است کار بک اند یک وب سایت را انجام دهند و منطقا کسی که کار برنامه نویسی سمت سرور (بک اند ) را انجام میدهد زیاد با کدهای مربوط به طراحی قالب سروکار ندارد اما این دیدگاه کاملا اشتباه است برنامه نویسانی که به صورت گروهی پروژه های خود را پیش میبرند شامل دو گروه هستند گروه اول افرادی که کار طراحی قالب را پیاده سازی میکنند که به آن ها فرانت اند کار گویند و افرادی که کار سمت سرور را انجام میدهند که به آن ها بک اند کار گویند. در واقع افرادی که بک اند کار میکنند تا حدودی باید با زبان های طراحی قالب آشنا باشند تا بتوانند هنگام ارسال اطلاعات به قالب به درستی این کدها را متناسب با نیاز کنترل کنند. پس این دیدگاه درستی نیست که برنامه نویسان بک اند احتیاجی به یادگیری HTML ندارند.

بهترین منابع آموزش html

بهترین منابع برای یادگیری یک زبان یا یک تکنولوژی در حوزه برنامه نویسی مراجعه کردن به مرجع اصلی و وب سایت مربوط به همان تکنولوژی است اما این کار به نسبت کمی دشوار است ما در آرتور تمامی دوره ها را متناسب با سایت های مرجع و منابع اصلی آموزش دادیم و تمامی دوره به صورت کامل و پروژه محور است به گونه ای که بعد از پشت سر گذاشتن دوره ها احتیاجی به هیچ گونه دوره مکملی برای یادگیری زبان مربوطه نداشته باشید.

بازار کار html

بطور صریح باید بگویم که html تنها اولین قدم برای ورود به بازار طراحی وب هست و html به تنهایی در بازار کار امروزه نمیشود از آن کسب درآمدی کرد پس اگر میخواهید از طریق بطراحی سایت به درآمد برسید باید حداقل های این حوزه را یاد بگیرید که html تنها یکی از این حداقل هاست و برای پیشرفت در این حوزه شما باید گستره دانش خود را در این حوزه بسیار بالاتر ببرید و از زبان هایی همجون css و جاوااسکریپت و فریمورک ها و تکنولوژی هایی که هر روزه به تعداد این ها اضافه میشود خود را مجهز کنید و بعد از طی کردن این مسیر، درآمد از این راه به راحتی برای برنامه نویسان و طراحان بدست خواهد آمد. اما با دانستن تنها زبان html باید بگویم درآمدی نخواهید داشت.

نتیجه گیری 

در این مقاله سعی شد تمامی نکات مربوط به زبان html را از جمله تاریخچه این زبان و راه های ورود به این حوزه و شروع این زبان جذاب و همینطور راه های پیشرفت در این زبان و بررسی بازار کار و فهرست های شغلی مربوط به این حوزه و این زبان را بررسی کردیم و مهم تر از همه به معرفی منابع خوب و رایگان برای آموزش این زبان پرداختیم و همانطور که در ابتدای مقاله گفته شد هم اکنون باید بتوانید آگاهانه مسیر خود را در این حوزه انتخاب کنید و با منطق و آگاهی بیشتر ادامه مسیر را طی نمایید.

منبع : وب سایت آرتور