دانشنامه وب و شبکه

Web and Network Diploma

دانشنامه وب و شبکه

Web and Network Diploma

عنوان ها در html

این پست را به عنوان ها و چگونگی بیان آنها و چرایی استفاده از آن ها اختصاص می دهیم.

تگ های هدر (header tags) دارای ۶ شماره از h1 تا h6 هستند و به ترتیب اهمیت مطلب و عناوین را می رسانند.یعنی به گونه ای که اهمیت h1 از h2 بیشتر می باشد و همین طور به ترتیب تا h6 همین روند ادامه دارد.

هتر است که با مثال عملی نحوه کار با آنها را فرابگیریم.



حالا پس از تست شاید این سوال در ذهن شما ایجاد شود که چرا باید از این تگ ها استفاده کنیم؟

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

نوع کاربردها را هم به خاطر بسپارید.

آموزش انتخاب تگ عنوان مناسب

طبق جدول زیر تگ های مناسب برای عنوان های خودتون برگزینید.سعی کنید جدول رو در ذهنتون داشته باشید مخصوصا برای h1 , h2 , h3 که مهم تر هستند.

تگ عنوان – heading tag

مکان مناسب استفاده

بهترین تعداد بکار بردن

h1

عنوان مقاله یا مطلب

۱ بار

h2

عناوین داخل مطلب

بین ۲ تا ۵ بار

h3

زیر عنوان های داخل مطلب

تا ۶ بار

h4

عنوان برای منوها یا عنوان نظرات

بدون محدودیت

h5

عنوان برای منوهای سایت

بدون محدودیت

h6

عنوان برای فوتر (footer) سایت

بدون محدودیت

معرفی تگ !doctype

درس این جلسه معرفی کامل تگ <DOCTYPE!> خواهد بود .نیار نیست درس این جلسه یاد بگیرید و بلد باشید این تگ چیه ، و چه کاربردی داره ، بعد هم مقدار <DOCTYPE!>رو در صفحات خودتون copy و paste کنید. معنی <DOCTYPE!> : نوع سند را معرفی می کنه که یعنی به مرورگر می فهماند صفحه وبی که شما طراحی کردید از چه نوعی است (از چه سندی است) مثلا : html4 , html1 , html5 و … کاربرد <DOCTYPE!> : خیلی خلاصه و مفید بخوام بگم ، این تگ باعث استاندارد شدن صفحه و نمایش یکسان صفحه در تمام مرورگر ها (Internet Explorer,Mozilla Firefox و …) خواهد شد.و همچنین اشکالات کدهای مان را نیز درست می کند.مثلا اگر ما کد رنگ را به این شکل وارد کنیم “FFFFFF” که اشتباه است ، نوع صحیح آن “FFFFFF#″ به این صورت است ، این سند باعث اصلاح کد ما خواهد شد و مرورگرها به درستی رنگ را در صفحه نمایش خواهند داد.
انواع doctype:


















خلاصه مطلب : قبل از تگ <html> یکی از <!DOCTYPE> بنویسید.و همین رو بدونید که این تگ باعث استاندارد شدن صفحه شما می شود.من در صفحات طراحی وب خود و همچنین در این آموزش از نوع HTML 5 استفاده می کنم و به شما هم پیشنهاد می کنم از این نوع استفاده کنید.

چگونه فایل های html را ذخیره کنیم؟

ابتدا تمامی کدها را  در نوت پد نوشته و سپس بری روی save as واقع در file کلیک کنید.

در قسمت نام پس از نوشتن نام دلخواه عبارت .htm و یا .html را قرار دهید.

مثال :  name.htm یا name.html

البته بهتر است که کل عبارت بین دو علامت “” قرار داده شود.

مثال : “name.htm” و یا “name.html”

شروع کار با html

زبان برنامه نویسی html را باهم با یک تمرین و معرفی علائم و کاربرد آنها آغاز می کنیم.

<html> : این تابع در آغاز برنامه های html می آید و هدف آن معرفی نوع زبان استفاده شده که همان html می باشد به مرورگر است.
<head> : این به معنای آغاز قسمت هد فایل است که درآن موارد زیادی از جمله عنوان و استایل و … قرار می گیرد این تابع(یا هرچیزی که اسمش را بگذاریم)با به پایان می رسد.

<title> : درون این تابع عنوان صفحات قرار می گیرد.
<body> : این به معنای آغاز بدنه ی سایت که شامل تمامی موارد قابل نمایش به کاربر از عکس و جدول ها گرفته تا متن است.

یک برنامه ساده را برای شروع با شما آغاز می کنیم: این برنامه یک متن ساده را نمایش می دهد و نحوه عنوان گذاری برای صفحات نیز برای شما آموزش داده می شود.

برنامه نوت پد را باز کنید.

کدهای زیر را در آن تایپ کنید.(حتما تایپ کنید که موجب یادگیری و تقویت حافظه طولانی مدت شما خواهد شد.

به نحوه بسته شدن تابع با ” /  ” دقت کنید.


html چیست؟

کلمه html مخفف عبارت (hyper text markup language) به معنای “نشانه گذاری فرامتنی” می باشد.

هر فایل html برای اجرا باید دارای یکی از دو فرمت htm و یا html می باشد. ( name.html یا name.htm)

زبان html به چه دردی می خورد؟

html زبانی است که سایت را به کاربر نمایش می دهد,عکس ها به کاربر نمایش می دهد و جدول ایجاد می کند.شما روزانه به سایت های زیادی سر می زنید.

اگر html را از این سایت ها کنار بگذاریم.هیچ چیزی برای نمایش به شما وجود نخواهد داشت.

آموزش html را میخواهیم گام به گام و با همراهی شما آغاز کنیم.

بر روی html در قسمت دسته ها کلیک کنید تا آخرین آموزش های ارائه شده را برای این زبان مشاهده نمایید.