تگ br

تگ br در html

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

تگ br این شکست خط و انتقال بخشی از متن را در سند html به خط بعدی انجام می دهد.

تگ br به عنوان یک تگ خالی یا تگ تهی شناسایی می شود.

به عبارت دیگر تگ br مانند برخی از تگ های سند اچ تی ام ال تنها شامل تگ باز ( opening tag ) می باشد و تگ پایانی ( تگ بسته ) یا ( closing tag ) را ندارد.

کاربرد تگ br زمانی مهمتر می شود، که توسعه دهنده وب قصد درج آدرس و یا اشعار و… در سند html خود دارد. در این صورت به جای استفاده از تگ p ( پارگراف ) از تگbr جهت شکست خط می توان استفاده کرد.

نحوه نوشتار تگ br

 

تگ section

تگ section در html

 

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

 

از تگ section هنگامی که فقط نیاز به استایل دادن و اسکریپت نویسی دارید استفاده نکنید.

هنگامی از تگ section استفاده کنید که محتوای شما از نظر مفهومی دارای تم مشخصی است

محل قرارگیری section

حتما به تگ section خود عنوان بدهید.

تگ section جایگزینی برای تگ div نیست.

هرچند سایر تگهای HTML5  مانند تگ header ، تگ footer ،  تگ main و … با div هایی که ان قسمت ها را در بر میگرفتند جایگزین شدند. ولی برای تگ section اینگونه نیست. اگر تعریف این تگ در مستندات مربوط به html5 را بخوانید، به این موضوع پی خواهید برد.

 

تگ aside

معرفی و کاربرد تگ aside در HTML

در این مقاله قصد داریم به معرفی و کاربرد تگ aside در HTML بپردازیم.

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

این تگ عمدتا به عنوان سایدبار سایت نشان داده میشود.

درون تگ aside اغلب توضیحات جانبی، مانند تعریف لغات یا چیزهایی که کمتر به محتوای اصلی مرتبط هستند مانند تبلیغات ، زندگینامه نویسنده و یا برنامه های کاربردی وب سایت ها ، اطلاعات پروفایل و یا لینک وبلاگ های مرتبط و… قرار می گیرد.

از تگ aside به دو صورت می توان استفاده نمود:

1. استفاده از تگ aside بصورت تو در تو در دیگر تگ ها: بعنوان مثال اگر از تگ aside داخل تگ articl استفاده می کنید، محتوایی که برای تگ aside در نظر می گیرید باید با محتوای تگ article ارتباط معنایی داشته باشد.
2. استفاده از تگ aside برای نمایش ستون های سمت راست و چپ: در این حالت هر محتوایی که لازم است در ستون سمت راست و چپ  قرار گیرد را می توان در تگ aside، قرار داد.

تگ aside به عنوان یکی از تگ های جدید در html5 می باشد. تگ aside در html 4.0.1 وجود نداشت.

نکته مهم

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

 

محتوای aside می تواند به عنوان یک نوار در یک مقاله قرار بگیرد.

تگ aside هیچگونه خصوصیت ویژه در html ندارد.

البته تگ aside از خاصیت های عمومی HTML پشتیبانی میکند.

تگ article

تگ article در اچ تی ام ال

یکی از تگ های جدید در اسناد html که در نسخه ۵ این زبان اضافه شد، تگ article می باشد.

تگ article یا تگ مقالات به عنوان یکی از تگ های مستقل در سند html کاربرد دارد.

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

هر تگ article می تواند دارای مجموعه تگ هایی درون خود باشد.

تگ article می تواند دارای تصویر (تصویر بند انگشتی) ، بخشی از محتوای پست ، عنوان پست و… باشد.

تگ مقالات می تواند در سکشن مستقل خود در صفحه به کار رفته نماینده ای از موارد زیر باشد:

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

درون تگ article هر عنصری که لازم باشد استفاده می شود.

 

محل قرارگیری article

تگ های img ، a ، section ، p ، span ، h1-h6 ، div و… برخی از تگ هایی است که در صورت نیاز درون تگ article یا تگ مقالات استفاده می شود.

تگ audio

تگ audio در HTML

تگ audio تعیین صوت ، مانند موسیقی یا دیگر جریان های صوتی را مشخص می کند.

در حال حاضر سه نوع فرمت صوتی در تگ audio پشتیبانی می شود که عبارتند از: MP3 ، Wav و Ogg

پشتیبانی مرورگرها از تگ audio در HTML

