ما ملاحظاتكم على مشروع تخرجي

لقد اطلعت على الموقع وهو افضل بكثير جداً ولكنه مازال بحاجة للمزيد من التعديلات لاسيما على صفحة (تسجيل الدخول و التسجيل)حيث ينقصها التصميم الجيد و وسيكون من جميل ان تضيف بعض شروط التحقق على النموذج.

كذلك فلديك مشكلة في الـ srcoll يمين ويسار ينبغي عليك العمل على حلها :

كذلك اعتقد ان ال footer يحتاج للمزيد من التحسين من الناحية التصميمية.

بالنسبة لصفحة خطوات الرحلة فاعتقد انه يمكنك العمل على المزيد من التفاصيل (حيث ان اسم الصفحة هو خطوات الرحلة بينما الذي يظهر هو مجموعة من الصور المرتبة بشكل شبكة)، كذلك الامر فهنالك مشكلة في قراءة بعض الكلمات (المكتوبة فوق الصور) ولا يوجد زر للعودة للصفحة الرئيسية و الصفحة غير متوافقة مع كل الشاشات الصغيرة.

قد يكون من الجيد ان تحول الصور إلى slider وفي كل slider يكون هنالك مثل شرح عن المعلم وبعض التفاصيل.

الصفحة الرئيسية تحتو على مشكلة بالتوافق مع الشاشات الصغيرة أيضاً.

التحسين على الموقع ظاهر ويبدو أفضل بكثير عما كان في السابق ، وكما أخبرك المدرب عمر يحتاج إلى بعض التعديلات ، ولقد لاحظت أنه يوجد في الموقع سكرول أسفل الصفحة وهذا خطأ لذلك يجب معالجته ، كما أن هناك بعض الأخطاء في التصميم مثل الإطار المتوهج بألوان مختلفة ، يجب أن يكون أفضل وطريقة عرض الصور تحتاج إلى ترتيب . أيضاً من الامور الجميلة في الموقع إضافة الحركات والتأثيرات على التصميم . بالنهاية قم باستخدام خط مناسب وجميل ليظهر النص بشكل سليم ورائع .

بالنسبة لقائمة التنقل Navbar فمن الأفضل جعل الشعار بحجم أكبر وأيضًا تجنب أن يكون الشعار عام جدًا وأعلم أنك ما زلت تتعلم لكن لمعلوماتك فقط، أي استخدم أيقونة مثلاً من موقع flaticon ولو بحثت عن travel ستجد الكثير من الأيقونات الجيدة حملها بصيغة PNG واستخدمها.

أيضًا روابط التنقل يجب أن تكون ظاهرة للمستخدم، عليك بجعلها تظهر في المنتصف مثلاً مع تغيير اللون الخاص بالروابط، فعند تصميم واجهات المستخدم هناك نقطة هامة ألا وهي التباين Contrast فكما ترى هناك روابط تظهر بشكل غير واضح عليك بزيادة حجم الخط وإختيار اللون الأبيض لكل الروابط مثلاً، مع تغيير اللون قليلاً عند عمل Hover مثلاً.

وتستطيع استخدام الأداة التالية من أجل قياس درجة التباين:

• https://coolors.co/contrast-checker/ffffff-4590e1

حيث يجب أن تكون على الأقل 5 وبإمكانك الضغط على enhance وإختيار تغيير لون الخلفية أو الخط من أجل تحسين التباين تلقائيًا لك.

وبالنسبة لقسم Hero وهو القسم الرئيسي الذي يأتي بعد قائمة التنقل، حاول ضبط التسلسل الهرمي في التصميم hierarchy حاول البحث على اليوتيوب عن "التسلسل او الانسيابيه ( Hierarchy ) مبادئ التصميم" وستفهم ما أقصده وإليك مثال:

بحيث يكون هناك فروق بين العنوان الرئيسي مع تسليط الضوء أيضًا على النص الذي تريد عرضه للزائر عند دخول الصفحة أسفل العنوان الرئيسي.

وأيضًا من الأفضل ذكر شعور أو حالة مثلاً في نص الزر، مثل سافر معنا بدلاً من اتصل بنا.

بالنسبة لباقي الأقسام حاول تجنب استخدام الظل بالألوان بتلك الطريقة، يكفي فقط وجود ظل باللون الأسود الخفيف وستجد هنا الكثير من الأمثلة التي يمكنك التعلم منها:

• https://getcssscan.com/css-box-shadow-examples

بجانب الإقتراحات السابقة يفضل حل مشكلة ال scroll الأفقي والعنصر الذي يسبب هذه المشكلة هما العنصران .row بداخل العنصر

<section class="tours container-fluid my-5 show active" id="tours-section">
  <h2 class="section-title mb-2 h1 mb-5">الجولات السياحية</h2>
  <div class="row no-gutters"><div class="col-10 offset-1 text-center">
    ...
  </div>
  <div class="row no-gutters">
    ...
  </div>
</section>

عند إضافة الصنف no-gutters للعنصر row  يتم حذف ال margin الزائدة التي تجعل عرض الموقع أكبر من عرض الشاشة

لذلك بعد التعديل السابق سيختفي ال scroll الأفقي

كما أن هناك بعض التعديلات التي يفضل العمل عليها وهي تعديل الحجم الخاص بالأيقونات كما هناك مكتبات للأيقونات أفضل من الموجودة

قد اطلعت على موقعك، وهو عموما جيد. بنية التصميم ككل جيدة، هيكلة وتقسيم الأقسام جيدة أيضا ولكن فيما يلي بعض الملاحظات: 

• الخط المختار غير جيد، فكر باختيار خط آخر.
• تخلص من أيقونة المنزل وأضف رابط المنزل للشعار الرئيسي. 
• تخلص من أيقونة تسجيل الدخول وأضف رابطا أو زرا "تسجيل / دخول" يؤدي الى صفحة تسجيل الدخول.
• اختر لونا آخر لكلمة "سفرني" بحيث تظهر مندمجة مع البنية العامة للتصميم.
• الصفحة ككل تظهر scroll على المحور x، تأكد من البحث عن السبب وحل المشكلة.
• حركة دوران الأيقونات عند الهوفر في بطاقات الخدمات غير احترافية، فكر باهتزاز بسيط لها فقط. سيكفي ذلك للدلالة على الهوفر. 
• الصور في قسم الجولات الاحترافية تظهر كبيرة جدا، قد يكون من الأحسن لو كان القسم عبارة عن شبكة grid فيها ثلاث خانات كل خانة هي بطاقة لجولة احترافية مثلا.
• لا داع من اضافة لونين مختلفين لكل زر في قسم الجولات الاحترافية.
• نفس الشيء بالنسبة للتضليل، لا يظهر الضل بشكل جيد. أضف ضلا طفيفا وليكن رماديا لا غير. 
• قسم تواصل معنا هو الآخر يحتاج تنقيحا، الأيقونات تظهر كبير جدا، أظن أنه سيكون من الأحسن لو كانت خيارات التواصل عبارة عن قائمة ul صغيرة توضع في حاوية مرنة flex مع عنصر الخريطة. كما أنك قد تحتاج ازالة الأيقونات تماما.
• صفحة تسجيل الدخول عموما جيدة، ولكن قد يكون من الأفضل لو تم تزويد حجم الهوامش الداخلية paddings لكل من الحقول النصية والأزرار. 

وفي الأخير، قد تكون هاته الملاحظات مجرد اراء شخصية لا الزمك بها، ولكنها ستحسن من جودة تصميمك ومن تجربة استخدامه ان شاء الله.