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

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

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

وستغطي مقالة اليوم النقاط الرئيسية لفن الطباعة، والتي على كل مصمم محترف الإلمام بها وتطبيقها في عمله.

إقرأ أيضاً: أساسيات معمارية المعلومات Information Architecture للمصممين

ما هي الطباعة Typography؟

الطباعة شيء أكبر من مجرد تقنية تصميم حيث عَرَّفها Robert Bringhurst (مصمم خطوط طباعية) في كتابه “The Elements of Typographic Style”  بأنها تتمثل في إكساب اللغة البشرية شكلاً مرئياً دائماً. إضافة إلى ذلك، تحول عملية الطباعة اللغة إلى عنصر مرئي ذو خاصية جمالية.

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

ثم انطلقت ثورة طباعة حقيقية بعد ظهور إنجيل (غوتنبيرغ)، حيث يعتبر الكتاب الرئيسي الأول الذي طُبع نصه بطريقة قوالب الحروف المعدنية المنفصلة، والذي حدد بداية عصر الكتب المطبوعة في الغرب. إن نمط الطباعة المستخدم في الكتاب المقدس لغوتنبيرغ يعرف الآن باسم Textualis و Schwabacher.

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

ومنذ فترة ليست طويلة كانت الطباعة دراسة مخصصة للعاملين في مكاتب التحرير، لكن الآن يُطبق هذا العلم في مختلف المجالات، ويلعب دوراً هاماً في مجال التصميم.

إقرأ أيضاً: 10 من أفضل أدوات مصممي واجهات الإستخدام وتجربة المستخدم

دور الطباعة في عملية التصميم

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

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

مع ذلك، تعتبر الطباعة جزءاً أساسياً لتصميم فعال ولذلك دعنا نعرف السبب في الآتي.

Interface design

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

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

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

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

إقرأ أيضاً: تصميم الطباعة في الهواتف: ثمانية خطوات نحو واجهة المستخدم القوية

عناصر الطباعة الأساسية

لخلق طباعة تتسم بالعمق، على المصمم تعلم التركيب الداخلي والعمليات المطلوبة لإعداد الطباعة.

مصطلح Font و Typeface

في وقتنا الحاضر، يستخدم العديد من المصممين مصطلحي “Font و Typeface” كمرادفات لبعضها البعض، ولكن هذا الاستخدام ليس صحيحاً ويجب توضيحه.

إن مصطلح Typeface أو “أشكال الخطوط” هو نمط تصميم النص ويحتوي على نطاق كامل من الأحرف بجميع الأحجام والأوزان. من ناحية أخرى، يعتبر مصطلح Font أو “الخط” تمثيلاً رسومياً لحرف ما في شكل خط وحجم ووزن معين.

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

خط الوسط وخط الأساس

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

Mean line and baseline

مقاييس الحروف ( الحجم، الوزن، والارتفاع)

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

كما أنه يُطلق على ارتفاع الحرف أيضاً مصطلح “x-height” لأن جسم كل حرف يعتمد في حجم معين على الحرف X. ولذا يصبح من السهل الفصل بين عناصر النص مثل العنوان والعنوان الفرعي وجسم النص عن طريق تغيير هذه العوامل.

Character measurement

الصواعد والهوابط

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

Ascender and Descender

المساحة البيضاء

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

White space

المحاذاة والضبط

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

Alignment

التعقيب

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

Tracking

تقنين الأحرف

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

Kerning

فوصلة السطور

وهي المسافة بين الخطوط الأساس للنص وتكوين المسافة المناسبة بين الأسطر يساعد القارئ على الانتقال بسهولة بين سطور النص وبالتالي يُمكنّه من قراءة قطع النصوص الكبيرة، في مجال التصميم تعتبر المسافة القياسية ما بين السطور هي 120% من حجم الخط، ويمكن أن تختلف تبعاً لخصائص نمط الخط.

Leading

التسلسل المطبعي

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

يخلق المصممون هذا التباين من خلال تنظيم عناصر الطباعة بما فيها نمط الخط، الحجم، اللون وكذلك المحاذاة.

The Big Landscape

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

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

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

ترجمة بتصرف لمقال Typography in UI: Guide for Beginners

مقترحات للقراءة

النسبة الذهبية لتحقيق التوازن في تصميم واجهة المستخدم

ست مراحل إبداعية في تصميم العلامة التجارية (الدليل المفصل)

النسبة الذهبية لتحقيق التوازن في تصميم واجهة المستخدم

كتب بواسطة

يونس بن عمارة

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

إنضم إلى مئات المشتركين لتحصل على أهم المقالات التي نقوم بنشرها اسبوعياً

ما هو تصميم واجهات الإستخدام UI و تجربة المستخدم UX

أصبح مصطلح UI / UX من المصطلحات شائعة الإستخدام هذه الأيام، ورغم بساطته إلا أنه يشير إلى الكثير ضمنه، ومما لا شك به أن تصميم واجهات الإستخدام UI و تصميم

اقرأ المزيد

10 من أفضل أدوات مصممي واجهات الإستخدام وتجربة المستخدم

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

اقرأ المزيد

أساسيات معمارية المعلومات Information Architecture للمصممين

تحتوي الشبكة المعلوماتية العالمية على قدرٍ هائلٍ من المعلومات التي يصعب تصورها غير منظمة ومن دون هيكلية لأن العقل البشري حينئذ لن يكون قادراً على استيعاب شيء منها، حيث

اقرأ المزيد