التصميم لشكل الموقع
قبل الشروع فى التكويد يجب ان نملك تصميم واضح للمشروع او المدونة وذلك عن طريق احد برامج تحرير الصور سواء الفوتوشوب او اي برنامج اخر لنفس الوظيفة مثل برنامج Gimp
وهو برنامج مجانى وجميل يمكن استخدامه فى تصميم شكل الموقع ويمكن تحميله من الموقع الرسمى من هنا
ولكن قبل البدء عليك مراعاة بعض الاشياء مثل الالوان والخطوط والمسافات بين العناصر وغيرها
هذه تصميم الصفحة الرئيسية بالفوتوشوب
طبعًا يمكنك الابداع كما شئت واختيار الالوان المناسبه لذوقك
يمكنك تحميل القالب كامل الذي قمت بتصميم من اجل هذه الدورة من هنا
نسخ الالوان من التصميم
اللون فى لغة HTML مكون من ستة خانات
مثال #F0F8FF
وكل شفرة تشير الى لون معين على حسب نسبة الاحمر والاخضر و الازرق فى هذا اللون
فميثل كل زوج ارقم من اليسار نسب الاحمر والاخضر والازرق بالترتيب
الان الى النقطة الاهم كيفية نسخ كود اللون من التصميم على برنامج محرر الصور الفوتوشوب او GIMP
من اجل استخدامه فى لغة HTML
وانا هنا ساشرح على برنامج الفوتوشوب
برنامج GIMP يعمل بطريقة مشابهة
اذا كنت تستخدم الفوتوشوب فمن هذه الاداة 
يمكنك الوقوف على اللون الذي تريده فى التصميم ثم بعد ذلك الضغط بزر الفأرة اليمين على
يمكنك الوقوف على اللون الذي تريده فى التصميم ثم بعد ذلك الضغط بزر الفأرة اليمين على 
بعد ذلك ستظهر لك هذه النافذة
قم بنسخ الكود المحدد فى الصورة للاستخدام فى HTML
قراءة المقاسات من التصميم
لقراءة المقاسات والابعاد نستخدم اداة Ruler Tool ويمكن استخدامها كما فى الصوة
وتسخدم عن طريق الضغط على بداية المسافة المراد قياسها والسحب حتى نهاية المسافة
ويتم قراءة القياسات كما بالصورة
اذا كنت تقيس بشكل افقى تقوم بقراءة Wعلى انها المسافة
واذا كنت تقيس بشكل رأسي تقوم بقراءة ال H على انها المسافة
لا حظ ان المسافات هنا بالبكسل
اذا كانت غير ذلك قم بالضغط على CONTROL + K
ثم Units & Rulers
واجعل Ruler بوحدة Pexels
الى هنا نكون انهينا من الدرس
دروس الدورة
