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

أفضل 10 خطوط وأكثرها استخدامًا

جميع الخطوط أدناه تعتبر أساسية، لذا يمكن استخدامها في الموقع حتى بدون رفع ملف الخط (*.ttf) إلى الدليل بالموقع

1. تاهوما

2. فيردانا

3. اريال/اريال اسود/اريال ضيق

4. تايمز نيو رومان

5. بالاتينو لينوتايب / بالاتينو

6. تأثير

7. القرن القوطية

8. هلفتيكا

9. جورجيا

10. جيل سانس جبل

بالإضافة إلى ذلك:

11. ساعي جديد

12. كاليبري

13. منجنيق MS

14. لوسيدا بلا يونيكود

عدة قواعد لاستخدام الخطوط على الموقع

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

عنوان

فقرة الفقرة الأولى

ثانيةالفقرة الفقرة

2. يجب أن يحتوي الموقع على مفهوم عام، لذا حاول ألا تستخدم أكثر من 2-3 خطوط لكل موقع. أدناه هو رمز CSS

الجسم (الخط: 14px/100% Tahoma، Verdana، sans-serif)
14 بكسلحجم الخط، 100% المسافة بين السطور، تاهوماالخط المستخدم
3. يجب أن يكون النص بعد التصميم قابلاً للقراءة - مع الحفاظ على التباين (نص أسود على خلفية بيضاء، أبيض على أزرق، وما إلى ذلك). حاول ألا تستخدم الألوان الزاهية لأي منهما. هناك استثناءات، لكنها لا تندرج تحت الممارسات القياسية.

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

5. يجب أن يكون النص قابلاً للقراءة! حاول استخدام الفقرات والمسافات البادئة للفقرات الفرعية أو المعلومات المرجعية.

نص الفقرة الأولى. طويلة ومثيرة للاهتمام.

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

شكرًا لكم على اهتمامكم! ونتمنى لك حظًا سعيدًا في تطوير تصميمات المشروع!)

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

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

كان توماس لورينافيسيوس مهتمًا بالخطوط التي يفضل مصممو الويب استخدامها في عملهم.

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

كما أجرى مقابلات قصيرة مع مصممي الويب لمعرفة الخط الأكثر ملاءمة في موقف معين. شارك توماس نتائج استطلاعه على موقع hongkiat.com.

خلال الاستطلاع، قام مصممو الويب بتسمية 73 خطًا مختلفًا - 46 خطًا مجانيًا و27 خطًا مدفوعًا.

تبين أن الخطوط المفضلة لدى مصممي الويب هي: Helvetica، وArial، وGeorgia، وGotham، وMyriad Pro، وDIN، وFutura، وLeague Gotic، وCabin، وCorbel.

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

أفضل 10 خطوط مجانية مفضلة لمصممي الويب

اختار المصممون الذين شملهم الاستطلاع أفضل 10 خطوط لرسومات الويب. ولم يأخذ هذا في الاعتبار الخطوط المثبتة افتراضيًا في نظام التشغيل، مثل Arial أو Verdana أو Times New Roman أو Georgia أو Tahoma. (هذا غريب بعض الشيء - في المقام الأول الخط الموجود في نظام التشغيل).

أفضل 10 خطوط مدفوعة مفضلة لمصممي الويب

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

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

بافل شودنيف

تذكر القاعدة: أفضل خط يمكن قراءته على الورق هو الخط serif؛ أما الخط sans serif فهو الأفضل للقراءة على الشاشة.

أعتقد أن السبب في ذلك هو أن المعلومات يتم عرضها بشكل مختلف على الورق وعلى شاشة العرض. لذلك، في الطباعة المطبعية، يعتبر معيار الخط هو 700 نقطة في البوصة (نقطة في البوصة - عدد النقاط في البوصة)، ووضوح الصورة على شاشة الشاشة هو 72 نقطة في البوصة فقط - أقل بعشر مرات. .

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

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

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