تگ audio تقریبا در بیشتر مرورگرهای معتبر اعم از اپرا ورژن ۱۰.۵ به بالا ، فایرفاکس ورژن ۳.۵ به بالا ، اینترنت اکسپلورر ورژن ۹.۰ به بالا ، گوگل کروم ورژن ۴.۰ به بالا و سافاری ورژن ۴.۰ به بالا پشتیبانی می شود.

تگ audio در HTML5 جدید است.

نکته: هر نوشته ای که بین audio و audio/ قرار گیرد، در مرورگر هایی که این تگ را پشتیبانی نمی کنند نمایش داده خواهد شد.

تگ iframe

تگ iframe در اچ تی ام ال

 

کاربردهای مهم تگ iframe در سند اچ تی ام ال

تگ iframe زمانی کاربرد دارد، که می خواهیم صفحه دیگری را در صفحه اصلی خود به نمایش در آوریم.

 

همچنین از تگ iframe می توانیم در ساخت فریم ها یا قاب های درون خطی نیز استفاده کنیم.

مورد استفاده دیگر تگ iframe در ساخت قاب جعبه ویدیو پلیر ها در اسناد html می باشد.

نحوه نمایش تگ iframe

ساختار عنصر iframe در سند اچ تی ام ال

تگ iframe از جمله تگ هایی است که شامل یک تگ باز ( Opening Tag ) و یک تگ بسته ( Closing Tag ) می باشد.

تگ iframe شامل یک سری Attribute های مهم درون خود می باشد، که بر روی تگ iframe کنترل دارند.

مهمترین خاصیت های تگ iframe در سند اچ تی ام ال

1. خاصیت src
2. خاصیت width
3. خاصیت height
4. خاصیت frameborder

 

1- خاصیت src در تگ iframe

یکی از صفات مهم در تگ iframe یک Attribute به نام src می باشد.

خاصیت src در حقیقت مقداری برابر با آدرس صفحه هدف ( target ) می گیرد که قرار است در یک فریم در صفحه اصلی ما به نمایش در آید.

البته خاصیت src در ساخت فریم ها یا قاب های درون خطی هم کاربرد دارد.

2- خاصیت width در تگ iframe 

یکی دیگر از صفات مهم در تگ iframe ، خاصیت width می باشد.

با خاصیت width درون تگ iframe و تعیین مقدار برای آن شما می توانید عرض یا پهنای فریم خود را مشخص کنید.

3- خاصیت height در تگ iframe درون سند اچ تی ام ال

صفت مهم دیگر در تگ iframe خاصیتی به نام height می باشد.

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

4- خاصیت frameborder در تگ iframe

چنانچه قصد دارید border پیش فرض دور فریم ساخته شده شما حذف شود، از خاصیت frameborder و مقدار ۰ استفاده کنید. تا border پیش فرض قاب مورد نظر شما حذف گردد.

 

تگ frame

تگ frame در html

 

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

لذا اگر سئوی وبسایت برای شما نیزاهمیت دارد، از این تگ به جهت مشکلات مذکور استفاده نکنید.

بنابراین تگ frame از جمله تگ های منسوخ در HTML5 به شمار می آید.

تگ frame یک پنجره خاص (قاب) را  در یک تگ frameset تعریف می کند.

هر تگ frame داخل یک تگ frameset می تواند ویژگی های مختلفی از جمله: border ،scrolling و ability to resize (قابلیت تغییر سایز) و … داشته باشد.

نحوه نوشتن تگ frame

نکته مهم :

اگر می خواهید یک صفحه حاوی frames ، را Validate (اعتبار) کنید لازم است که DOCTYPE!  به یکی از دو حالت  “HTML Frameset DTD” یا “XHTML Frameset DTD” تنظیم شده باشد.

تگ frame تگ پایانی در سند HTML ندارد اگرچه در XHTML این تگ با تگ پایانی نیز همراه است.

تگ Frameset

Frame یا قاب به طراح وب این امکان را می دهد که چند صفحه و سند html  را در یک صفحه و سند وب مورد نمایش قرار دهد. اگرچه نمایش چندگانه صفحات وب در یک صفحه به نظر جذاب است ، اما به دلیل مشکلاتی از قبیل مشکل در چاپ صفحه و چند موضوعی شدن سند ( که برای رتبه سایت در موتورهای جستجو امتیاز منفی به حساب می آید ) امروزه اکثر تگ های مرتبط با قاب بندی صفحات وب عملا منسوخ شدند.

