10 قواعد لطباعة الويب يجب أن يعرفها كل مصمم

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

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

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

1. توقف عن استخدام LoremIpsum بعد عملية التصميم الأولية

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

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

2. جعل النص بلا سيريف

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

3. فكر في الاقتباسات الذكية والرموز الأخرى في وقت مبكر من عملية التصميم

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

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

4. مهارات CSS المتقدمة مهمة للغاية

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

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

5. كل من الطباعة الدقيقة والماكرو مهمة

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

ترتبط الطباعة الكلية بالطريقة التي ترتبط بها اختياراتك فيما يتعلق بالطباعة بتصميمك العام. يتعلق الجماليات.

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

6. تعرف على المحتوى وكذلك التصميم

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

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

7. فهم أهمية التسلسل الهرمي

التسلسل الهرمي هو خريطة الطريق التي تقدمها للأشخاص الذين يزورون موقع الويب الخاص بك. يمكنك استخدام الصور والفيديو والألوان والطباعة (بالطبع) لإنشاء هذا التسلسل الهرمي.

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

8. كن مبدعا ولكن حذرا مع اللون

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

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

9. التخلص من نص التوسيط

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

10. ضع في اعتبارك الشكل الذي يبدو عليه النص بعد تكبيره

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

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

أدوات وموارد مفيدة

فيما يلي بعض الأدوات والموارد المفيدة لمساعدتك على إنجاز المزيد مع الطباعة:

• FontFace Ninja : تساعدك هذه الأداة على تحديد الخطوط التي تجدها على الإنترنت. هذه أداة رائعة عند تشغيل خط يلفت انتباهك حقًا. سيساعدك مكون Chrome الإضافي هذا في تحديد أي خط متوفر تجاريًا تراه على أي موقع ويب والعثور عليه وشرائه.
• TypePlate : هذا إطار عمل طباعة كامل مثالي لمصممي الويب. يمكن لـ TypePlate التعامل مع الأحرف الاستهلالية ، والاقتباسات الكتلية ، والقياس ، والألوان ، ومجموعة متنوعة من التحديات الأخرى المتعلقة بالطباعة.
• مقياس نمطي : هذا مقياس يسمح لك بتحديد الخط وحجم الخط المثاليين. يساعدك أيضًا على إنشاء توازن بين حجم خط العناوين والعناوين الخاصة بك والخط الذي تحدده للنص.
• TIFF : تسمح لك هذه الأداة بإحضار خطين مختلفين. بعد ذلك ، يعرض الاختلافات بين كل من الخطين نيابة عنك. حتى أنه يسمح لك بمقارنة الأحرف والأرقام المختلفة من خط إلى آخر.
• TypeWolf : استخدم موقع الويب هذا للحصول على إصلاح لبعض من أروع الخطوط والاستخدام الأكثر إلهامًا للطباعة على الإنترنت. هذا مصدر ممتاز للإلهام ، وكذلك المعلومات.
• لماذا الخطوط مهمة ، سارة هيندمان : هذا كتاب ممتاز يستكشف أهمية الخطوط والطرق التي يمكن أن تؤثر بها الطباعة على الحالة الذهنية. إنه كتاب رائع للأشخاص المتحمسين للطباعة ، ولكن أيضًا للأشخاص الذين قد يحتاجون إلى الإقناع بأهمية اختيار النوع المناسب من الوظيفة.

خاتمة

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