الأربعة الأولى: خطوط Arial وHelvetica وVerdana وGeorgia

كما أظهرت نتائج استطلاع آراء 35 من مصممي الويب أجرته مجلة Smashing، فإن المركز الأول يتقاسمه خطان: Helvetica وArial. (بالنسبة للتعليم العام، سأقول إن مصممين سويسريين طوروا خط Helvetica منذ أكثر من نصف قرن، وأن خط Arial أصغر بعشرين عامًا.) وهذه الخطوط هي الأكثر شيوعًا على الإنترنت، وبالتالي يمكن ادعاء أنها الخطوط أفضل.

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

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

أما بالنسبة لخطوط القراءة من الورق، فهي كثيرة (عدة آلاف) بحيث يكاد يكون من المستحيل تسليط الضوء على أفضلها. ومع ذلك، بغض النظر عن مدى تافهة الأمر، فإن Times New Roman وأشكاله المختلفة تستخدم على نطاق واسع في الطباعة. لذلك سنترك له أمجاد أفضل خط غير متصل بالإنترنت.

ملاحظة.بالمناسبة، يتم ترجمة Serif وSans Serif من الفرنسية بهذه الطريقة: مع الرقيق وبدون الرقيق.

روابط ذات علاقة:

على موقع InspirationBit يمكنك قراءة نتائج الاستطلاع المذكور لمصممي الويب في تدوينة أفضل 16 خطًا لتصميم الويب (باللغة الإنجليزية)

ما هو إعادة تصميم موقع الويب ولماذا هو مطلوب؟

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

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

ما هو وزن الخط

إمكانية قراءة الخط

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

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

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

مثال 1:النص غير قابل للقراءة للغاية

مثال 2:يقرأ النص جيدا

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

يمكنك أيضًا الاطلاع على أرشيف الطباعة المستقل http://fontsinuse.com/ - وهو مورد حيث يتم جمع عينات من مواقع الويب والمنشورات المطبوعة وفرزها حسب نوع الخط المستخدم.

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

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

تذكر القاعدة: أفضل خط يمكن قراءته على الورق هو الخط serif؛ أما الخط sans serif فهو الأفضل للقراءة على الشاشة.

أعتقد أن السبب في ذلك هو أن المعلومات يتم عرضها بشكل مختلف على الورق وعلى شاشة العرض. لذلك، في الطباعة المطبعية، يعتبر معيار الخط هو 700 نقطة في البوصة (نقطة في البوصة - عدد النقاط في البوصة)، ووضوح الصورة على شاشة الشاشة هو 72 نقطة في البوصة فقط - أقل بعشر مرات. .

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

هذا الخط له تاريخ مثير للاهتمام.

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

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

الأربعة الأولى: خطوط Arial وHelvetica وVerdana وGeorgia

كما أظهرت نتائج استطلاع آراء 35 من مصممي الويب أجرته مجلة Smashing، فإن المركز الأول يتقاسمه خطان: Helvetica وArial. (بالنسبة للتعليم العام، سأقول إن مصممين سويسريين طوروا خط Helvetica منذ أكثر من نصف قرن، وأن خط Arial أصغر بعشرين عامًا.) وهذه الخطوط هي الأكثر شيوعًا على الإنترنت، وبالتالي يمكن ادعاء أنها الخطوط أفضل.

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

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

أما بالنسبة لخطوط القراءة من الورق، فهي كثيرة (عدة آلاف) بحيث يكاد يكون من المستحيل تسليط الضوء على أفضلها. ومع ذلك، بغض النظر عن مدى تافهة الأمر، فإن Times New Roman وأشكاله المختلفة تستخدم على نطاق واسع في الطباعة. لذلك سنترك له أمجاد أفضل خط غير متصل بالإنترنت.

ملاحظة.بالمناسبة، يتم ترجمة Serif وSans Serif من الفرنسية بهذه الطريقة: مع الرقيق وبدون الرقيق.

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