English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية
HTML5 هو طريقة وصف لإنشاء محتوى الويب. HTML5 هي معيار الويب الجديد، وهي طريقة لإنشاء وعرض محتوى الويب. يعتبرها أحد تقنيات نواة الإنترنت. تم إنشاء HTML في عام 1990، أصبح HTML4 معيارًا للإنترنت في عام 1997، وتم استخدامه على نطاق واسع في تطوير تطبيقات الإنترنت
HTML5 هو أحدث إصدار من HTML، تم إكمال إعداد المعيار من قبل اتحاد الويب العالمي (W3C) في أكتوبر 2014
يهدف تصميم HTML5 إلى دعم الوسائط المتعددة على الأجهزة المحمولة
HTML5 هو معيار أساسي في الويب HTML، والذي يعرضه المستخدمون عند تصفح أي صفحة ويب باستخدام أي وسيلة هي في أساسها شكل HTML، ويتم تحويله إلى شكل قابل للتعرف عليه من خلال بعض التقنيات في المتصفح
HTML5 سهل التعلم
HTML5 هو معيار HTML الجديد
HTML، النسخة السابقة من HTML 4.01، ولدت في عام 1999. منذ ذلك الحين، قد حدثت تغييرات كبيرة في عالم الويب.
HTML5 لا يزال قيد التحسين. ومع ذلك، معظم المتصفحات الحديثة قد قدمت دعمًا لبعض ميزات HTML5.
HTML5 هو نتاج التعاون بين W3C و WHATWG، و WHATWG هو Web Hypertext Application Technology Working Group.
يهدف WHATWG إلى نماذج الويب والتطبيقات، بينما يركز W3C على XHTML 2.0. في عام 2006، قررا التعاون لإنشاء إصدار جديد من HTML.
بعض الميزات الجديدة المثيرة للاهتمام في HTML5:
عنصر رسم مثل canvas
عناصر عرض وسائط مثل video و audio
دعم أفضل للإيداع المحلي (localStorage و sessionStorage)
عناصر محتوى خاصة جديدة مثل article،footer،header،nav،section
عناصر تحكم جديدة للنماذج مثل calendar،date،time،email،url،search
أصبح HTML5 يأخذ الويب إلى منصة تطبيقات ناضجة، حيث يتم تنظيم الفيديو والصوت والصور والرسوم المتحركة والتفاعل مع الأجهزة.
إعلان <!doctype> يجب أن يكون في الخط الأول من ملف HTML5، وهو بسيط جدًا في الاستخدام:
<!DOCTYPE html>
بهذه الطريقة، سيستخدم المتصفحات التي لا تدعم HTML5 الحالي نمط التحليل القياسي، مما يعني أنهم سيحللون أجزاء العناصر القديمة المتوافقة مع HTML5 وسيتجاهلون الميزات الجديدة التي لا تدعمها.
هذا doctype أقصر وأبسط من ذي قبل، مما يجعله أسهل للتذكر ويعزز من تقليل عدد الأحرف التي يجب تنزيلها.
عادة ما يكون أول شيء تقوم به في صفحة هو إعلان مجموعة الأحرف المستخدمة. في إصدارات HTML القديمة، كان ذلك عنصر <meta> معقد جدًا، ولكن الآن أصبح بسيطًا جدًا:
<meta charset="UTF-8">
ضع هذا في <head> الخاص بك، لأن بعض المتصفحات قد تعيد تحليل ملف HTML إذا كانت مجموعة الأحرف المعلن عنها مختلفة عن التوقعات الخاصة بها. بالإضافة إلى ذلك، إذا لم تستخدم UTF-8 حاليًا، نوصيك بتغيير موقعك إلى هذا الترميز، لأنه يبسط معالجة مختلف الأدوات للخطوط في الملف.
من المهم ملاحظة أن HTML5 يحد من مجموعة الحروف المتاحة، ويجب أن تكون متوافقة مع ASCII البالغ 8 bits. يتم القيام بذلك لزيادة الأمان، وعدم السماح ببعض أنواع الهجمات.
إليك وثيقة HTML5 بسيطة:
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>أنا عنوان وثيقة html5</title> </head> <body> محتويات وثيقة html5...... </body> </html>
ملاحظة: يجب استخدام إعلان الترميز <meta charset="utf-8"> للصفحات الصينية، وإلا قد تظهر الأحرف عشوائية.
العناصر الجديدة
الخصائص الجديدة
دعم CSS3 الكامل
فيديو وصوت
رسم 2D/3D
التخزين المحلي
بيانات SQL المحلية
تطبيقات الويب
باستخدام HTML5 يمكنك بسهولة تشغيل الفيديو (video) والصوت (audio) في الصفحة.
باستخدام HTML5 يمكنك بسهولة تطوير التطبيقات
التخزين المحلي للبيانات
الوصول إلى الملفات المحلية
بيانات SQL المحلية
المراجع المخزنة
مطورو Javascript
XHTMLHttpRequest 2
باستخدام HTML5 يمكنك بسهولة رسم الرسوم:
استخدام <canvas> العناصر.
استخدام الداخلية SVG.
استخدام تحويلات 2D CSS3،تحويلات 3D CSS3.
المصفوفات الجديدة
الخصائص الجديدة
الرسوم المتحركة
التحويلات 2D/3D
الجوانب المستديرة
أثر الظل
الخطوط القابلة للتنزيل
للتعرف على معرفة CSS3 المزيدية يرجى الرجوع إلى موقعنا دليل CSS3.
أضاف HTML5 الكثير من العناصر الدلالية كما هو موضح أدناه:
| الوسم | الوصف |
| <article> | يحدد منطقة محتوى مستقلة في الصفحة |
| <aside> | يحدد محتوى الرف الجانبي للصفحة |
| <bdi> | يسمح لك بتعيين نص، بحيث يكون مستقلاً عن إعدادات اتجاه النص في العنصر الأب |
| <command> | يحدد زر الأمر، مثل المربعات المفردة، المربعات المزدوجة أو الأزرار |
| <details> | لوصف تفاصيل الوثيقة أو جزء من الوثيقة |
| <dialog> | يحدد نافذة الحوار، مثل نافذة الإشعار |
| <summary> | العنوان الذي يحتوي على عنصر details |
| <figure> | يحدد محتوى التدفق المستقل (الصور، الرسوم البيانية، الصور، الكود وما إلى ذلك). |
| <figcaption> | يحدد عنوان عناصر <figure>. |
| <footer> | يحدد قدم المقطوع أو الوثيقة. |
| <header> | يحدد منطقة رأس الوثيقة. |
| <mark> | يحدد النص المميز. |
| <meter> | يحدد الكمية. يستخدم فقط للكميات التي يمكن معرفة القيمة القصوى والمنخفضة. |
| <nav> | يحدد جزء من رابط التوجيه. |
| <progress> | يحدد تقدم أي مهمة من أي نوع. |
| <ruby> | يحدد التعليقات ruby (النص الصيني أو الرموز). |
| <rt> | يحدد التفسير أو التطبيق الصوتي للكتابة (النص الصيني أو الرموز). |
| <rp> | يستخدم في التعليقات ruby، لتحديد المعلومات التي سيتم عرضها في المتصفحات التي لا تدعم عناصر ruby. |
| <section> | يحدد جزء المقطوع أو الفقرة في الوثيقة. |
| <time> | يحدد تاريخ أو وقت. |
| <wbr> | يحدد أين يمكن إضافة سطر جديد في النص. |
عناصر نماذج جديدة، خصائص جديدة، أنواع جديدة للإدخال، التحقق التلقائي.
العناصر التالية من HTML 4.01 تم حذفها من HTML5:
<acronym>
<applet>
<basefont>
<big>
<center>
<dir>
<font>
<frame>
<frameset>
<noframes>
<strike>
من خلال محرر HTML الخاص بنا، يمكنك تعديل HTML، ثم النقر على الزر لعرض النتيجة.
<!DOCTYPE HTML> <html> <head> <meta charset="utf-8"> <title>موقع دروس الأساسيات (oldtoolbag.com)</title> </head> <body> <video width="320" height="240" controls> <source src="movie.mp4" type="video/mp4"> <source src="movie.ogg" type="video/ogg"> لم يتم دعم علامة الـ video من قبل متصفحك. </video> </body> </html>اختبار لـ ‹/›
الإصدار الأحدث من Safari و Chrome و Firefox و Opera يدعم بعض خصائص HTML5. سيكون Internet Explorer 9 يدعم بعض خصائص HTML5.
طرق التكامل في متصفحات إصدارات IE9 وниزاءها، باستخدام حزمة html5shiv الثابتة من هذا الموقع:
<![if lt IE 9]> <script src="http://apps.bdimg.com/libs/html5shiv/3.7/html5shiv.min.js"></script> <![endif]-->
بعد التحميل، يتم تعريف CSS الجديد للعلامات:
/*html5*/
article,aside,dialog,footer,header,section,nav,figure,menu{display:block}يمكنك العثور على وصف العلامات والخصائص في HTML5 على هذا الموقع، يرجى الضغط دليل HTML5.