24.02.2009

مشكلة عرض الخطوط العربية في متصفح أوبرا

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

opera-font

في حين، المفترض أن تظهر بهذه الطريقة:

Opera-font-after

سبب هذه المشكلة، هو استخدام الخاصية letter-spacing في CSS. لأن هذه الخاصية، تعني وضع مسافة فاصلة بين الحروف. في الحروف اللاتينية، هذه الخاصية مفيدة لان الكلمات تتكون من حروف غير متصلة (مثال: Mahdi تصبح: M a h d i) بينيما في العربية، فهي تتكون من حروف متصلة (مثال: مهدي) وإذا استخدمنا خاصية letter-spacing مع كلمة “مهدي” فستظهر بهذه الطريقة في أوبرا (م ه د ي). يتجاهل فيرفوكس وإنترنت إكسبلورر هذه الخاصية مع النصوص العربية، في حين يصر على تطبيقها متصفح أوبرا. والحل هو بإزالة هذه الخاصية أو بعدم استخدامها مع التصاميم العربية لأن لا حاجة لها.

غالباً، تظهر هذه المشكلة مع التصاميم المعربة كقوالب ووردبريس وغيرها،وأعتقد أن المشكلة قد تظهر أيضاً في Opera mini.

ذات صلة:

الكاتب: مهدي

مهندس الكترونيات واتصالات ومدوّن تقنيني، مؤسس ومُحرر رحلة ضَوْء. يمكنك متابعته على تويتر كما يمكنك زياره موقعه الشخصي أو مدونته الشخصية.



المشاركات: 18 مشاركة

  1. يحيى قال:

    مهدي شكراً لك… ولكني لم أفهم بالضبط كيف يمكن التخلص من هذه المشكلة! لقد حاول أحد أصدقائي قراءة مدونتي مقطوعات عبر ال i-phone ولكن الأحرف العربية كانت مقطعة. كيف يمكن تعديل ال CSS لحل هذه المشكلة؟

    مع التحيات

  2. مهدي قال:

    @ يحيى: ابحث في ملف CSS في مدونتك واحذف جميع خصائص letter-spacing … (خذ نسخة احتياطية أولاً من ملف CSS).

    مثال: تكون بهذا الشكل:

    letter-spacing:YYpx

    YY: قيمة مسافة التباعد بين الأحرف. (وبنهاية السطر، قد توجد فاصلة منقوطة)

  3. يحيى قال:

    شكراً لك أخي مهدي..

    لقد بحثت في ملف ال CSS وللأسف لم أجد أي تعريف لخاصية letter-spacing …

    ماذا لو وضعتها بنفسي و جعلتها:

    letter-spacing:0px

    هل سينفع ذلك برأيك؟

     

  4. مهدي قال:

    @ يحيى : جرّب …

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

  5. abgred قال:

    شكراً اخ مهدي
    مدونتي على البلوغر وجربت الطريقة لكن لم تنفع
    وربما لم أفهم جيدا لكن هل من حل أخر’’’؟؟؟

  6. abgred قال:

    يااااااااااااااااااااااا سلام عليك أخ مهدي
    الله يجازيك بالخير

    نفعت طريقة letter-spacing:0px
    مع مدونتي وهي على البلوغر

  7. abgred قال:

    كما لا أنسى اخ يحيى الذي أوحى لنا بالحل
    فشكرا جزيلا

  8. مهدي قال:

    @ abgred:

    سواء حذفت السطر بالكامل أو اعطيتها القيمة 0
    letter-spacing:0px

    فنفس المعنى (بحسب المثل الشعبي: هاي ذاني وهاي ذاني- هل لديكم هكذا مثل في بلدكم؟) . القيمة 0 تعني إلغاءها نهائياً …

    بهذه المناسبة، لي عندك مكافأة ;-)

  9. مهدي قال:

    ملاحظة: عندما قلت لصديقنا يحيى “جرّب” لأنني أردت أن يجبر المتصفح على اعتبار المسافة = 0 بين الحروف. فلعلها تنفع مع مشكلته …

  10. المدني قال:

    .

    شكراً أخي مهدي . .

    فعلاً كانت مشكلة واجتها مع هذا المتصفح

    لكنني سأجرب استخدامه مرة أخرى

    .

    • مهدي قال:

      @ المدني: الحل الذي أقترحه هو ليس للمستخدمين بل للمصمين؛ لأن سبب المشكلة هو التصميم نفسه.

  11. ودّ قال:

    أشكرك.. حللت المشكلة..

  12. abgred قال:

    مهدي لم أفهم معنى المث ل، هل هو فلسطيني،؟؟؟؟
    قل لي حتى أوافيك بمقابله المغربي
    دمت بود

  13. مهدي قال:

    abgred: يعني إذا أمسكت بأذنك من الأمام ام التفت لمسكها من خلف رأسك فالنتيجة واحدة والأذن واحدة سواء امسكتها من الأمام أم من الخلف …

    في الواقع، لا أحب اللهجة العامية وتحديداً في رحلة ضَوْء، ولكن أحياناً تضطر لذلك لأن أمثالنا الشعبية أشد تعبيراً كما الصور …

  14. abgred قال:

    والله يا أخي مهدي لم يحضرني أي مثل يفيد هذا المعنى الساعة.
    لكني اهديك هذا المثل في المحبة
    ” العينين لي كيحبوك من البعيد كيشفوك”
    يعني ان العيون التي تحبك تراك ولو من بعيد….

    ترى هل يراني أحد ؟؟؟
    ولو من بعيد،،،،

  15. ميم همزة قال:

    هناك حل سريع لقراءة المواقع التي تحدث فيها هذه المشكلة:

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

    اضغط Shift مع F12 ثم اختر علامة التبويب Buttons ، واسحب الأزرار المطلوبة إلى شريط الأدوات العلوي أو السفلي.

    باختيار الخيار User Mode تكون أبطلت مفعول CSS الخاطئة مع اللغة العربية ويمكنك عندها قراءة الصفحة دون تنسيقات CSS.

  16. متصفح الأوبرا الأفضل من وجهة نظري. عيبه الوحيد هو إظهار الحروف العربية مقطعة في بعض الصفحات.
    والحمد لله قمت بحل هذه المشكلة اليوم ، لمن يهتم http://gouhary.com/blog/?p=343

أضف تعليقاً

سياسة نشر التعليقات:

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

 




Spam Protection by WP-SpamFree

© 2010 | رحلة ضَوْء (ر.ض.)، جميع الحقوق محفوظة – لا يجوز إعادة النشر (النقل).

فيسبوك تويتر قناة رحلة ضَوْء