إبدأ معنا تعلُّم اساسيات لغة "HTML5" ..!

تحية إخلاص لمابعي موقع " مشروح "، في هذه التدوينة سوف نتحدث فيها عن الـ "HTML5" والجديد فيه بصفة عامة لحين الاستفاضة والتخصص -إن شاء الله تعالى- في المقالات الأخرى.

بدأ الحديث منذ فترة عن ال "HTML5" والـ "CSS 3" لوصلوهم في نفس الوقت في الغالب وارتباطهم ببعض القوى. حتى الآن اغلب المتصفحات الحديثة تدعم هذه التطورات فايرفوكس واوبرا وكروم وسفارى. ولكن حتى الآن لم يتم دعم الـ "HTML5" ولكن المستخدم والرسمي من   "W3C"  هو الـ  "HTML4".
 تحتوى الـ "HTML5" على العديد من الوسوم الجديدة سوف نستعرض أهمها وإن شاء الله سوف يكون مقال آخر لـ "CSS 3".

لنبدأ :
1- <!DOCTYPE>
نوع الوثيقة ليست من ضمن الوسوم ولكن هي بداية لأي صفحة بهذه اللغة لتخبر المتصفح نوع الوثيقة
أصبحت في الـ "HTML5"

هكذا  <!DOCTYPE html>   مع ملاحظة أنها يجب كتابتها قبل بداية وثيقة الـ HTML.

<!DOCTYPE HTML>
<html>
<head>
<title>Page Title</title>
</head>
<body>
Page Content
</body>
</html>
<div id=”Header”>…</div>

أصبح في الـ HTML 5

<header>

2- <header>
هو أحد الوسومات الجديدة والجديدة فيه سهولة استخدامه أكثر من مرة فهو هيدر للصفحة وهيدر للعمود وهيدر للمقالة.

3- <nav>
معروفة بمنطقة القوائم أو التنقلات.

4- <section>
يستخدم لتعريف أقسام الصفحة على حسب الأنماط الخاصة بها فيمكن وضع section للأخبار وsection الاتصال وهكذا.

5- <article>
يحتوى على أشكال مختلفة للنصوص في الصفحة فهو خاص للمقالات أو التدوينات الخاصة بالمدونات وخلافه.

6- <aside>
هو الخاص بالجانب سواء الأيمن أو الأيسر.

7- <footer>
ليس خاص بنهاية الصفحة ولكن كما استخدمنا الهيدر في أكثر من مكان نستطيع استخدام الذيل في أكثر من مكان هو ذيل للصفحة أو العمود أو المقالة وهكذا.

8- <Audio>  <Video>
أصبح بالإمكان الآن وضع ملف صوت أو فيديو مباشرة في الصفحة فقط بهذا الوسم دون استخدام أي إضافات أخرى.

9-  <canvas>
هذا الوسم من الأوسمة الجديدة، أصبح الآن بإمكانك إدخال لوحة رسومات في الصفحة بالحجم الذي تريده بكل سهولة لإنجاز أعمالك.

و الآن هل بإمكانكم اصدقائي تجربة هذه الاكواد فقط على برنامج 
"Bloc-note" الموجود في حاسوبكم تلقائيا ؟ شاركونا تجربتكم .

أحدث أقدم

نموذج الاتصال