۱۰ تگ HTML که باید بیشتر در مورد آنها بدانید

[حسین هادیان 30]

با سلام و عرض تبریک سال نو به تمام دوستان

احتمالا اکثر دوستان به سایت (http://www.ittutorial.ir) آشنا هستند!

چند وقت پیش این سایت یه مقاله گذاشته بود که احساس کردم اینجا هم بدرد بعضی ها بخوره:

۱۰ تگ HTML که باید بیشتر در مورد آنها بدانید:

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

۱ – ارائه توضیحات در کدهای HTML با استفاده از

ارائه توضیحات در مورد کدهای نوشته شده یکی از اصول کدنویسی استاندارد است که می تواند شما را در حفظ ساختار کلی وب سایت نیز کمک کند.این توضیحات می توانند در مورد شروع و یا پایان یک قسمت یا جزء از وب سایت و یا توضیح در مورد تکنولوژی مورد استفاده باشد.برای ارائه توضیحات در مورد کدهای HTML می توانید به روش زیر عمل کنید.این توضیحات در Source Code قابل رویت می باشد.

>


</pre>
<ul>
menu item 1
menu item 2
</ul>
<br><br><br><p>This is the main content.</p>
<br><br

– 2 ساختار جدول – Table Styles – ,

در گذشته ای بسیار نزدیک استفاده از جداول ( Table ) بسیار مرسوم بود و بسیاری از طراحان وب سایت برای ایجاد ساختار وب سایت از این تگ استفاده میکردند.در طراحی های مدرن و امروزی تر از این تگ ( tag ) فقط برای ارائه اطلاعات به صورت جدول استفاده می شود و استفاده از آن بسیار محدود تر شده است.

اما استفاده صحیح از این تگ و دانستن کاربرد صحیح آن می تواند ما را در ارائه صحیح تر و بهتر مطالب به صورت جدول ( که جزء مهمی از ارائه اطلاعات در وب سایت است ) کمک کند .

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

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

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

قرار میگیرد و خوانده میشود.

در بر گیرنده و مشخص کننده محتوای جداول در سطر ها و ستون ها

>
</pre>
<table>ItemQtySum7#13#24</t

3 –

استفاده از Drop Down یکی از بهترین روش ها برای ارائه اطلاعات به مخاطبان ، جهت انتخاب هستند.

با استفاده از تگ میتوانید اطلاعات دسته بندی شده تری را در غالب یک Drop Down در اختیار مخاطبان خود قرار دهید و انتخاب را برای آنها ساده و ساده تر کنید.

Detroit Tigers
Chicago Cubs


Detroit Lions
Chicago Bears

4 – تیتر

,

,

,

,

, and

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

,

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

استفاده از این تگها از

تا

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

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

۵ –

and

فرم ها نقش بسیار پر رنگی در طراحی وب سایت دارند . چینش مناسب فرمها و دسته بندی مطالب در فرم ها میتواند در ارتباط با مخاطب تاثیر بسیار مثبتی داشته باشند.

با استفاده از تگ

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

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

General Information: 
Name: 
Email: 
Date of birth: 

6 –

تگ یک خصوصیت ظاهری برای یک جزء ( field ) در فرم ( form ) شما نخواهد بود. با استفاده از این تگ یک خصوصیت به فرم اضافه خواهد شد. این تگ برای معرفی برچسب اجزاء یک فرم استفاده می شود . با استفاده از این تگ برچسب ها نیز قابل کلیک خواهند بود ، به این معنی که با کلیک بر روی برچسب هر text box , radio buttons , check box نیز میتواند آن را انتخاب نمائید و یا آن را فعال و یا غیر فعال کنید.

این خصوصیت فقط در text box , radio buttons , check box تاثیر گذار است .

Name: 
Male: 
Female: 

7 –

استفاده از این تگ در ارائه یک متن به صورت ویژه میتواند بسیار تاثیر گذار باشد.با استقاده از این تگ میتواند یک جمله را که از اهمیت ویژه ای در متن شما برخوردار است به راحتی مشخص کنید. هنگام استفاده از این تگ به صورت پیش فرض فضاهای خالی به ابتدا و انتهای متن مورد نظر اضافه خواهد شد و با ایجاد حاشیه این متن از سایر اجزاء جدا می شود.

طراحی هدفمند وب سایت | webtarget.ir

8 –

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

"مدیران اثر بخش در زمان حال زندگی  می‌کنند اما همیشه به فکر آینده هستند"  - ال هیز   

9 –

استفاده از لیست ( list ) یکی از بهترین روشها برای دسته بندی اطلاعات است . تگهای مختلفی برای این منظور مورد استفاده قرار میگیرند که یکی از عمومی ترین آنها ( ul , li ) هستند .

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

* ۱٫ Unordered List (ul) | لیست نامرتب

* ۲٫ Ordered List (ol) | لیست مرتب شده

* ۳٫ Definition List (dl) | لیست همراه با توضیحات

از لیست

,

زمانی استفاده خواهد شد که نیازی به توضیح برای اجزاء در یک لیست مورد نیاز باشد.

| عنوان یک جزء از لیست

| توضیحات در مورد یک جزء از لیست

>
</pre>
<dl>This is list item #1This is the definition of list item #1This is list item #2This is the definition of list item #2

10 – ' , (and other ASCII characters)

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

Apostrophe = ' = '

وب سایت w3school.com میتواند منبع خوبی برای دیدن تمامی کدهای استاندارد ASCII باشد. استفاده از این کدها میتواند در بهبود استاندارد یک وب سایت کمک کند

منبع

راستی اینجا هم سربزنید==> (معرفی ۱۶ ابزار بسیار مفید آنلاین در زمینه Css)