ما را بیابید

نشانی
خیابان ۱۲۳
نیویورک، نیویورک ۱۰۰۰۱

ساعت کاری
شنبه تا چهارشنبه: ۹ صبح تا ۵ بعد از ظهر
پنجشنبه و جمعه: ۱۱ صبح تا ۳ بعد از ظهر

وب

معرفی و آموزش HTML5 | قسمت چهارم : آموزش نحوه استفاده از استایل های html5 و قرار داد های کد نویسی

عناصر معنایی html5

معرفی و آموزش HTML5 | قسمت چهارم : آموزش نحوه استفاده از استایل های html5 و قرارداد های کد نویسی

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

در بین سال های ۲۰۰۰ تا ۲۰۱۰ بسیاری از توسعه دهندگان از html به xhtml کوچ کردند. در xhtml کاربران مجبور بودند تا کد های مجاز و با فرم مرتب بنویسند. اما زمانی که html5 ارائه شد این امکان برای طراحان به وجود آمد تا کمی شلخته تر و نا مرتب تر کد نویسی کنند و قوانین دست و پا گیر کمتر شد.

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

 

آموزش پیشنهادی برای شما : آموزش کامل HTML و HTML5

 

راهنمای استفاده از استایل های html5

شما به عنوان یک توسعه دهنده وب باید باهوش و آینده نگر باشید. استفاده همیشگی از استایل های html5 متن html شما را قابل درک تر می کند. این مرتب نویسی علاوه بر این که به شما کمک می کند مزیت دیگری نیز دارد و آن آینده نگری است. شاید در آینده برنامه ها ای که xml را می خوانند از html نیز پشتیبانی کنند. کد نویسی مرتب و نزدیک به حالت xhtml می تواند سبب شود که فایل های html شما به راحتی در این برنامه ها اجرا شوند. پس اولین نکته در استفاده از استایل های html5 این است که کد خود را مرتب، تمیز و با شکل دهی مناسب بنویسید.

 

انتخاب کردن نوع سند

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

<!DOCTYPE html>

 

از حروف کوچک برای نوشتن نام عناصر خود استفاده کنید

یکی دیگر از نکاتی که در استفاده از استایل های html5 باید آن را رعایت کنید این است که باید همواره از حروف کوچک برای نام عناصر استفاده شود. البته html5 این امکان را فراهم کرده است تا از  حروف کوچک و بزرگ برای نوشتن نام عناصر استفاده کنید، اما ما به دلایل زیر به شما توصیه می کنیم از حروف کوچک برای این کار استفاده کنید:

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

 

همه عناصر html را ببندید

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

عناصر خالی را هم باید ببندید. زیرا در xhtml شما باید از عنصر پایان دهنده استفاده کنید.

 

حتما از نقل قول برای مقدار های ویژگی ها استفاده کنید.

در html5 شما می توانید بدون نقل قول هم مقدار های ویژگی ها را مشخص کنید. مانند :

<table class=striped>

اما در استفاده از استایل های html5 توصیه می شود حتما از نقل قول استفاده کنید. دلیل این توصیه این است که :

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

به مثال زیر دقت کنید

 

برای تصاویر خود ویژگی تعیین کنید

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

 

از فاصله در اطراف علامت مساوی استفاده نکنید

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

استایل های html5

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

یکی از قوانین استفاده از استایل های html5 و کد نویسی این است که از نوشتن خط های طولانی پرهیز کنید. زمانی که از یک ویرایشگر html استفاده می کنید، به شما اجازه نمی دهد تا به سمت چپ یا راست اسکرول کنید. و در واقع از شما می خواهد خط های خود را طولانی تر از ۸۰ کاراکتر نکنید.

 

از خطوط استفاده نکنید

طبق قوانین کد نویسی بهتر است بدون دلیل از خط خالی در کد نویسی استفاده نکنید. برای بهتر خوانده شدن کد ها از خط های خالی فقط برای جدا کردن بلوک های بزرگ کد استفاده کنید. همچنین از کلید tab کمتر استفاده کنید. لازم نیست در استفاده از استایل های html5 برای جدا سازی هر عنصر از خط خالی استفاده کنید. این خط های خالی سرعت خوانده شدن کد ها را کاهش می دهد. به دو مثال بد و خوب زیر توجه کنید.

مثال بد:

حالا مثال خوب :

Table Example:

List Example:

استایل های html5

کلام آخر

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

 

منبع : طراحی سایت

آموزش تک
نویسندهآموزش تک

دیدگاهتان را بنویسید