معرفی زبان طراحی وب اچ تی ام ال ( HTML ) + کتاب آموزشی

اچ تی ام ال ( HTML ) مخفف عبارت Hyper Text Markup Language به معنی زبان نشانه گذاری ابر متن است . این زبان شکلی از زبان دیگری بنام SGML است و جهت طراحی صفحات وب به کار رفته و زبان استاندارد طراحی صفحات وب سایت به شمار می رود .  یک سند اچ‌تی‌ام‌ال ، یک پرونده مبتنی بر متن (Text–based) است که معمولاً با پسوند html. یا htm. نامگذاری می شوند .

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

تاریخچه HTML

در سال ۱۹۸۹ دانشمند بریتانیایی به نام تیم برنرزلی (Sir Timothy John Berners-Lee) شبکه جهانی وب را طرح ریزی کرد و با انتشار زبان Html شبکه جهانی وب را اختراع کرد . پس از معرفی اولین نسخه این زبان که در آن به توصیف ۱۸ عنصر از عناصر اولیه پرداخته شده بود ، در نسخه های بعدی قابلیت های فراوانی به این زبان اضافه شد و تا سال ۱۹۹۹ نسخه های ۲ ، ۳ و ۴ در فواصل زمانی مختلف عرضه شد .

در سال ۲۰۰۰ کنسرسیوم جهانی وب [۱] (W3C) نسخه جدیدی از زبان وب را تحت عنوان XHTML عرضه کرد و آن را جایگزین HTML نمود . این زبان جدید از بسیاری جهات شبیه HTML است ولی برای با زبان XML ساخته شده بود . بدلیل نقص هایی که این نسخه داشت ، در سال ۲۰۰۹ ، W3C اجازه داد که منشور گروه کاری XHTML منقضی شده و دیگر تجدید نشود .

پس از آن در سال ۲۰۱۱ نسخه HTML5 منتشر شد . HTML5 جدیدترین نسخه زبان نشانه گذاری وب است که تغییرات بسیاری نسبت به نسخه های پیشین خود کرده است . سیر تکاملی این زبان به صورت زیر است :

HTML5

HTML5 جدید ترین نسخه از زبان کدنویسی وب و برای ساخت و ارائه محتوا برای شبکه جهانی وب است . اهداف اصلی اچ‌تی‌ام‌ال۵ بهبود این زبان به صورتی است که از جدیدترین فناوری‌های چند رسانه‌ای پشتیبانی کند در حالی که هم به راحتی توسط انسان‌ها قابل خواندن باشد و هم به طور مداوم توسط رایانه‌ها و دستگاه‌ها (مرورگرهای وب، تجزیه کننده‌ها و غیره) قابل درک باشد . اچ‌تی‌ام‌ال۵ نه تنها ۴HTML بلکه ۱XHTML و ۲HTML را نیز پشتیبانی می کند .

HTML5 دارای قابلیت ها و امکانات جدیدی است که کار را برای طراحان وب بسیار ساده می کند . از جمله این امکانات می توان به طراحی اشیا به صورت ۲ بعدی و یا پخش فایل های صوتی و تصویری بدون نیاز به نرم افزار جانبی اشاره کرد. HTML5 حاصل همکاری و مشارکت دو نهاد اصلی استاندارد سازی وب یعنی W3C و WHATWG است.

مفهوم تگ های HTML

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

هر تگ HTML ، یک بخش ابتدایی و یک بخش انتهایی دارد که هم نام بوده و به صورت استاندارد طبق شکل کلی زیر به کار می روند :
<تگ انتها/>    محتویات    <تگ ابتدا>
مثال :<table> ….. </table>

تگ ابتدایی مشخص کننده آغاز تگ و تگ پایانی ، مشخص کننده انتهای تگ است . هر تگ HTML ، باید حتما در ادامه توسط تگ پایانی بسته شود . کلیه نوشته ها و تگ های دیگری که در بین تگ ابتدا و پایان نوشته می شوند ، محتویات تگ را تشکیل می دهند .

نحوه ساخت صفحه HTML

یکی از مزیت های HTML این است که فایل های آن با هر ادیتور ساده ای قابل ساختن هستند. مثلا اگر از ویندوز استفاده می کنید میتوانید با نرم افزار Notepad یک فایل HTML را ایجاد کنید. کافیست در هنگام ذخیره ی فایل در Notepad به آخر نام فایل ، یکی از پسوند های .html یا .htm اضافه کنید و آن را ذخیره نمایید. به همین راحتی میتوانید یک فایل HTML را ایجاد نمایید.

البته برای راحتی کار و صرفه جویی در وقت خود بهتر است از نرم افزار های پیشرفته و حرفه ای که برای این کار ساخته شده اند استفاده نمایید. مانند Adobe Dreamweaver ، Visual Studio ، Microsoft Expression Web ، CoffeeCup HTML Editor ، HTML PAD و …

نحوه نمایش HTML

تمامی کدهایی که در طراحی یک سایت نوشته شده باید به زبان اچ تی ام ال تبدیل و بعد از آن توسط مرورگر نمایش داده شود . به عبارت دیگر مرورگرها هیچ کدام از کدهایی که در سمت سرور به زبان های مختلف برنامه نویسی مثل php یا asp نوشته شده است را درک نمی کنند و تنها کد قابل درک برای مرورگرها HTML است . بنابراین کامپایلر [۲] زبان های برنامه نویسی باید کدهای خود را به کد اچ تی ام ال تبدیل نموده و آن ها را برای مرورگر ارسال نموده تا مرورگر اطلاعات را برای کاربران به نمایش (Render) درآورد .

ارتباط HTML با CSS

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

تالیف و گردآوری : سجاد عزیززاده

[۱] کنسرسیوم شبکه جهانی وب (World Wide Web Consortium – W3C) انجمنی است که در آن استانداردهای وب (World Wide Web) تولید می شود. شرکت ها و سازمان های عضو این کنسرسیوم به بحث و گفتگو بر روی استانداردها و فناوری های وب می پردازند W3C.  استانداردهای عملی را توسعه می دهد تا منجر به بهبود قابلیت محصولات و فناوری های وب شود. در حال حاضر حدود ۴۵۰ شرکت و سازمان عضو این انجمن می باشند که از جمله آن ها می توان بهMicrosoft  اشاره نمود. ریاست کنسرسیوم جهانی وب هم اکنون به عهده تیم برنزلی است. تیم برنزلی که  مخترع وب نیز می باشد در سال ۱۹۹۴ اقدام به تأسیس w3c نمود.

[۲] کامپایلر ( به انگلیسی Compiler ) برنامه یا مجموعه‌ای از برنامه‌های کامپیوتری است که متنی از زبان برنامه نویسی سطح بالا ( زبان مبدأ ) را به زبانی سطح پایین ( زبان مقصد ) ، مثل اسمبلی یا زبان سطح ماشین، تبدیل می‌کند. خروجی این برنامه ممکن است برای پردازش شدن توسط برنامه دیگری مثل پیونددهنده مناسب باشد یا فایل متنی باشد که انسان نیز بتواند آنرا بخواند.