HTML‌ چیست

HTML چیست

فهرست

HTML چیست؟ این شاید اولین سؤال برای افرادی باشد که به‌تازگی می‌خواهند مسیرشان را برای ورود به دنیای وب و طراحی وب سایت و اپلیکیشن باز کنند. در یک تعریف خیلی ساده، HTML یا زبان نشانه‌گذاری ابرمتن، به زبانی گفته می‌شود که با استفاده از آن می‌توانید ساختار و اسکلت وب سایت خودتان را پیاده کنید. در این مطلب از وب سایت آژانس بازاریابی اسمارتیز می‌خواهیم در موردِ همین مسئله با شما صحبت کرده و نکاتی را ارائه کنیم که با استفاده از آنها به این نتیجه می‌رسیم که زبان برنامه نویسی HTML چیست؛ تا پایان این مطلب را دنبال کنید. 

مقدمه‌ای برای پاسخ به سؤال HTML چیست

قبل از اینکه بخواهیم به سراغِ اصل مطلب برویم و ببینیم که HTML چیست و اصلاً چه کاربردی دارد، بهتر است کمی بیشتر در مورد این زبان، اطلاعات کسب کنیم. اولین چیزی هم که باید به آن توجه کنیم این است که HTML، مخفف عبارت Hyper Text Markup Language است که معنیِ لغویِ آن «زبان نشانه‌گذاری ابَرمتن» است که کارکرد آن در ایجاد صفحات وب است.

در واقع اگر بخواهیم بگوییم که کار HTML چیست، باید به این نکته اشاره کنیم که HTML قرار است ایجاد صفحات، بخش‌ها، پاراگراف‌ها و همچنین لینک‌های مختلف که در ساختار صفحات وب وجود دارند را امکان‌پذیر کند. HTML این کار را با استفاده از عناصری که در این زبان نشانه‌گذاری طراحی شده است (مثلِ تگ‌ها و اتریبیوت‌ها) انجام دهد. 

همچنین اگر بخواهیم به این نتیجه برسیم که کاربرد زبان HTML چیست، می‌توانیم کارکرد این زبان نشانه‌گذاری را خیلی خلاصه، در موارد زیر جستجو کنیم:

۱- اولین کارکرد HTML را می‌توان طراحی و توسعه‌ی وب دانست. توسعه دهندگان با استفاده از کُدهای HTML تعیین می‌کنند که عناصر مختلف موردنیاز در صفحات مختلف وب، به چه صورت باید قرار گیرند. به‌عنوان مثال متن‌ها باید با چه ترتیبی در وب سایت قرار بگیرند، عکس‌ها کجای صفحه قرار بگیرند و همچنین فایل‌هایی مثلِ ویدیوها یا صوت، کجا و چطور باید در صفحه‌ی وب سایت دیده شوند.

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

۳- کارکرد مهم دیگر HTML، سئوی وب سایت است. خزنده‌های گوگل که قرار است بین صفحات مختلف وب سایت شما بچرخند، محتواهای آن را شناسایی و صفحات را دسته‌بندی کنند و در نهایت به شما بر اساسِ فاکتورهای مختلف رتبه بدهند، عمده‌ی کار خودشان را با خواندنِ فایل HTML صفحات وب سایتتان انجام می‌دهند.

البته باید این نکته را هم بدانید که HTML هیچ وقت یک زبان برنامه‌نویسی نبوده و اساساً کارکرد آن هم طوری نیست که از آن انتظار یک زبان جداگانه را داشته باشیم. سؤالی که در اینجا مطرح می‌شود، ممکن است این باشد که دلیل قرار نگرفتن در جمع زبان‌های برنامه نویسیِ HTML چیست؟ دلیلش این است که HTML یک زبان پویا نیست؛ و باز هم به‌صورت خیلی ساده و خلاصه، شما نمی‌توانید یک شرط که اساسِ یک زبان برنامه‌نویسی است را در HTML قرار دهید. 

