معرفی زبان برنامه نویسی HTML

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

تاریخچه زبان HTML

اولین نسخه HTML، در سال 1993 و توسط تیم برنرز لی (Tim Berners-Lee)، فیزیک‌دان و پیمان‌کار شرکت سرن (CERN)، نوشته شد. از آن زمان، نسخه‌های متفاوتی از این زبان ارائه شده است که در سال 1999، HTML 4.01 به نسخه استاندارد آن تبدیل شد. در حال حاضر، HTML 5.0 جدیدترین نسخه این زبان است که کاربردی جهانی دارد.

XHTML، نسخه دیگری بود که به عنوان یک زبان XML، از HTML بازنویسی شد. این زبان نیز زبان نشانه‌گذاری استانداری است که از آن برای ایجاد زبان‌های نشانه‌گذاری دیگر استفاده می‌شود. امروزه از صدها زبان XML مانند GML، MathML، MusicML و RSS استفاده می‌شود که هر یک، کاربرد مجزای خود را دارند.

HTML مخفف چیست؟

HTML مخفف عبارت Hyper Text Markup Language یا «زبان نشانه گذاری فرامتن» است که برای ایجاد صفحات وب استفاده می‌شود. اما مفهوم دقیق زبان نشانه‌گذاری فرامتن یا HTML چیست؟

Hypertext

هایپر تکست را به صورت ساده می‌توان به «متن درون متن» معنا کرد. در واقع هر متنی که لینکی درون خود دارد، یک هایپر تکست یا فرامتن است که به عنوان روشی برای پیوند دو یا چند صفحه وب (اسناد HTML) با یکدیگر شناخته می‌شود.

Markup Language

زبان نشانه‌گذاری، یک زبان کامپیوتری است که برای پیاده‌سازی طرح و قالب در یک سند متنی استفاده می‌شود. زبان نشانه‌گذاری، متن را تعاملی‌ و پویاتر کرده و می‌تواند آن را به تصویر، جدول، لینک و… تبدیل کند.

به جز این موارد، برای دستیابی به پاسخ دقیق HTML چیست، لازم است تا با مفهوم صفحه وب نیز آشنا باشید:

صفحه وب

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

زبان HTML چیست؟

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

اما زبان نشانه‌گذاری چیست و چه تفاوتی با زبان برنامه‌نویسی دارد؟

زبان برنامه‌نویسی

زبان برنامه‌نویسی، یک زبان رسمی و شامل مجموعه‌ای از دستورات و سینتکس‌ها (Syntax) است که برای ایجاد برنامه‌های نرم‌افزاری استفاده می‌شود. زبان‌های برنامه‌نویسی عمدتاً به دو بخش تقسیم می‌شوند:

زبان‌های سطح بالا

زبان‌های سطح بالا از سینتکس یا نحو مشابه زبان انگلیسی استفاده می‌کنند؛ بنابراین خواندن آن زبان‌ها آسان‌تر و برای برنامه‌نویسان قابل‌درک‌تر است.
به این برنامه‌ها سورس‌کد (Source Code) یا کد منبع نیز می‌گویند. کد منبع با استفاده از یک کامپایلر یا مفسر، به کدی قابل فهم برای ماشین تبدیل می‌شود. جاوا (Java)، سی پلاس پلاس (C++)، سی (C) و پایتون (Python) چند نمونه از زبان‌های برنامه‌نویسی سطح بالا هستند که از آن‌ها برای توسعه وب، دسکتاپ، برنامه‌های کاربردی موبایل و… استفاده می‌شود.

زبان‌های سطح پایین

زبان‌های برنامه‌نویسی سطح پایین، بیشتر «ماشین‎پسند» هستند و به طور مستقیم با سخت‌افزارها تعامل دارند:

• زبان ماشین (machine language): این زبان، باینری یا دو-دویی بوده و نوشتن برنامه آن بسیار سخت است.
• اسمبلی (assembly): یک قدم جلوتر از زبان ماشین است و برای نوشتن آن باید دانش خوبی از معماری کامپیوتر داشته باشید.

یک برنامه اسمبلی با استفاده از اسمبلر به زبان ماشین تبدیل خواهد شد. از این زبان‌ها معمولاً برای توسعه برنامه‌های کاربردی مبتنی بر سخت‌افزار مانند سیستم‌عامل‌ها و درایورها استفاده می‌شود.

زبان نشانه‌گذاری

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

تفاوت بین زبان برنامه‌نویسی و زبان نشانه‌گذاری

• زبان نشانه‌گذاری: سیستمی است که یک سند را به گونه‌ای که از نظر نحوی، از متن قابل تشخیص باشد، حاشیه‌نویسی می‌کند؛
• زبان برنامه‌نویسی: این زبان رسمی با استفاده از دستورالعمل‌‌های مختلف، خروجی‌های گوناگونی تولید می‌کند.
  بنابراین، زبان HTML نه برنامه‌نویسی، بلکه یک زبان نشانه‌گذاری است.

کاربردهای زبان نشانه گذاری HTML چیست؟

