دليل المصمم لإتقان تباعد أزواج الأحرف

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

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

02-font-size-weight-line-length.png

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

03-kerning.png

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

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

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

قال مصمم الخطوط الشهير فريدريك جودي ذات مرة:

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

04-manipulation.jpg

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

05-clock.png

06-glasses.png

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

07-Resolution.png

السبب الرئيسي للاختلاف في شكل الخط بين الشاشة والمطبوعات هو دقة الشاشة وعدد النقاط في البوصة (DPI) ، حيث تتمتع الشاشات عمومًا بدقة 100 نقطة في البوصة أو أقل قليلاً ، في حين أن عدد النقاط في الطباعة هو 300 نقطة في المتوسط ​​، والسبب وراء هذا الاختلاف الكبير هو أن خطوط المطبوعات تناسب احتياجات وخصوصيات عملية الطباعة ، حيث أن للخط حد حبر يضبط كمية الحبر المطلوبة عند الكتابة بخط صغير ودقيق أحجام الخطوط المرئية والمسافات بين الحروف. تختلف هذه الإعدادات بخط واحد عند استخدامها بأكثر من حجم.

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

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

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

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

08-spacing.png

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

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

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

هناك مجموعة من الثوابت الأساسية التي يجب وضعها في الاعتبار عند تطوير تصميمات متغيرة:

09-background.png

هناك مجموعة من المبادئ التي يجب مراعاتها عند اختيار الخط المناسب أو مجموعة الخطوط التي سنستخدمها في تصميم الويب ، وإليك أهم هذه المبادئ:

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

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

ترجمة – ومعدلة – لمقالة دليل المصممين إلى تباعد الحروف بقلم هارش رافال.

أضف تعليق