در توسینسو تدریس کنید

و

با دانش خود درآمد کسب کنید

آموزش HTML گام به گام قسمت 4 : عنوان بندی و تگ های جدید

اگر یادتان باشد در قسمت های قبلی به تگ های عنوان بندی اشاره کردم در این جلسه میخواهم کمی بیشتر در رابطه با آنها حرف بزنیم. خب همانطور که گفته شد تگ های عنوان بندی با حرف h و یک عدد بین 1 تا 6 نوشته می شود.

<h1>Heading</h1>

یکی از نکات مهم این تگ این هستش که عدد مورد نظر اگر بیشتر باشد سایز نوشته کوچک خواهد بود اما توجه کنید که محدوده این عدد دربین 1 تا 6 می باشد.

<h1>Heading</h1>
<h2>Heading</h2>
<h3>Heading</h3>
<h4>Heading</h4>
<h5>Heading</h5>
<h6>Heading</h6>

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

  • نکته: برای قوی کردن یا بزرگ کردن متون عادی از این تگ ها هیچوقت استفاده نکنید، چون تگ های دیگری برای اینکار وجود دارد.

تگ <hr> در HTML

این تگ مخفف کلمات Horizontal Rules می باشد که برای تعریف یک خط افقی استفاده می شود. با این تگ می شود یک خط افقی با حالت واکنشگرا نسبت به بزرگی و کوچکی صفحه مرورگر رسم کرد. اگر یادتان باشد در درس قبلی که به مبحث توصیفات پرداختیم یک مشخصه خیلی مهم width رو بررسی کردیم که برای عرض چه تصاویر و چه بسیاری دیگر از عناصر صفحات وب کاربرد دارد. تگ hr نیز از این قاعده پیروی می کند. تگ <hr> از آن تگ هایی است که تگ پایانی ندارد.

<hr width=”100”>

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

تگ br در HTML

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

<html>
<body>
ITPRO
HTML
</body>
</html>

و

<html>
<body>
ITPRO
<br>
HTML
</body>
</html>

تگ های Head در html

تا کنون با هر تگی که آشنا شدید در قسمت Body سندهای اچ تی ام ال استفاده می شد. اما درون تگ head نیز یکسری تگ ها قرار می گیره که اکثرا مشخصات سایت که برای موتورهای جستجوگر مهمه درش قرار می گیره مثل تگ عنوان، نام نویسنده و... خب یکی از تگ های بسیار کاربردی در این قسمت تگ عنوان یا <title> می باشد که برای مرورگر و موتور بهینه بسیار کاربردی است. متن داخل این تگ روی زبانه مرورگر نمایش داده می شود.

<head>
<title> ITPRO HTML </title>
</head>

در این کد متن ITPRO HTML روی زبانه مرورگر نمایش داده می شود. یکی دیگر از تگهای بسیار مهم در این قسمت تگ <meta charset=””> می باشد که برای مشخص کردن کاراکترها صفحه استفاده می شود. مثلا در حالت پیش فرض کاراکترهای قابل شناسایی در مرورگر ها و سندهای اچ تی ام ال صرفا انگلیسی می باشند و همین باعث می شود که کاراکترهای عربی، فارسی و... نمایش داده نشود. برای این کار در قسمت Head از دستور زیر استفاده می کنیم.

<meta charset="UTF-8">

مقدار UTF-8 برای شناسایی یونیکد و... کاربرد دارد. در رابطه با تگ های دیگر این قسمت در بخش های آینده ذکر می کنیم!

نویسنده : ارسطو عباسی

منبع : جزیره طراحی و توسعه وب وب سایت توسینسو

هرگونه نشر و کپی برداری بدون ذکر منبع و نام نویسنده دارای اشکال اخلاقی می باشد

#آموزش_قدم_به_قدم_html #آموزش_html_و_css #مبانی_html #آموزش_تگ_ها_در_html #آموزش_html #آموزش_طراحی_وبسایت_با_html #آموزش_گام_به_گام_html #آموزش_مقدماتی_html_و_css #استفاده_از_تگ_های_html #آموزش_مقدماتی_html
عنوان
1 آموزش HTML گام به گام قسمت 1 : معرفی و آشنایی کلی رایگان
2 آموزش HTML گام به گام قسمت 2 : دستورات مقدماتی و معرفی ساختار رایگان
3 آموزش HTML گام به گام قسمت 3 : صفحات یا Attributes و نکات مربوطه رایگان
4 آموزش HTML گام به گام قسمت 4 : عنوان بندی و تگ های جدید رایگان
5 آموزش HTML گام به گام قسمت 5 : استایل و فرمت متن ها رایگان
6 آموزش HTML گام به گام قسمت 6 : نقل قول و درج توضیحات رایگان
7 آموزش HTML گام به گام قسمت 7 : استفاده از رنگ رایگان
8 آموزش HTML گام به گام قسمت 8 : CSS چیست و مقدمات آن رایگان
9 آموزش HTML گام به گام قسمت 9 : لینک ها رایگان
10 آموزش HTML گام به گام قسمت 10 : تصاویر رایگان
11 آموزش HTML گام به گام قسمت 11 : جداول رایگان
12 آموزش HTML گام به گام قسمت 12 : لیست ها رایگان
13 آموزش HTML گام به گام قسمت 13 : بلاک و کلاس ها رایگان
14 آموزش HTML گام به گام قسمت 14 : قاب بندی رایگان
15 آموزش HTML گام به گام قسمت 15 : تگ عنوان یا Head رایگان
16 آموزش HTML گام به گام قسمت 16 : چند قانون ساده رایگان
17 آموزش HTML گام به گام قسمت 18 : فرم ها رایگان
18 آموزش HTML گام به گام قسمت 19 : کنترل ها و اجزای فرم رایگان
19 آموزش HTML گام به گام قسمت 20 : انواع ورودی رایگان
20 آموزش HTML گام به گام قسمت 21 : خاصیت های تگ input رایگان
21 آموزش HTML گام به گام قسمت 22 : چندرسانه/ویدیو و صدا رایگان
22 آموزش HTML گام به گام قسمت 23 : مدیریت بهتر لایه های وب رایگان
زمان و قیمت کل 0″ 0
0 نظر

هیچ نظری ارسال نشده است! اولین نظر برای این مطلب را شما ارسال کنید...

نظر شما
برای ارسال نظر باید وارد شوید.
از سرتاسر توسینسو
تنظیمات حریم خصوصی
تائید صرفنظر
×

تو می تونی بهترین نتیجه رو تضمینی با بهترین های ایران بدست بیاری ، پس مقایسه کن و بعد خرید کن : فقط توی جشنواره تابستانه می تونی امروز ارزونتر از فردا خرید کنی ....