كيفية الحفاظ على استجابة التصميم المستجيب
تصميم الويب المتجاوب شائع ولا يخفي على الإطلاق. هذا هو ما ينادي به الخبراء وما هي العديد من العلامات التجارية التي تتحول إلى. لا يتعلق الأمر فقط بإنشاء موقع جاهز للجوّال ، ولكن أيضًا عن جعل موقعك مرئيًا لكل حجم متصفح ، سواء عن طريق الكمبيوتر المكتبي أو الجهاز اللوحي أو الهاتف الذكي.
الجزء الخشن حول التصميم من أجل الاستجابة هو إنشاء موقع يبدو جيدًا كبيرًا وصغيرًا. عليك أن تأخذ الكثير بعين الاعتبار قبل أن تفتح برنامج التصميم وتذهب إلى العمل. إنها خطوة إضافية عادة ما تكون جيدة في المنتج النهائي. من الواضح جداً عندما لا يخطط المصمم للاستجابة ؛ مواقع تميل إلى أن تبدو حقا عارية ومملة.
من الضروري للغاية أن يحافظ المصممون على إبداعهم في جميع أنحاء المواقع سريعة الاستجابة. نظرًا لأن المزيد من الأشخاص يستخدمون الأجهزة اللوحية والهواتف الذكية ، فأنت تريد التأكد من أن الجميع قادر على عرض موقعك. إليك بعض النصائح التي تساعدك على إبقائك مبدعًا وفعالًا عند تصميم الويب المتجاوب.
1. استخدم الطباعة الممتازة
مع المواقع المتجاوبة ، عليك أن تنظر في ما هو جيد على شاشة أصغر. تعد الطباعة الجيدة عنصرًا أساسيًا في أي تصميم ويب جيد ، ولكنها ضرورية في تصميم الويب سريع الاستجابة. مع انخفاض أحجام الشاشات ، يجب أن تتحول معظم العناصر وتتقلص أو تتحرك كذلك. أولا وقبل كل شيء ، يجب أن يكون لديك الطباعة هذه القدرة.
ثانيًا ، يجب أن تستخدم عناوين مختلفة وأحجامًا مختلفة في النص. الآن ، نستخدم عادةً عناوين وعناوين كبيرة الحجم لتصميمات سطح المكتب. هذا ليس من الضروري أن يتوقف في مجمله لأنك تفكر في أحجام أصغر. تأكد فقط من أنك تستخدم مكونًا إضافيًا ، مثل FitText، لتقليل أحجام النص الخاص بك. هذا يساعد.
حداد يستخدم العديد من الخطوط المختلفة لخلق شكل ومظهر مثير جدا للاهتمام. كما أنها تختلف أحجام هذه الخطوط في جميع أنحاء الموقع. ما يثير الاهتمام في وضع سطح المكتب ، هو الطريقة التي يتم بها اصطف النص والفقرات في أعمدة مختلفة. عندما يتم تصغير الإطار ، ينهار النص في عمود واحد. لحسن الحظ ، يظل النص ثابتًا بالحفاظ على نفس المقياس والأسلوب.
مجلة Smashing تميل إلى أن تفعل الشيء نفسه. يتخلصون من الجانب الأيمن من التصميم (الإعلانات) بالكامل عندما يتم تصغير النافذة. ومع ذلك ، يلتف النص داخل النافذة وتظل الأنماط والألوان والأحجام متناسقة.
2. استخدم صور رائعة
الصور ، مثل الطباعة ، مهمة للغاية في أي تصميم موقع. أيضًا مثل الطباعة ، في التصميمات سريعة الاستجابة ، عند عرض موقع على شاشات أصغر ، يجب أن تظهر صورك أيضًا أصغر أو أقل. هناك أطنان من التخطيطات المختلفة وأحجام مختلفة للصور يمكن استخدامها في تصميم متجاوب. من المهم الانتباه إلى الصور التي تختارها وكيفية استخدامها لأنها ستتغير بلا شك. عندما تصبح الشاشات أكبر أو أصغر ، تتغير الصور الشكل وتكشف أو تقطع أجزاء معينة من الصورة.
من الناحية المثالية ، تحتاج إلى التأكد من أن الصور الفوتوغرافية الكبيرة الخاصة بك لا تحتوي على أي محتوى رسومي عليها يمكن اقتصاصها عند تغيير حجم النوافذ. بالإضافة إلى ذلك ، عند إنشاء صور رسومية ، يجب عليك التأكد من إنشاء صورة يتم تحميلها بسرعة وستكون مرئية على شاشة أصغر. هذا هو السبب في احتضان المصممين التصميم المسطح. إنها أسهل.
في Pandiscio ، يجب أولاً ملاحظة كيف تبدو صورة الرأس الأكبر على سطح المكتب. إنه ممتلئ ، يمتد إلى الجوانب وجودة عالية جدًا. كلما قمت بتقليص حجم النافذة ، تصبح الصور أصغر حجمًا ، وتغير الشكل (من مستطيل إلى مربع) ويتم اقتصاصها. لقد عثروا على صور تبدو جيدة عند تغيير حجم الشاشة.
KinHR هو موقع يستخدم الكثير من العناصر الرسومية المختلفة بالإضافة إلى الصور الفوتوغرافية. لاحظ أنه عندما تكون الصور كبيرة الحجم وعندما تكون صغيرة ، تصبح أصغر حجمًا كما هو الحال في موقع Pandiscio الإلكتروني. ومع ذلك ، فمع العناصر الرسومية في الجسم ، تصبح الصور أصغر مع الحفاظ على شكلها وعدم اقتصاصها.
3. لا تنام على الملاحة
ضع علامة فارقة ، إذا لم يكن لدى الأشخاص فكرة حول كيفية التنقل حول موقعك ، فلن يفعلوا ذلك. يعتبر التنقل أصعب عند التعامل مع التصميم المتجاوب لأننا معتادون على إنشاء الملاحة لتصميمات المناظر الطبيعية. الآن ، علينا إنشاء الملاحة التي يمكن تكثيفها بسهولة لتناسب أبعاد الصورة.
انها ليست مشكلة كبيرة عندما يكون لديك عدد قليل من الروابط. يمكنك إما جعل القائمة أصغر أو مكثفة بالقرب من الجزء العلوي أو يمكنك إنشاء قائمة منسدلة للمشاهدين. من الأهمية بمكان هو كيفية التعامل مع الملاحة مع المزيد من المواقع الثقيلة المحتوى.
لديه Mashable طن من الروابط لأن لديهم طن من الفئات ، وحتى المزيد من المقالات. علاوة على ذلك ، لديهم صفحات خاصة بهم تتمحور حول الشركة والتي يجب ربطها أيضًا. تقرر Mashable إنشاء قائمة منبثقة على الجانب الأيسر من الشاشة للمتصفحات الأصغر.
لدى Monocle مستويين من التنقل الشامل لموقعهم. بالنسبة إلى المتصفحات الأصغر حجمًا ، فقد أنشأوا قائمة الشرائح لأسفل للحصول على أقصى درجة من المحتوى واكتشفت فقط المستوى الثاني من التنقل.
4. جعلها ممتعة للاستخدام
عند النقر فوق الارتباطات عبر الإنترنت ، قد تضطر إلى الجلوس هناك وانتظر تحميل الأشياء قبل ظهور صفحة. على الهواتف ، من المزعج للغاية العثور على الزر التالي بدقة للانتقال إلى المزيد من المحتوى. الاشياء من هذا القبيل ليست ممتعة ولا هي بديهية.
إن الاهتمام بالتفاصيل وجعل موقعك أكثر سهولة يجعل موقعك أكثر مشاركة. فكر فيما يشبه استخدام موقع على أي حجم متصفح. فكر في ما يجب على مواقع الويب فعله عند الاتصال بأي إجراء. ابحث عن هذه الأشياء وأصلحها حتى يصبح موقعك سهلاً وممتعًا وبديهيًا في الاستخدام. كما أنه يجعل أكثر إثارة للاهتمام!
يجعل الطين موقعه أكثر إثارة للاهتمام من خلال الانتباه إلى انتقالاته. إنها تخلق إحساسًا أنيقًا للغاية بالسماح للعديد من عناصرها بالانزلاق والتلاشي بدلاً من التحرك فجأة والظهور. انها تصنع عالم جديد ومختلف.
يستخدم Neue Yorke الكثير من الحركة عند الانتقال من بند المحفظة إلى البند. مرة أخرى ، يخلق شعورًا راقيًا للغاية ويبقي المشاهدين مهتمين بما سيتم الكشف عنه قريبًا.
5. فكر خارج الصندوق
عندما يفشل كل شيء آخر ، فقط كن مبدعًا. لا يُقصد من تصميم الويب السريع الاستجابة أن يكون قيدًا على طريقة إنشاء مواقع الويب. هناك دائما مجال لاستخدام الإبداع ، سواء كان ذلك عن طريق الترميز أو التصميم.
أنشأت Enso موقعًا يبدو وكأنه ليس لديه أي فرصة للاستجابة. لاحظ كيف غيّروا التصميم قليلاً عندما يصبح الحجم أصغر ، لكنهم حافظوا على علامتهم التجارية وإبداعهم.
لدى TBWA موقع لديه بعض التصميم الرائع. لكن لديهم أيضا صور رائعة. ولديهم أيضًا كتابة رائعة! لقد استخدموها جميعًا هنا لتصميم تصميم ويب سريع الاستجابة وفريد من نوعه.
استنتاج
إن الحفاظ على إبداعك في تصميم متجاوب ، أو في أي تصميم ويب سهل مثل رسم مفهومك ومراجعته للحفاظ على أهدافك. تحدث الأشياء المرحة بسهولة أكبر عندما تبدأ في تخطيط الطريقة التي تريد أن يعمل بها موقعك على الويب ويعمل ، بدلاً من البدء بذلك. لا يجب أن يكون تصميم الويب سريع الاستجابة هو المهمة الكبيرة القديرة التي يخافها المصممون. انها بسيطة الى حد ما! احتفظ بجميع الأشياء السابقة التي ناقشناها في عين الاعتبار وأنشئ مواقع خارجة عن العالم! نتمنى لك التوفيق في تصميم الويب سريع الاستجابة.
ما هي النصائح التي ستشاركها للحفاظ على التصميم سريع الاستجابة؟ هل وجدت تصميمًا مبدعًا للغاية؟ اسمحوا لنا أن نعرف في التعليقات.