تنها یک کلیک با یک سایت حرفه‌ای فاصله دارید

تحول کسب‌وکار خود را با طراحی وب‌سایتی شگفت‌انگیز آغاز کنید. همین امروز اولین قدم را بردارید!

نحوه کارکرد HTML چیست

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

نحوه کارکرد HTML چیست

اما نکته‌ی مهم بعدی این است که بدانیم هر وب سایت از صفحات مختلفی تشکیل شده است که هر کدام از آنها هم حتماً یک فایل HTML دارند. به‌عنوان مثال، صفحه‌ی اصلی سایت، صفحه‌ی تماس با ما و هر صفحه‌ی دیگری که در یک وب سایت وجود دارد، حتماً یک فایل HTML هم دارد.

نکته‌ی مهم بعدی این است که پسوندِ فایل‌های HTML چیست؟‌ در پاسخ باید گفت که اسناد HTML یا پسوندِ HTML دارند و یا به .htm ختم می‌شوند. مرورگر این فایل را می‌خواند و محتوای آن را به کاربر نشان می‌دهد.

همچنین تمامی فایل‌های HTML دارایِ یک سری عناصر هستند که همان‌طور که در مقدمه هم عنوان شد، از مجموعه‌ای از تگ‌ها (Tag) و خصوصیات (Attribute) تشکیل شده‌اند. مجموعه‌ی این دو به مرورگر می‌گویند که اولاً عنصر HTML عکس است یا متن است یا انواع دیگری از المان‌ها است و اینکه چه مشخصاتی دارند. 

اگر موارد استثناء را هم کنار بگذاریم، هر یک از تگ‌های HTML از سه قسمت اصلی تشکیل می‌شود:

  • تگ ابتدایی (Opening Tag): از این تگ برای این استفاده کنیم که به مرورگر بفهمانیم که این عنصر، دقیقاً از کجا شروع می‌شود. تمام تگ‌ها هم در بین علامت <> قرار می‌گیرند. مثلا تگ <p> یعنی اینکه ما می‌خواهیم یک متن بنویسیم و اینجا، نقطه‌ی شروع پاراگراف است. 
  • محتوا (Content):‌ محتوا یعنی همان چیزی که ما قرار است به کاربر نشان بدهیم. مثلاً همان پاراگراف را اگر بخواهیم مثال بزنیم، محتوایی که قرار است در پاراگراف به کاربر نشان دهیم، در داخل تگ پاراگراف، یعنی دقیقاً بعد از <p> قرار می‌گیرد.
  • تگ انتهایی (Closing Tag):‌ برای اینکه به مرورگر بگوییم که محتوا در کجا تمام می‌شود، از تگ انتهایی استفاده می‌کنیم. تگ‌های انتهایی مشابه با تگ‌های ابتدایی هستند، با این تفاوت که بعد از کاراکتر ابتدایی‌شان، یک / هم قرار می‌گیرد. بنابراین اگر بپرسید که تگ انتهایی تگ پاراگراف در HTML چیست، این تگ به‌صورت <p/> است.

ترکیب این سه عنصر را می‌توان به‌خوبی در مثال زیر دید: 

				
					<p>سلام! این اولین خط کدی است که من می‌زنم</p>

				
			

به‌نظرتان کارکرد این تگ در HTML چیست؟ اگر بگویید که این تگ قرار است جمله‌ی «سلام! این اولین خط کدی است که من می‌زنم» را در مرورگر و به‌صورت پاراگراف نشان دهد، حرفتان کاملاً صحیح است و این یعنی مطالب قبلی را به‌خوبی خوانده‌اید. 

سؤالی که در این قسمت باید به آن پاسخ بدهیم این است که HTML به همین ختم می‌شود؟‌ یعنی این زبان، فقط همین تگ‌ها را دارد؟‌ پاسخِ این سؤال، «نه» است. HTML همچنین دو قسمت مهم و حیاتی دیگر دارد: Name و Attribute. مثلاً عنصر (Element) استایل که در این قسمت می‌خواهیم رنگ بنفش و فونت Family Verdana را با استفاده از آن به همان متنی اختصاص دهیم که همین چند خط بالاتر آن را در تگ پاراگراف نوشتیم، به شکل زیر نوشته می‌شود:

				
					<p style="color:purple;font-family:verdana">This is how you add a paragraph in HTML.</p>

				
			

