لقد التقينا جميعا بمواقع على الويب حيث يكون الخط صغيرا جدا ويصبح من المستحيل قراءة النص. هذه مشكلة يواجهها المستخدمون ضعاف البصر ، وكذلك الأشخاص الذين يفضلون الأحرف الكبيرة للقراءة المريحة. ومع ذلك ، ليس من الصعب زيادة الخط على الموقع ، وفي هذه المقالة سننظر في بعض الطرق البسيطة لزيادة النص.
الطريقة الأولى هي استخدام مفاتيح التكبير في صفحة الويب. في الأساس ، يدعم كل متصفح حديث القدرة على تكبير أو تصغير عرض الصفحة. عادة ، يتم استخدام اختصار لوحة المفاتيح كترل و " + "للتكبير ، ويتم استخدام كترل و" — " للتصغير. إذا كنت تعمل على ماك ، استبدال مفتاح كترل مع كمد.
الطريقة الثانية هي تغيير حجم الخط من خلال إعدادات المتصفح. تسمح لك معظم المتصفحات الحديثة بضبط حجم الخط الافتراضي ، مما سيتيح لك رؤية نص أكبر على جميع المواقع. يمكن العثور على إعدادات الخط عادة في قائمة الإعدادات أو الخيارات في المتصفح. ما عليك سوى العثور على قسم إعدادات الخط وتحديد الحجم الذي تحتاجه.
الطريقة الثالثة هي استخدام أنماط كس. إذا كنت مطور ويب أو لديك حق الوصول إلى رمز الموقع ، ثم يمكنك تعيين حجم الخط الخاص بك باستخدام كس. ما عليك سوى إضافة الكود التالي إلى قسم النمط في مستند هتمل: ص {حجم الخط: 20 بكسل؛} هنا "20 بكسل" هو حجم الخط بالبكسل ، يمكنك تغيير القيمة إلى القيمة التي تحتاجها.
- كيفية تكبير الخط على الموقع
- طرق بسيطة لتكبير النص
- تكبير الخط باستخدام المغلق
- استخدام الإضافات لتكبير الخط
- إنشاء تصميم سريع الاستجابة لتعزيز سهولة القراءة
- استخدام الألوان المتناقضة لزيادة سهولة قراءة النص
كيفية تكبير الخط على الموقع
يمكن أن تكون زيادة حجم الخط على الموقع مفيدة للمستخدمين ذوي البصر المحدود أو لأولئك الذين يفضلون حجم نص أكبر. في هذه المقالة ، سنلقي نظرة على بعض الطرق البسيطة لزيادة الخط على الموقع.
- استخدام وحدات القياس النسبية
- استخدام خاصية حجم الخط المغلق
ح1 {حجم الخط: 24 بكسل;}- باستخدام جافا سكريبت
واحدة من أسهل الطرق لزيادة حجم الخط على موقع الويب هي استخدام وحدات القياس النسبية مثل النسب المئوية أو م. على سبيل المثال ، بدلا من تحديد القيم المطلقة مثل "12 بكسل" أو "14 نقطة" ، يمكنك استخدام القيم النسبية مثل "120 ٪" أو "1.2 م". سيؤدي ذلك إلى زيادة حجم الخط على الموقع بأكمله ، وليس فقط على العناصر الفردية.
هناك طريقة أخرى لزيادة حجم الخط على موقع ويب وهي استخدام خاصية حجم الخط المغلق لعناصر معينة. يمكنك تحديد حجم الخط المطلوب بالبكسل أو النسب المئوية أو م. على سبيل المثال ، لزيادة الخط لجميع رؤوس ح1 ، يمكنك إضافة القاعدة التالية إلى ورقة الأنماط:
هناك طريقة أخرى لزيادة حجم الخط على موقع الويب وهي استخدام جافا سكريبت. يمكنك إضافة أزرار لزيادة حجم الخط وتقليله وإرفاق معالجات الأحداث بها والتي ستغير حجم الخط في عناصر الصفحة المحددة. على سبيل المثال ، عند النقر فوق الزر "تكبير الخط" ، يمكنك استدعاء وظيفة جافا سكريبت التي ستحدد حجم خط أكبر لعنصر معين.
اعتمادا على احتياجات المستخدمين وتصميم الموقع ، يمكنك اختيار الطريقة الأنسب لتكبير الخط. من المهم أن تضع في اعتبارك إمكانية الوصول إلى الموقع وقابليته للاستخدام لجميع المستخدمين ، بما في ذلك أولئك الذين يعانون من مشاكل في الرؤية.
طرق بسيطة لتكبير النص
إذا كنت بحاجة إلى زيادة حجم النص على موقع الويب الخاص بك ، فهناك بعض الطرق البسيطة للقيام بذلك:
1. استخدام حجم الخط النسبي
يمكنك تعيين حجم الخط باستخدام القيم النسبية مثل النسب المئوية أو م. على سبيل المثال ، يمكنك تعيين حجم الخط إلى 120 ٪ أو 1.2 م لزيادته بنسبة 20 ٪ بالنسبة إلى الحجم الأساسي.
2. باستخدام حجم الخط المطلق
يمكنك أيضا تعيين حجم الخط المطلق باستخدام القيمة بالبكسل. على سبيل المثال ، يمكنك ضبط حجم الخط على 18 بكسل لجعله أكبر مقارنة بالنص الآخر في الصفحة.
3. باستخدام الخاصية المغلق الخط-حجم-ضبط
تتيح لك هذه الخاصية تعيين مستوى إعداد حجم الخط لعنصر ما. يمكنك استخدام قيمة من 0 إلى 1. تعني القيمة 1 استخدام حجم الخط الأصلي ، وتقلل القيمة الأقل من 1 من حجم الخط. على سبيل المثال ، يمكنك تعيين حجم الخط-ضبط:1.2 لزيادة حجم الخط بنسبة 20٪.
4. باستخدام جافا سكريبت
إذا كنت تريد أن يتمكن المستخدم من ضبط حجم الخط على موقعك ، فيمكنك إضافة القدرة على تغييره باستخدام جافا سكريبت. على سبيل المثال ، يمكنك إنشاء أزرار لزيادة حجم الخط وتقليله وتغييره باستخدام الوظائف المناسبة.
سيساعدك استخدام أي من هذه الطرق على زيادة النص على موقع الويب الخاص بك وتحسين إمكانية قراءته للمستخدمين الذين يعانون من ضعف البصر أو في المواقف الأخرى التي يفضل فيها النص الكبير.
تكبير الخط باستخدام المغلق
لتغيير حجم الخط لعنصر معين ، يمكنك استخدام خاصية حجم الخط. على سبيل المثال ، لتكبير الخط لفقرة ، يمكنك إضافة رمز كس التالي:
ص {حجم الخط: 20 بكسل;
}
في هذا المثال ، سيتم زيادة حجم الخط لجميع الفقرات إلى 20 بكسل. يمكنك تغيير قيمة البكسل إلى أي قيمة أخرى تلبي متطلباتك.
إذا كنت ترغب في تعيين حجم خط افتراضي جديد للموقع بأكمله ، فيمكنك استخدام محدد النص العام وتحديد قيمة خاصية حجم الخط. على سبيل المثال:
الجسم {
حجم الخط: 18 بكسل;
}
| في هذه الحالة ، سيتم تعيين حجم الخط لجميع العناصر على الموقع إلى 18 بكسل. | |
|---|---|
| بالإضافة إلى تغيير حجم الخط ، يمكن أيضا استخدام كس لتغيير نمط الخط واللون والمحاذاة والسمات الأخرى التي لها تأثير مرئي على النص. | استخدام كس لتكبير الخط على الموقع يوفر المرونة والتحكم ، مما يسمح لك بسهولة تخصيص وتغيير حجم الخط وفقا لاحتياجاتك وتفضيلاتك. |
| استخدام الإضافات لتكبير الخط | هناك العديد من المكونات الإضافية التي يمكن استخدامها لهذا الغرض. واحد منهم هو نص التكبير المساعد فقط. يسمح لك بتكبير النص على الصفحة فقط دون تغيير باقي المحتوى. لاستخدام هذا المكون الإضافي ، يكفي إضافة الرمز إلى الصفحة وتكوين المعلمات حسب تقديرك. |
| البرنامج المساعد | الوصف |
تكبير النص فقط
يسمح لك بتكبير النص فقط على الصفحة.
تغيير حجم النص
يسمح لك بتغيير حجم النص على الموقع عن طريق التكبير أو التصغير.
مغير حجم الخط
بدلا من قيمة حجم الخط الثابت مثل وحدات البكسل ، يوصى باستخدام وحدات قياس نسبية مثل النسب المئوية أو م. على سبيل المثال ، بدلا من
حجم الخط: 16 بكسل;
يمكنك استخدام
حجم الخط: 100%;
أو
حجم الخط: 1 م;
. يسمح هذا للنص بالتوسع تلقائيا اعتمادا على إعدادات الخط التي حددها المستخدم.
2. استخدام استعلامات الوسائط
لتكييف حجم الخط على النحو الأمثل للأجهزة المختلفة ودقة الشاشة ، يمكنك استخدام استعلامات الوسائط في كس. على سبيل المثال ، يمكنك تحديد أحجام خطوط مختلفة للأجهزة المحمولة والأجهزة اللوحية وأجهزة الكمبيوتر المكتبية.
3. استخدام ميزات المتصفح
توفر معظم المتصفحات الحديثة للمستخدمين القدرة على توسيع نطاق النص مباشرة في الواجهة. لضمان سهولة القراءة على الموقع ، يجب عليك استخدام ميزات المتصفح القياسية لتغيير حجم الخط. على سبيل المثال ، يمكنك تمكين زيادة حجم الخط باستخدام كترل+ أو كمد+ مفاتيح.
4. العرض الأمثل لكتلة المحتوى
لتسهيل قراءة النص على الموقع ، من المهم أيضا تحديد عرض كتلة المحتوى بشكل صحيح. يجب ألا يكون عرض الكتلة عريضا جدا بحيث لا يفقد المستخدم اتجاهه عند القراءة. يوصى بالحد من عرض كتلة المحتوى إلى حوالي 50-60 حرفا في كل سطر.
يعد إنشاء تصميم تكيفي لتحسين قابلية قراءة النص جانبا مهما من جوانب تطوير موقع الويب ، مما يساعد على مراعاة الاحتياجات المختلفة للمستخدمين وجعل النص قابلا للقراءة في جميع الظروف. باستخدام طرق بسيطة لتكبير الخط وإنشاء تصميم مثالي ، يمكنك جعل موقعك أكثر سهولة في الاستخدام ومتعة للمستخدمين.