لذا اگر سئوی وبسایت برای شما نیزاهمیت دارد، از این تگ به جهت مشکلات مذکور استفاده نکنید.

تگ frameset یک قاب را تعریف می کند.

تگ frameset یک یا چند تگ frame را شامل می شود. هر تگ frame می تواند حاوی سندی جداگانه باشد.

تگ frameset مشخص می کند که چه تعداد ستون یا ردیف باید در قاب قرار گیرد، هر کدام چند درصد / پیکسل از فضا را اشغال کند.

نکته: اگر می خواهید یک صفحه حاوی frames، را Validate (اعتبار) کنید لازم است که DOCTYPE! به یکی از دو حالت  “HTML Frameset DTD” یا “XHTML Frameset DTD” تنظیم شده باشد.

www.websazandeh.ir

امیدوارم این مطالب مفید واقع شده باشه!

تگ td

تگtd در html

تگ td یک ستون در جدول HTML تعریف می کند.

یک تگ td شامل یک یا چند تگ th و tr است.

تگ td درون تگ table به همراه تگ هایی همچون tr و th یک جدول در سند HTML می سازد.

به عبارت دیگر یک جدول حاوی سطرهایی می باشد (که با تگ tr مشخص می شود)، هر سطر شامل تعدادی سلول است (که با تگ td مشخص می شود) و یک جدول شامل اطلاعات سرتیتر می باشد(که با تگ th مشخص می شود).

 

تگ tr

تگ در HTML

تگ tr یک سطر در جدول HTML تعریف می کند.

یک تگ tr شامل یک یا چند تگ th و td است.

تگ tr درون تگ table به همراه تگ هایی همچون td و th یک جدول در سند HTML می سازد.

نحوه طراحی جدول

به عبارت دیگر یک جدول حاوی سطرهایی می باشد (که با تگ tr مشخص می شود)، هر سطر شامل تعدادی سلول است (که با تگ td مشخص می شود) و یک جدول شامل اطلاعات سرتیتر می باشد(که با تگ th مشخص می شود).

تگ table

تگ table در HTML

تگ table یک جدول در سند HTML تعریف می کند.

جدول HTML تشکیل شده از تگ table و یک یا چند تگ tr ، th و td می باشد.

نحوه نوشتن تگ table

یک جدول حاوی سطرهایی می باشد (که با تگ tr مشخص می شود)، هر سطر شامل تعدادی سلول است (که با تگ td مشخص می شود) و یک جدول شامل اطلاعات سرتیتر  می باشد(که با تگ th مشخص می شود).

 

تگ link

تگ link

تگ link پیوند بین یک سند و یک منبع خارجی را تعریف می کند.

تگ link در یکی از کاربردهایش برای پیوند به style sheets ( شیوه نامه های خارجی ) استفاده می شود.

نحوه فراخوانی تگ link

تگ link یک تگ خالی است، و فقط شامل attributes ( خصوصیت ها ) می باشد.

ویژگی های تگ link

به عبارت دیگر تگ link فقط یک تگ باز ( opening tag ) دارد، و تگ بسته ( closing tag ) ندارد.

تگ link در قسمت head قرار می گیرد، اما می توان بارها از آن استفاده کرد.

 

 

 

تگ i

تگ i در Html

تگ i بخشی از متن را با صدا یا حالتی متناوب تعریف می کند.

محتوای تگ i معمولا به صورت کج یا مورب نشان داده می شود.

تگ i را می توان برای نشان دادن یک اصطلاح فنی، یک عبارت از زبانی دیگر، یک فکر، یک نام و غیره استفاده کرد.

از تگ i زمانی استفاده می کنیم که یک عنصر معنایی (semantic) مناسب تری پیدا نکنیم.

بررسی تگ i در HTML 4.01 و HTML5

در HTML 4.01، تگ i برای متن به صورت مورب استفاده می شود، با این حال ، در HTML5 کاربردی ندارد. زیرا این گونه تغییرات را می توان با استایل دادن به متن درون تگ i ایجاد کرد.

ویژگی های خصوصی تگ i در HTML

تگ i هیچ خاصیت ویژه ای در سند HTML ندارد.

ویژگی های عمومی تگ i در HTML

تگ i از کلیه ویژگی های عمومی در سند HTML پشتیبانی می کند.

نحوه نوشتاری و نمایش تگ i

 

تگ em

تگ در HTML

تگ em

تگ em یک تگ عبارتی است و متن را به صورت تاکید ارائه می دهد .

