11 خطًا لتصميم الويب من شأنها أن تمنح موقع الويب الخاص بك وجهًا جديدًا

نشرت: 2023-02-02

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

خطوط تصميم الويب

ما الذي يفصل "السوبر" عن العادي؟ بينما تصرخ إحدى شخصيات الفيلم ذات اللون الأزرق ، "عرض تقديمي!"

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

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

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

كيفية اختيار خطوط تصميم الويب

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

  1. مقروئية ومقروئية
  2. اتساق العلامة التجارية
  3. المزاج والنبرة
  4. إرشادات الوصول إلى الويب
  5. التوافق عبر المستعرضات
  6. قابلية التوسع

1. مقروئية ومقروئية

الوضوح هو مدى سهولة تمييز المستخدمين بين الشخصيات. إذا واجه القارئ صعوبة في تحديد ما إذا كان الحرف "S" من "5" ، فقد يتعين عليك اختيار خط مختلف. توفر بعض الخطوط أشكالًا مختلفة لأحرف متشابهة (مثل "1" ، وحرف كبير "I" ، وحرف صغير "l") لتمييزها عن بعضها البعض.

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

في هذا الصدد ، تختلف الوضوح عن سهولة القراءة.

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

2. اتساق العلامة التجارية

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

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

3. المزاج والنبرة

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

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

4. إرشادات الوصول إلى الويب

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

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

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

القراءة الموصى بها: مفاهيم تصميم الويب التي تعطي الأولوية لتركيز العميل

5. التوافق عبر المستعرضات

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

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

  • النوع المفتوح المضمن (EOT). مدعوم من مستعرضات Microsoft فقط (Internet Explorer و Microsoft Edge)
  • True Type Font / Open Type Font (TTF / OTF). تأسست هذه التنسيقات من قبل Apple و Microsoft في الثمانينيات ، وهي مدعومة من قبل جميع المتصفحات الرئيسية ، وهي Chrome و Firefox و Opera و Microsoft Edge و Internet Explorer
  • تنسيق خط الويب المفتوح (WOFF). تم إنشاء هذا التنسيق بواسطة Mozilla في عام 2009 ، وهو نسخة مضغوطة من TTF / OTF تم تصميمه للتحميل بشكل أسرع
  • تنسيق خط الويب المفتوح (WOFF2). مراجعة لـ WOFF السابقة ، تشمل أهم لاعبيها Chrome و Firefox و Opera ؛ تم تصميمه ليحل محل WOFF وسوف يفعل ذلك في النهاية

اعلم أن التنسيقات الأكثر استخدامًا في الوقت الحالي هي TTF / OTF و WOFF. يمكن عرض الخطوط التي تستخدم هذه التنسيقات بشكل صحيح عبر جميع المستعرضات المدعومة.

6. قابلية التوسع

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

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

خطوط تصميم الويب الشعبية

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

1. افتح Sans

Open Sans هو نوع خط "بلا زخرفة". إنه مباشر ودقيق ولا يعبث برسالتك. Open Sans هو أيضًا متعدد الاستخدامات بشكل مدهش. يبدو رسميًا ، لكنه يمنحه أيضًا "مظهرًا محايدًا وودودًا" من قبل مصممه.

إنه قابل للتطوير ، مما يعني أنه يمكنك قراءته بأحجام نصية صغيرة وكبيرة. كما أنها مُحسّنة للطباعة والويب وواجهات الهاتف المحمول.

يمكنك معرفة سبب استخدام Open Sans بشكل شائع عبر الإنترنت. في الواقع ، يستخدمه أكثر من 84 مليون موقع بطريقة أو بأخرى. بعض هذه المواقع تشمل:

  • حتى العمل
  • فانا
  • أتول ديجيتال
  • مجلة سنس

2. روبوتو

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

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

لا عجب أن أكثر من 630 مليون موقع ، بما في ذلك Google و YouTube ، تستخدم Roboto دينياً.

