علیرضا احمدی بابلانی : وب مهراز - جامعه برنامه نویسان

10 دلیلی که ما را ملزم به استفاده از HTML5 می کند

در اینجا سعی داریم 10 دلیل اصلی که در حال حاضر  ما را ملزم به استفاده از HTML5 می کند را بیاوریم:

HTML5_Webmehraz

شما هنوز هم  از HTML5  استفاده نمی کنید؟ نه؟   احتمالا شما دلایل خود را برای استفاده نکردن از آن دارید. شاید چون  ورژن های قدیمی اینترنت اکسپلورر از آن پشتیبانی نمی کنند شما آن را دوست ندارید و یا شاید هم عاشق  کدهای سخت و دشوار  XHTML  هستید.

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

اگر از من می پرسید ، همین الان به شروع یادگیری آن بپردازید. بله ، دقیقا پس از خواندن این مقاله:

شروع آموزش جامع HTML5

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

فکر می کنم مشکل اصلی  خیلی ها این است که HTML5 را به چشم موجودی مرموز میبینند. یا خیلی ها آن را ماشین پرنده یا جت پک تصور می کنند !!!! و یا شاید هم خیلی ها  فکر می کنند استفاده از  HTML5  خنده دار و سر گرم کننده است نه مفید!!!

اشتباه نکنید ، استفاده از آن بسیار ساده و عملی است. بله HTML5 یک واقعیت محض است.  با به اشتراک گذاری این مطلب می توانید همه توسعه دهندگان وب را آگاه کنید که  چرا باید از HTML5 استفاده کنند.

10. در دسترس بودن HTML5

10_webmehraz.ir
به دو دلیل با HTML5 می توان براحتی سایت هایی با دسترسی راحت بوجود آورد:

    • Semantics: تگ های جدیدی که در HTML5 قرار داده شده است مانند:
      <header> , <footer> , <nav> , <section> , <aside> و . . .  که به توسعه دهندگان وب اجازه می دهند تا براحتی  محتوای وبسیات را بچینند. قبلا توسعه دهندگان حتی با استفاده از id , class  برای مشخص کردن اعضای صفحه و قرار دادن آن ها در جای مناسب مشکل داشتند.
    • ARIA : ARIA تنظیمات w3c است که بطور گسترده ای مورد استفاده قرار می گیرد که کنترل اختصاص نقش ها را به عناصر و تگ های یک سند HTML برعهده دارد و همچنین نشانه های مهم یک صفحه : بالا صفحه , پایین صفحه و منو بار یا محتوای مقاله را بوسیله صفات نقش ها  کنترل می کند. عمدتا این استانداردها رعایت نمی شود و اکثر صفحات ما دارای ایراد می باشند و استاندارد نیستند. HTML5 این صفات را اعتبار خواهد بخشید. HTML5 هوشمندانه به تخصیص صحیح نقش ها می پردازد و دیگر یک توسعه دهنده وب مانند قبل نیازی به کنترل و ساخت نقش ها ندارد.

اعتبار سنج کد W3C برای صفحات وب

9. پشتیبانی از صدا و فیلم

Flash player و سایر ابزار های مدیا پلیر را با کد نویسی های سخت و طاقت فرسایش فراموش خواهید کرد.در HTML5 فیلم ها و صداهای خود را با دسترسی واقعی و به آسانی بروی وب قرار خواهید داد. تا قبل از این قرار دادن ویدئو و صدا در وبگاهتان بیشتر شبیه یک کابوس به نظر می رسید. استفاده از کد ها و تگ های خسته کننده <embed> و <object> و تعیین یک لیست بزرگ از پارامترها ، کد های گیج کننده و طولانی واااای !!!!!!! حتی پس از انجام این همه کار و کدنویسی باز هم نمی دانستید که آیا ویدئو یا صدای شما بدرستی پخش خواهد شد یا خیر !!
تمام شد، دیگر این کابوس ها را فراموش خواهید کرد. پای HTML5 که به میان بیاید همه مشکلات حل میشود، می خواهید فیلم یا ویدئو در صفحه وب خود قرار دهید ؟ تکه کد زیر کافیست:

