أسهل طريقة لتعرف ما هو الخط المستخدم في أي موقع ويب

كيف أعرف ما هو الخط المستخدم في أي موقع إلكتروني؟ 

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

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

أنواع الخطوط في مواقع الويب 

هناك 4 أنواع أساسية للخطوط وهي: 

1 خطوط Serif  

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

ومن الأمثلة عليها 

• Serif Times New Roman 
• Montserrat 
• Roboto
• Open Sans 
•  Georgia

Serif

2 خطوط  Sans Serif 

 Sans Serif

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

ومن الأمثلة على هذاالنوع من الخطوط  

•  Arial 
• Lato
• Helvetica 
•  Calibri

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

3 خطوط  Script   

Script font

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

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

من الأمثلة عليها 

• Monarda
• Raksana

4- خطوط Decorative    

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

أمثلة عليها 

•  Lemonada
•  Stencil
• Vibes

كيف أعرف ما هو الخط المستخدم في موقع ما؟ 

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

طريقة1 معرفة نوع الخط من خلال إضافات المتصفح 

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

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

قم بتنصيب WhatFont الأن 

طريقة 2 فحص الكود المصدري CSS  

يمكنك النقر بزر الماوس الأيمن على أي نص في صفحة الويب الخاصة بك واختيار الأمر فحص لعرض الكود المصدري  ضمن المستعرض كما يلي

 وفي التبويب Styles على  الجهة اليسرى، ابحث عن الواصفة font-family أو font  وسترى كافة المعلومات عن الخط المستخدم في هذا النص. 

 طريقة 3 عن طريق موقع  Stylify Me

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

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

 نصائح لاستخدام  الخطوط في موقع الويب الخاص بك.

1. احرص لى ان يكون الخط  بسيط وسهل القراءة لاسيما في الفقرات والنصوص الطويلة 
2. استخدم نوعين من الخطوط كحد أقصى واحد للعناوين وآخر للفقرات والنصوص، وإذا قمت بإضافة خط ثالث فاستخدمه في مواضع محددة مثل علامات الاقتباس. 
3. استخدم حجم معتدل للخط وتجنب استخدام النصوص  المكتوبة بأحرف كبيرة جدَا أو صغيرة جدًا لأنها تتعب عين المستخدم. (يترواح حجم الخط الأفضل لمواقع الويب إلى 14 إلى 16 نقطة ويختلف حسب اللغة ونوع الخط بالطبع)
4. كي تساعد القارئ على التركيز وتنظيم المعلومات اعتمد تسلسل هرمي للمعلومات واستخدم  تنسيق  H1 للعنوان الرئيسي  وتنسيق  H2 للعناوين الأساسية في النص ثم تنسيقات H3 و H4  للعناوين التالية وهكذا.. 

الخلاصة: 

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

 

 

تابع ليمان على فيسبوك