التيبوجرافي: الإنقرائية أم الوضوح

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

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

 

أولاً: الإنقرائية (Readability)

 

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

أو هي “سهولة وسرعة قراءة العين للنصوص”

 

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

 

وهذا هو مثال يوضح الفرق بين الخطوط القابلة للقراءة بسهولة وغيرها:

readability_thumb

ثانياً: الوضوح(Legibility)

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

حيث أن هناك حروف لا تستطيع تميزيها إذا حصل لها تكبير أو تصغير مثل حرف الC يمكن أن يتم قرائتة O في بعض أنوع الخطوط.

أو هو “سهولة تمييز حرف عن أخر”

 image_thumb6

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

 

 

كيف تنشئ نص مقروء وواضح ؟

دعونا نتعرف على بعض العوامل التي تؤثر على القراءة والإنقرائية بداية من التصميم وحتى النهاية.

 

التخطيط

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

 

المحاذاة

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

 

طول السطر

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

المسافات بين السطور

المسافات العمودية بين السطور تعتبر من أكثر عناصر الإنقرائية في الأهمية.فتخيل معي أن هذا المقال لا يوجد مسافات بين السطور هل سوف تستطيع أن تقرء المقال بسهولة.لذلك فإن المسافات بين السطور قد تترواح بين 50-150% أكبر من طول السطر نفسة.وهذا مثال بسيط يوضح ما أقول:

leading

المسافات بين الحروف

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

 

شكل الخط

شكل الخط أيضاً يؤثر على الإنقرائية وسهولة القراءة .حيث أن الخطوط  من النوع الرقيق ( serif)  أو من نوع (sans serif) تكون أكثر وضوحاً وإنقرائية عن غيرها من أنواع الخطوط. 

اللون والتباين

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

عدد من الخطوط

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

 

حجم الخط

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

.السؤال الذي ربما تسألة هو  كيف  تعرف ما هو حجم  الخط المناسب الذي يجب عليك استخدامة. ليس هناك إجابة بسيطة. لاحظ المقارنة بين  الخطوط الأتية باللغة الأجنبية:

aa2

 

 

الخاتمة

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

المراجع

1-sitepoint

2-vanseodesign

3-sitepoint

مقالات ذات صلة

4 تعليقات

  1. مصطفى وهبه
    2 أكتوبر,2014 في 12:32 ص - Reply

    حقيقي رائع يا احمد . تسلم ايدك بجد .

  2. احمد اشرف
    2 أكتوبر,2014 في 12:55 ص - Reply

    رائع جداً .. تسلم ايديك 😀

  3. MidooDj
    2 أكتوبر,2014 في 5:08 م - Reply

    موضوع أكثر من رائع يا أحمد، معلومات جديدة اتعرف عليها لأول مرّة من خلال موضوعك
    شكرًا لك.

  4. احمد ممدوح
    30 يناير,2015 في 12:17 ص - Reply

    حقيقى موضوع رائع جدا