معرفی HTML
معرفی HTML
اچ تی ام ال چیست ؟ HTML چه کاربردی دارد ؟ در این مقاله قصد داریم به طور کلی به معرفی HTML بپردازیم.
سرفصل‌های این مقاله
1 آموزش طراحی سایت با HTML
1.1 اچ تی ام ال HTML چیست؟
2 آیا HTML یک زبان برنامه نویسی است؟
3 ساختار صفحات HTML
4 مزایا و معایب HTML
4.1 مزیت ها
4.2 معایب
5 نتیجه گیری
1 آموزش طراحی سایت با HTML
با عرض سلام خدمت تمامی دوستداران و علاقمندان به آموزش طراحی سایت با HTML ، با اولین جلسه‌ی آموزش html در خدمت شما عزیزان هستم .
در این جلسه به شما توضیح خواهیم داد که HTML چیست ؟ و نام HTML از چه کلماتی گرفته شده است تا شما عزیزان در ابتدا به درک درستی از اچ تی ام ال برسید
و سپس در جلسات آینده وارد مباحث آموزشی جذاب‌تر و کاربردی‌تر خواهیم شد.
1.1 اچ تی ام ال HTML چیست؟
روزانه به سایت‌های زیادی سر می‌زنیم که هر کدام به شکلی برایمان جذاب هستند و ممکن است ما را به این فکر بیندازند که این سایت‌ها چطور ساخته شدند؟
اگر به چند سال قبل برگردیم و نگاهی به اولین سایت‌های منتشرشده در وب بیندازیم، می‌بینیم که صفحات آن‌ها تنها از چند المان ساده و ابتدایی تشکیل شده‌اند.
از قدیم تا امروز، تکنولوژی‌های مختلفی در جذاب کردن فرآیند طراحی وب تاثیرگذار بوده‌اند، اما اگر بگوییم تمام این تکنولوژی‌ها به HTML منتهی میشوند باور می‌کنید؟
در این مسیر همراه ما باشید تا کشف کنیم HTML چیست و چطور این همه سال در دنیای وب جایگاه خودش را حفظ کرده است؟
پیش از اینکه به معرفی HTML بپردازیم لازم است تا ابتدا با انواع برنامه ھای تحت وب آشنا شویم. برنامه ھای تحت وب بصورت کلی به دو دسته تقسیم میشوند:
1-برنامه ھای استاتیک (Static)
برنامه هایی هستند که صفحات آن ها از متن ، تصاویر ، صوت و … تشکیل شده در واقع این صفحات هیچ گونه تعاملی با کاربر ندارند
و کاربر تنها می‌تواند این صفحات را مشاهده کند .
2-برنامه های داینامیک (Dynamic)
برنامه هایی هستند که داده ای را از کابر گرفته سپس آن را پردازش کرده و نتیجه‌ی آن را در اختیار کاربر قرار می‌دهند.
HTML چیست؟
HTML یک زبان نماد گذاری یا نشانه گذاری است که در طراحی سایت کاربرد بسیار فراوانی دارد . از اچ تی ام ال برای ساختن صفحات استاتیک استفاده میشود
و به وسیله آن میتوان صفحات وبی ساخت که شامل عکس ، فیلم ،موزیک ، پاراگراف ، جدول و … است.
HTML مخفف عبارت Hyper Text Markup Language به معنی زبان نشانه گذاری ابر متن است،
که در ادامه به توضیح ھر یک از کلمات این عبارت خواهیم پرداخت و معرفی زبان HTML را تکمیل خواهیم کرد.
Language
این عبارت نشان دھنده این است که HTML یکی از زبان ھای برنامه نویسی است.
البته بهتر است که به جای عبارت “برنامه نویسی” از “نشانه گذاری” استفاده کنیم.
Text
این عبارت نشان می‌دھد که یک برنامه به زبان HTML یک فایل متنی ساده بیشتر نیست!
در واقع مرورگر‌ھا این فایل متنی را می‌خوانند و با توجه به دستورات داخل آن ، آن را به عناصر مختلف همچون عکس‌ها ، پاراگراف‌ها و … تبدیل می‌کنند.
Hyper
در مقابل “Liner” قرار دارد . جالب است که بدانید زبان ھای برنامه نویسی به دو دسته تقسیم میشوند : 1 – Hyper – 2 Linner
Liner :
به زبان ھایی ھمچون C,Pascal, Delphi, PHP و … گفته می شود که باید دستورات به ترتیبی که نوشته شده اند به صورت خط به خط اجرا شوند
و تا خطی از برنامه اجرا نشده خط بعدی اجرا نمی شود، و در واقع الگوی خطی دارند که وجود خطا در ھر خط از برنامه موجب توقف اجرای کل برنامه می شود.
Hyper :
در مقابل زبانھایی ھستند که الگوی خاصی ندارند و خطا در یک خط از برنامه موجب توقف کل برنامه نمی شود. به این زبان ھا Hyper گفته می شود.
Markup
زبان HTML بر خلاف بسیاری از زبان ھای برنامه نویسی فاقد دستور‌ھایی ھمچون ساختارشرطی، حلقه، توابع و… است.
در عوض این زبان از ساختار ساده ای به نام Markup Tag یا به اختصار Tag ( برچسب ) تشکیل شده است.
در واقع اچ تی ام ال (HTML) یه نوع دستور بیشتر ندارد و آن ھم ھمین Tagھا ھستند.
2 آیا HTML یک زبان برنامه نویسی است؟
همانطور که گفتیم زبان HTML یک زبان نشانه گذاری است و اصطلاح زبان برنامه نویسی HTML یک اصطلاح اشتباه است، چرا؟
طبق تعریفی که برای صفحات استاتیک و پویا (داینامیک) داشتیم، HTML برای طراحی صفحات استاتیک استفاده میشود
و به دلیل نداشتن امکانات و توابع داینامیک یک زبان برنامه نویسی به حساب نمی‌آید.
با توجه به همین مورد کد های نوشته شده به زبان اچ تی ام ال، توسط نرم افزار های خواندن فرمت‌های داکیومنت مانند مایکروسافت ورد قابل خواندن است.
پس تا الان متوجه شدیم که HTML چیست ؟ و با این تعریف متوجه شدیم که چرا HTML یک زبان برنامه نویسی نیست!
زبان نشانه‌گذاری چه تفاوتی با زبان برنامه نویسی دارد؟
زبان برنامه نویسی ابزاری قدرتمند است که به وسیله آن می‌توانیم با کامپیوترها حرف بزنیم.
زبان‌های برنامه نویسی به کمک دستورالعمل‌هایی که برای کامپیوتر قابل فهم هستند با آن‌ها ارتباط برقرار کرده
و به طور عمده از ساختارهای کنترلی و شرطی استفاده می‌کنند. سخت افزار برای این که درست کار کند
نیاز به یک سری دستورالعمل دارد. این دستورالعمل‌ها توسط برنامه نویس و زبانی که برای کامپیوتر قابل فهم باشد، به سخت افزار داده میشود.
انواع مختلفی از زبان نشانه گذاری وجود دارد که معروف‌ترین آن HTML است.
اگر به اسم زبان نشانه گذاری دقت کنید، متوجه مفهوم آن خواهید شد.
در زبان‌های نشانه گذاری خبری از ساختارهای رایج برنامه‌نویسی مثل شرط، حلقه، تکرار و غیره وجود ندارد
و شما داخل متن خود از یک سری نشانه استفاده می‌کنید. در حقیقت در این زبان‌ها شما به کمک این نشانه‌ها متن را از سایر عناصر صفحه جدا می‌کنید
تا به کمک آن‌ها المان‌های مختلف را داخل یک صفحه وب قرار داده و ساختار صفحه را مشخص کنید.
3 ساختار صفحات HTML
وقتی با HTML کار میکنیم، از یک ساختار خیلی ساده یعنی تگ ها و خاصیت ها استفاده میکنیم.
به عنوان مثال برای تهیه یک پاراگراف از تگ p استفاده میکنیم.
<p>امیدواریم یک شروع خوب را با فرازنتورک داشته باشید. </p>
در بالا با استفاده از تگ باز و بسته p ، عبارتی را نوشتیم که خروجی آن را در تصویر زیر مشاهده می‌کنید.
نمونه کد HTML
4 مزایا و معایب HTML
مانند هر چیز دیگه ای، HTML هم محدودیت ها و قدرت های خاص خودش رو داره که ما بهش مزیت و عیب HTML میگیم و در ادامه باهاشون آشنا میشیم.
4.1 مزیت ها
به علت داشتن منابع بسیار خوب و انجمن های رفع اشکال قدرتمند این زبان یکی از پر استفاده ترین زبان هاست.
به طور کلی در تمامی مرورگر های وب به صورت Native یا زبان مادری فعال است.
یادگیری آن بسیار راحت است و نیازی به دانش قبلی نداره.
متن باز و کاملا رایگان است.
کد هاش کاملا قابل فهم و ساده هست.
استاندارد های اصلی وب توسط سازنده همین زبان یعنی W3C تعیین میشود.
خیلی راحت با زبان های برنامه نویسی سمت سرور یا Backend مثل PHP ، Node.js و Python (فلسک یا جنگو) ارتباط برقرار می‌کنه.
4.2 معایب
در بیشتر مواقع برای ساخت صفحات و برنامه های استاتیک ازش استفاده میشه و برای استفاده پویا یا داینامیک از HTML نمیتونید استفاده کنید
و باید از Javascript یا یک زبان سمت سرور مثل PHP استفاده کنید.
از یک منطق خاصی برای ساخت صفحات پیروی نمیکنه. برای هر صفحه شما باید بخش های مختلفش رو بسازید
و خودتون تعریف کنید که اون بخش چه کاری انجام میده.
حالا تو HTML5 یک سری تگ ها اضافه شده به نام header و footer ولی اون ها هم از منطق خاصی پیروی نمیکنند
و فقط برای راحت تر کردن مفهوم استفاده میشوند.
بعضی از مرورگر ها امکانات و ویژگی های جدید رو دیر پیشتیبانی می‌کنند.
پیش بینی رفتار مرورگر ها در نمایش کد ها کمی سخت است
( به عنوان مثال بعضی از مرورگر های قدیمی تگ های جدید موجود در HTML5 را نمیشناسند و نمیتوانیم تضمین دهیم
که با بعضی از راهکار ها باز هم تمامی مرورگر ها وب سایت ما را صحیح نمایش می‌دهند).
خب در این جلسه با مفهوم HTML ، اینکه HTML چیست و چه کاربردی دارد، آشنا شدیم
اگر عاشق طراحی سایت هستید و برای ورود به این حوزه برنامه جدی دارید، آموزش HTML اولین قدم شما در این مسیرخواهد بود.
در جلسه بعدی به معرفی تاریخچه‌ی پیدایش HTMLمی‌پردازیم.
مطالب مرتبط :
1-نرم افزارهای مورد نیازدر HTML
جهت مشاهده دوره های آموزشی بر روی این لینک کلیک نمایید.
جدیدترین اخبار مجموعه فراز نتورک را در این صفحه اجتماعی دنبال کنید.
نویسنده: راحله تبریزی
دیدگاهتان را بنویسید
برای نوشتن دیدگاه باید وارد بشوید.