نکته: استفاده از این تگ توصیه نمی شود. و برای رسیدن به نتایج بهتر می توانید از CSS استفاده کنید.

نحوه نوشتاری تگ em

 

تگ img

عنصر img و نمایش تصاویر با html

تگ img ، یکی از پرکاربردترین ترین تگ ها در زبان html به حساب میاد.

شما اگر بخواهید در مرورگرتون عکسی به نمایش در بیاد ، باید از تگ img استفاده کنید.

 

img از جمله تگ های self closing tag یا تگ تکی محسوب میشه. که در مقاله مفهوم تگ در زبان html توضیح دادم.

تگ پرکابرد img دارای چندین اسم خصوصیت ( ATTRIBUTE NAME ) و مقدار خصوصیت ها ( ATTRIBUTE VALUE ) هستش.

یکی از مهمترین اسم خصوصیت های این تگ ، خصوصیت src هست.

این خصوصیت برابر با آدرس تصویری است که در مروگر نمایش داده میشه.

یعنی پس از src و = شما مسیر عکسی که میخواهید در مرورگرتون نشون داده بشه رو داخل یک دبل کوتیشن (“”) قرار می دید.

اگر آدرس عکستون رو درست به مقدار این خصوصیت بدید ، تصویرتون در مرورگر نمایش داده میشه.

آناتومی یک تگ img

اگر سئوی یک عکس برای شما اهمیت داره حتما باید از خصوصیت alt هم استفاده کنید.

خصوصیت alt یک مقدار میگیره که در واقع میتونه اسمی برای اون عکس باشه.

در واقع یه زمانی اگر به هر دلیلی عکس شما لود نشه یا حذف بشه و یا مسیرش تغییر کرده باشه و در مرورگرتون به نمایش درنیاید، اسمی که در ویژگی alt براش تعریف کردید نمایش داده میشه.

استفاده از ویژگی alt برای خزش بهتر موتور جستجو روی عکس ها بسیار مهمه. لذا حتما در تصاویرتون از این اتریبیوت استفاده کنید.

البته img همونطور که خدمتتون عرض کردم ، دارای چندین خصوصیت هستش ،

در جلسه بعدی کلیه خصوصیت های img رو برای شما همراهان گرامی معرفی میکنم.

امیدوارم مفید واقع شده باشه

تگ B

معرفی و کاربرد تگ b در اچ تی ام ال

در این مقاله به معرفی و کاربرد تگ b در اچ تی ام ال می پردازیم.

تگ b در html باعث میشود که محتوای آن به صورت توپر ، برجسته و یا bold  نشان داده شود.

تگ b مانند بسیاری از تگ های html دارای یک تگ باز ( opening tag ) و یک تگ بسته ( closing tag ) می باشد.

درون تگ باز و بسته محتوایی که می خواهید در سند html برجسته کنید را قرار دهید.

 

وجه داشته باشید که با توجه به خصوصیات HTML5 ، از تگ b زمانی میتوانید استفاده کنید که هیچ تگ مناسب تری وجود نداشته باشد .

به عبارتی علی رغم اینکه تگ b در هر دو ورژن HTML 4.0.1 و HTML5 استفاده می شود، اما کاربرد کمتری در ورژن جدید HTML یعنی HTML5 دارد.

در HTML 5 برای عناوین یا تیترها باید از تگ های h1 تا h6 استفاده شود.

و برای متن تاکیدی از تگ em ، برای متن هایلایت شده از تگ mark استفاده می کنند.

و برای متن مهم بجای تگ b بهتر است از تگ strong استفاده کنید.

جایگزین مناسب این تگ ویژگی font-weight در CSS و تگ strong در اچ تی ام ال میباشد.

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

پشتیبانی مرورگرها از تگ b

تگ b در همه مرورگرهای اصلی نظیر اینترنت اکسپلورر، فایرفاکس ، اپرا ، گوگل کروم و سافاری پشتیبانی می شود.

خاصیت های ویژه تگ b در html

تگ b هیچ خاصیت ویژه ای ندارد

خاصیت های عمومی تگ b در اچ تی ام ال

تگ b از خاصیت های عمومی HTML پشتیبانی میکند.

 

تگ a

روش ایجاد لینک در اچ تی ام ال

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

برای ایجاد لینک بر روی متن و یا حتی عکس مورد نظر ، از تگ a استفاده می شود.

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

 

در قسمت تگ باز یک اسم خصوصیت ( Attribute Name ) با نام href قرار دارد.