<video src=”url”/>

 

می خواهید طول و عرض آن را نیز مشخص کنید ؟ نگران نباشید ، فقط مانند دیگر کد های HTML به تنظیم صفات آن بپردازید:

<video src=”url” height=”190px” width=”320px”/>

 

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

اطلاعات بیشتر درباره فیلم ها Video HTML5
اطلاعات بیشتر درباره صداها ها Audio HTML5

8. Doctype

08_webmehraz.ir

<!DOCTYPE html>

بیانیه doctype است. نه یک خط کمتر و نه یک خط بیشتر. شما با وارد کردن این خط تمامی ویژگی های HTML5 را در اختیار خواهید داشت. تمامی مرورگر ها بجز اینترنت اکسپورر 6 مخوف از آن پشتیبانی می کنند. این یک خط کد را وارد کنید و از زندگی خود با HTML5 لذت ببرید.

مقدمه HTML5 و بیانیه DOCTYPE

7. کدهای تمیز  و ساخت یافته

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

حالا کد HTML5 همین هدر و لیست منو را می نویسیم، شما قضاوت کنید که آیا کدهای HTML5 ساخت یافته و تمیز تر نیستند؟

 

با HTML5 شما می توانید با کد هایی ساده به جای تعیین کلاس تگ دلخواه خود را بنویسید و همان تگ را که خود با اختیار خود به آن هویت داده اید استایل بندی کنید.قبلا شما هر بلوک را یک DIV در نظر می گرفتید و برای آن کلاس تعیین می کردید اما در HTML5 شما بجای div از تگ دلخواه استفاده می کنید که خود آن می توانید استایل بپذیرد. شما با کد های <header> , <footer> , <nav> , <section> , <aside> و . . . بسیار راحت تر خواهید بود. با این کار کدهای css شما نیز ساخت یافته و زیبا تر خواهند بود.

6. ذخیره سازی محلی هوشمند

06_webmehraz.ir
یکی از جالبترین چیزها در مورد HTML5 ویژگی جدید ذخیره سازی محلی است. این ویژگی عبوری است از بین کوکی ها و پایگاه داده های سمت کلاینت.عملکرد ذخیره سازی در HTML5 شاید بهتر از کوکی هاست چون در آن امکان ذخیره سازی در چندین پنجره باز شده وجود دارد، از لحاظ امنیت و کارایی بهتر است و حتی بعد از بستن مرورگر داده های ذخیره شده در پایگاه ذخیره سازی حضور خواهند داشت.
با اینکه این سیستم ذخیره سازی سمت کلاینت یا مشتری یا همان کاربران می باشد اما دیگر هیچ نگرانی در رابطه با این که کاربران کوکی ها را حذف کنند نخواهید داشت. این سیستم توسط تمامی مرورگرهای محبوب پشتیبانی می شود. ذخیره سازی محلی برای خیلی چیز ها مناسب است اما فقط قسمتی از سرویسی است که توسط HTML5 ارائه میشود. سیستم ذخیره سازی محلی داده ها در مرورگرهای کاربران به توسعه دهندگان وب این امکان را می دهد تا به راحتی برنامه های کاربردی بسازند و با آنها کار کنند. مانند:
ذخیره سازی اطلاعات کاربران
توانایی بازیانی آخرین وضعیت کاربران

5. تعامل بهتر