3. لاتو

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

كما أنه سهل على العيون ، مما يجعل Lato منافسًا جادًا للنص الأساسي. إنها أيضًا جيدة جدًا في الأحجام الكبيرة ، مع الحفاظ على خصائصها الفريدة عندما يصبح النص أكبر.

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

يمكن العثور على مثال جيد لاستخدام Lato في Bundl ، وهو موقع مشروع مشترك.

4. Helvetica

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

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

تتطور Helvetica أيضًا باستمرار مع العصر بسبب مرونتها. تستخدم العلامات التجارية في الصناعات المختلفة Helvetica بطريقة أو بأخرى ، وهي: BMW و Motorola و Nestle و Microsoft و Apple. السلطات الحكومية مثل وكالة ناسا والاتحاد الأوروبي هي أيضا ميزة Helvetica.

5. بروكسيما نوفا

نشر الرئيس السابق لشركة Design Cameron Moll في Facebook مقالاً عن تاريخ Proxima Nova. يصف الخط بأنه "متعدد الاستخدامات بشكل لا يصدق للواجهات الرقمية ، ويعمل مثل العمود الفقري بالعديد من الأحجام المختلفة ، ويبدو رائعًا على شاشات شبكية العين."

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

منذ ذلك الحين ، أصبح الخط التجاري الأكثر شعبية على الإنترنت.

6. مونتسيرات

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

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

7. Raleway

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

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

8. المصدر بلا برو

Source Sans Pro هي أول عائلة خطوط مفتوحة المصدر من Adobe. إنه مصمم للعمل بشكل جيد مع واجهات المستخدم. تجعل أشكاله المستديرة الأحرف سهلة على العيون ، مع زيادة المسافات بين كل حرف.

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

9. بوبينز

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

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

استوديو الرسوم المتحركة Wonderlust هو من بين 8.1 مليون موقع يستخدم الخط.

10. جورجيا

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

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

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

11. عرض Playfair

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

كيفية استخدام خطوط تصميم الويب بشكل فعال

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

1. الخط الاقتران والجمع.

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

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

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

2. إنشاء خط مخصص.

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

3. حقوق الترخيص والاستخدام.

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

4. الاختبار والتحسين.

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

يوصى بقراءة: كيفية إنشاء تصميم ويب سلس وسير عمل التطوير

إعداد الخطوط لاستخدامها على مواقع الويب

الآن بعد أن أصبحت لديك فكرة عن الخطوط المستخدمة بشكل شائع عبر الإنترنت ، فأنت جاهز لبدء استخدامها. إليك كيف يمكنك البدء:

1. قم بتنزيل وتثبيت الخطوط.

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

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

بمجرد العثور على الخط ، ما عليك سوى تنزيله على جهاز الكمبيوتر الخاص بك. ستأتي معظم الخطوط بتنسيق ZIP ، لذا يتعين عليك استخراجها. ما عليك سوى النقر بزر الماوس الأيمن على الملف واختيار "استخراج هنا" للقيام بذلك. ستنتهي بملف خط جاهز للتثبيت.

فقط انقر نقرًا مزدوجًا فوق الملف ثم اضغط على "تثبيت" في شاشة المعاينة المنبثقة.

2. تضمين الخطوط على موقع الويب الخاص بك.

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

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

3. ضمان التوافق عبر المستعرضات.

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

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

نصائح تحسين خط الويب

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

1. لا تستخدم الكثير من الخطوط.

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

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

2. استخدم الخطوط المحسنة لكل متصفح.

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

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

الماخذ الرئيسية

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

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

تواصل مع Propelrr اليوم لمعرفة المزيد عن مفاهيم تصميم الويب. نحن أكثر من سعداء لمساعدتك. إذا كنت بحاجة إلى مزيد من المساعدة أو مزيد من المعلومات ، فتواصل معنا عبر Facebook أو Twitter أو LinkedIn.

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