تصميمات HTML وCSS عملية
ارتقِ بمهاراتك في تصميم واجهات الويب مع دورة «HTML & CSS Designs» للمستوى المتوسط، وحوّل معرفتك الأساسية إلى تصاميم جذابة وتفاعلية من خلال 27 جلسة بشرح باللغة العربية. ستطبّق تأثيرات احترافية على الصور والنصوص والأزرار، وتبني حركات سلسة تشمل ظهور النص والكتابة والتوهج والنبض وارتداد الكرة باستخدام HTML وCSS. وستصمّم بطاقات بتأثير الزجاج، وخلفيات متدرجة، ومعارض صور، وتبويبات، إلى جانب هياكل تحميل تمهيدية وأشرطة ومؤشرات تحميل متحركة تمنح الواجهة تجربة بصرية متكاملة. كما ستوظّف لمسات من JavaScript لبناء شريط تنقّل متجاوب، وقائمة منزلقة، وزر للعودة إلى الأعلى، وواجهة متعددة الخطوات، والتحكم في إظهار كلمة المرور وإخفائها، مع استكشاف المظهرين الداكن والفاتح وتصميم نماذج دخول حديثة ومحاكاة واجهتي Facebook وNetflix. تتبع كل جلسة من الجلسات الـ27 أسئلة اختبار قصيرة من 5 أسئلة مع عرض الدرجة فورًا، لتراجع فهمك وتتابع تقدّمك باستمرار. وعند إكمال الدورة، ستحصل على شهادة إتمام توثّق إنجازك وتضيف قيمة إلى رحلتك في تطوير واجهات الويب.
ماذا ستتعلم
- إنشاء تأثيرات تفاعلية للصور والأزرار والروابط باستخدام التحويم والانتقالات السلسة في CSS.
- تطبيق حركات CSS للنصوص والعناصر، تشمل الكتابة والظهور والتوهج والنبض وارتداد الكرة.
- تصميم بطاقات زجاجية وخلفيات متدرجة ومعارض صور وتبويبات بتنسيقات جذابة باستخدام HTML وCSS.
- بناء هياكل تحميل تمهيدية وأشرطة ومؤشرات تحميل متحركة لعرض حالات الانتظار بوضوح وجاذبية.
- دمج HTML وCSS مع JavaScript لإنشاء تنقّل متجاوب وقوائم منزلقة وزر عودة إلى الأعلى وواجهات متعددة الخطوات.
- تطوير نماذج دخول حديثة مع التحكم في ظهور كلمة المرور، واستكشاف المظهرين الداكن والفاتح، وإعادة إنشاء واجهات مستوحاة من Facebook وNetflix.
محتوى الكورس
- 1تأثير تمرير المؤشر على الصور
- 2حركة إظهار النص بسلاسة
- 3بطاقة هيكلية أثناء التحميل
- 4حركة كرة مرتدة
- 5نص متوهج
- 6شريط تنقل متجاوب
- 7زر العودة إلى أعلى الصفحة
- 8حركة نبض القلب
- 9واجهة تفاعلية متعددة الخطوات
- 10حركة نبض باستخدام CSS
- 11قائمة منزلقة تفاعلية
- 12بطاقة بتأثير الزجاج
- 13شريط تحميل باستخدام CSS
- 14تبويبات باستخدام HTML وCSS
- 15معرض صور باستخدام HTML وCSS
- 16زر إظهار كلمة المرور وإخفائها
- 17تأثير الكتابة المتحرك باستخدام HTML وCSS
- 18تصميم خلفية متدرجة باستخدام HTML وCSS
- 19خط سفلي متحرك عند تمرير المؤشر
- 20محاكاة صفحة تسجيل دخول فيسبوك باستخدام HTML وCSS
- 21إنشاء زر متحرك للموقع
- 22تحريك الأزرار باستخدام HTML وCSS
- 23محاكاة صفحة هبوط نتفليكس باستخدام HTML وCSS
- 24إنشاء مؤشر تحميل دوار باستخدام HTML وCSS
- 25الوضع الداكن والفاتح باستخدام HTML وCSS
- 26زر متحرك باستخدام HTML وCSS فقط
- 27تصميم نموذج تسجيل دخول عصري باستخدام HTML وCSS
ماذا يقول طلابنا عن هذا الكورس
شرح واضح ومنظم، والتمارين العملية ساعدتني أطبّق كل درس فورًا.
أفضل كورس أخذته في المجال، المحتوى عملي ومحدّث.
الجلسات قصيرة ومركزة، والشهادة أضافت لسيرتي الذاتية.
الواجبات والاختبارات جعلتني أتأكد من فهمي لكل جزء.
أسلوب المدرب ممتع، وأنصح به كل المبتدئين.
بعد الكورس قدرت أبدأ أول مشروع حقيقي لي.
شرح واضح ومنظم، والتمارين العملية ساعدتني أطبّق كل درس فورًا.
أفضل كورس أخذته في المجال، المحتوى عملي ومحدّث.
الجلسات قصيرة ومركزة، والشهادة أضافت لسيرتي الذاتية.
الواجبات والاختبارات جعلتني أتأكد من فهمي لكل جزء.
أسلوب المدرب ممتع، وأنصح به كل المبتدئين.
بعد الكورس قدرت أبدأ أول مشروع حقيقي لي.
آراء المتعلمين
قيّم الكورس واترك تعليقك
سجّل الدخول للتقييم- لا توجد تعليقات بعد — كن أول من يشارك رأيه.