البحث في الموقع

يُعَد فن الخط من المجالات التي تتقدم بخطًى سريعة وتحتاج إلى سنوات عديدة لاحترافها، ومن المهم فهم المبادئ الأساسية في مجال الخطوط مع انتشار الكثير من المصادر عبر الإنترنت التي تتيح التعرّف عن كثب على فن تصميم الخطوط، وتستطيع الارتقاء بفن الخط إلى مستوى عالٍ من الاحترافية من خلال الاستخدام المناسب للخطوط وتوظيف فن الخط في المكان المناسب، وتفيد هذه المعرفة في إيصال الرسالة المطلوبة من علامتك التجارية ومبادئها وأهدافها بدقة واحترافية، ويفيد الاستخدام الصحيح للمعرفة المفصلة بفن الخط في بناء تصاميم أفضل من وجهة نظر تجربة المستخدم، ويمكنك استخدام قائمة المبادئ التي سنستعرضها في مقالنا هذا بوصفها قائمةً مرجعيةً لتحقيق أهدافك في مهامك المستقبلية. وظف النصائح التالية في عملك ابن تسلسلا احترافيا للخط المستخدم يمكنك تحقيق ذلك بعدة طرق من أهمها اللون والتباين والحجم والوزن، وتعطي هذه الهرمية بناءً واضحًا وترشد المستخدم أو المشاهد أثناء تصفحه تصميمك أو محتوى موقعك، ويُصعّب غياب الهرمية في الخط عملية القراءة والاستيعاب والبحث عن المعلومات التي تهم القارئ، وتوضح الصورة فقرتين نصيتين الأولى مكتوبة في الجهة اليسرى من الصورة ويظهر فيها النص بأكمله مكتوبًا بالخط نفسه والحجم والوزن نفسه؛ أما الفقرة المكتوبة على يمين الصورة فتظهر بخط ذي أوزان متفاوتة، ويبدو النص الأيمن مقروءًا وواضحًا ومريحًا للناظر بوجود فرق بين العناصر المختلفة وخط واضح، وهو ما تفتقر إليه الفقرة اليسرى التي كتبت بنفس اللون والحجم والوزن، مما يوحي للمستخدم بأن الفقرة عبارة عن كتلة واحدة دون أي نقاط مميزة فيها، وهو ما قد يربك المستخدم ويدفعه للشعور بالملل أثناء القراءة. اختر الخط المناسب لكتابة النص الأساسي تأتي أهمية هذه الخطوة من ضرورة المحافظة على وضوح المحتوى المكتوب في نظر القارئ، وتكمن الأولوية في عملك بصفتك مصممًا بأن تحقق وضوح النص وسهولة قراءته وفهمه من قِبل المستخدِم قبل كل شيء، وتناسب بعض أنواع الخطوط تصميمًا معيّنًا، ولكن لا بد من تحديد نوع التأثير الذي يتركه هذا الخط عند القارئ، فمثلًا قد يغري نوع الخط Satisfy المصمم باستخدامه، ولكن تُظهر الصورة دليلًا قاطعًا بأن النص المكتوب بهذا الخط غير مريح للنظر وصعب القراءة وغير واضح بما يكفي موازنةً مع نوع الخط المستخدم في كتابة الفقرة اليمنى. امنح الخط مساحة كافية يُنظر أحيانًا إلى المساحات البيضاء الفارغة وكأنها أجزاء مهملة أو عديمة النفع، ولكنها في الواقع تتمتع بأهمية كبيرة في عالم التصميم، ويؤثر ضيق المساحات البيضاء على إمكانية القراءة، وقد يصعُب على القارئ الانتقال من سطر إلى آخر عندما تكون المساحة البيضاء الفارغة قليلةً أو أضيق من اللازم، ويمكن تجاوز هذه المشكلة ببساطة من خلال زيادة قيمة ارتفاع الخط، ولكن انتبه إلى عدم المبالغة في زيادة هذه القيمة، لأن المساحات البيضاء الواسعة أكثر من اللازم ستربك المستخدم وتؤثر سلبًا على تصميم الصفحة. حافظ على التباين تنطبق هذه القاعدة على كافة عناصر التصميم، لذا استخدم مولد نظام الألوان الذي يساعدك على إيجاد الألوان التي تتناغم وتنسجم مع بعضها البعض، ومن المهم وجود فرق واضح في التباين اللوني بين النص المكتوب وخلفية الصفحة، إذ يؤدي ضعف أو غياب هذا الفرق إلى تقليل قابلية النص للقراءة ووضوحه أمام عين القارئ، ومن الحكمة عند اختيار عناصر التصميم استخدام عدة ألوان وأوزان للخط تتراوح بين الوزن الرقيق الذي يترك الحروف بحواف رقيقة، والوزن الداكن الذي يعطي الحروف حواف غامقةً وسميكةً، ويجب مراعاة وجود تباين واضح بين أنواع الخطوط، ولا سيما عندما تتشابه أنواع الخطوط المستخدمة، لتجنب إرباك القارئ. قسم النص المكتوب إلى مربعات نصية افتراضية تتجلى أهمية هذه الخطوة عند التعامل مع المحتوى النصي الذي يحتوي على سطور صغيرة، فمن المفيد إنشاء صندوق كبير يفصل بين السطور من خلال الضغط على زر Enter، وذلك لخلق نوع من الصورة الخادعة التي توحي بوجود خطوط فاصلة بين سطور النص، وقد لا تبدو هذه الطريقة مثاليةً لفصل السطر، ولكن يُنصح بإنشاء صناديق منفصلة تساعد على تقسيم النص المكتوب، ليصبح على مستوى أعلى من الوضوح والمرونة أثناء تجربة التصفح والقراءة. اتخذ القرارات المناسبة بشأن النص وتنسيق الحروف من الممكن تغيير شكل وتنسيق الصناديق النصية المختلفة بسهولة إذا كانت الحروف والمقاطع النصية مُنسّقةً، ويفيد ذلك في الحالات التي يكون فيها المحتوى النصي كبيرًا في التصاميم المختلفة، ويمكنك تنسيق الحروف والنصوص من خلال تطبيق تنسيقات الخطوط المُعرّفة مسبقًا بسهولة من خلال نقرة واحدة، ومن غير الضروري تغيير تنسيقات الخط لكل صندوق يدويًّا عندما تغير التنسيق الكلي أو الإجمالي. تباعد حروف العنوان النصي يُعرّف مصطلح Tracking بأنه ضبط المسافات الفاصلة بين حروف الكلمات، وقد نتساءل عن أهمية ذلك في مقالنا هذا، ولكن يضيف ضبط التباعد بين الحروف العديد من المزايا إلى النص، وعليك أن تنتبه إلى الطريقة الصحيحة لضبط ذلك، والتحكم به دون مبالغة أو إفراط، ويُثبت الاستخدام المناسب للتباعد بين الحروف مهاراتك التصميمية، فمثلًا تخلق زيادة التباعد بين الحروف في العنوان النصي أو الصور الرئيسية أثرًا كبيرًا على تصميم الصفحة، ويجذب الانتباه بوضوح وإتقان وخصوصًا في النصوص الأجنبية. امنح النص مساحة داخلية كافية يبدو النص -الذي يملأ المساحة الفارغة المخصصة له ويقترب كثيرًا من حواف الصفحة- ضيّقًا وصعب القراءة، كما يوحي للمستخدم بأنه متداخل ومتعب للنظر، ويمكنك تجاوز هذه المشكلة من خلال إضافة مساحة فارغة كافية حول الجهات الأربعة للمربع النصي أو الصندوق النصي الذي تحدثنا عن بنائه سابقًا، وسيبدو نصك في هذه الحالة مريحًا وسهل القراءة بالنسبة للقارئ، إذ تمنح المساحة الفارغة متنفَّسًا للنص يريح القارئ ولا يُشعره بالضيق أو الملل، ويجب أن تراعي مختلف التصاميم ومواقع الويب المحافظة على المساحة الداخلية الكافية للنص مع وجود فراغات كافية ومناسبة تفصل الجهات الأربعة للمربع النصي عن باقي الصفحة. اعتد على الفرق بين الخط وحروف الطباعة نخلط أحيانًا بين هذين المصطلحين بحيث يُبادل البعض أحدهما بالآخر عند الحديث عن فن الخط ككل، لذلك من الجيد التعرف على الفروقات الأساسية بينهما بحيث تصبح قادرًا على التمييز بين كل مصطلح والآخر بسهولة، ويكمن الفرق بين هذين المصطلحين في دلالة كل منهما، إذ يعبر مصطلح الخط Font عن تمثيل المحتوى أو التصميم، بينما يعبّر مصطلح حروف الكتابة Typeface عن التصميم أيًّا يكن نوعه، ويعبّر الخط أساسًا عن مجال متنوع من أنواع التأثيرات والأحجام والأوزان مثل الخط الغامق أو الخط المائل، فمثلًا عندما نستخدم عائلة Helvetica في تصاميمنا، فإننا نتعامل بذلك معها بوصفها مجموعةً متكاملةً من الحروف Typeface ذات النوع Sanserif التي تتمتع بالشكل الذي يميزها عن غيرها مع مجموعة واسعة من خيارات الأوزان والأحجام والتأثيرات، ولكن عندما نسأل عن نوع الخط المستخدم في تصاميمنا فالإجابة هي خط Helvetica عادي قياس 9 نقاط، وهو ما يعبّر عن مكتبة الخطوط المستخدمة وملف الخط الذي يتعامل معه برنامج التصميم المستخدم. الدليل الذكي تتجلى أهمية الأدلة الذكية التي تقدمها برامج التصميم للمصممين أثناء عملهم عند التعامل مع الشبكة، ويصعب على المصمم ضبط اصطفاف عناصر دون الاعتماد على الأدلة الذكية والهوامش، ومن المريح أن نعلم أن معظم البرامج التي تستخدم اليوم في التصميم مجهّزة جيّدًا بمجموعة متكاملة من الأدلة الذكية التي تساعد المصمم على تجنب ارتكاب الأخطاء أثناء ضبط الحدود والمحاذاة مع الهوامش، ويمكنك الوصول إلى هذه الأدلة في معظم البرامج من خلال قائمة Preferences في شريط قوائم البرنامج، ثم اختيار الوحدات والقواعد Units and rules، وأثناء العمل تستطيع طلب المساعدة من هذه الأدلة من خلال الاستعراض الفوري، بحيث تظهر الأدلة على العناصر الموجودة على الشاشة بالحدود المطلوبة، بحيث تبدأ بعملية الضبط دون صعوبات، وذلك من خلال قائمة عرض View ثم إظهار Show وخيار Smart guides. الدمج بين خطي Serif وSanserif يمكن كتابة العنوان الرئيسي للمشروع بخط Sanserif عريض، ثم كتابة بقية المحتوى النصي بخط Serif، وسيساعدك ذلك على إنشاء تباين واضح سيُضيء بقوة على الفرق بين العنوان والمَتن، ولكن تجنّب دمج تنسيقين من خط Serif مثلًا، أو تنسيقين من خط Sanserif، ويمكنك استخدام عملية الدمج إذا أردت الإشارة إلى أهمية العنوان أو تنسيق النص الأساسي تنسيقًا مريحًا للقارئ دون اللجوء إلى حيلة تغيير الألوان. ضبط التباعد بين أزواج الحروف Kerning وضبط التباعد بين السطور Leading وضبط المسافة بين مجموعات الحروف Tracking تشكّل هذه المصطلحات الثلاث جزءًا أساسيًّا في فن الخط، ومن الضروري فهم هذه المصطلحات بدقة، ويشير مصطلح Kerning إلى المسافة الفاصلة بين أزواج الحروف في الكلمة الواحدة، ويعبر مصطلح Leading أو المعروف باسم Line height عن المسافة الفاصلة بين السطور في النص الواحد، بينما يشير مصطلح Tracking إلى التباعد بين حروف النص الكلي، وتُكمّل الأدوات الثلاث بعضها البعض وتساعدك تجربة القياسات المختلفة للتباعد على اختيار الضبط الأفضل الذي يناسب النص. افهم استخدام خط الكتابة أو Typeface توجد العديد من أنواع خطوط الكتابة الجاهزة للاستخدام عند تصميم مواقع الويب أو تصميم لافتة معينة مثلًا، كما توجد عدة أنواع من الخطوط الجاهزة للاستخدام الشخصي، لذا خذ بالحسبان الرخصة الرسمية للخط الذي ستستخدمه حتى وإن كان متاحًا للتحميل المجاني، واحتفظ برخصة الخط الذي تحمّله بهدف الرجوع إليه مستقبلًا، لأن الرخصة هي المرجعية الأساسية للسماح باستخدام الخط، كما تنطبق هذه القاعدة على الخطوط المدفوعة، إذ يجب أن تتأكد من أن الخط الذي ستستخدمه أيًّا كان نوعه يملك رخصة استخدام، ويمكنك الاطلاع على رخصة الخط للتأكد من أنه من المسموح استخدام هذا الخط في مشاريعك. لا تتوقف عن البحث يتطور عالم التصميم ويتغير كل يوم، لذلك فقد بات البحث عن كل ما هو جديد حاجةً ملحّةً للمصمم، ومن الضروري أن تبقى على اطلاع بأهم صيحات عالم التصميم والتقنيات الجديدة في المجال. لم يكن فن الخط منتشرًا بكثرة في السابق، لكنه يحتل اليوم عالم العناصر المرئية بأنواعها، لذا ابقَ على اطلاع ودراية بأهم التحديثات والتطورات في مجال الخطوط، وحاول دومًا أن تمزج بلمسة فنية بين التقنيات القديمة والتقنيات الحديثة في عملك بما يناسب متطلبات المشروع. الأمور التي يجب عليك تجنبها أحجام الخط الصغيرة تسيطر أحجام الخط الصغيرة على المحتوى بأنواعه أكثر مما نعتقد، ويظهر هذا واضحًا في المدونات والمجلات والمنصات المشابهة، حيث تكون قابلية القراءة هي الأولوية الأساسية، وتتفاقم هذه المشكلة عندما يتغلب الاهتمام بالعناصر الجمالية والتصميمية على تجربة المستخدم وقابلية النص أو المحتوى للقراءة، وتؤخذ تجربة المستخدم بالحسبان في وقتنا الحالي أكثر من أي شيء آخر ولا سيما في مجال التصميم ومكوناته وعناصره المختلفة، لذا انتبه جيّدًا على تحسين تجربة المستخدم عند زيارته لموقعك بما يضمن راحته أثناء قراءة المحتوى، وضَع الأولوية لتحسين قابلية قراءة النص وليس للعناصر التزيينية أو الجمالية. استخدام الحروف الكبيرة باستمرار تبدو هذه المشكلة واضحةً عند الكتابة باللغة الإنجليزية، إذ تأخذ الحروف الإنجليزية حجمين أساسيين حسب موقع الحرف في الكلمة، هما الحروف الكبيرة Upper-case والحروف الصغيرة Lower-case، ومن غير المألوف للقارئ أن يقرأ محتوى النص بحروف كبيرة ولا سيما إذا كان النص يعج بهذه الحروف، إذ تسبب الحروف الكبيرة صعوبةً في القراءة والفهم أحيانًا، وترتبط الحروف الكبيرة معنويًّا بالانفعال والتوبيخ والعدائية، كما تبدو عشوائيةً عندما تستخدم بكثرة في النصوص أو المحتوى التسويقي، لذا اعتدِل في استخدام هذه الحروف دون مبالغة لتجنُّب إرباك القارئ. استخدام خطوط متعددة يمكن أن يستخدم المصمم ثلاثة أنواع من الخطوط المتكاملة لكتابة العنوان وترويسة الصفحة والمحتوى النصي المتبقي، وهو أمر شائع ولا يسبب أي مشاكل تصميمية، وتستطيع الاكتفاء باستخدام خطين بغرض تحسين قابلية القراءة، كما تستطيع تجربة ما يناسبك من خلال استخدام منصة Google fonts وخدمة Type kit من شركة أدوبي، وتجنّب استخدام أكثر من ثلاثة أنواع من الخطوط بهدف الابتعاد عن تشويش القارئ. تُمكّنك منصة Google fonts من رؤية تطبيق أنواع الخطوط المختلفة على نص معين أمامك، وتستطيع البحث عن الخطوط المختلفة إما عن طريق اللغة، أو عن طريق خصائص الخط. وتمنحك المنصة فرصةً مثاليةً لرؤية التأثيرات المختلفة المطبقة على الخط الواحد، بحيث تختار التأثير أو الوزن أو النمط الذي يناسب تصميمك، كما تستطيع الاطلاع على رخصة الخط لضمان إمكانية استخدامه في مشاريعك، فلا تتردد بتجربة هذه المنصة. الإفراط في تطبيق المحاذاة لمركز الصفحة تتفاوت خواص المربعات النصية عند استخدام محاذاة النص إلى المركز، مما سيصعّب القراءة، كما سيصعب على القارئ التنقل بين السطور عندما يكون لكل سطر نقطة بداية مختلفة عن الآخر، وتُعَد المربعات النصية الموجودة في مركز الصفحة صعبة المحاذاة لبقية مكونات الصفحة، كما توحي بقلة الاحترافية في التصميم، إذ عليك أن تعتدل في استخدام الخطوط والحروف الكبيرة كما ذكرنا سابقًا. تمديد النص إيّاك وتمديد النص أو إطالة الحروف، حيث يسبب تمديد حروف النص التخلي عن واحدة من أهم أساسيات التصميم النصي الناجح، وهي استخدام الخط المقصود والمد للتصميم أمامنا، إذ يشوّه التمديد المحتوى المكتوب، كما سيدمر النص شكلًا ومضمونًا، وسيمنع القارئ من استكمال القراءة إذا بدأ بقراءة النص ولم تكن حروفه مريحةً للنظر. السطور والفقرات الطويلة قد يفقد القارئ تركيزه عندما يكون السطر المكتوب طويلًا للغاية، كما تسبب السطور الطويلة مشاكل في قابلية القراءة المريحة، وسيواجه القارئ مشاكل عديدةً في تمييز النص وتتبُّع كل سطر، وقد تشتت السطور الطويلة أكثر من اللازم انتباه القارئ وتشوّش تركيزه، لذا عليك أن تأخذ طول السطر المناسب بصريًّا بالحسبان، بحيث تتجنب تشتيت ذهن القارئ أو إزعاجه، ويتراوح عدد الكلمات المثالي في السطر الواحد بين 40 و60 كلمةً، وهو ما يجب أن تراعيه أثناء كتابة المحتوى النصي. المساحات الضيقة تشكل السطور المتلاصقة مشكلةً شائعةً أثناء الكتابة، لذلك يجب الاستغناء عنها، ويؤدي إهمالك لحل هذه المشكلة إلى كسر العديد من القواعد والمبادئ الأساسية في التصميم، ونطلق على هذه المشكلة اسم التباعد بين السطور أو Leading، وسيبدو النص صعب القراءة والفهم إذا كانت المسافات الفارغة التي تفصل بين السطور أضيق من اللازم، ويمكنك التعامل مع هذه المشكلة بوصفها قضيةً متعلقةً بالجانب الجمالي والفني من عملك. الظلال الخلفية انتبه إلى استخدام الظلال في نصوصك، لأنها قد تضفي جماليةً إلى النص أحيانًا، وقد تكون ذات نتائج كارثية أحيانًا أخرى، لذا فكّر ثانيةً قبل إضافة الظلال الخلفية لعملك، لأن استخدام الظلال قد يحول عملك من الاحترافية إلى عمل هاوٍ، إذ يرتكز أساسًا على الشكل دون مراعاة إمكانية القراءة، وقد يُصعّب ظل النص من إمكانية قراءته، مما سيحبط الهدف الأساسي لعملك، ويكمن الهدف الرئيسي وراء عملك في تحسين تجربة قراءة المستخدم لنصك بسهولة ودون إرباك، وقد لا يخدمك استخدام الظلال في ذلك. الاعتماد على تأثيرات الفوتوشوب يعتمد العديد من المصممين على خيارات مزج التأثيرات الموجودة في برنامج الفوتوشوب أو الإليستريتور، وهنا يمكنك التمييز بين الخط الجيد والخط السيئ، ويجب أن تستخدم هذه التأثيرات لتحسين العمل وإضفاء لمسة فنية عليه وليس العكس، لذا كن حكيمًا عند استخدامك هذه التأثيرات وطبّقها باعتدال، وعندما تستخدم هذه التأثيرات احرص على السيطرة على كافة الخيارات المختلفة، وعدّل بحسب خبرتك حتى تصل إلى التصميم المناسب. المبالغة في التصميم ستستمتع بوصفك مصمّمًا باستخدام الأدوات المنتشرة مجانًا عبر الإنترنت، ولا سيما عندما تعمل على تصميم معين يحتاج تلك التأثيرات البصرية، ولكن تجنّب استخدام كل الأدوات دفعةً واحدةً، وتذكّر أن المهم هو العقلانية في استخدام الأدوات الفنية المتنوعة تبعًا لهدف المشروع الذي تعمل عليه والسمة العامة له، وستساعدك عقلانيتك على معرفة الاتجاه الصحيح للعمل، وتجنُّب إضافة التأثيرات أو المبالغة في استخدامها مجتمعةً. ترجمة -وبتصرّف- للمقال Font Design: Do’s and Dont’s لصاحبه Harsh Raval. اقرأ أيضًا مهارات في فن الخط يجب أن يملكها المصمم نصائح لاحتراف ضبط التباعد بين الأحرف في التصميم كيف تقوم بعملية تجميل لخطوط موقع الوردبريس النسخة الكاملة لكتاب أساسيات تصميم الرسوميات

