4 اتجاهات التصميم الأساسية لعام 2015
تغيرت شبكة الإنترنت كثيرًا على مدار العقد الماضي ، وفي الوقت نفسه لم تتغير على الإطلاق. إذا نظرنا إلى الوراء لمدة 10 سنوات ، فسنجد أن الويب يحتوي على نمط تخطيط شائع جدًا في العمل عبر الجزء الأكبر من المواقع. يتكون نمط الانتقال هذا من رأس وتذييل وشريط جانبي ومنطقة محتوى. كان التخطيط المتوقع للويب. في الوقت نفسه ، كان لدينا ارتفاع في Macromedia Flash الذي أفسح المجال لعصر من التخطيطات البديلة. تخطيطات لم تلتزم بهذه الصيغة الصارمة. وبالطبع مع تآكل الفلاش ، تلاشت هذه المقاربة قليلاً ... أقولها قليلاً ، لأنها عادت مع الانتقام.
إذا قمت بمسح أحد المعارض الفنية العديدة التي تعرض تصميم الويب الحالي ، فسوف تلاحظ بلا شك أن البنية الأساسية لصفحات الويب ليست سوى ثابتة. يمكن أن يتغير ويغير أي شيء يحتاج إلى أن يكون. هذا في رأيي هو واحد من أفضل الآثار الجانبية وقد أنتجت تصميم الويب استجابة. المعيار الجديد كما هو ، هو أنه لا توجد على ما يبدو صيغة ثابتة على الإطلاق.
وقال كل ذلك يمكننا مراقبة العديد من الاتجاهات عالية المستوى في تصميم التخطيط التي تمثل ما أعتبره تخطيطات غير عادية. غير عادي لأنهم لا يتبعون صيغة صارمة أو نظام محدد مسبقًا. ولكن هذه اتجاهات في قدرتي على تقديم العشرات ، إن لم يكن المئات من الأمثلة التي تملأ كل فئة من هذه الفئات.
ما تجده هنا هو مزيج مثير للاهتمام من الاتجاهات والتخطيطات غير العادية التي نأمل أن تلهمك في تقييم الهياكل الأساسية التي تتقدم بها لتصميم الويب. دعونا الغوص في وإلقاء نظرة ...
شاشات انقسام
في هذه الفئة ، نجد مجموعة مختارة من المواقع التي تقسم الشاشة بالكامل باستخدام فاصل رأسي. ربما يكون هناك العديد من الأسباب للقيام بذلك ، وفي مسح العديد من العينات من هذا النوع وجدت سببين رئيسيين.
الأول هو أنه في بعض الأحيان يمكن أن يحتوي التصميم على عنصرين أساسيين لهما نفس الأهمية. من المقاربات الشائعة لتصميم الويب ترتيب الأشياء حسب الأهمية. ثم تنعكس هذه الأهمية في التسلسل الهرمي وهيكل التصميم. ولكن ماذا لو كان لديك بالفعل شيئان للترويج لهما؟ يتيح لك هذا الأسلوب إبراز أهمية كل منهما والسماح للمستخدم بالاختيار السريع بينهما.
السبب الثاني الذي وجدته لهذا النهج هو أنه في بعض الأحيان تحتاج إلى نقل ازدواجية مهمة. فكر في موقعي Eight و Four على سبيل المثال. هنا يريدون أن يعبروا عن حقيقة أن نقاط قوتهم الأساسية هي جذورهم الرقمية وطاقمهم الموهوب. هذا الاقتران هو ما يحددها. شاشة الانقسام هي طريقة جميلة لتقديم هذا. وأنا أحب على وجه الخصوص كيف يوحّد علامة العطف الجانبين.
لا الكروم!
أحد العناصر الرئيسية المستخدمة في تصميم الويب تحتوي على عناصر: مربعات وحدود وأشكال وحاويات من جميع الأنواع المستخدمة لتقسيم محتوى الصفحة. فكر في رأسية نمطية حيث يتم احتواء العناصر بدقة وفصلها عن المحتوى. الاتجاه الشائع الآن هو إزالة كل هذا الكروم الإضافي.
هذا هو نهج الحد الأدنى ، لكنه يذهب خطوة أبعد وبعض التحولات مثيرة للاهتمام على طول الطريق.
في هذا المثال ، قاموا بإزالة فكرة رأس وتذييل الصفحة معاً. يبدو أكثر مثل كشك تفاعلي بدلا من ذلك. يتم إجراء التسلسل الهرمي للمحتوى في المقام الأول من خلال منظمة من اليسار إلى اليمين ، مما يساعد على جعل التخطيط أمرًا بديهيًا للغاية. والكروم لفصل التنقل عن المحتوى هو ببساطة غير مطلوب. بدلا من ذلك ، فإن المنتجات الجميلة تتألق.
هنا نجد أن المحتوى يتم التأكيد عليه بشكل كبير عن طريق إزالة أي إحساس بالرأس أو التذييل. بدلاً من قراءة رأس الصفحة أولاً ، تقرأ اسم الشركة وبيان واضح حول ما يفعلونه (وأين يفعلون ذلك). تليها الملاحة الرئيسية. ما هي طريقة رائعة للتأكيد على العلامة التجارية قبل حث الأشخاص على التنقل. يجعلها تدفق أنيقة. من المثير للاهتمام عند تمرير الصفحة الحصول على رأس ولمسة من الكروم. تخطيط جميل وفعال يستخدم النمط بطريقة ملهمة.
وحدات أو شبكة القائمة
بعد ذلك ، لدينا تصميمات مبنية على هياكل تشبه الوحدات أو الشبكة. في هذه التصاميم ، يتم تصميم كل وحدة على أساس حجم الشاشة. هذا ليس بالضبط نهج جديد ، ولكن إدخال تصميم الويب سريع الاستجابة جعله أكثر فائدة. يلمح هذا إلى نوع التخطيطات القابلة للتكيف التي يمكن إنشاءها باستخدام المكونات الإضافية مثل الماسونية.
يوضح هذا المثال الفكرة تمامًا. التصميم مستجيب تماما. مع تغير حجم الشاشة ، تتكيف كل وحدة مع أحجامها لتلائم المساحة. من خلال تقسيم المساحة بالتساوي يكون من الأسهل الحصول على التصميم. ويحصلون على نقاط إضافية لإدخال عنصر (بأحجام شاشة أكبر) يكسر الحواجز الجامدة بين الوحدات.
هذا المثال هو نسخة مكثفة من النمط. إنها بالطبع تحتضن المنهج النمطي ، الذي يسمح لهم بنقل المحتوى إلى الداخل والخارج حسب الحاجة. لكن هناك عنصر تصميمي مهم في العمل هنا ، والذي افتقر إليه المثال السابق. يختلف حجم الوحدات ليعكس ترتيب الأهمية ومكانها في التسلسل الهرمي. إن خطر هذا النهج النمطي يجعل كل شيء بنفس الحجم ، مما يعني أنك لا تركز على أي شيء. في المقابل ، يعطي هذا المثال أهمية واضحة للعنصر الأساسي.
ملء شاشة واحدة
وأخيرًا ، لدينا مواقع تستخدم أسلوبًا حيث يتكيف التصميم ليتم ملء الشاشة تمامًا. هذه مجموعة فرعية من التصميم المتجاوب من حيث أنها تتكيف مع حجم الشاشة. ولكن في هذا المكان تتكيف التصاميم بطريقة تجعلها تملأ الشاشة تمامًا ولا تنتج أشرطة التمرير. هذا النقص في التمرير يعني أن المحتوى يجب أن يكون شديد التركيز ، وأن التسلسل الهرمي للمحتوى محدد بوضوح. أجد التركيز والوضوح من هذه المواقع أن تكون منعشة.
استنتاج
وبينما قمت بتشريح كل من هذه الاتجاهات هنا في عزلة ، فإن الواقع هو أنها تمثل لبنات البناء. ويمكن تجميع هذه اللبنات بعدة طرق مختلفة. في الواقع ، يمكن نقل العديد من العينات المعروضة هنا إلى العديد من الفئات التي ناقشناها. إن تنوع التنسيقات على الويب الحديث ، وحقيقة أنها قابلة للاستخدام ، يجعل الويب وسيلة مثيرة للعمل بها.