href در تگ a ، یک مقدار خصوصیت ( Attribute Value ) میگیرد.

در واقع برای تگ a مهم ترین خصوصیت href است، که نشان می دهد مقصد لینک کجاست.

به طور پیش فرض ، لینک ها در مرورگرها به یکی از روش های زیر، ظاهر می شوند:

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

که در حقیقت ، این مقدار ( Value ) نشان دهنده مسیر پیوند است.

تگ های هدینگ (h1,h2,h3,h4,h5,h6)

تگ هدینگ در HTML تگ h1 و h2 و h3 و h4 و h5 و h6

تگ heading در اچ تی ام ال ، یکی از تگ های مهم در این زبان برنامه نویسی به شمار می آید.

مجموعه تگ های هدینگ شامل ۶ تگ از h1 تا h6 می باشند. که همه آنها شامل یک تگ باز و یک تگ بسته هستند.

 

در بین تگ باز و بسته هدینگ می توانیم محتویات ( Content ) مورد نظر خود را قرار دهیم.

متونی که از اهمیت بالایی در سند اچ تی ام ال برخوردار هستند، در بین تگ باز و بسته هدینگ قرار می دهیم.

تگ های هدینگ معمولا برای درج تیترها در html کاربرد دارند. و از نظر اولویت با یکدیگر تفاوت دارند.

بطوریکه تگ h1 بالاترین اولویت و تگ h6 از کمترین اولویت برخوردار است.

ساختار انواع هدینگ ها در سند اچ تی ام ال :

همان طور که در تصویر زیر مشاهده می کنید ، در بین تگ های باز و بسته h1 تا h6 محتوا قرار گرفته است.

به عبارت دیگر تگ های هدینگ شامل یک تگ باز ( Opening Tag ) و یک تگ بسته ( Closing Tag ) می باشد.

در داخل تگ باز و بسته هدینگ ، محتوا قرار می گیرد.

شما زمانی که بخشی از متن سند خود را داخل تگ هدینگ قرار می دهید ، اهمیت متن را برای موتور جستجو تعریف می کنید.

 

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

لذا برای سئو و بهینه سازی سایت شما اهمیت بالایی دارد که کدام متن را تگ هدینگ بدهید.

در بین تگ های هدینگ h1 از بیشترین اهمیت و h6 از کمترین اهمیت برای موتور جستجو برخوردار است.

استفاده بهینه از تگ های هدینگ تاثیر بسزایی در ارتقای کلمات کلیدی مورد نظر شما دارد.

هدینگ کلمه کلیدی و استفاده بهینه از آن در محتوای صفحه به زودی اهمیت کلمه کلیدی شما را در بین موتورهای جستجو بالا می برد.

نحوه تمایش تگ های Heading

 

تگ Header

تگ header در HTML

 

تگ header یک سربرگ برای یک سند یا یک بخش تعریف می کند.

در HTML4 و نسخه های قبل از آن برای تعریف سربرگ اصلی یا هدر سایت که در همه صفحات سایت بایست تکرار شود، از یک تگ div  که در داخل آن یک id که معمولا برابر با header بود قرار می گرفت.

و تمام متعلقات هدر هم درون همان تگ با id هدر قرار می گرفت.

اما در نسخه HTML5 یک تگ اختصاصی header برای ساخت سربرگ اصلی سایت در نظر گرفته شد.

تگ header باید شامل اطلاعاتی مربوط به عنصر حاوی اش باشد.

تگ header به طور معمول شامل منو های سایت ، لوگوی سایت ، توضیح کوتاه در مورد فعالیت وبسایت و… می تواند می باشد.

نکته مهم :

شما می توانید چندین تگ header در یک سند HTML داشته باشید.

به عبارت دیگر شما علاوه بر هدر اصلی وبسایت خود می توانید برای بخش های مختلف سایت خود اعم از مقالات ( articles ) ، سایدبار ( aside ) ، سکشن های متنوع و… هم از تگ header یا تگ سربرگ و هم از تگ footer یا تگ پابرگ استفاده کنید.

 

محل قرارگیری Header و سایر عناصر

 

تگ P

معرفی عنصر p در HTML

عنصر p در اچ تی ام ال ، یکی از تگ های پرکاربرد در این زبان به حساب می آید.

 

تگ p برای ساخت پاراگراف در پروژه های مختلف طراحی سایت استفاده می شود.

این تگ دارای هر دو تگ باز و بسته می باشد. یعنی مطابق شکل بالا دارای opening tag و closing tag می باشد.