اتریبیوت دیگری که به هیچ عنوان نمی‌توانیم از آن بگذریم، اتریبیوت «Class» است که به‌صورت گسترده در برنامه‌نویسی از آن استفاده می‌شود. حالا ببینیم که کارکرد این اتریبیوت در برنامه نویسی HTML چیست؟

این اتریبیوت می‌تواند عناصر مختلف را در یک دسته‌ی مشخص قرار دهد. با این روش، هر کاری که روی همان دسته انجام دهید، به‌صورت اتوماتیک روی تمام عناصری که در آن دسته قرار گرفته‌اند، اعمال می‌شود. به‌عنوان مثال فرض کنید که تمام متن‌های صفحه‌ی وب سایت شما قرار است اندازه‌ی فونت ۱۶ داشته باشند و از یک فونت خاص مثلِ «یکان بخ» استفاده کنند. در این‌صورت کافی است به همه‌ی این متن‌ها، کلاس ثابتی اختصاص دهید و بعداً با استفاده از CSS، فونتِ همه‌ی آنها را به یکان بخ تغییر دهید. 

واقعیت این است که HTML و پرداختن به جزئیات آن، چیزی نیست که در یک متن و دو متن بتوان به آن رسید. در واقع هدف ما هم در این متن این بود که ببینیم زبان برنامه نویسی HTML چیست و چه کاربردی دارد. اما به‌عنوان جمع‌بندی مختصر تا این قسمت، می‌توان گفت که اگر وب سایت را با تمام جزئیاتی که دارد، مثلِ بدن یک انسان تصویرسازی کنیم، اسکلت این بدن را می‌توان به زبان HTML تشبیه کرد. اما پس از HTML، ما نیاز داریم که این بدن گوشت، پوست و زیبایی داشته باشد که همه‌ی این موارد با استفاده از زبان CSS قابل انجام است. 

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

مزایا و معایب HTML چیست؟

هیچ تکنولوژی‌ای را نمی‌توان بدون نقص دانست. همه‌ی تکنولوژی‌ها آمده‌اند تا کاری را انجام دهند و به مرور زمان، توانسته‌اند عیوبشان را برطرف کنند. HTML هم از این قاعده مستثنی نیست. مهم این است که شما علاوه بر مزایا، بدانید که معایب HTML چیست تا بتوانید انتظارات صحیحی از این زبان نشانه‌گذاری داشته باشید. در ادامه بیشتر در مورد این موضوع صحبت می‌کنیم:

مزایای HTML چیست؟

از جمله مزایای HTML می‌توان به موارد زیر اشاره کرد:

۱- زبان HTML به‌صورتی طراحی شده است که حتی افرادی که تا قبل از این به هیچ عنوان سابقه‌ی کدنویسی نداشته‌اند هم می‌توانند به سرعت با آن هماهنگ شوند. به‌عبارت دیگر، منحنی یادگیری این زبان کاملاً سریع است. 

۲- این زبان هیچ رقیب دیگری ندارد. یعنی برخلاف زبان‌های دیگر مثل جاوا اسکریپت یا فریم‌ورک‌ها یا کتابخانه‌های مختلفی که دارد و تیم توسعه بر اساس مشخصات پروژه تصمیم می‌گیرد که از کدام یک از آنها استفاده کند، HTML رقیبی ندارد. بنابراین اولاً شما ملزم به استفاده از آن هستید و در ثانی، همین موضوع باعث شده است تا یک جامعه‌ی قدرتمند پشت آن وجود داشته باشد که خاطر شما را از آپدیت‌های بعدی‌ آن راحت می‌کند.