همه ما خواستار تعامل بهتر هستیم. همه ما خواستار وبسایتی پویا تر می باشیم تا با کاربران تبادل نظر کنیم وحتی کاربران با یک دیگر پرسش ، پاسخ و بحث و گفتگو داشته باشند و از آن لذت ببرند. با ورود عنصر <canvas> در HTML5 امکان کارهای بیشتری  نسبت به اپلیکیشن های قبلی مانند فلش برای تعامل و پویایی خواهید داشت. در اینجا یک لیست سریع از رابط های برنامه کاربردی آمده است:

  •  کشیدن و رها کردن (Drag and Drop (DnD
  • پایگاه ذخیره سازی آفلاین
  • مدیریت تاریخچه مرورگر
  • ویرایش اسناد
  • پخش مدیا ، صدا و تصویر

4. توسعه بازی های اینترنتی

بله درست است. شما میتوانید با تگ <canvas> بازی هایی تولید کنید.HTML5 ابزار مناسبی را برای توسعه بازی های تحت وب ارائه می دهد.
امروزه اکثر مردم یک موبایل هوشمند به همراه دارند و یک بازی آنلاین و پویا می تواند مخاطب های فراوانی به خود جذب کند. قبلا از فلش برای این کار استفاده میشد.
لینک های زیر آموزش هایی هستند که برای طراحی بازی های HTML5 در نظر گرفته شده اند:

3. پشتیبانی تمامی مرورگرهای قوی روز از HTML5

تمامی مرورگرهای محبوب و مدرن از HTML5 پشتیبانی میکنند. فایرفاکس، گوگل کروم، سافاری، اینترنت اکسپلورر 9+ و اپرا همه و همه. جالب اینجاست حتی مرورگرهای بسیار قدیمی هم بیانیه DOCTYPE را می شناسند اما این بدین معنی نیست که آن ها تگ های جدید HTML5 را میشناسند. اما مطلب قابل توجه این است که خوشبختانه ما با قرار دادن یک کد جاوا اسکریپت می توانیم حتی مرورگر های قدیمی را هم مجبور  به پشتیبانی از تگ های جدید HTML5 کنیم به همین سادگی :

03_webmehraz.ir

2. موبایل ،‌موبایل و موبایل

این روز ها تکنولوژی موبایل محبوبیت بیشتری نسبت به قبل پیدا کرده است. این یک فرض احمقانه است که فکر کنیم موبایل یک تکنولوژی زود گذر باشد. تلفن های همراه کل دنیا را در دست گرفته اند. امروز برای استفاده از اینترنت عده بسیاری از مرورگرهای گوشی موبایل خود استفاده می کنند. HTML5 آماده ترین ابزار برای طراحی سایت هایی مخصوص تلفن همراه می باشد.
فلش موبایل راهی بسوی مرگ را در پیش گرفته است.بزودی برای طراحی نسخه موبایل یک وبسایت فقط و فقط از HTML5 استفاده خواهد شد. مرورگر های موبایل بطور کامل از HTML5 پشتیبانی میکنند. بنابرین به راحتی می توان با طراحی و تنظیم صفحاتی متناسب با اندازه های کوچک صفحات لمسی و یا غیر لمسی موبایل قدمی بزرگ و سریع برداشت. متا تگ ها و یا متا برچسب هایی وجود دارد که شما به راحتی بتوانید وبسایت خود را برای موبایل بهینه سازی کنید:

  • viewport: به شما کمک می کند تا به تنظیم عرض و تنظیمات زوم آن بپردازید.
  • full screen browsing: مقدار خاص ios که به دستگاه های اپل اجازه می دهد تا صفحه را به صورت تمام صفحه مشاهده کنند.
  • Home Screen Icons: مانند favicon ها آیکون هایی برای اضافه کردن صفحه به صفحات دلخواه هستندکه درios و دستگاه های اندروید استفاده میشوند.

برای کسب اطلاعات در رابطه با موبایلی کردن صفحه وبتان به این لینک مراجعه کنید: “Mobifying” Your HTML5 Site

1. HTML5 آینده را در دستانش خواهد گرفت

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

تعداد بازدید : 396
ارسال به دوستان

ارسال