HTML5: العناصر الدلالية وإضافة الصور والصوت والفيديو
HTML5 يقدم عناصر دلالية جديدة تجعل بنية صفحة الويب أكثر معنى ووضوحاً، بالإضافة إلى دعم مدمج للوسائط المتعددة.
العناصر الدلالية (Semantic Elements)
header: رأس الصفحة أو القسم.
nav: شريط التنقل.
main: المحتوى الرئيسي للصفحة.
section: قسم عام من المحتوى.
article: محتوى مستقل مثل مقال أو تدوينة.
aside: محتوى جانبي.
footer: تذييل الصفحة.
على عكس div، هذه العناصر تحدد معنى المحتوى وتساعد محركات البحث.
إضافة الصور
img src=”image.jpg” alt=”وصف الصورة” width=”500″ height=”300″
figure
img src=”photo.jpg” alt=”منظر طبيعي”
figcaption منظر جميل للجبال /figcaption
/figure
إضافة الصوت
audio controls
source src=”song.mp3″ type=”audio/mpeg”
source src=”song.ogg” type=”audio/ogg”
متصفحك لا يدعم تشغيل الصوت.
/audio
إضافة الفيديو
video controls width=”600″
source src=”video.mp4″ type=”video/mp4″
source src=”video.webm” type=”video/webm”
متصفحك لا يدعم تشغيل الفيديو.
/video
تمارين
التمرين 1: أنشئ صفحة HTML5 كاملة باستخدام العناصر الدلالية (header, nav, main, footer).
التمرين 2: أضف صورة وفيديو إلى صفحة ويب باستخدام العناصر المناسبة.
للمزيد من الدروس، راجع درس HTML5 والعناصر الدلالية ودرس إنشاء موقع ويب باستخدام HTML و CSS.
مدونة التربية و التعليم في الجزائر – دروس، فروض، نتائج امتحانات مدونة التربية والتعليم في الجزائر | تحضير الدروس، فروض واختبارات، نتائج البكالوريا وBEM، مسابقات التوظيف، والتوجيه المدرسي للطلاب وأولياء الأمور.