Responsive Web Design - التصميم المتجاوب لمواقع الويب

ofrecido por
Coursera Project Network
En este proyecto guiado, tú:

تصميم موقع باستخدام HTML وإضافة عدة عناصرللموقع كشريط التنقل

إضافة تنسيق للموقع باستخدام CSS وجعل التصميم يتجاوب عند تغيير حجم الشاشة

إضافة عناصر خارجية كخطوط وأيقونات جوجل

Clock1 hour
IntermediateIntermedio
CloudNo se necesita descarga
VideoVideo de pantalla dividida
Comment DotsÁrabe (Arabic)
LaptopSolo escritorio

في هذه الدورة التدريبية القائمة على المشروع والتي تستغرق ساعة واحدة، ستتعلم كيفية تصميم موقع ويب متجاوب. التصميم المتجاوب هو التصميم الذي يتناسب ويتناسق مع كل أحجام الشاشات، فقد تتغير طريقة عرض بعض العناصر أو ألوانها أو كيفية استجابتها عند تغيير حجم الشاشة. يحتاج المصممون والمطورون اليوم لمعرفة كيفية تصميم موقع ويب متجاوب لأن الموقع قد يتم عرضه على شاشة حاسوب أو جهاز تابلت أو على شاشة الموبايل وعدم تهيئة الموقع لمختلف أحجام الشاشات قد يعرض التصميم للفشل وقد يؤدي إلى تجربة مستخدم سيئة. ستتعلم خلال المشروع كيفية تصميم شريط التنقل، كيفية إضافة أقسام للموقع، وكيفية تصميم نموذج \استمارة - form ، كيفية تصميم ترويسة وتذييل للموقع، كيفية إضافة أيقونات من أيقونات جوجل ، بالإضافة إلى تنسيق جميع ما ذكر وإضافة بعض التنسيقات لجعل التصميم يتجاوب مع اختلاف حجم الشاشة.

Habilidades que desarrollarás

  • HTML5
  • Cascading Style Sheets (CCS)
  • Web Design
  • تصميم المواقع
  • Responsive Web Design

Aprende paso a paso

En un video que se reproduce en una pantalla dividida con tu área de trabajo, tu instructor te guiará en cada paso:

  1. تحضير الهيكل الأساسي للموقع

  2. تنسيق ألوان الأقسام وتصميم شريط التنقل - Navbar

  3. تنسيق شريط التنقل والترويسة

  4. إضافة تصميم متجاوب لشريط التنقل والترويسة

  5. features تصميم قسم الخصائص

  6. pricing تصميم قسم الدورات

  7. تنسيق قسم الدورات وإضافة محتوى قسم التواصل

  8. تنسيق قسم التواصل وتصميم قسم التذييل

Cómo funcionan los proyectos guiados

Tu espacio de trabajo es un escritorio virtual directamente en tu navegador, no requiere descarga.

En un video de pantalla dividida, tu instructor te guía paso a paso

Preguntas Frecuentes

Preguntas Frecuentes

¿Tienes más preguntas? Visita el Centro de Ayuda al Alumno.