يُعَد التباعد بين الحروف أحد الجوانب الأساسية في مجال تصميم مواقع الويب، إذ يساعدك احتراف أساسيات فن الخط على تطوير مواقع الويب بتصاميم ثورية، وعلى الرغم من الأهمية الكبيرة التي يحظى بها فن الخط في تصميم المواقع، إلا أن العديد من المصممين يهملون أحيانًا أهمية هذا الجانب، وتؤثر عملية ضبط التباعد بين الحروف على كافة تفاصيل التصميم، إذ يظهر هذا التأثير على واجهة المستخدم وسهولة تفاعله وفهمه لمحتوى الموقع والتصميم البصري واستراتيجيات المحتوى والتسويق، ولنبدأ برحلة التعرف على أساسيات استخدام فن الخط في مجال تصميم الويب، والتي ستغني تجربتك في التعرف على جوهر معايير الخطوط في تصميم الويب والأفكار المتعلقة بذلك وآداب التعامل مع هذا الفن ودور اللغة في ذلك وأهم النصائح التي ستساعدك على اختيار أفضل الخطوط لتصميمك، من خلال استغلال المساحات البيضاء وضبط التباعد بين أزواج الحروف وضبط المسافات بين حروف الكلمات. ما فن الخط؟ يُعرّف فن الخط في عالم الويب بأنه التقنية المستخدمة في ترتيب وتنظيم خطوط الكتابة بصورة فنية أثناء تصميم مواقع الويب، ولا يقتصر استخدام فن الخط في مجال تصميم الويب على ترتيب الحروف وكتابتها بتسلسلها الصحيح الذي يشكل الكلمات على صفحة الويب، بل تتجلى أهميته في بناء شخصية مرئية وشاملة للموقع وبناء تواصل مع القارئ، ويُعَد الخط العنصر الأساسي في تسويق موقعك الإلكتروني. ما عملية ضبط التباعد بين الحروف؟ هي العملية التي ينفذها المصمم أثناء الكتابة بهدف إدارة وضبط المسافات بين الحروف، وتوحّد عملية ضبط المسافات بين الحروف مظهر المساحات الفاصلة بين الحروف عند تصميم مواقع الويب، وتؤثر هذه العملية على كثافة الكلمة والحيّز الحيوي بين الحروف والمساحة البيضاء ودمج أنواع الخطوط المختلفة، وإذا أراد المصمم منح النص القليل من الانتعاش والحيوية، فالأفضل هو زيادة المسافات الفاصلة بين الحروف؛ أما إذا أراد تصميم نص مضغوط فالأفضل هو تقليل تلك المسافات. يخلط المصممون المبتدئون بين مصطلحي Tracking وKerning، حيث يعبر مصطلح Kerning أو ما يُعرف بضبط التباعد بين أزواج الحروف عن الضبط الدقيق للمسافة الفاصلة بين حرفين متتاليين في الكلمة الواحدة، وتلعب عملية ضبط التباعد بين أزواج الحروف دورًا حيويًّا عند كتابة العناوين واستخدام المحارف وحروف الكتابة المختلفة في التصميم. أهمية ضبط التباعد بين الحروف هل تساءلت يومًا عن سبب الأهمية الكبيرة لعملية ضبط التباعد بين الحروف بالنسبة لمصممي الويب، على الرغم من وجود أدوات تصميم مُعدّة مسبقًا ومضبوطة لتُقدم أدوات تنسيق النصوص؟ ولماذا يقضي مصممو الويب وقتًا طويلًا في ترتيب وإعادة ترتيب الحروف والمساحات البيضاء عند تصميم صفحات الويب؟ النظرية لا يوجد علم واضح ودقيق يربط بين ضرورة وجود المزيد من المساحات الفارغة عندما تكون أحرف النص صغيرةً، وقد بدأت المشكلة مع ظهور الخطوط الرقمية التي تأتي بأحجام مختلفة، ولا توفّر المساحة المتوافقة اللازمة بين الحروف، على خلاف الخطوط التقليدية التي تزوّد المصمم أو الكاتب عمومًا بخيارات عديدة لضبط الحروف، وهو ما يدفع مصمم الويب نظريًّا على الأقل إلى إجراء تعديلات وتصحيحات على المحتوى المكتوب بواسطة هذه الخطوط. الناحية العملية تؤمِّن زيادة المسافة الفاصلة بين الحروف قابلية قراءة النص بسهولة من قِبل المستخدِم، بالإضافة إلى وضوح المحتوى المكتوب، وتُعَد الحروف والرموز والمحارف المتنوعة من العناصر المرئية التي كلما زاد وضوحها زاد إدراك العين البشرية لما تراه، وبالتالي زاد فهم القارئ وتمييزه للمحتوى بأفضل ما يمكن، وقد لا يلحظ القراء مدى أهمية ذلك أثناء تصفحهم أو قراءتهم السريعة لموقع ويب، ولكن يأخذ مصممو الويب على عاتقهم تحسين تجربة المستخدمين في قراءة المحتوى المكتوب على صفحات الموقع، ولا يوجد بديل يحل محل تحسين موضع الحروف وشكل الخط أمام القارئ وهو أمر يدركه مصمم الويب جيّدًا، وتُعَد زيادة وتقليل المسافات الفاصلة بين الحروف قوةً مؤثرةً يتحكم بها مصممو الخطوط لإدارة وضبط المحتوى المعروض أمام القارئ، وذلك للتأكد من عدم وجود أي اتصال مباشر أو تداخل بين حروف النص لتحسين قابلية القراءة. قال مصمم الخطوط الشهير فريدريك جودي مرّةً: إذ لاحظ فريدريك تأثُّر وضوح الحروف وقابلية قراءة الكلمات عند زيادة المسافة الفاصلة بين الحروف الإنكليزية المكتوبة بأحرف صغيرة، وتكمن خطورة هذا في عدم نجاح الضبط عند استخدام أنواع معينة من الخطوط، وقد يعالَج الأمر في النهاية من خلال القليل من التلاعب بالمسافات الفاصلة بين الحروف، ولكن يقترح فريدريك بأن يتجنب المصمم التلاعب بالمسافات ما لم يكن مدركًا تمام الإدراك الهدف وراء ذلك، ويتطلب ضبط المسافة الفاصلة بين الحروف معرفةً وخبرةً واضحةً في إدارة المساحات والمناورة في فن الخط، أو ما يسميه المصممون Manipulation in typography. تهدف المناورة في تصميم الخطوط إلى دمج بعض العناصر التصميمية مع الخط، بحيث يبدو النص وكأنه مكون من حروف ترسم لوحةً معينةً كما تُظهر الصورتين التاليتين: التحديات أثناء تصميم المواقع الفرق بين الطباعة والشاشة تختلف تجربة وضوح خط الكتابة بين الشاشة والمطبوعات بأنواعها، كما تختلف باختلاف الخلفية التي يوضع عليها المحتوى المكتوب، ويكمن الاختلاف الجوهري بين الحالتين في المظهر الفيزيائي للمحتوى والذي يكون إما مشوشًا أو واضحًا، ويتطلب ذلك الملاءمة مع المحتوى المعروض على الشاشة، بحيث يتكيّف مع التغيرات التي تطرأ على حجم الخط والدقة. يكمن السبب الرئيسي وراء اختلاف شكل الخط بين الشاشة والمطبوعات في دقة الشاشة وعدد النقاط في الإنش الواحد DPI، حيث تتمتع الشاشات إجمالًا بدقة 100 نقطة في الإنش أو أقل بقليل، بينما تبلغ عدد النقط وسطيًّا في المطبوعات 300 نقطة، والسبب وراء هذا الاختلاف الكبير هو أن الخطوط المخصصة للمطبوعات تلائم احتياجات وخصوصيّات عملية الطباعة، إذ يتمتع الخط بعتبة حبر تضبط كمية الحبر المطلوبة عند الكتابة بخط صغير وأحجام بصرية دقيقة للخط وفراغات بين الحروف، وتختلف هذه الإعدادات في الخط الواحد عند استخدامه بأكثر من حجم. اختلاف أحجام شاشات العرض حيث تقلل من إمكانية القراءة، كما يصبح تمييز الحروف من خلال نظرة سريعة وخاطفة على النص أمرًا صعبًا، بينما يبدو النص مقروءًا وواضحًا ومريحًا لعين القارئ عندما تصطف الحروف الكبيرة إلى التصميم المتجاوب، أو ما يسمى Responsive design وهو أول مصطلح يخطر في بال مصمم الويب عندما يُطلب منه تصميم موقع ويب يناسب الشاشات المتنوعة من حيث الحجم، ولكن لا يعني ذلك أن تبدو صفحة الويب بمظهر رائع على شاشات الحواسيب الشخصية والهواتف الذكية، حيث يتجاوز الأمر التفاصيل الجمالية ليصل إلى إمكانية القراءة، إذ تتجلى أهمية التصميم المتجاوب في زيادة قابلية المحتوى للقراءة من قبل المستخدم بأفضل ما يمكن عندما يقرأ المستخدم محتوى صفحة الويب بواسطة الحاسوب أو بواسطة الهاتف الذكي، ولا سيما بعد إعلان جوجل عن مبادرة mobile-first indexing والتي حوّلت فيها جوجل الأولوية في فهرسة وعرض نتائج البحث عبر الويب إلى الأجهزة الذكية، وأصبح الغرض الأساسي من موقعك وصفحاته المختلفة هو تحسين إصدار الموقع على الأجهزة الذكية بدلًا من الحواسيب الشخصية، ومن هنا تأتي أهمية دور مصممي الويب في تطوير تصميم صفحة الويب لتصبح تفاعليةً ومرنةً بما يكفي لتناسب مظهر الخط الذي يُعَد أساس المحتوى المكتوب. معايرة دقة الشاشة عندما يتعلق الأمر بخط الكتابة يولي مصممو الويب اهتمامًا كبيرًا بدقة الشاشة، إذ تُظهر الشاشة ذات الدقة المنخفضة عناصر تصميم صفحة الويب بحجم كبير أضخم من شاشة العرض المفروضة، وتسبب الدقة العالية اصطفاف مكونات صفحة الويب، بحيث تناسب الصفحة حجم الشاشة ليظهر المحتوى كاملًا على الشاشة دفعةً واحدةً، مما سيقلل من إمكانية القراءة، ويواجه مصممو الويب تحدّيًا حقيقيًّا في ضبط الأوزان البصرية للخطوط لتلائم عين القارئ، وتحسّن إمكانية قراءة المحتوى المكتوب على كافة شاشات العرض، وتتمتع الخطوط ببكسلات ثابتة باختلاف حجم الخط، لذلك ستحافظ الدقة العالية على الخطوط بحجم أكبر، بينما تقلل الدقة المنخفضة من حجم تلك الخطوط. ما مبدأ عمل التباعد بين الحروف؟ الحروف الكبيرة Capitals نعلم أن الحروف الكبيرة الموضوعة بالقرب من بعضها البعض تقلل من إمكانية القراءة، كما يصبح تمييز الحروف من خلال نظرة سريعة وخاطفة على النص أمرًا صعبًا، بينما يبدو النص مقروءًا وواضحًا ومريحًا لعين القارئ عندما تصطف الحروف الكبيرة إلى جانب الحروف الصغيرة، كما تتحسن رؤية القارئ للمساحات البيضاء بين الحروف. ويرتكز المصممون في أغلب الأحيان على المساحات البيضاء الفاصلة بين الحروف الكبيرة بهدف تحسين إمكانية القراءة ليستمتع القارئ بالمحتوى المكتوب أمامه، وينطبق توظيف المساحات الفاصلة على كل الحروف سواءً الكبيرة أو الصغيرة. العنوان نظريًّا تُعنى عملية اختيار الخطوط بقابلية قراءة النص، إذ تتمتع الخطوط بمعايرة ذاتية للتوضُّع، ولا تترك وراءها أي هوامش للملاءمة أو إعادة الضبط، ومع ذلك تظهر المشكلة الحقيقية عند التعامل مع العناوين، وستبدو المسافات أو الفراغات بين حروف العناوين غير متوازنة وأكبر من اللازم. يجب أن يدرك المصمم عدم وجود قاعدة موحّدة للارتكاز عليها عند ضبط المسافات بين الحروف، ولكن يجب أن يركّز المصمم في الوقت نفسه على صيغة موحّدة لأنواع وعائلات الخطوط المستخدمة في التصميم والتي تشكل أساسًا في التسويق الصحيح للعلامة التجارية، وبوجود المصفوفة المتنوعة لأنواع الخطوط، فسيحتاج المصمم إلى الكثير من التحكم والضبط لملاءمة الخطوط، بحيث تنسجم مع المساحات البيضاء والصور وعناصر الصفحة المتنوعة، وستتمتع العناوين ذات عدد البيكسلات المتراوح بين 16 و44 بيكسل بحدود ذات صيغ مضبوطة مسبقًا، كما سيظهر الحجم الأكبر من هذه الخطوط على شكل هوامش سلبية، وستبدو الخطوط متشابكةً مع بعضها البعض على شاشات الهواتف الذكية أو الأجهزة اللوحية بوجود الدقة الديناميكية للشاشات. توجد عدة ضوابط عددية عامة لضبط المسافات بين الحروف، والدليل المثالي الذي يجب تطبيقه هو: العنوان الأول H1: 96 بيكسل، -1.5%. العنوان الثاني H2: 60 بيكسل، -0.5%. العنوان الثالث H3: 48 بيكسل، 0%. العنوان الرابع H4: 34 بيكسل، 0.25%. العنوان الخامس H5: 24 بيكسل، 0%. العنوان السادس H6: 20 بيكسل، 0.15%. العنوان الفرعي: 16 بيكسل، 0.15%. عليك أن تبحث عن تصاميم جاهزة لصيغ الأدلة المناسبة لأجهزة الأندرويد Android والآبل Apple لاستخدامها في التطبيقات، وعادةً ما تكون الصيغ التي تقدمها متاجر التطبيقات مجهّزةً لملاءمة هذه التحديات التي تواجه المصمم، وتزوّده بالصيغة الموحدة التي تضبط المسافات بين الحروف في صفحات الويب وتطبيقات الهواتف الذكية. النص الرئيسي عندما نناقش نظرية تباعد الأحرف أثناء كتابة النص الرئيسي، فالأفضل أن نعود قليلًا إلى الحكمة التي قالها فريدريك والتي ذكرناها سابقًا، حيث يذكر عبارة stealing a sheap والتي قصد بها الخطوط ذات الحروف الثخينة وليس النص الكلي، وعندما نصمم موقع ويب، فسنستخدم غالبًا خلفيات داكنةً وألوانًا فاتحةً للحروف، أي أنها حروف لا تتمتع بحواف ثخينة داكنة، ولكن توقف مصممو الويب ومصممو الخطوط عن ضبط المسافات بين الحروف الصغيرة التي تكوّن النص الأصلي، حيث يظهر الجانب المحلي من عملية ضبط المسافات بين الحروف أن ضبط المسافات بين الحروف الصغيرة تضيف تحسُّنًا واضحًا وتحوّلًا ملحوظًا في شكل صفحة الويب، ومن الشائع أن الالتزام بالصيغ الثابتة والمرجعية تحقق وضوح المحتوى المكتوب وبالتالي يتحقق دور المصمم، بينما تتحسن قابلية القراءة عدة أضعاف عند زيادة المسافة الفاصلة بين الحروف بحدّ هامشي 1.5%. كما ذكرنا سابقًا يوجد مجال واسع جدًّا من أنواع الخطوط التي يستطيع المصمم استخدامها، ولكن من غير الصائب استخدام قواعد الضبط نفسها لكل أنواع الخطوط المستخدمة، ومن الضروري الاعتماد على التجربة أثناء ضبط التباعد بين الحروف وتحسين قابلية القراءة بحسب متطلبات وخصوصيات كل خط. توجد مجموعة من الثوابت الأساسية التي يجب مراعاتها عند تطوير تصاميم متغيرة: صيغة ارتفاع الخط: من المناسب استخدام نسبة ارتفاع قدرها 100% بين كل سطرين متتاليين، وإذا زادت نسبة الارتفاع عن 120%، فستقل المسافة الفارغة بين الحروف، وسيحتاج النص لبعض التعديلات. خلفية النص: ذكرنا سابقًا أن تصميم الويب هو فن رسومي، لذلك فإن الشكل الجميل مهم جدًّا، فإذا أردت تصميم مظاهر متنوعة وفصل كل نص عن الآخر، فإن استخدام الخلفيات هو ضرورة ملحّة لا بد من التدرُّب عليها، ولهذا السبب يحسن استخدام خطوط فاتحة اللون مع خلفية داكنة إمكانية القراءة. قيم عامة: توجد عدة مجموعات إرشادية لصيغ الضبط المناسب، وعندما نناقش خط النص الرئيسي في تصميم مواقع الويب نستطيع استخدام الإرشادات الدليلية التي اختُبرت على عدة أنواع من الخطوط. + النص الرئيسي الأول Body1: 16 بيكسل، 0.5%. + النص الرئيسي الثاني Body2: 14 بيكسل، 0.25%. التعليقات: عندما يستخدم المصممون خطوطًا ذات حواف ثخينة وخطوطًا كبيرة الحجم، فسيفتقد النص وجود هوامش كافية لتباعد الحروف بين الحروف الصغيرة والمحارف المختلفة، وتوجد مجموعة من الضوابط والتطبيقات العملية التي يستطيع المصمم الالتزام بها، إذ إن الالتزام بالإرشاد الدليلي الثابت ليس مجديًا، وعندما يستخدم المصمم حجم خط أقل من 13 بيكسل، فيجب أن يأخذ بالحسبان التعديل على المسافات الفاصلة بين الحروف لتحسين إمكانية القراءة، وبما أنه لا توجد قواعد ثابتة، فسيلجأ بعض المصممين إلى تعديل المسافات الفاصلة بين الحروف عند استخدام خط بحجم 11 بيكسل أو أقل، وسنستطيع في الحالة المثالية استخدام الإرشادات التالية لحجم الخط أثناء استخدام خطوط صغيرة لكتابة التعليقات أو التوضيحات. + التعليق: 12 بيكسل، 0.5%. + التوضيح: 10 بيكسل، 1.5%. اختيار الخطوط المناسبة: تعلّمنا أن اختيار الخط المناسب لا يقل أهميةً عن ضبط المسافات الفاصلة بين كل حرف والذي يليه، ولكنه ليس بالأمر السهل. توجد مجموعة من المبادئ التي يجب أخذها بالحسبان عند اختيار الخط المناسب أو مجموعة الخطوط التي سنستخدمها في تصميم الويب، وإليك أهم هذه المبادئ: فكّر بالتعبير عن علامتك التجارية بواسطة الخطوط. اختر عائلة الخطوط المناسبة. ادمج مجموعةً من الخطوط لتحسين إمكانية القراءة. انتبه إلى وزن الخط وارتفاعه وحجمه. تدرّب على استخدام تنسيقات CSS. بعض النصائح الاحترافية يُعَد ضبط التباعد بين الحروف خطوةً أساسيةً يجب أخذها بالحسبان خلال المراحل الابتدائية لتصميم موقع الويب، وتوجد مجموعة إضافية من التقنيات الأساسية التي يجب أن يستخدمها المصمم للتعامل مع الخطوط والمساحات البيضاء والتباعد بين الحروف: إن ضبط المسافات بين الحروف هو أول ما قد يقوم به مصمم الويب، ولكن سيتطلب الأمر أثناء التقدم في عملية التصميم التحكم بالتباعد بين أزواج الحروف، والذي يأخذنا إلى بعد جديد في تحسين جاذبية الموقع وإمكانية قراءة المحتوى النصي التي تلفت نظر زوار الموقع. يتقارب ضبط المسافات بين السطور وضبط المسافات بين الحروف من حيث الأهمية في مجال التصميم، ولا يمكن تحقيق أحدهما بغياب الآخر، ولا يمكن أن يبدو أحدهما ملائمًا دون الآخر، ولذلك تعمل كل من التقنيتين بالتعاون والتكامل مع الأخرى، ويجب تحقيق التباعد المناسب بين الكلمات بالتكامل مع تحقيق هذا التباعد بين السطور، فإذا أردت الحصول على تصميم متوازن وجذّاب، فعليك أن تضبط باحترافية كلًّا من التباعدين. ضبط محاذاة الهوامش البصرية هو تقنية يجب أن يستخدمها مصمم الويب لتجنب المسافات السلبية بين الحروف لضمان عدم ضغط الفقرات أكثر من اللازم، فعندما يظهر الكثير من المسافات البادئة والمسافات الختامية في الفقرات، فمن الأفضل الاعتماد على محاذاة الهوامش البصرية التي تُعَد تقنيةً مناسبةً في هذه الحالة. عندما تكتسب المزيد من الخبرة في مجال التصميم، فستدرك أن مراقبة تصاميم الويب للمصممين الآخرين بعناية وشغف سيساعدك على اكتساب بصيرة أفضل في تلك المهارات، ونظرة ثاقبة ودقيقة ستقودك إلى تعلُّم عدة حيل من تجارب الآخرين، وسيساعدك الغوص بعمق في أساسيات الكتابة وفحص تصاميم المصممين الآخرين بدقة على التوغل في الفوارق البسيطة لفن الخط، والتي ستنقل تصاميمك نقلةً نوعيةً. ترجمة -وبتصرّف- للمقال Designers’ Guide to Letter Spacing لصاحبه Harsh Raval. اقرأ أيضًا نصائح لاحتراف ضبط التباعد بين الأحرف في التصميم دليلك إلى تصميم الخطوط مهارات في فن الخط يجب أن يملكها المصمم النسخة الكاملة من كتاب أساسيات تصميم الرسوميات