داخل هشتک باز (>) و هشتک بسته (<) اسم تگ Pمی آید.

و در تگ بسته یک علامت (/) بعد از هشتک باز (>) اضافه می شود.

در مقالات آموزشی قبل تفاوت inline-level و block-level را به شما آموزش دادیم.

تگ پاراگراف به عنوان یکی از تگ های block-level می باشد.

و با وجود محتوای کمتر از یک خط نیز یک خط ( بلاک ) کامل را به خود اختصاص می دهد.

یعنی هیچ تگ block-level و inline-level دیگری اجازه همراهی با این تگ در یک خط را ندارند.

خصوصیات عمومی تگ P در HTML

تگ P از کلیه ویژگی های عمومی در سند HTML پشتیبانی می کند.

رویدادهای عمومی تگP در HTML

تگ P از کلیه رویدادهای عمومی در سند HTML پشتیبانی می کند.

پشتیبانی مرورگرها از تگ P

تگ P در همه مرورگرهای معتبر اینترنتی نظیر اینترنت اکسپلورر ، فایرفاکس ، اپرا ، گوگل کروم و سافاری پشتیبانی می شود.

تگ <title>

تگ title

 :

• یک عنوان را در نوار ابزار مرورگر تعریف می کند.
• هنگامی که می خواهید صفحه ای را به لیست favorite اضافه نمایید از محتویات عنصر title برای این منظور استفاده می شود.
• نتایج موتور های جستجو بر اساس محتویات تگ title گزارش می شود.

تگ title

 درون تگ title  قرار می گیرد. تگ title  نیز یک ظرف برای همه عناصر عنوان است.

تگ head باید شامل یک title برای سند باشد و می تواند شامل script ها باشد، مرورگر را به مکانی هدایت کند که style sheet ها رابیابد، اطلاعات meta را ارائه کند و غیره..

نکته ۱ : شما نمی توانید بیشتر از یک تگ title در سند HTML خود داشته باشید.

نکته ۲ : اگر شما تگ title را حذف کنید، سند HTML شما اعتباری نخواهد داشت.

websazandeh.ir

             تگ title در همه سندهای HTML الزامی است و عنوان سند را تعریف می کند.

تگ <head>

تگ head برای نشان دادن بخش هد سند HTML و اطلاعات عمومی (metadata) در مورد سند استفاده می شود.

و باید شامل یک عنوان برای سند باشد و همچنین میتواند اسکریپت ها، استایل ها، اطلاعات متا و … را نیز در بربگیرد.

بین دو تگ  و  تگ‌های جدیدی با اسم تگ باز  و تگ بسته  قرار می‌گیرند.

به این عمل, یعنی قرار دادن یک تگ در دل تگ دیگر ، nest می‌گویند.

تگ  و  در برگیرنده اطلاعات ابتدایی را در رابطه با صفحه html است.

مثلا می‌گوید نویسنده این صفحه چه کسی است یا توضیحاتی در رابطه با خود سایت ارائه می‌کند.

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

در حالی که محتویات کمی از تگ head به کاربران نشان داده میشود ، اما این تگ برای رباتها مهم است.

موتورهای جستجو ، خزنده هایی دارند (به عنوان مثال در گوگل GoogleBot نامیده میشوند) که به طور مداوم برای گردآوری و ایندکس کردن لینک ها از یک سایت به سایت دیگر به در اینترنت به گشت و گذار می پردازند.

گوگل دارای الگوریتمی است که تصمیم می گیرد کدام صفحات به عبارات جستجو مرتبط تر هستند.

وب سایت های که به خوبی توسط اسپایدر ها خوانده شود به احتمال زیاد در نتایج موتورهای جستجو رتبه بالایی خواهند داشت.

به این فرآیند SEO یا بهینه سازی موتور جستجو گفته میشود.

بررسی تگ در HTML 4.01 و HTML5

تفاوت خاصی از نظر کاربرد ندارند. منتها در HTML5 دیگر خاصیت profile پشتیبانی نمی شود.

خصوصیات ویژه تگ در HTML

تنها خاصیت ویژه profile که مقدار URL را می گیرد در HTML5 پشتیبانی نمی شود.

URL یک پرونده حاوی مجموعه ای از قوانین ر ا مشخص میکند.

خصوصیات عمومی تگ در HTML

تگ  از کلیه ویژگی های عمومی در سند HTML پشتیبانی می کند.