۳- مثلِ تمامی زبان‌های دیگر برنامه‌نویسی، این زبان هم کاملاً رایگان است و مانند بیشتر آنها، منبع‌باز هم هست. تمامی مرورگرها از این زبان پشتیبانی می‌کنند. بنابراین در استفاده از آن هیچ مشکلی ندارید. 

۴- به‌عنوان آخرین پاسخ برای این سؤال که مزایای زبان برنامه نویسی HTML چیست، باید بگوییم که این زبان به‌صورت کامل با همه‌ی زبان‌های دیگر برنامه‌نویسی سازگار است. بنابراین چه شما یک متخصص بک اند باشید و از زبانی مثل PHP استفاده کنید یا بخواهید از فریم‌ورک Node.js استفاده کنید و یا اینکه یک متخصص فرانت اند باشید، هیچ مشکلی برای ارتباط با این زبان ندارید. 

معایب HTML چیست؟

حالا به سراغ معایب این زبان برویم و ببینیم که معایب HTML چیست. این معایب یا اگر بخواهیم درست‌تر بگوییم، نقص‌ها، در ادامه لیست شده‌اند:

۱- زبان HTML یک زبان کاملاً استاتیک است. دلیلش هم این است که زمانی‌که اولین نسخه‌ی این زبان معرفی شد، اساساً مفهومی به نام وب سایت‌های داینامیک وجود نداشت. به‌ همین دلیل برای اینکه بتوانید وب سایت‌های داینامیک طراحی کنید، حتماً باید از زبان‌های دیگری که معروف‌ترین آنها جاوا اسکریپت است، استفاده کنید.

۲- شما مجبورید برای هر صفحه‌ی وب سایت، یک فایل HTML هم داشته باشید. این موضوع وقتی حوصله‌تان را به‌عنوان یک توسعه‌دهنده سر می‌برد که تعداد زیادی صفحه‌ی وب سایت داشته باشید و علاوه بر آن، المان‌های تکراری زیادی هم در این صفحات وجود داشته باشد. بنابراین ممکن است از خودتان بپرسید که دلیل استفاده از HTML چیست؟‌ و اگر این سؤال را از ما بپرسید، حتماً به شما می‌گوییم: چون چاره‌ی دیگری ندارید!

۳- HTML هم مانند هر زبان دیگری، توسط جامعه‌ای که پشتِ آن است، توسعه داده می‌شود. بنابراین ممکن است فیچرهایی به آن اضافه شود یا بعضی از فیچرهای قدیمی که الان دیگر کارکردی ندارند، حذف شوند. تا اینجای کار مشکلی نیست؛ اما مشکل زمانی شروع می‌شود که مرورگرها که مسؤال خواندن اطلاعات فایل HTML هستند، بعضی وقت‌ها خیلی کُند این کار را انجام می‌دهند. بنابراین ممکن است شما به‌عنوان برنامه‌نویس، از یک فیچر جدید استفاده کنید اما مرورگر کاربر آن را نشان ندهد. 

یک وب‌سایت حرفه‌ای، یک قدم به جلو برای کسب‌وکارتان!

طراحی سایتتان را به اسمارتیز بسپارید و در فضای رقابت آنلاین، بین رقبای‌تان بدرخشید!

کلامِ آخر

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

سؤالاتی که ممکن است در ذهنتان باشد

HTML یک زبان نشانه‌گذاری است که وظیفه‌ی آن ایجاد ساختار اولیه برای المان‌هایی است که قرار است در قسمت‌های مختلف وب سایت از آنها استفاده شود. 

HTML مخفف عبارت HyperText Markup Language و به معنی زبان نشانه‌گذاری ابر متن است. با استفاده از این زبان نشانه‌گذاری می‌توانید ساختار وب سایت خودتان را طراحی کنید.

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

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

منابع این مطلب

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

مطالب دیگر

دنیایی از اطلاعات برایِ شما… تا از دنیای بازاریابی عقب نمانید!