يُعَد فن الخط واستخدامه في التصاميم باحترافية مهارةً أساسيةً في مجال تصميم الويب، ولا يمكن تجاهل أثر الخط على المظهر المتكامل لموقع الويب، ويجب أن يهتم المصممون بمحورين أساسيين عند بناء صفحات ويب متناغمة ومقروءة بوضوح، هما: حجم الخط، والمساحة. فبتغيير هذين المكونين تستطيع صفحات الويب أن تمنح المستخدم تجربةً ممتعةً، ويجب أن ينتبه المصممون إلى شكل الخط عندما يفتح المستخدم الموقع من أجهزة مختلفة، ويهدف التكامل بين جمال التصميم والأداء الوظيفي إلى تشجيع المستخدم على قراءة محتوى الموقع باهتمام، ولنبدأ معًا بالغوص بعمق في العوامل التي تؤثر على الخط ولنتعلم بعض المهارات والحيل لتحقيق التكامل بين المحتوى الجذاب والمقروء بنفس الوقت. حجم الخط يجب على مصمم الويب أن يدرك بدقة أحجام الخط المناسبة للتصميم الذي سيُعرض على شاشات الحواسيب عند فتح الموقع بواسطة الهاتف الذكي، إذ تتنوع أحجام الخطوط المستخدَمة على شاشات الحواسيب ضمن مجال يتراوح بين 11 نقطةً و14 نقطةً، ولكن سيبدو المحتوى صغيرًا جدًّا أو كبيرًا جدًّا عند استخدام الأرقام نفسها على شاشات الهواتف الذكية، ويجب أن يكون الخط المخصص لكتابة المحتوى الرئيسي لصفحة الويب متنوّعًا ضمن مجال يتراوح بين 14 بيكسل و16 بيكسل، أما الخط المخصص لكتابة المحتوى الثانوي أو الأقل أهميّةً، فيمكن أن يتراوح بين 13 بيكسل و14 بيكسل. استعرض خيارات الخطوط التي استخدمتها في موقعك على جهاز حقيقي قبل نقل الموقع إلى منصات الاستخدام الفعليّة، وسيساعدك ذلك على إيصال محتوى الموقع ورسالته بوضوح، وقد يعتقد البعض أن اختيار الخط المناسب وضبطه ليس صعبًا ولكن تتكون عملية اختيار الخط من عدة مراحل، بحيث يراعي المصمم خلالها أهمية تنوع حجم الخط بما يعبر عن محتوى صفحة الويب، بالإضافة إلى ملاءمة الخط للشاشات المختلفة التي سيُعرض عليها، ولنتحدث قليلًا عن أهم قواعد اختيار الخط المناسب لشاشات الهواتف الذكية عند تصميم مواقع الويب، وقد اخترنا البدء بالحديث عنها لأن حركة التصفح باستخدام الهواتف الذكية أعلى بكثير من حركة التصفح بواسطة الأجهزة الأخرى. تجنّب استخدام قياس خط أصغر من 16 بيكسل، إذ تميل المتصفحات إلى تقريب الصفحة تلقائيًّا عندما يكون حجم الخط فيها أصغر من 16 بيكسل، مما سيجبر المستخدم على إعادة الشاشة إلى وضعها السابق المصغر Zoom out عندما يتابع قراءة باقي المحتوى، وتذكّر أهمية اختبار قابلية القراءة عند وضع الهاتف الذكي على مسافة مناسبة من العين، فقد لا يتمتع جميع زوّار موقعك بالصبر الكافي لقراءة كامل محتوى الصفحة. قد تبدو العملية أكثر تعقيدًا عندما يتعلق الأمر بالحواسيب، إذ نميّز نوعين من الصفحات عندما نتحدث عن مواقع الويب المُستعرضة بواسطة الحواسيب، وهما الصفحات ذات المحتوى الكثيف Text-heavy pages والصفحات التفاعلية Interactive-heavy pages، ويجب أن يراعي المصمم ضرورة استخدام خطوط تناسب كلًّا من النوعين، وتضم الصفحات ذات المحتوى الكثيف كميةً كبيرةً من المعلومات، لذلك يُفضل استخدام مجال لأحجام الخطوط يتراوح بين 16 بيكسل و18 بيكسل، بحيث نزود القارئ بتجربة مريحة قدر الإمكان، وإذا كان موقعك تعليميًّا أو ينشر محتوًى تعليميًّا، فالخيار الأفضل هو استخدام الخط الأكبر ضمن المجال، أي 18 بيكسل ليحظى المتعلّم بالراحة الكافية أثناء القراءة. تضم الصفحات التفاعلية محتوًى أقل، إذ تحتوي على الأزرار التفاعلية والمكان المخصص للبحث وغير ذلك، لذا فقد يؤدي استخدام الخط الكبير في هذه الصفحات إلى تشتيت المحتوى وتقليل تماسكه، فمثلًا يتراوح الخط المستخدم في نسخة الويب لموقع الفيسبوك بين 12 بيكسل و14 بيكسل، وهو خيار مريح ويؤمّن تماسك صفحة الموقع. وحدات القياس تُعَد وحدة ems هي الأشهر في قياس أحجام الخطوط المستخدمة في تصاميم الهواتف الذكية، ويستطيع المصممون بسهولة تحديد مجال لقياسات الخطوط لأنها تستخدم النسب المئوية، وتعادل كل وحدة em مقدار نقطة واحدة، وتُمثَّل وحدة em إما بواسطة الأعداد العشرية أو على شكل كسور مقاماتها من مضاعفات المئة، وقد جاءت تسمية هذه الوحدة من عرض الحرف M عندما يُكتب كبيرًا إذ يبلغ عرض حرف M -عندما يكتب على الشاشة- نقطةً واحدةً أو em وحدةً. اختر ألوانا متباينة يستطيع المصممون إضافة محتوًى بصريًّا مسليًّا وممتعًا من خلال التلاعب بضبط الألوان أو ما يسمى التباين اللوني الذي يعبر عن درجة وضوح اللون وشدّة مركباته أمام العين البشرية، كما يصف التباين في صفحات الويب سهولة قابلية قراءة النص بوضوح من قِبل المستخدم، ويندرج الأمر ضمن دراسة عميقة تهدف لمعرفة أثر اللون في ذهن الشخص الذي يراه، وهو أمر مهم جدًّا في مجال تصميم المواقع. يُطبّق التباين اللوني على العناوين الرئيسية أو الفرعية أو على بقية النص المكتوب، فمثلًا إذا كان لون الخلفية داكنًا فالأفضل اختيار لون فاتح نوعًا ما لكتابة النص بحيث يبدو بأوضح شكل ممكن. حدّد ألوان موقعك من خلال تحديد الفئة التي يستهدفها الموقع، إذ تختلف كل شريحة عن الأخرى من حيث تفاعلها مع الألوان، وتساعدك عجلة الألوان على اختيار الألوان المتناسقة مع بعضها البعض، إذ إنها تعتمد على قاعدة الألوان المتقابلة بحيث يتناسق أي لون على العجلة مع اللون المقابل له. نعلم أن الألوان ترتبط ارتباطًا وثيقًا بالجانب النفسي، إذ يعبّر كل لون عن دلالات مختلفة تساعد القارئ على إدراك سمة الموقع ونوعية محتواه، فمثلًا يرتبط اللون الأزرق بالجدية والالتزام، والأحمر بالقوة والطاقة، بينما يرمز الأخضر إلى الرخاء والاستقرار، ويعتمد اختيار الألوان على السمة العامة للموقع وأهمية الاهتمام بقابلية قراءة المحتوى، لذا تجنب استخدام خلفية سوداء مع كتابة رمادية مثلًا أو استخدام خلفية بيضاء مع كتابة بلون فاتح، ويمكنك التعرف على عجلة الألوان وطريقة عملها من خلال منصة Paletton، إذ تستطيع الضغط على أي لون من ألوان العجلة لتعطيك بالمقابل درجات الألوان التي تتناغم معه. اختيار الخطوط من المهم اختيار خط الكتابة المناسب لضمان إمكانية قراءة المحتوى، فعندما تختار الخط الذي ستستخدمه انتبه جيّدًا إلى وضوح الخط ككل بغض النظر عن تصميم الخط أو تأثيراته، فمثلًا تُستخدم العناوين الأساسية والفرعية للفت نظر القارئ وانتباهه لذلك فمن المفيد استخدام بعض أنماط الزينة للخطوط عند كتابة العناوين. من الأفضل اختيار خط تقليدي دون أي تأثيرات عند كتابة بقية محتوى صفحة الويب، ويجب أن يكون المحتوى سهل القراءة مما يدفع القارئ إلى متابعة قراءة محتوى الصفحة بانتباه ودون تعب. تجنب استخدام أنواع مختلفة من الخطوط في الصفحة الواحدة واكتفِ بنوع واحد من الخطوط مع إضافة تأثيرات مناسبة عند الحاجة، وتستطيع اعتماد حزمة الخطوط Sanserif websafe fonts التي ستضمن ظهور موقعك دون أي مشاكل في العرض على كافة أجهزة المستخدمين دون أن يؤثر الخط على أداء الصفحة أو زمن تحميلها. إذ تتكون هذه الحزم من مجموعة من الخطوط المضبوطة التي تتكيف لتلائم جميع المتصفحات والأجهزة التي قد يستعملها المستخدم للوصول إلى موقعك. تتمتع هذه الحزم بوجود نسخة احتياطية من الخطوط التي ستحافظ على خط محتوى موقعك حتى وإن زاره المستخدم من جهاز لا يحوي نسخة مثبتة من نوع الخط الذي يُعرّف موقعك. الانتظام وضبط المحاذاة يفضل القرّاء قراءة النص ضمن مجموعات أو مقاطع ولا سيما عندما يتصفحون الويب باستخدام الهواتف الذكية ذات الشاشات الصغيرة نسبيًّا، حيث يجب أن يُصمم النص الذي سيُعرض على الشاشات الصغيرة، بحيث تنتظم الكلمات في السطور على أبعاد متساوية بالنسبة لبعضها البعض. سيساعد هذا الترتيب على إزالة الفراغات غير الضرورية على جانبي كل مقطع من مقاطع النص. وتُعَد المحاذاة المضبوطة الخيار الأمثل للحصول على أفضل ضبط للنص لأنها لا تترك أي مساحات بيضاء فارغة أو نافرة على جانبي النص المكتوب. تهدف عملية ضبط المحاذاة في صفحات الويب إلى ترتيب العناصر المختلفة للصفحة بما فيها المحتوى النصي والصور والأزرار، بحيث تتوضع على الشاشة ضمن صفوف منتظمة أو متوازية تضمن تجربة تصفح مريحة لزوار الموقع. تؤكد عملية الضبط على ثلاثة شروط أساسية يجب تحقيقها هي: 1- وجود مساحة متساوية حول كل عنصر وبينه وبين العناصر الأخرى. 2- ظهور المحتوى في أماكن متوقّعة وواضحة أمام زائر الموقع. 3- تُضبط محاذاة كل فقرة نصية بالنسبة لبعضها البعض حتى وإن اختلفت عن ضبط محاذاة عنصر آخر في الصفحة. تتجلى أهمية الانتظام في ترتيب عناصر صفحة الويب في المواقع التفاعلية، فقد يؤدي الضبط غير الصحيح لحواف الصفحة أو مكوناتها إلى ظهور محتوى الموقع ناقصًا أمام الزائر عندما يفتح صفحة الموقع من الهاتف المحمول، أو قد تعجز شاشة الهاتف عن إظهار زر معين بسبب عدم توضعه في مكانه المناسب. ضبط التباعد بين الأسطر يجب الالتزام بضبط موحد للمسافات الفاصلة بين السطور عند العمل على تصميم ويب ستُعرض على شاشات الهواتف الذكية. يشير مصطلح التباعد بين الأسطر إلى توحيد المسافة الفاصلة بين كل سطر والسطر الذي يليه، مما يضمن ترتيب الفقرة وصفحة الموقع ككل. يساعدك تضييق المسافة بين الأسطر على تحسين إمكانية قراءة المحتوى النصي للصفحة عند تصفح الموقع باستخدام الهاتف الذكي. لكن لنتعامل مع ضبط المسافات بين الأسطر باحترافية، فلا بد لنا من التعمق بفهم هذا المصطلح، إذ تُعرّف عملية ضبط المسافات الفاصلة بين أسطر الفقرة بأنه الفراغ بين أسفل الحرف في السطر الأول وأعلى الحرف في السطر الذي يليه ويشار إليه رياضيًّا بالفرق بين ارتفاع السطر وارتفاع النص المكتوب. يستخدم المصطلح في أيامنا هذه نظريًّا، إذ يحل محله مفهوم ارتفاع الخط Line-height الذي يستخدمه مصممو الويب عند تصميم المواقع بلغة CSS. ويكمن السر في الحصول على الضبط المناسب للتباعد في معرفة الرسالة التي تود إيصالها باستخدام النص المكتوب ومن ثم ضبط التباعد بما يناسب كثافة المحتوى وهدفه. دمج عدة خطوط تستطيع بناء فقرة نصية مُنسقّة ومتكاملة عندما تجد التوليفة المناسبة لحجم الخط ونوعه والمسافة الفاصلة بين سطور النص. جرّب أنواع الخطوط المختلفة واختر التشكيلة المناسبة التي ستضمن قابلية قراءة النص من قبل زوار الموقع، بحيث تقلل أي تشتت أو تشويه. تذكر هذه القواعد الذهبية التي ستساعدك على دمج الخطوط بنجاح ودون التسبب بأي تشويش للقارئ: انتبه إلى تحقيق التناسب بين المحتوى المكتوب باستخدام عدة خطوط، وابحث عن الخطوط التي تتمتع بنفس المقياس ونسبة الأبعاد واستخدمها معًا. وحّد الخطوط بنفس اللون أو التصميم لأن كثرة الزخرفات والألوان ستسبب تشتت القارئ وسيضعف من قيمة المحتوى المكتوب. انتبه إلى الأولوية في الخطوط المستخدمة، حيث تلفت أنواع معينة من الخطوط نظر القارئ أكثر من أنواع أخرى لذلك حاول كتابة المحاور الأساسية بالخط الذي سيثير اهتمام القارئ أكثر من غيره. تجنب استخدام أنواع خطوط متقاربة جدًّا من بعضها. حافظ على قابلية قراءة المحتوى النصي الذي يشكل جسم الصفحة. استخدم عدة تنسيقات لنوع الخط الواحد، بحيث تغني محتوى الصفحة دون تشتيت القارئ. ثق بنظرتك الفنية لأن العين البشرية هي خير حاكم على جودة التصميم. استغلال المساحات البيضاء استغل المساحة البيضاء لتزيين صفحات موقعك. يساعدك ضبط المسافات بين السطور والحروف والتصاميم والنصوص على تصميم نموذج سهل الفهم وبالتالي سهل القراءة، فمثلًا عند استخدام أزرار الدعوة إلى إجراء معين، انتبه إلى أن المساحة المحيطة بكل زر تحدد عمله والوصلة المنبثقة عنه. علاقة سعة الشاشة بالخط تلعب سعة الشاشة دورًا أساسيًّا عند التصميم لملاءمة الأجهزة المختلفة، فعندما نعمل على شاشات الهواتف الذكية، فمن الضروري أن نأخذ بالحسبان كلتا المساحتين الأفقية والعمودية، لنضمن الحصول على أفضل محاذاة وأقل مساحة بيضاء فارغة. استخدم أنماط خطوط جديدة يجب أن تشير العناوين الرئيسية والفرعية إلى محتوى النص المكتوب تحتها، وهو ما سيزيد من تميُّز المحتوى، وستغني إضافة نوع معين من أنواع المحتوى المثير للاهتمام التجربة البصرية لزوار الموقع. الفعالية حافظ على فعالية التطبيق عندما تصمم صفحة ويب للأجهزة الذكية، لذا ضع نصًَا معيّنًا لتنفيذ مهمة أو وظيفة معينة، مما سيساعد المستخدمين على تمييز التفاعل من خلال تنفيذ مهمة مثل إرسال رسالة أو إجراء مكالمة هاتفية، ويمكن تعريف فعالية موقع الويب بأنها سهولة تصفح المستخدم لموقعك والحصول على المعلومات أو الخدمات التي يريدها. لذلك لا يمكن أن يكتمل تصميم موقع الويب دون التأكد من فعاليته، وسهولة حصول المستخدم على ما يريد دون أي تأخير أو إرباك، وتهدف فعالية الموقع إلى تحقيق التوازن بين استراتيجيات عمل الموقع، والفئة التي يستهدفها، ومحتوى الموقع وتصميمه. ستساعدك هذه الضوابط على تحسين فعالية موقعك بما يضمن تجربة استخدام رائدةً: البساطة هي الأهم، لذلك اختر شريط تنقل بسيطًا ومحددًا لتصفح موقعك. تصميم سهل الفهم ومريح وواضح أمام المستخدم، بحيث يجد ما يريده دون عناء. استخدام عناصر مرئية ذات جودة عالية. الاهتمام بتصميم أزرار الدعوة إلى إجراء معين. التعريف بالشركة وخدماتها بوضوح من خلال الموقع. وزن الخط اختبر الأوزان المختلفة للخطوط، بحيث تختار الوزن المثالي لشاشة جهازك، وإذا كانت الصيحة المنتشرة هي استخدام نصوص مكتوبة بخطوط كبيرة ومتعددة الأوزان، فاحرص على تجربة الأوزان المختلفة، بحيث تقلل أي نوع من التشتت أو الإرباك للمستخدم. تدعم معظم أنواع الخطوط عدة أوزان تتدرج ابتداءً من الوزن الصغير الذي يعطي الحروف حوافَّ رقيقةً، وصولًا إلى الحروف ذات الحواف السميكة. الخلفية اصنع التوازن اللوني المناسب من خلال استخدام خلفية بلون فاتح ومحتوًى نصي بلون داكن وبالعكس، وجرّب الألوان والتنسيقات المختلفة عند عرض مقطع فيديو أو صورة متحركة، وقلل من استخدام العناصر التفاعلية المختلفة عندما تكون صفحتك مزدحمةً بالمحتوى المكتوب، واضغط خط صفحة الويب ووضع النصوص المكتوبة تبعًا لمتطلبات صفحة الويب للمزيد من الحركة أو الكتابة أو التعديل. تمثل خلفية الموقع الصور أو التدرجات اللونية أو التصاميم التي تملأ شاشة الموقع، وتمثل الانطباع الأول الذي يأخذه زوار الموقع، لذلك فإن اختيار الخلفية المناسبة أمر مهم جدًّا. إليك هذه النصائح التي ستساعدك على اختيار الخلفية المثالية لموقعك: زد قابلية القراءة فوق الصورة الموضوعة في الخلفية قدر الإمكان. استخدم الألوان الأساسية لتكون ألوانًا لخلفية الصفحات. تجنب استخدام الصور ذات المحتوى الصاخب أو المزدحم. لا بأس بالقليل من الحركة في الخلفية بما يخدم تصميم الصفحة. استخدم التدرجات اللونية الجاهزة Gradient. استخدم عدة خطوط حاول أن تجمع عدة خطوط عند تصميم العناوين الأساسية والفرعية ومحتوى النص، ويستطيع المصممون في هذه الحالة إضافة المزيد من التميُّز والتفرد إلى المحتوى، وقد لا يساعدك ذلك على زيادة قابلية القراءة، لكنه يزيد حتمًا من متعة تجربة المستخدم عند قراءة محتوى الموقع. يُعَد النص أحد أبرز وسائل التواصل التي يكرس المصممون معظم وقتهم لضبطه وتنسيقه، ويجب تحديد هدف التصميم قبل اختيار وتحديد نوع الخط المستخدم، كما يجب أن ينسجم نوع الخط مع هدف المشروع أو الموقع بأكمله، ونأمل أن تكون هذه النصائح مفيدةً لتجربة التصميم التي ستخوضها مستقبلًا بما يضمن توظيف فن الخط بأفضل صورة ممكنة. ترجمة -وبتصرّف- للمقال 14 Typography Skills Every Graphic Designer Should Have لصاحبه Harsh Raval. اقرأ أيضًا نصائح لاحتراف ضبط التباعد بين الأحرف في التصميم كيف تقوم بعملية تجميل لخطوط موقع الوردبريس لم المحتوى أهم من التصميم؟ النسخة الكاملة لكتاب أساسيات تصميم الرسوميات