رویدادهای عمومی تگ در HTML

تگ  از کلیه رویدادهای عمومی در سند HTML پشتیبانی می کند.

پشتیبانی مرورگرها از تگ در HTML

تگ  در همه مرورگرهای معتبر اینترنتی نظیر اینترنت اکسپلورر ، فایرفاکس ، اپرا ، گوگل کروم و سافاری پشتیبانی می شود.

www.websazandeh.ir

 

معرفی و کاربرد تگ <html>

زبان html به عنوان یک زبان طراحی در زمینه طراحی وب شناخته می شود.

در حقیقت html ساختار و چارچوب یک وبسایت را براساس کدهای html ایجاد می کند.

معرفی و کاربرد تگ html

 

html ، شامل ۵ ورژن در نسخه های قدیمی تا جدید خود می باشد. که اسناد html اخیرا بر پایه html5 نوشته می شود.

اولین جمله هر سند اچ تی ام ال  است.

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

پس  اولین کاری که انجام می‌دهیم، آن است که همین کلمه را در ابتدای سند بنویسیم.

اگر نگاهی به صفحه ساده‌ای که برایتان مثال زدیم نیز بیندازید, در خط اول کلمه  را می‌بینید.

پس بخاطر داشته باشید که ما همیشه آن را در اولین خط از کدهایمان قرار می‌دهیم.

ساختار  تگ  HTML

دومین رکن اصلی هر صفحه HTML ، استفاده از تگ های باز و بسته  و  است.

که برای شروع نوشتن زبان اچ تی ام ال از آن استفاده می‌کنیم.

همه محتویات یک صفحه Html5 را از این به بعد در بین این دو تگ  html ، می نویسیم.

تگ های باز در html به opening tag و تگ های بسته در html به closing tag معروف هستند.

تگ  اچ تی ام ال ، به عنوان ریشه اصلی سند html و پدر همه تگ های درونی سند html است.

 

<DOCTYPE!> چیست؟

معرفی تگ   در HTML

تگ ابتدایی ترین تگ در زبان5 HTML است و تنها تگی است که تگ پایانی برایش تعریف نمی شود. تگ  به مرورگر کمک میکند تا صفحات وب را به درستی نمایش بدهد و متوجه شود تگ های نوشته شد ۱۰۰%5 HTML هستند و نسخه اچ تی ام ال استفاده شده را در نظر میگیرد. این نکته را به خاطر داشته باشید نوشتن این تگ هیچ دستوری را به5 HTML ارجاع نمیدهد و تنها برای نمایش درست در مرورگر است.

 

www.websazandeh.ir

 

کدنویسی با HTML

همانطور که بیان شد html زبان برنامه نویسی نیست و هیچ گونه محاسبه ای برای ما انجام نمیدهد. Html یک زبان نشانه گذاری به حساب می آید. به همین دلیل کدنویسی با این زبان کمی متفاوت تر از دیگر زبانهاست. در زبان اچ تی ام ال ما از تگ ها برای نشان دادن المنت های اصلی در وب سایت استفاده میکنیم. حالت استاندارد استفاده از تگ ها بصورت زیر هست:

 

تگ ها از یک استاندارد خاص استفاده میکنند و هر تگ شامل یک تگ باز و یک تگ بسته است. به تگ باز Opening tag و به تگ بسته Closing tag گفته میشود. تفاوت تگ باز با تگ بسته به تنها یک اسلش (/) اضافه در تگ بسته است و به صورت زیر است:

Content

در برخی موارد تگ ها داری تگ بسته نیستند. Html زبانی نیست که نسبت به حروف بزرگ و کوچک حساس باشد و در اصطلاح (Case Sensitive)کیس سنسیتو نیست و سینتکس بسیار ساده ای دارد. برای کار با HTML  اصلا نیاز به سخت افزار قدرتمندی نیست وبا ساده ترین سیستم و نرم افزار میتوان آنرا قرا گرفت و از آن استفاده کرد. اولین برنامه که میتوان کد های html  را در آن نوشت نرم افزار نوت پد(not pad) است که روی تمام سیستم ها که ویندوز دارد قرار دارد. پس از نوشتن کد هایhtml  ، خروجی آنها در  مرورگر پردازش میشود و مرورگر آنرا نمایش میدهد.

websazandeh.ir

 

تغییرات در html 5 نسبت به نسخه های پیشین

 

