9 من أفضل الأمثلة على تصميم مواقع الويب ومتى يتم استخدامها

نشرت: 2020-12-04

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

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

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

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

سيساعدنا تقييم هذه الأمثلة على فهم الدور الذي يخدمه كل نوع تخطيط في بناء محتوى موقع ويب يحقق أهداف التصميم الخاصة بنا. في نهاية المطاف ، فإن معرفة متى وكيفية الاستفادة من التخطيط الصحيح لمواقعنا - سوف يجهزنا ويمكّننا من بناء استراتيجيات تصميم أكثر قوة وصياغة مواقع ويب تكون أكثر جمالًا.

استخدم شبكة موقع ويب لبناء تخطيط صفحتك

جدول المحتويات

  • ما هو تخطيط موقع الويب؟
  • ما يجب أن يتضمنه كل تصميم موقع
  • 9 تخطيطات مواقع الويب الأكثر فعالية
  • 1. تخطيط عمود واحد: جهاز iPad الشهير عالميًا
  • 2. تخطيط عمودين: Earmark
  • 3. ثلاثة مربعات تخطيط: KatchMe
  • 4. تقسيم الشاشة تخطيط: Bose
  • 5. تخطيط غير متماثل: أسفل البطن
  • 6. الشريط الجانبي الثابت: مطعم أربور
  • 7. تخطيط الوسائط بملء الشاشة: الأوبرا الوطنية الهولندية والباليه
  • 8. تخطيط الشبكة: مليكة فافر
  • 9. مربعات التخطيط: TSX برودواي
  • جاهز ، جاهز ، بناء

ما هو تخطيط موقع الويب؟

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

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

ما يجب أن يتضمنه كل تصميم موقع

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

بشكل أساسي ، ما يجب ألا ننساه أبدًا عند التخطيط لتخطيط صفحتنا هو تضمين:

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

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

تعرف على كيفية تحسين تخطيط موقع الويب الخاص بك باستخدام Elementor