جایگاه HTML در طراحیدر طراحی و پیاده سازی صفحات وب و application های تحت وب، تکنولوژی های متعددی مورد استفاده قرار می گیرند که هر کدام کاربرد خاص خود را دارند. در این بین کاربردها و اهداف اصلی استفاده از HTML را در دو مورد زیر می توان خلاصه کرد:
![]() فرایند تکامل HTML5 HTML 4 در سال 1997 منتشر شد. با گذشت زمان نیاز به ایجاد تغییرات برای برآوردن نیازهای جدید احساس میشد. روند کند توسعه استانداردهای وب که تحت نظارت W3C انجام میشد باعث شد تا گروه WHATWG متشکل از علاقمندان و نمایندگانی از شرکت های فعال در این عرصه نظیر Mozilla ، Opera و Apple در سال 2004 تشکیل شود. حاصل کار چند ساله این گروه در اواسط سال 2007 برای تدوین استاندارد HTML5 مورد قبول W3C واقع شد. HTML5 نسخه شماره ۵ زبان اصلی World Wide Web یعنی HTML است. این نسخه در تاریخ ۲۲ ژانویه ۲۰۰۸ بوسیله کنسرسیوم وب جهانی (W3C) منتشر شد. ایده ابتدایی این نسخه از HTML در سال ۲۰۰۴ در WHATWG کلید خورد. این گروه کاری شامل شرکت های بزرگی مانند AOL، Apple، Google، IBM، Microsoft، Mozilla، Nokia، Opera و … می باشد. نشانه های جدید HTML 5 عناصر و ویژگی های جدیدی به تگ ها (tag) ها اضافه کرده است. از لحاظ تکنیکی بعضی از این تگ ها به div و span شبیه هستند. به عنوان مثال تگ جدید nav و تگ جدید footer از این دسته هستند. بعضی دیگر از تگ های جدید مخصوص موتور های جستجو (برای ایندکس کردن اطلاعات) ، دستگاه های دارای صفحه کوچک (مانند موبایل) و یا خواننده های صوتی می باشند مانند تگ های جدید audio و video. همچنین بعضی از عناصر حذف شده اند. مانند تگ center. چه امکاناتی را میتوان از Html5 انتظار داشت؟
لیست تعدادی از تفاوت های HTML 5 با HTML 4 به طور خلاصه (تعداد کمی از نمونه ها نمایش داده شده است) عبارتند از:
تغییرات HTML5 بیشتر در رابطه با هر چه بهتر برآوردن دو هدفی است که پیشتر گفته شد. » تگ های جدیدی که برای توصیف بهتر ساختار معنایی اطلاعات افزوده شده عبارتند از: section , article , aside, header , footer , nav , dialog , figure » تغییرات جدید برای طراحی بهتر فرم های ورود اطلاعات، افزوده شدن انواع جدیدی از input نظیر : datetime, datetime-local, date, month, week, time, number, range, email, url تگ های جدید output و datalist » برخی از تگ های جدید برای پویا تر شدن محتوا و رابط کاربری: audio, video, canvas, meter, progress, event-source, … مشاهده لیست کامل تغییرات (در سایت W3C) :: برای مشاهده تگ های جدید اضافه شده به نسخه 5 و توضیح کوتاهی در مورد هر یک، به صفحه HTML 5 Reference مراجعه نمایید. تگ های جدید با (NEW) مشخص شده است. (در سایت W3schools) ساختار کلی یک صفحه وب مبتنی بر HTML۵ همانطور که گفته شد HTML5 تغییرات بسیاری نسبت به نسخه پیشین خود داشته است. یکی از مهمترین ویژگی های HTML5 مشخص نمودن نوع محتوا است که میتواند تحولی در عرصه موتورهای جستجو باشد به این صورت که شما با مشخص کردن مکان دقیق مطالبتان، آنها را از قسمتهای دیگر سایت که همیشه ثابت هستند جدا کرده و باعث دستهبندی صحیح محتوا برای موتورهای جستجو میشوید. در اینجا با تصویری ساده درباره این قابلیت HTML5 توضیح می دهیم.
همانطور که در تصویر مشاهده میکنید تمامی قسمتها توسط تگهایی از یکدیگر جدا شدهاند و این، کار را برای موتورهای جستجو راحت میکند. همانطور که از نامش پیداست مکان دقیق سربرگ سایت را مشخص میسازد و تمامی عناصر مربوط به سربرگ بین دو تگ <header> و </header> قرار میگیرند به صورت زیر: <header>
<aside>. . </header> محتوای سایت که در کنار صفحه و جدا از محتوای اصلی تعریف شده و با محتوای قسمت های دیگر صفحه مرتبط می باشد در تگ <aside> قرار می گیرند. لینک های صفحه در این قسمت قابل تعریف می باشند. <section> از این تگ برای تعریف بخش ها در صفحه استفاده می شود. فصل ها ، سرصفحه ، پاورقی ، بخش های مربوط به تبلیغات و یا هر بخش دیگر از صفحه با این تگ مشخص و مجزا می گردد. <article> جهت تعریف محتوای خارجی از تگ <article> استفاده می شود. محتوای خارجی می تواند یک مقاله خبری از ارائه دهنده های خارجی، یک متن از وبلاگ و یا یک متن از یک بخش یا هر چیز دیگر از یک منبع خارجی باشد. <footer> تگ <footer> همانطور که از نامش پیداست برای مشخص کردن مکان پابرگ سایت یا وبلاگ استفاده میشود و تمامی عناصری که در قسمت پابرگ صفحه قرار میگیرند بین دو تگ <footer> و </footer> قرار میگیرند. در اینجا جا دارد کمی هم درباره ساختار یک صفحه وب صحبت کنیم. در نسخه قدیمی HTML یعنی نسخه ۴ آن برای شروع کدنویسی هر صفحه باید استاندارد آن صفحه تایید میشد که با کد زیر مشخص میشود: <!DOCTYPE html PUBLIC "-//W۳C//DTD XHTML ۱.۰ Transitional//EN" "http://www.w۳.org/TR/xhtml۱/DTD/xhtml۱-transitional.dtd">
اما در HTML۵ دیگر لازم نیست دو خط کد بنویسید تا استاندارد بین المللی HTML را مشخص کنید و فقط کافی است با کد زیر در ابتدای کدها، استانداردتان را مشخص کنید:<html xmlns="http://www.w۳.org/۱۹۹۹/xhtml">
<!DOCTYPE html>
همانطور که مشاهده کردید کدها در HTML۵ بسیار بهینهتر از گذشته شده اند تگهای بسیاری در نسخه جدید جایگزین چندین خط کد شدهاند. به عنوان مثال برای مشخص کردن نوع کاراکتر صفحه و تنظیم آن به UTF8 در نسخه قبلی باید کد زیر نوشته می شد: <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
اما حالا در نسخه جدید فقط کافی است از کد زیر استفاده کنید:<meta charset="UTF-۸">
این کدها در مورد فایلهای موجود در صفحه سایت نیز صدق میکنند. شما قبلا برای قراردادن یک اجرا کننده صوتی یا تصویری در سایت باید از چندین خط کد استفاده میکردید و برای داشتن یک اجرا کننده خوشساخت باید دست به دامان جاوا اسکریپت و فلش میشدید ولی در HTML5 به راحتی و فقط با یک تگ میتوانید یک اجرا کننده فایلهای صوتی و تصویری با ظاهری زیبا داشته باشید.سازگاری مرورگرها با HTML5 اکثر مرورگر ها به غیر از IE همگام با استاندارد ها پیش میروند و کم و بیش از استاندارد های جدید پشتیبانی میکنند. هم اکنون نسخه های بتای firefox3 و opera9.5 تا حدودی از HTML5 پشتیبانی میکنند. قطعا زمانیکه HTML5 از پیش نویس خارج شده و کاربردی شود این مرورگر ها هم از نسخه بتا خارج شوند، میتوان انتظار داشت تا از HTML5 و CSS3 پشتیبانی قابل قبولی داشته باشند. با توجه به این که اکثر کاربران این مرورگرها از نسخه های آپدیت استفاده میکنند در آینده نزدیک مشکل خاصی با این مرورگرها وجود نخواهد داشت. اما IE که متاسفانه حدود 75 درصد از کاربران وب از آن استفاده میکنند. بعید به نظر میرسد که در آینده نزدیک (و یا حتی دور) پشتیبانی قابل قبولی از HTML5 و CSS3 داشته باشد. IE6 در سال 2001 منتشر شد و در سال 2005 نسخه ی 7 این مرورگر در حالی منتشر شد که پیشرفت چشمگیری نسبت به نسخه قبل نداشت و حتی هنوز از CSS2 هم پشتیبانی خوبی نداشت. و اگر مایکروسافت این روند را در پیش بگیرد نمیتوان به IE8 امیدوار بود. ![]() HTML5، طراحان وب و مرورگرها از آنجایی که سازگاری یکسان همه مرورگرها با استاندارد های وب ظاهرا" رؤیایی بیش نیست. لذا طراحان وب چاره ای ندارند جز اینکه خودشان طرح ها یشان را با مرورگر ها سازگار کنند. برای مثال برای پشتیبانی از canvas در IE میتوان از explorercanvas استفاده کرد که در واقع canvas شبیه سازی شده با استفاده از جاوااسکریپت و vml است. HTML5 و CSS3 برای راحت تر و بهتر شدن طراحی بوجود آمده اند ولی با توصیفاتی که ذکرش رفت، طراحی با تکنولوژی های جدید و در عین حال سازگار بودن با تمام مرورگرها کار را دشوار تر میکند. اما چاره ای نیست چون گذر از این مراحل برای پیشرفت لازم است حتی اگر دشوار باشد و حتی اگر موانعی نظیر IE بر سر راه باشد. نکته: XHTML5 در واقع همان HTML5 با رعایت قوانین XML هست. ولی در مورد XHTML2.0 بر خلاف XHTML1 که بر اساس HTML4 توسعه یافته، XHTML 2.0 کاملا مستقل از HTML5 هست و حتی با XHTML 1.1 هم سازگاری ندارد. برای آشنایی هر چه بیشتر با نسخه 5 HTML مشاهده ویدئویی در این مورد خالی از لطف نیست.
منابع:زمان ویدئو تقریبا" 42 دقیقه بوده و برای مشاهده آنلاین آن داشتن اینترنت پر سرعت الزامی است. » لینک ویدئو: http://www.vimeo.com/6691519 » زبان: English » زمان: 41:55 دقیقه http://www.w3schools.com http://www.pcpedia.ir http://forum.downloadina.com http://www.faroxa.com منابع و مقالات به زبان انگلیسی: |