1. در نسخه های پیشین بدون فلش پلیر امکان استفاده از رسانه های مختلف امکان پذیر نبود. html نسخه ی 5 با استفاده از تگ های audio و video این امکان به سادگی به وجود آمده است.
2. در نسخه های پیشین html در مرورگر اجرا نمیشود اما در html 5 جاوا اسکریپت در پس زمینه اجرا میشود .
3. توسط html های قدیمی طرح ها و نمودار ها  تنها با ابزار هایی مانند فلش پلیر ها امکان استفاده داشتند اما در html نسخه 5 یک بخش مجزا از این زبان استفاده از svg و طرح ها هستند.
4. در نسخه های پیشین امکان درگ اند دراپ (drag & drop)وجود نداشت در حالی که در نسخه ی5  html وجود دارد.
5. در نسخه های قدیمی امکان استفاده از اشکال هندسی مانند دایره، مربع و مثلث وجود نداشت؛ در حال که در نسخه ی5 html این امکان وجود دارد.
6. نسخه های قدیمی با تمام مرورگر های قدیمی سازگارند ولی نسخه ی 5 این زبان تنها با مرورگرهای جدید پشتیبانی و پردازش میشود.
7. در نسخه های قدیمی المنت هایی مانند header , navbar , footer قابل معرفی و اشاره نیستند در حالی که در html5 هر کدام تگ خاص خود را دارا هستند.
8. نسخه های پیشنی سینتکس اشتباه را متوجه نمیشدند و پردازش نمیکردند اما نسخه ی html5 این قابلیت را داراست و syntax اشتباه را میتواند پردازش کند.

   

   websazandeh.ir

    

HTML چیست؟

 

عبارت HTML (اچ تی ام ال) مخفف Hyper Text Markup Language به معنی زبان نشانه <تگ> گذاری ابر متن است، بذارید یکم بیشتر توضیح بدم
زبان HTML شامل یه سری تگ میشه که این تگ ها هر کدوم یه خصوصیاتی دارن مثلا برای نوشتن پاراگراف از تگ p استفاده میکنیم یعنی هر متنی بین تگ باز (p) و تگ بسته (p/) قرار بگیره مثل یک پاراگراف ساده نشون میده یا مثلا هر متنی بین تگ قرار بگیره عنوان محسوب میشه و از نظر سایز از متن داخل تگ بزرگتر و ضخیم تر نمایش داده میشه.

html زبان استاندارد طراحی صفحات وب است.

Websazandeh.ir

 

تاریخچه HTML

اولین نسخه ی این زبان سال 1991 معرفی شد و آنرا تنها با نام html میشناختند و هیچ شماره ورژنی نداشت. و تنها صفحات وب ساده با آن طراحی میشدند. در سال 1995 html 2.0 معرفی شد که حالت استاندارد این زبان به شمار میرفت. سپس در سال 1997 ورژن html 3.2 توسط کنسرسیوم جهانی وب پیشنهاد شد. بعد از آن در همان سال 1997  به دلیل مشکلات موجود در نسخه ی موجود؛ html ورژن 4.0 ارائه شد. پس از مدتی نسخه ی 4.01 ارائه شد که قابلیت و تنظیمات بیشتری برای انواع مختلف رسانه ها را اضافه کرد. قابلیتهایی برای  اجرا کردن بهتر سی اس اس و دیگر انواع اسناد را در خود جای داد.
در سال 2000 ورژن جدیدی از این زبان به نام ایکس html 1.0 ارائه شد که طراحان وب را بسیار در طراحی بهتر صفحات سایت یاری میکرد. در سال 2009 یک انقلاب بزرگ ایجاد شد و html 5 ارائه شد. این ورژن از اچ تی ام ال در بین همه ی طراحان وب بسیار محبوب است و کنسرسیوم جهانی وب پس از این نسخه از html توسعه ی ورژن XHTML 2.0 را کنار گذاشت. زبان html  توسط کنسرسیوم جهانی وب که از آن به عنوان  World Wide Web Consortium یاد میشود توسعه داده میشود. به تازگی شایعاتی مبنی بر توسعه ی html و انتشار نسخه ی 6  این  این زبان ( html6 ) در بین کاربران در شبکه های اجتماعی و وب سایت ها پراکنده شده است در حالی که هیچ خبر یا مطلبی در این باره از سمت سازمان w3c دال بر صحت این خبر منتشر نشده است. حتی در برخی موارد برخی وب سایت ها تگ ها و المان های را هم معرفی کرده اند که اکثر این وب سایت ها خارجی هستند. 

websazandeh.ir