از ظهور اولین نسخه‌های HTML تا آخرین ورژن آن، کاربردهای این زبان نشانه‌گذاری، روز‌به‌روز افزایش یافته است:

توسعه صفحات وب

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

ناوبری اینترنتی

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

ایجاد سند وب

برای ایجاد اسناد اینترنتی، معمولاً از تگ‌های HTML یا مفاهیم دیگری مانند DOM Document) Object Model) استفاده می‌‌شود. یک سند وب استاندارد، از 3 بخش اساسی تشکیل شده است:

1. عنوان (Title)
2. سر (Head)
3. بدنه (Body)

برای طراحی هر یک از این قسمت‌ها، از تگ‎ های HTML استفاده می‌شود.

پشتیبانی از ورود داده با HTML

برای کمک به سطح ورود داده، از استاندارد HTML 5.0 و مجموعه APIها استفاده می‌شود. همانطور که استانداردهای جدید HTML 5.0 در مرورگرها اجرا می‌شوند، توسعه‌دهندگان می‌توانند تگ‌های مختلف را به یکدیگر اضافه کرده و زمینه‌های موردنیاز، محتوا، نوع داده و… را مشخص کنند.

تصاویر واکنش‌گرا در صفحات وب

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

استفاده از قابلیت‌های آفلاین

ذخیره‌سازی داده‌ها در مرورگر، به توسعه‌دهندگان کمک می‌کند تا مدیریت وبسایت و منابع خود را به‌صورت آفلاین پیش ببرد.

توسعه بازی

قبل از ظهور HTML 5.0، ساخت و توسعه بازی به ابزارهای Flash و Silverlight محدود بود. پشتیبانی مرورگرها از قابلیت‌های جدیدترین نسخه HTML، نقش مهمی در توسعه بازی ایفا کرده است.

ذخیره‌سازی سمت کاربر

پیش از ارائه زبان نشانه‌گذاری HTML، کاربران نمی‌توانستند داده‌های مرورگر را ذخیره کنند. اکنون این‌کار توسط HTML 5.0 و به کمک حافظه محلی و IndexDB امکان‌پذیر است.

استفاده از APIهای بومی برای غنی‌سازی وب‌سایت

ابزارها و قابلیت‌های جدید HTML 5.0، استفاده از APIهای جدید برای سیستم‌های فایل،موقعیت جغرافیایی، مدیریت رویداد، ذخیره‌سازی و… را از همیشه ساده‌تر کرده‌اند.

زبان HTML چطور کار می کند؟

HTML، به سادگی نحوه نمایش صفحه را به مرورگرهای مختلف نشان می‌دهد. کدنویس‌ها ابتدا باید با استفاده از یک یک ویرایشگر متن پایه (مانند TextEdit در مک)، سند HTML خود را ایجاد کرده و با استفاده از تگ‌های این زبان، آن را از نظر عناصر موردنظر خود سامان‌دهی کنند.

تگ ها در زبان HTML چه نقشی دارند؟

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

• <!Doctype> تعریف نوع سند
• <html> تعریف HTML بودن سند
• <title> تعریف عنوان سند
• <body> تعریف بدنه سند
• <h1> to <h6> تعریف هدینگ‌ها
• <p> تعریف پاراگراف‌ها
• <br> تعریف شکستن خط
• <hr> تعریف تغییر محتوای موضوعی
• <!–?–> تعریف کامنت یا نظر

مزایای زبان HTML

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

معایب زبان HTML

• HTML یک زبان ایستا است و به تنهایی برای ایجاد صفحات پویا مفید نیست؛
• درک ساختار این زبان می‌تواند مشکل باشد؛
• برخی از خطاهای کدنویسی و استفاده از این زبان، هزینه‌بر خواهد بود؛
• ایجاد جدول‌ها، لیست‌ها و فرم‌ها در صفحات وب و حفظ طرح‌های رنگی به صورت همزمان، زمان زیادی می‌برد؛
• برای ایجاد یک صفحه وب ساده، باید کدهایی طولانی نوشته شود؛
• بررسی تگ‌های منسوخ‌شده دردسرساز و در عین حال الزامی است؛
• این زبان نشانه‌گذاری، ویژگی‌های امنیتی محدودی دارد.

رابطه زبان CSS و HTML و JavaScript

اگرچه می‌توان از HTML برای افزودن عناصر متنی و ایجاد ساختار محتوا استفاده کرد، این زبان به‌تنهایی برای ساخت یک وبسایت حرفه‌ای کافی نیست. در واقع شما برای ایجاد یک وبسایت، لازم است که از Cascading Style Sheets یا CSS و جاوا اسکریپت نیز کمک بگیرید:

• CSS: پس‌زمینه، رنگ‌ها، چیدمان، فاصله‌ها و انیمیشن‌ها؛
• جاوا اسکریپت: افزودن قابلیت‌های پویا مانند اسلایدرها، پاپ-آپ‌ها و گالری عکس.

آگاهی به مفهوم این 3 زبان و آشنایی با کاربرد هر یک از آن‌ها، از مهم‌ترین اصول اولیه توسعه فرانت اند (Front-end) است.

جمع‌بندی

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

ارسال شده در 16 آبان 1401