مرحبًا، جميعًا. مرحبًا بكم من جديد. حان الوقت
لتقديم مثال واجب منزلي اّخر. إن ما سنقوم به هذا
الأسبوع هو إضافة تحسينات أكثر على الصفحات التي بدأت
في تنسيقها الأسبوع الماضي. لذا فإن الهدف مرة أخرى من
هذا الواجب هو أنني لا أريدك أن تقوم
بتغيير برنامج html على الإطلاق. أريدك أن تقوم بإنشاء صفحة تصميم جديدة
أو تحديث صفحة التصميم الخاصة بالأسبوع الماضي حتى يمكن استخدامها في ثلاث
ملفات html مختلفة. عندما تبدأ، من المهم للغاية
أن تكون قد أتممت دورة النظير المتدرج الأولى. سأفترض أنك
قمت بإتمامها و لذا عندما أتحدث في هذا الفيديو عن
التغييرات المختلفة، سأريد منك ان تقوم ب إجراءها. يمكنك إجراء التغييرات على
الواجب المنزلي السابق أو يمكنك أن تبدأ تمامًا من الصفر إن لم تكن
راضيًا عن ما قمت به في الدورة السابقة. لذا فلتلقي نظرة على ما كان قبل هذا وما
بعد هذا الواجب لذا أريدك أن
تحاول أن تقوم به. لقد كانت هذه صفحتنا عندما بدأنا. ففي الواجب المنزلي الأول،
أخذتها من هنا إلى هنا. لا يزال الأمر بسيطًا، ولكن أكثر أناقة
لأننا أضفنا بعض ألوان الخلفية، بعض الخطوط الملونة و
تخلصنا من تلك الصور. ما أريدك أن تعمل عليه هذا
الأسبوع هو تغيير هذه الأشياء حقًا و وجعلها في غاية الأناقة
بدلاً من مجرد تنسيقها فقط. لذا فلنلقى نظرة على ما أود أن
تقوم به في الأسبوع الثالث. كما ترى، يبدو هذا وكأنه
موقع مختلف تمامًا. عادت الصور، وقمت بإضافة
صورة خلفية لشريط التنقل و وشيء ليس ضروريًا أن يكون من السهل
رؤيته عندما تنظر فقط إلى ورقة، وأضفت خاصية جديدة توضح
في أى صفحة نكون الاّن. لذا فإذا نظرت، تلحظ أنه قد تم إبراز الرابط الرئيسي
لأننا في الصفحة الرئيسية. إذا قمت بالنقر على السجل، فإن رابط السجل سيوضح كيف يتم ذلك لأننا في صفحة السجل،
ثم هكذا وبنفس الطريقة في صفحة الفرق (المجموعات). إذًا هذا هو ما نمسيه بالصفحة
الحالية التي ننظر إليها. ولذا ستقوم بتصميم ذلك
من أجل مساعدة مشاهديك على معرفة مكان وجودهم بهذه الصفحة. لذا سأمضي قدمًا و
سأتحدث عن كل علامة من هذه العلامات. أريدك أن تسعى
لإتمام هذا الواجب. لذا فعندما تبدأ،
ستترك الكود الخاص ب HTML هكذا كما هو بمفرده، وستقوم بإنشاء إما ورقة تصميم
جديدة، أو ستمضي قُدمًا و أو ستقوم بتحديث الورقة التي قمت باستخدامها من قبل. ما ستحتاج إلى العمل
عليه بالتحديد هى هذه العناصر. تحتاج العمل على الهيكل،
العنوان، والهيكل الذي له حرف H والروابط و ثم أنه هناك ثلاثة فئات نطلق عليها نشط،
يسار ويمين، وسأقوم في النهاية بالطلب منك أن تعيد تلك الصور إلى
ما كانت عليه في الجانب الأيسر من الصفحة. لذا فلنتحدث أولاً عن الهيكل. قم بوضع المتصفحات الخاصة بك في
بعض الحواشي والهوامش بشكل افتراضي, ولكني أريدك أن تقوم بالكتابة عليها، ثم ضع شيئًا
يبدو متسقًا مع كافة المتصفحات. كما يمكنك أصلا تعديل حجم
النص كيفما شئت، ولكن هذا غير ضروري. أعلم أنني فعلت ذلك لأنني وجدت
الخط صفيرًا للغاية. لننتقل بعد ذلك إلى العنوان. تكمن الخطوة الأولى في تغيير لون
الخلفية ومعرفة ما إذا كان يمكنك القيام بذلك. وبعد ذلك سترغب
في إضافة صورة الخلفية. وحتى أكون صادقًا، سيكون هذا هو الجزء الأكثر صعوبة
في الواجب المنزلي بأكمله. حيث أنه لن يكون دائمًا واضحًا
لك أين يمكنك إيجاد الصور و وأين يتعذر ذلك، لذا فعليك التأكد أن قمت بالبحث في بعض
المصادر الأخرى إذا تعثرت في هذا الجزء. بعد ذلك أريدك أن تغير
لون الخط و أن تكبر حجم الخط أكثر قليلاً. وهنا ستتعلم مرة أخرى شيئًا
جديدًا لم تتعلمه من قبل. أريدك ان تقوم بتصميم وضبط الروابط
الموجودة في الجزء الخاص بالتنقل ولكن فقط تلك الروابط. وليست كافة الروابط الموجودة بالصفحة. لست بحاجة إلى إعادة أنشاء
ما قمت به على سبيل المثال بالتحديد، ولكن أريد أن تكون روابطك
متباعدة بشكل مناسب، كما ينبغي أن تحتوى على بعض ألوان الخلفية
وتكون الإطارات مستديرة مع عدم وجود خطوط تحت الكلمات. واجعلها تبدو أنيقة الشكل. ثم تأكد بعد ذلك من أنك رأيت تلك
الفئة النشطة التي تحدثت عنها. وبهذه الطريقة سيتمكن الأشخاص من
معرفة الصفحة التي ينظرون إليها دون الحاجة إلى النظر إلى ال URL. والاّن هناك شيء اّخر ستحتاج
العمل عليه وهو هذه فكرة أن صفحتنا تحتوى على صفين صف يسار وصف يمين بجانبها, والاّن حتى تجعل كافة الأشياء بجانب
بعضها البعض، ستحتاج إلى عشوائية العرض
اعتمادًا على كيفية تنفيذ ذلك. لذا تأكد من تغييرها حتى
تكون بجانب بعضها البعض و ثم قم بتغيير لون خلفية
الجزء الأيسر. ربما تكون قد فعلت ذلك بالفعل
في الواجب المنزلي السابق، ولكن إن لم تكن متاكدًا من ذلك، فلتقم به الاّن. وفي النهاية، نريد الرجوع
إلى تلك الصور. تحتاج أولاً إلى إعادة الصور
مرة أخرى لأنني، اّمل أن تكون في الواجب المنزلي الأول قد استطعت ضبط العرض
.............. لذا أعدهم إلى وضعهم الأصلي بحيث
يتكدسون فوق بعضهم البعض. ثم تأكد بعد ذلك من تمركزهم
وسط الجزء الأيسر. لا أريد أن تكون كافة
الصور في جانب واحد أو اّخر. وعند وضعهم في الوسط،
تأكد من ترك بعض المسافات بينهم، سواء في الجزء العلوي أو السفلي أيضًا. ومرة أخرى، سنستخدم مستوى النظير
حتى نقوم بتقييم ما قمت به من عمل. وعلى عكس ما سبق، ستتوقف الدرجات
على مستوى الإكمال و وبشكل أكثر لحد ما على الهيئة التي تبدو بها صفحتك. كما نريد التأكد من أنك لا
تضع أشياء يصعب فراءتها أو أو أشياءً لا معنى لها حقًا عند دمجها مع بعضها البعض. فإن أتيحت لك الفرصة، تأكد من تفعيل
بعض برامج التقييم المختلفة. لتجنب وتفادي أي مشكلات. وهناك أماكن مختلفة يمكنك الذهاب إليها. ولكن هذا هو الجزء
اللطيف المتعلق بتصنيف النظائر (الأقران)، فيمكن لأقرانك أن يخبروك إذا ما كانت الأشياء
تتميز بتباين جيد في الألوان أم لا. والاّن ومرة أخرى،
سيتم تطبيق المعايير المناسبة من جديد. ويمثل هذا عنصرًا هامًا بالتحديد عندما
نبدأ في الحديث عن المحددات المتقدمة. وجدت أن الناس أحيانًا يقومون بكتابة
كل ما يفكرون فيه في ورقتهم التصميمية و
يأملون فقط أن تسير الأمور على ما يرام. سنحصل على نقاطًا
إذا قمنا بذلك. والاّن اّخر شيء أريد
أن أفعله هو أن أذكر أنني أعرف أن الناس تقوم بالبرمجة
على أجهزة مختلفة. لذا عندما تقوم بالتسجيل في البرمجة،
تأكد أنك غير متردد أن تقول أن الرمز الخاص بي يظهر فقط على شاشة كبيرة
أو على هاتف أو شيء من هذا القبيل. إن الاهتمام بأحجام الشاشات المختلفة
شيء يسمى التصميم الفعال (سريع الاستجابة). الذي لن نتناوله في
هذه الدورة بالتحديد. لذا فأنا لا أتوقع منك القيام بتصميم موقع
يبدو في غاية الروعة على كل منصة. وما أتوقعه منك أن تفعله هو حقًا
القيام بالبرمجة والترميز وتكون لديك القدرة على القيام به هذه المرة. تأكد من أنك تعرف بالضبط
ما يتم في كل سطر وأنك تشعر بالراحة عندما تقوم بتغيير بعض الأجزاء الصغيرة و
تشعر بأن صفحتك لن تتأثر سلبًا. ومرة أخرى، إذا واجهت مشكلات،
تأكد من استخدامك لوحات المناقشة. لقد كان لديك زملاء
استفدت حقًا منهم وأريد أن أشجع حقًا
على هذا التواصل. حظ سعيد.