Google Play badge

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


زبان نشانه‌گذاری فرامتن ( HTML )

HTML مخفف عبارت Hypertext Markup Language است. این زبان نشانه‌گذاری استاندارد برای اسنادی است که برای نمایش در مرورگر وب طراحی شده‌اند. HTML می‌تواند توسط فناوری‌هایی مانند Cascading Style Sheets ( CSS ) و زبان‌های اسکریپت‌نویسی مانند جاوا اسکریپت پشتیبانی شود.

بنیاد وب

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

ساختار اسناد HTML

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

 <!نوع سند html>
<html>
    <سر>
        <title>عنوان صفحه</title>
    </head>
    <بدنه>
        <h1>این یک عنوان است</h1>
        <p>این یک پاراگراف است.</p>
    </body>
</html>

این کد یک صفحه وب پایه با عنوان، سرتیتر و یک پاراگراف متن تعریف می‌کند.

عناصر و تگ‌های HTML

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

برای مثال، تگ <code><p></code> یک پاراگراف متن را در بر می‌گیرد و ساختار آن به صورت زیر است:

 <p>این یک پاراگراف نمونه است.</p>

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

ویژگی‌ها

عناصر HTML می‌توانند دارای ویژگی‌هایی باشند که اطلاعات اضافی در مورد عناصر ارائه می‌دهند. ویژگی‌ها در داخل تگ شروع یک عنصر قرار می‌گیرند و اغلب به صورت جفت‌های نام/مقدار مانند <code>name="value"</code> ارائه می‌شوند.

برای مثال، برای جاسازی یک تصویر، از تگ <code><img></code> به همراه ویژگی <code>src</code> (منبع) برای مشخص کردن URL تصویر استفاده می‌کنیم:

 <img src="url to image.jpg" alt="توضیحات تصویر">

ویژگی <code>alt</code> در صورتی که تصویر قابل نمایش نباشد، متن جایگزینی برای آن ارائه می‌دهد.

لینک‌ها و ناوبری

استفاده از تگ <code><a></code> باعث ایجاد هایپرلینک‌ها می‌شود که اساس ارتباط متقابل وب هستند. یک هایپرلینک می‌تواند به یک صفحه وب دیگر، یک بخش متفاوت در همان صفحه یا حتی یک فایل قابل دانلود لینک دهد. برای مثال:

 <a href="https://example.com">از Example.com دیدن کنید</a>

این یک لینک به <code>https://example.com</code> ایجاد می‌کند.

لیست‌ها

HTML عناصری برای ایجاد لیست‌ها ارائه می‌دهد. دو نوع اصلی لیست وجود دارد:

هر آیتم در لیست درون تگ <code><li></code> (لیست آیتم) قرار می‌گیرد.

HTML5

HTML5 آخرین تکامل این استاندارد است که ویژگی‌های جدید بسیاری را معرفی می‌کند که نیازهای مدرن برای اسناد چندرسانه‌ای و تعاملی را منعکس می‌کند. این ویژگی‌ها شامل عناصر ساختاری جدید (<code><header></code>، <code><footer></code>، <code><article></code>، <code><section></code>)، عناصر گرافیکی (<code><canvas></code> برای نقاشی، <code><svg></code> برای گرافیک برداری مقیاس‌پذیر) و عناصر رسانه‌ای (<code><audio></code> و <code><video></code>) می‌شوند.

HTML معنایی

HTML معنایی به استفاده از نشانه‌گذاری HTML برای تقویت معنا یا مفهوم اطلاعات در صفحات وب اشاره دارد. HTML معنایی به جای اینکه صرفاً نحوه ظاهر یا رفتار عناصر را تعریف کند (که این کار بر عهده CSS و جاوا اسکریپت است)، ساختار و نوع محتوا را به طور دقیق توصیف می‌کند. به عنوان مثال، تگ <code><article></code> نشان می‌دهد که محتوای داخل یک مقاله است، در حالی که تگ <code><nav></code> یک منوی ناوبری را نشان می‌دهد.

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

نتیجه‌گیری

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

Download Primer to continue