صممت صفحة ويب تفاعلية تحت عنوان "Encyclopedia of Dishes using Bootstrap"، وهي موسوعة إلكترونية تعرض مجموعة من الأطباق المختلفة مع صور جذابة وتفاصيل مفصلة. تم تصميم الصفحة باستخدام تقنيات HTML5، CSS3، وBootstrap لضمان سهولة الاستخدام والاستجابة التامة على جميع الأجهزة (الهواتف الذكية، التابلت، والحواسيب).
المميزات الرئيسية:
لقد قمت باستخدام Bootstrap لإنشاء تصميم سريع الاستجابة يتكيف بشكل كامل مع جميع أحجام الشاشات، مما يوفر تجربة مستخدم ممتازة سواء على الهواتف أو الحواسيب.
وقمت بعرض الأطباق باستخدام بطاقات (Cards) مرتبة بطريقة منظمة ومميزة. كل بطاقة تحتوي على:صورة للأكل,عنوان الطبق,نصوص قصيرة تشرح الطبق,زر إضافي (مثل زر السلة) لتسهيل التفاعل.
تم إدراج مقطع فيديو داخل الصفحة لتقديم تجربة متعددة الوسائط. الفيديو مدمج باستخدام العناصر القياسية لـ HTML5، مما يتيح للمستخدمين مشاهدة مقاطع فيديو ذات صلة بالطبق.
لقد قمت بتنظيم المحتوى باستخدام مكونات Bootstrap مثل الصفوف (Rows) والأعمدة (Columns) لضمان توزيع متناسق للعناصر على الصفحة.
استخدام أشكال مختلفة من البطاقات والنصوص لتوفير تجربة مرئية مريحة وممتعة.
استخدمت ميزات Bootstrap مثل:
Grid System: لتنظيم العناصر بشكل ديناميكي.
Cards Component: لعرض المعلومات بطريقة مرتبة وجذابة.
Typography: لتحسين تنسيق النصوص وجعلها أكثر قراءة.
Buttons and Icons: لإضافة عناصر تفاعلية مثل الأزرار والرموز.
التقنيات المستخدمة:
HTML5: لبناء الهيكل الأساسي للصفحة.
CSS3: لتطبيق الأنماط البصرية وإضافة بعض الإضافات الجمالية.
Bootstrap: لضمان التصميم السريع الاستجابة وسهولة التنفيذ.
Images and Videos: لدعم المحتوى المرئي.