يُعرف ضبط التباعد بين أزواج الحروف بأنه تقويم المسافة بين الأحرف المتعاقبة، ويهدف إلى تحقيق التوازن بين المسافة السلبية وحروف النص كافةً بهدف تحسين إمكانية القراءة المتكاملة للنصوص، مما سيحسّن من تجربة المستخدم عند قراءته المحتوى، وتساعد عملية الضبط على تحسين النص الإجمالي ليغدو مريحًا للعين أثناء القراءة. قد لا تدرك نظريًّا المجهود الكبير الذي يتطلبه تحقيق التباعد الممتاز بين الأحرف، ولكنك ستدرك حتمًا سوء أي محتوى نصي لا يراعي تباعدًا مناسبًا بين الأحرف عندما تنظر إليه مرةً أخرى، إذ ستشعر أن شيئًا غير مريح يظهر أمام عينيك. يساعد ضبط التباعد على تحسين تصميم النص ومظهره، كما يساعد القارئ على بناء تصاميم وعروض تقديمية ونماذج بصرية جميلة ومُحسّنة، وتتميز الخطوط الحديثة بضبط تباعد مدمج مع حزمة حروف الخط، ولكنها تحتاج أحيانًا إلى ضبط التباعد بنفسك تبعًا لاختلاف نوع الخط، وإليك هذه النصائح التي ستساعدك على تحقيق ضبط التباعد المناسب بين الأحرف في نصوصك وتصاميمك المختلفة. افهم جيدا العلاقات بين الأحرف يؤكد التباعد بين أزواج الحروف على أهمية المحافظة على مسافات متساوية بين كافة الأحرف قدر الإمكان، ويجب ألّا تعتمد على منهج رياضي في عملية الضبط، بل حاول أن تحافظ على مسافة خطية مضبوطة ودقيقة بين الأحرف، وتخلق التراكيب الاستثنائية للحروف مسافات مختلفة فيما بينها. ستبدو أي كلمة بأفضل شكل ممكن عندما تتنوع المسافات الرياضية بين حروفها تبعًا لشكل كل حرف، ويجب أن تكون المسافة بين حرفين يتمتعان بحواف مستقيمة أكبر من المسافة بين حرفين أحدهما ذو حواف مستقيمة والآخر ذو حواف دائرية، وعندما نصف المسافات بين الأحرف من ناحية عكسية، فإن المسافة بين الحرف المستقيم والحرف الدائري الذي يليه يجب أن تكون مساويةً للمسافة بين الحرف الدائري والحرف المستقيم الذي يليه، وهو مفهوم مشابه للعلاقات الرياضية التبديلية. انتبه إلى حجم الخط قد لا يلعب مفهوم الحجم دورًا جوهريًّا من المنظور الفلسفي، وهو ما يبدو مريحًا نوعًا ما، ولكن تختلف أهمية هذا الدور عند الحديث عن الخط والتصميم، إذ يشكّل حجم الخط عاملًا أساسيًّا في جودة التصميم وجماله، ويجب أن تحدد حجم الخط الذي تريد استخدامه في عملك قبل البدء بضبط التباعد بين أزواج الحروف، وإذا غيرت رأيك أثناء العمل وأردت تعديل حجم الخط، فسيضيع الجهد الذي بذلته في ضبط التباعد بين أزواج الحروف سُدى، وتأتي أهمية ضبط حجم الخط من البداية من حاجة الأحرف في الخطوط الصغيرة إلى مسافة فاصلة أكبر فيما بينها مما يضمن بقاء الكلمات مقروءةً وواضحةً. وتتطلب الأحرف التي تُكتب بحجم خط كبير أن تكون أقرب إلى بعضها البعض، بحيث يبقى النص مريحًا ومتماسكًا ومقروءًا، ويجب أن نأخذ هذا الأمر بالحسبان، حيث عندما نصمم شعارًا سيوضع على الملابس أو الأعلام أو على البطاقات والكروت بأنواعها، ويغير معظم المصممين حجم الشعار ليلائم احتياجات المساحة التي سيوضع فيها، ولكن من الأفضل استبدال ذلك بإنشاء تغيُّرين مختلفين للشعار، بحيث يختلف ضبط التباعد بين أزواج الحروف باختلاف نسخة التصميم، ويحوّل حجم الأحرف عملية تحديد نوع الخط إلى خطوة محوريّة، ويجب أن نأخذ بالحسبان شكل كل حرف على حدة قبل البدء بالتصميم. استخدم الزيادة والنقصان في محلهما يبدو النص مربكًا وصعب القراءة عند تقليل المسافة الفاصلة بين أزواج الحروف أكثر من اللازم، وتسبب زيادة المسافة بين أزواج الحروف -بنسب كبيرة- تجربة قراءة غير مريحة بالنسبة للقارئ، ويتجلى ذلك أثناء استخدام خطوط صغيرة الحجم، إذ تُلمِّح بعض الكلمات المكتوبة بخط غير ملائم إلى معنى مختلف عن المعنى المقصود أو المطلوب، وإذا لم تكن المسافة الفاصلة مضبوطةً كما يجب، فقد تختلط بعض الحروف الإنجليزية بسبب أخطاء أثناء القراءة، إذ يؤدي ضيق المسافة الفاصلة بين حرفي c وi مثلًا في حالة الأحرف الصغيرة إلى قراءتهما من قبل القارئ وكأنهما حرف d مكتوب بحالة الحروف الصغيرة، كما أن توالي حرفي r وn دون وجود مسافة فاصلة كافية سيحولهما إلى حرف m. لذلك عليك أن تنتبه جيدًا إلى خطورة تقليل المسافة الفاصلة بين أزواج الحروف في بعض الحالات، ويسبب ضيق المسافات الفاصلة بين الأحرف إلى صعوبة في قراءة المحتوى وسيبدو شكل الكلمات متعِبًا للنظر، ويجب أن تحرص على تحقيق التوازن الصحيح والملائم بين حروف الكلمة الواحدة بحيث تكون الكلمة متماسكةً وواضحةً بما يكفي، وعليك الانتباه إلى المحافظة على هوية الحروف ووضوحها، وتكمن أهمية ضبط المسافات الفاصلة بين أزواج الحروف في تصميم المطبوعات، إذ يسبب ضيق المسافات الفاصلة بين الحروف أخطاء طباعيةً أثناء تدفق الحبر من الطابعة، فانتبه إلى حساب حبر الطابعة مع الأخذ بالحسبان كافة احتمالات تدفقه أثناء طباعة الحروف ذات المسافات الفاصلة المضبوطة. قسم الكلمة إلى مجموعات يضم كل منها ثلاثة حروف عندما تكتب كلمات طويلةً أو عدد حروفها كبير نوعًا ما، فالخيار الأفضل لضبط التباعد بين أزواج الحروف هو تقسيم الكلمة إلى مجموعات، بحيث تضم كل مجموعة ثلاثة حروف، إذ تمكّنك هذه الطريقة من التغاضي عن التفاصيل عند النظر إلى الكلمة ككل، زلهذا ابدأ بالحروف الثلاثة من الكلمة أو أخفِ بقية الحروف أو غيّر لون الحروف التي ستعمل عليها حاليًّا، وعندما تنهي المجموعة الأولى انتقل إلى المجموعة التالية، بحيث يكون انتقالك حرفًا تلو الآخر، وستحصل في النهاية على حروف ذات مسافات فاصلة مضبوطة باحترافية موازنةً بالعمل على كل حرف على حدة. ابحث عن تشكيلات جديدة للكلمات يُعرّف مصطلح المساحة السلبية بأنه المساحة الفارغة حول الجسم، وبينه وبين الأجسام من حوله، وبالحديث عن الأحرف فلكل حرف مساحة سلبية لا بد من أن تؤخذ بالحسبان، ويتطلب التصميم تحقيق التوافق في المساحات السلبية للعناصر أو الحروف، إذ قد تؤدي بعض تشكيلات الأحرف إلى خلق المزيد من المساحة الفارغة المنظورة حول الحرف. لذلك حاول أن تضبط المساحات السلبية للحروف بالنسبة لبعضها البعض، وتتجلّى أهمية هذه الخطوة عند كتابة الحروف الكبيرة باللغة الإنجليزية، فمثلًا اضبط المسافات بين أزواج الحروف التالية F وP L وT وW وA وV أو ما يشبهها، فعندما يُكتب أحد الحرفين A أو V مثلًا بجانب حرف ذي شكل مثلثي مثل M أو H، أو بجانب حرف ذي حواف عمودية مثل I، فقد يلامس الخط المائل للحرف الأول الخط المستقيم للحرف المجاور، فاضبط تحديدًا معيّنًا يُستخدم عندما يتجاور حرفان مثل A وV، وعندئذٍ تخلق التشكيلة بين حرفين مائلين المزيد من المساحة السلبية. حدد الشروط يضم فن الخط ثلاثة مفاهيمًا تهدف إلى تحسين ضبط المسافة الفاصلة بين أزواج الحروف، وهي تباعد الأسطر Leading، وتباعد الأحرف Tracking، وضبط المسافة الفاصلة بين أزواج الحروف Kerning، ويَسهُل التمييز بين مصطلحي Leading وKerning إلى حد ما، ولكن قد يسبب مصطلح Kerning بعض الإرباك عند محاولة فهمه، فلنتعرّف على الفروقات الأساسية بين هذه المفاهيم من وجهة نظر تصميمية. يُعبّر مصطلح تباعد الأسطر عن الضبط الدقيق للمساحة العمودية بين سطرين متعاقبين من الكتابة، وتُقاس المسافة القصوى بدءًا من الخط الأساسي، ويجب أن نأخذ بالحسبان الخصائص المميزة لكل حرف مثل الارتفاعات والانخفاضات. يركز مصطلح تباعد الأحرف على المسافة الأفقية بين الأحرف، ولا يضبط تباعد الأحرف المسافات بين كل حرف والذي يليه على عكس تباعد الأسطر، ويتحكم تباعد الأحرف بتقليل أو زيادة المسافات بين الأحرف بطريقة موحّدة، ويمكنك استخدام المساحات السلبية للأحرف لزيادة ملاءمة الحرف للمساحة المحدودة التي يشغلها، وانتبه إلى أن المبالغة في ذلك قد يسبب تداخل الكلمات بحيث يصبح النص مبهمًا. تساعد المساحة الإيجابية على تلاؤم الحروف مع المساحة المحيطة، بحيث تملأ الفراغات عندما لا نملك محتوًى ضخمًا يكفي المساحة الكلية الفارغة أمامنا، فتجنب المبالغة هنا لمنع تقليل المساحات بين الكلمات، وكن حذرًا عند ضبط تباعد الأسطر والمساحات أولًا ومن ثم الانتقال إلى ضبط التباعد بين أزواج الحروف. اضبط المسافات الفاصلة بين أزواج الحروف بنفسك دون الاعتماد على البرامج الجاهزة تضم بعض منصات التصميم الجرافيكي خيارين فقط لضبط المسافات الفاصلة بين أزواج الحروف، هما: الضبط البصري Optical وضبط المقاييس Metric، ويتوفر هذان الخياران في برامج الفوتوشوب والإليستريتور وإن ديزاين، وتستطيع الوصول إلى هذه الخيارات من خلال اللوحة الجانبية للحروف، ويستخدم ضبط Metric الإعدادات الجاهزة المصممة مسبقًا للمسافات الفاصلة بين أزواج الحروف ومساحات الخطوط، إذ يذكر مصمّم الخطوط ذلك في ملف الخطوط المرفق مع مكتبات البرنامج، ويتجاهل ضبط Optical المحتوى الجاهز للحروف ويضبط المسافات الفاصلة بينها اعتمادًا على شكل الحروف وباستخدام خوارزمية عشوائية. على الرغم من أنك تستطيع الحصول على نتيجة جيّدة عند استخدام هذه الخيارات الجاهزة، إلا أنها قد تترك وراءها بعض الأحرف ذات المسافات غير المضبوطة بدقة، ويمكننا الوثوق بالعين البشرية إلى حد كبير عند الحديث عن ضبط التباعد، حيث تمنحك رؤيتك الشخصية تحكّمًا أفضل، وإذا وضعت الأدوات التي ذكرناها سابقًا تراكبيًّا في تصميم معين، فستستطيع بذلك أن ترى الفروقات بينها بوضوح. اقلب النص رأسا على عقب يؤثر اعتيادنا على الكلمات التي نعمل معها في تصميمنا على الحكم المناسب فيما يتعلق بالمسافات الفاصلة بين أزواج الحروف، وإليك حلًّا غريبًا بعض الشيء لتلك المشكلة، اقلب النص رأسًا على عقب، ولن يتأثر دماغك في هذه الحالة بالكلمات التي تعرفها مسبقًا، وستتعامل مع الحروف وكأنها حروف مفردة دون أي حكم مسبق على ضبطها، مما سيساعدك على ضبط حروف تصميمك بوضوح ومنطقية. تحقيق التناغم والثبات إن أفضل مثال عن الضبط المناسب للتباعد بين الحروف هو ذلك النص الذي يتمتع بقدر عالٍ من التناغم والثبات، ويجب أن يتربع كل حرف إلى جانب الحرف التالي بتناغم وتوازن، ويمكنك التأكد من تحقيق هذا الشرط بأن تبتعد قليلًا عن الشاشة، وأن تنظر عن بعد إلى الكلمات بحيث تلاحظ المسافات بين الحروف بوضوح. انتبه إلى المسافات بين الكلمات يركز ضبط التباعد بين أزواج الحروف على الحروف المكونة للكلمة فقط، ولكن احذر أن تهمل التركيز على المسافات بين الكلمات، وانتبه عند استخدامك الخطوط الجاهزة المنتشرة على الإنترنت، إذ إنها تفتقر أحيانًا للتباعد المضبوط باحترافية. اترك مسافات كافية بين الأحرف يميل المصمّمون أحيانًا إلى تقليص المسافات الفاصلة بين الأحرف بنسب كبيرة، مما يجعل النص ضيّقًا وغير مريح للقارئ، ويجب أن تبعد كل كلمة مسافةً مناسبةً عن الكلمات الأخرى، بحيث تكون ملائمةً لنظر القارئ عندما يقرأ التسلسل الطبيعي للجمل، وتؤثر المسافات بين الكلمات على المسافة المنظورة بين الأحرف. إذا كانت المسافة كبيرةً فستبدو الكلمات المكتوبة متباعدةً وذات تنسيق سيئ من حيث التباعد النصّي، وإذا كانت المسافة أصغر من اللازم، فستبدو الكلمات مفكّكةً وسيبدو النص غير مترابط أمام القارئ. يساعد توحيد المسافة الفاصلة بين جميع الكلمات على تحقيق التوازن البصري المطلوب، وقد يفيد تغيير التباعد بين الأحرف والكلمات -استنادًا إلى الشكل والمحدّدات التصميميّة الأخرى- في تحقيق توازن مناسب. أصبحت الآن على دراية بأساسيات ضبط التباعد بين أزواج الحروف، فلنُلقِ نظرةً سريعةً على أهم خيارات الضبط التلقائي للتباعد التي نجدها في المنصات الشائعة مثل الوورد والفوتوشوب وغيرها. ضبط التباعد في برنامج الفوتوشوب يحتوي برنامج الفوتوشوب على خيارات ضبط التباعد التي يستطيع أي مصمم أن يستخدمها، ولكن تكمن المشكلة في إيجاد الأداة أولًا، وأيًّا يكن المحتوى الذي تود فتحه باستخدام برنامج الفوتوشوب لضبط المسافات الفاصلة بين الحروف، فابدأ أولًا بالنقر بالفأرة بين حرفين ثم اختر اللوحة الجانبية للحروف Character panel. تتضمن اللوحة أداةً تحمل الحرفين V/A مع سهم صغير تحتهما، وهي أداة ضبط التباعد بين أزواج الحروف افتراضيًّا في الفوتوشوب، وتُضبط هذه الأداة افتراضيًّا على وضع Optical وتستطيع الضغط على السهم لتتعرف على الأوضاع الأخرى، وتوجد عدة قيم عددية تشير إلى أشكال مختلفة، لذلك تستطيع أن تجرب عدة خيارات لتصل في النهاية إلى الضبط المثالي للتباعد، وتقلل الأرقام السالبة المسافة في حين تزيدها الأرقام الموجودة. ضبط التباعد في برنامج الوورد يُعَد برنامج الوورد من الخيارات المثالية لكتابة النصوص والمحتوى، كما تستطيع استخدامه لتصميم الإعلانات والمخططات التوضيحية، وستود عندها الحصول على محتوًى مرئي يتمتع بخصائص جمالية قدر الإمكان، ويكون استخدام المسافات الفاصلة المضبوطة بدقة هو الطريقة المُثلَى للتأكد من جمالية الحروف والتحكم بالمسافات الفاصلة في برنامج الوورد ضع المشيرة بين الأحرف التي تود ضبط تباعدها، ثم انقر على خيار التنسيق Format، واختر خيار الخط Font، ثم اختر خيار القائمة المتقدمة من النافذة التي تظهر أمامك. ستجد في هذه اللوحة خيار Kerning for font وإلى جانبه مربع فارغ، من هنا اضغط على هذا المربع لتفعيل ضبط التباعد، وتستطيع إدخال قيم عددية في الفراغ الموجود يمين المربع السابق، إذ تستطيع التحكم بمقدار التباعد عدديًّا، وقد تخطئ في هذه المرحلة، ويتجلى الجانب الإيجابي في هذا الخيار بعدم وجود أرقام محددة مسبقًا، مما يزيد مجال القيم القابلة للتعديل. ضبط التباعد في برنامج الإليستريتور يتشابه ضبط التباعد في برنامج الاليستريتور مع طريقة الضبط في برنامج الفوتوشوب، انقر على أداة إضافة نص وضَع مؤشر الفأرة بين حرفين ترغب بضبط التباعد بينهما، واختر أداة V/A من اللوحة الجانبية للحروف، وتستطيع استخدام الأسهم الموجودة على يسار القيم العددية لزيادة أو إنقاص قيمة التباعد. ضبط التباعد في اللغة العربية عندما نتعامل مع المسافات الفاصلة بين أزواج الحروف، فلا بد لنا أن نأخذ بالحسبان اللغة المستخدمة في الكتابة أو التصميم، إذ تتمتع كل لغة بخصوصية تختلف عن الأخرى، وتتمتع اللغة الإنجليزية بحروف تُكتب منفصلةً عن بعضها البعض في حالتي الكتابة بالأحرف الكبيرة والصغيرة، على خلاف اللغة العربية التي تتمتع بحروف تُكتب متصلةً ببعضها وذات خصائص شكلية تختلف باختلاف الخط العربي المستخدم. تتعاظم في أيامنا هذه أهمية استخدام فن الخط بوصفه طريقةً مثاليةً للتعبير عمّا يجول في خاطر المصمم، إذ يمثل الخط اللغة المرئية الأكثر تأثيرًا على المتلقي من خلال التحكم بقابلية النص أو المحتوى المكتوب للقراءة والتأثيرات الجمالية التي تترك أثرًا واضحًا في نفس القارئ عند استخدامها في المواطن الصحيحة، ويُعرّف فن الخط Typography بأنه فن وتقنية ترتيب الحروف وضبطها وتنسيقها للحصول على لغة مكتوبة واضحة ومقروءة وجذابة، وينطوي هذا الترتيب على عدة عمليات لا بد أن يحترفها المصمم، وهي اختيار المحارف وأحجام النقاط وأطوال السطور وضبط التباعد بين السطور وضبط التباعد بين الحروف وضبط التباعد بين أزواج الحروف. يكمن الهدف الرئيسي وراء عملية ضبط التباعد بين الحروف في تسهيل إمكانية قراءة النص، بحيث تكون تجربة المستخدم أثناء قراءة المحتوى غنيةً ومفيدةً وغير مربكة، ونعلم أن الخط العربي محط اهتمام وبحث على مر العصور، بهدف استكشاف الأصول التي تطور عنها والمراحل التي مر بها، كما يُعَد الخط العربي اليوم أداةً فنيةً مميزةً في يد المصمم العربي، لما يُحدثه من إيقاع بصري يُمتع القارئ. يجب أن يراعي المصمم أثناء ضبطه للتباعد بين الحروف منظومة العلاقات التي تربط بين الحروف العربية وقابلية المد والانثناء وشغل الفراغات الناشئة بين الحروف، إذ بُنيت الحروف العربية على أساس هندسي ينطلق من أن حرف الألف هو المعيار وبقية الحروف هي أجزاء من دائرة يكون حرف الألف هو القطر فيها، وتتميز الحروف بنسبة رياضية ثابتة تسمى النسبة الفاضلة التي تُردّ إليها كافة الحروف بما يراعي هندسة كل حرف. يتعلق ضبط المسافات الفاصلة بين الحروف بخطوط بناء تلك الحروف، إذ تتعامد خطوط الحروف العربية بزوايا قائمة تصنع حالة من الاستقرار والثبات في الشكل العام للنص، وهو ما يجب مراعاته أثناء ضبط المسافات الفاصلة بين تلك الحروف، كما يُعرف الشكل العام للحرف باسم صورة الحرف، إذ تتميز الحروف العربية بقلة صورها نسبيًّا نتيجة تشابه صورة الحرف من صورة حروف أخرى بوجود اختلاف متعلق بالتنقيط، وهو ما يتجلى بوضوح في حروف الجيم والحاء والخاء، والعين والغين، والفاء والقاف. يجب أن يراعي المصمم أثناء ضبطه المحتوى المكتوب أهمية موقع الحرف العربي بالنسبة لسطر الكتابة -وإن كان هذا السطر غير مرسوم-، إذ يتباين موضع الحروف العربية بالنسبة لسطر الكتابة من حيث موازاتها له أو علوّها عنه أو انخفاض أجزاء منها تحته، وتنبع هذه الحركة من تصميم شكل الكلمة، وتمتاز الحروف العربية بأنها تُكتب متصلةً، ومن هنا تأتي أهمية عملية الوصل بين الحروف المتجاورة بما يضمن إظهار جمالية الخط العربي، من خلال ضبط تراصف الحروف واتصالها، وضرورة ضبط المدّات بين الحروف لتتحلى الكلمات بالتناسق والانضباط، وتختلف طريقة الوصل بين الحروف والمسافات الفاصلة بينها باختلاف نوع الخط المستخدم في الكتابة، فمثلًا يتمتع الخط الكوفي بالخطوط المستقيمة والزوايا، بينما نجد الأقواس برفقة الزوايا في خط النسخ وخط الثلث، وتظهر السماكات المختلفة للحروف بتبايُن واضح في الخط الفارسي. أنواع الخطوط يجب مراعاة شكل خط الطباعة أو ما يُسمى Typeface عند الكتابة أو التصميم وذلك تبعًا لنوع المحتوى المكتوب ومتطلّباته، إذ نميّز ثلاثة أشكال لخط الطباعة المستخدم في التصميم، وهي شكل الخط Serif وشكل الخط Sans-serif -الذي يتميز ببساطة شكل حروفه وحيويتها- وشكل الخط Decorative الذي يتميز بقدرته على تزويد الخطوط بزخارف أو تأثيرات زخرفية تجميلية، وتُعرّف عائلات الكتابة أو عائلات الخطوط بأنها مجموعات من الخطوط التي تشترك في المظهر العام، وتكون مصممةً لتستخدم مع بعضها، وتتضمّن أنواع الخطوط والحروف الأساسية المحارف المركبة والحروف الممتدة والزخارف والأعداد الترتيبية والعناوين والأحرف المرتفعة والمنخفضة والأرقام. لا تستطيع كافة خطوط الطباعة أن تتكون في كافة عائلات الخطوط، ومن أهم الخطوط المستخدمة عالميًّا في برامج التصميم: خط Arial وخط Times New Roman وخط Tohama، والتي تُستخدم في مختلف أنواع المطبوعات وتدعم اللغة العربية، كما توجد مجموعة متنوعة من الخطوط العربية المستخدمة في التصاميم المتقدمة والاحترافية وتصميم الشعارات، وأهمها خط أندلس وخط أيريال وخط أرابيك ترانسبيرنت وخط ديكوتايب نسخ وديكوتايب ثلث والخط الديواني والخط الفارسي. تتفق الحروف العربية مع الحروف الإنجليزية بعائلات الخطوط وأشكالها وقياساتها، ولكن يكمن الاختلاف في بنية الكلمة العربية، إذ تتصل الحروف العربية ببعضها البعض وتتمتع بانحناءات شكليّة تدعم هذا الاتصال، ولا تحتاج الخطوط العربية إلى إجراء أي عمليات لضبط المسافات الفاصلة بين أزواج الحروف، لأن الحروف تتصل ببعضها البعض افتراضيًّا، ويتحكم نوع الخط المستخدم بالقياسات المختلفة للمسافات بين الحروف. تتأثر أشكال الحروف العربية بنسب خطيّة ومقاييس معينة مثل مقياس نظام النقاط، وعند البدء بالتصميم حدّد أولًا نوع الخط الذي ترغب باستخدامه اعتمادًا على نوع المحتوى الذي ستكتبه ومكان عرضه والفئة المستهدفة، وتستطيع استخدام أي موقع يحوي خطوطًا عربيةً متنوعةً، حيث تتيح لك العديد من المواقع مكتبةً هائلةً من الخطوط العربية، مع إمكانيّة تجريب عدة خطوط على عبارة أو كلمة معينة ورؤية نتيجة التطبيق عمليًّا، مما سيسهل عليك اختيار الخط الملائم لتصميمك. هذه هي أهم النصائح الضرورية لتعلم ضبط التباعد بين أزواج الحروف، فحاول أن تفهمها جيّدًا وطبّق ما تحتاجه في تصاميمك القادمة، ويساعد ضبط التباعد على إضفاء المزيد من الفن على التصاميم لتبدو جميلةً ومتوازنةً واحترافيةً، ويمنحك احتراف ميزة الضبط تقدّمًا على المصممين الذين لا يهتمون بها، فتمرّن باستمرار وستتمكن من استخدام ميزة ضبط التباعد بين أزواج الحروف باحترافية في كافة التصاميم والمشاريع التي تعمل عليها. ترجمة -وبتصرّف- للمقال 11 Tips for Mastering Kerning in Your Typography لصاحبه Harsh Raval. اقرأ أيضًا كيف تقوم بعملية تجميل لخطوط موقع الوردبريس النص وأسلوب الطباعة Typography في تصميم الرسوميات لم المحتوى أهم من التصميم؟ دليل المبتدئين خطوة بخطوة لتصميم شعار النسخة الكاملة لكتاب أساسيات تصميم الرسوميات