HTML

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

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

HTML چیست؟

HTML مخفف Hyper Text Markup Language است. توجه داشته باشید که این یک زبان برنامه نویسی نیست، بلکه یک زبان نشانه گذاری است. کدنویسی با آن به این صورت است که راه مدیران وب‌سایت‌های بزرگ را دنبال میکنید و شروع به ساختن سایت‌های شگفت‌انگیز کنید.

اگر عاشق طراحی سایت هستید و برنامه ای جدی برای ورود به این عرصه دارید، آموزش آن اولین قدم شما در این مسیر خواهد بود. اگر می خواهید در مورد مراحل شروع یادگیری طراحی سایت بیشتر بدانید، مطالعه زیر را از دست ندهید.

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

زبان برنامه نویسی ابزار قدرتمندی است که به وسیله آن می توانیم با کامپیوتر صحبت کنیم. زبان های برنامه نویسی از طریق دستورالعمل هایی که توسط کامپیوتر قابل درک هستند با آنها ارتباط برقرار می کنند و عمدتاً از ساختارهای کنترلی و شرطی استفاده می کنند. سخت افزار برای درست کار کردن به یک سری دستورالعمل نیاز دارد. این دستورالعمل ها توسط یک برنامه نویسی به سخت افزار فروارد می شود و یک کامپیوتر می تواند یک زبان را بفهمد.

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

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

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

به این ترتیب این زبان به تدریج مشکلات قبلی خود را حل می کند. HTML4 در سال ۱۹۹۹ معرفی شد و بسیاری از طراحان وب برای مدت طولانی از آن استفاده کردند تا اینکه با معرفی HTML5 بزرگترین تغییر در تاریخچه HTML رخ داد. این نسخه از این زبان توانسته به توسعه دهندگان در طراحی سایت کمک کند که در ادامه می خواهیم با آن آشنا شویم.

HTML5 چیست؟

در این بخش قصد داریم به این موضوع بپردازیم که HTML5 چیست و چه تفاوتی با HTML دارد. تا سال ۲۰۰۸، بازار HTML4 داغ بود. اما واضح بود که این نسخه از HTML دارای اشکالاتی است و نیاز به به روز رسانی دارد. به همین دلیل WHATWG توسعه این زبان را بر عهده گرفت و استانداردهای آن را ارتقا داد. نقاط ضعف اصلی مالتی مدیا و گرافیک بود.

HTML 5 در سال ۲۰۱۴ یک آپدیت مهم و اساسی را تجربه کرد، در این آپدیت تگ های جدیدی آمده است که تاثیر بسیار مثبتی در بهبود کیفیت و بهبود تجربه کاربری داشته است. پس از این به روز رسانی، طراحی سایت ساختار جدیدی پیدا کرده و مفاهیم قدیمی (مانند استفاده از جدول در بدنه اصلی صفحات) از بین رفته است.

چگونه کار می کند؟

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

البته در دنیای وب معمولا یک نفر مسئول کدنویسی HTML و CSS خواهد بود. فایل های HTML با پسوند .htm یا .html در سیستم آنها وجود دارد. همه مرورگرهای وب از این فایل ها پشتیبانی می کنند و می توانند به راحتی محتوای آن را ارائه دهند. رندر به این معنی است که عناصر داخل سایت که ترکیبی از کد، تصویر، انیمیشن، ویدئو و … هستند به اطلاعاتی تبدیل می شوند که کاربران می توانند آنها را ببینند.

تگ چیست ؟

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

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

مهمترین تگ های HTML

تنوع تگ ها در HTML بسیار زیاد است و این تگ ها در نسخه های جدید بهتر هستند. برخی از آنها چندان محبوب نیستند و طراحان وب به ندرت از آنها استفاده می کنند. به عنوان مثال، تگ mater که برای اندازه گیری است، تگ محبوبی برای طراحان وب سایت نیست.

از طرف دیگر، تگ <div> صفحه را به بخش های مختلف تقسیم می کند، تقریباً بخشی جدایی ناپذیر از طراحی سایت است. بنابراین اگر می خواهید به این زبان تسلط داشته باشید، توصیه می کنیم تگ های مختلف را بررسی کنید.

لیست کامل دسترسی به برچسب های HTML

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

مزایای

• یادگیری آسان و لذت بخش
• قابلیت اجرا در تمامی مرورگرها
• منبع باز و رایگان
• ادغام آسان با زبان های سمت سرور مانند php

معایب

• ایستا و وابستگی به زبان های سمت سرور برای تعامل با کاربر
• پشتیبانی ضعیف از مرورگرهای قدیمی
• نیاز به طراحی جداگانه هر صفحه به دلیل عدم وجود قوانین برنامه نویسی منطقی