تقديم النص: كم هو معقد؟ اتضح أن التحدي لا يصدق! بقدر ما أعرف ، حرفيًا لا يوجد نظام يعرض النص "تمامًا". في مكان ما أفضل ، في مكان ما أسوأ.
افترض أنك تريد نصًا اعتباطيًا به خطوط وألوان وأنماط اعتباطية ، مع دعم التفاف النص وتمييز النص. في الواقع ، هذه هي الحد الأدنى لمتطلبات العرض الصحيح للنصوص المعقدة ، ونافذة النهاية ، وصفحة الويب ، إلخ.
بشكل عام ، دعنا نقول على الفور: لا توجد إجابات صحيحة متتالية ، كل شيء أكثر أهمية بكثير مما تعتقد ، وكل شيء يؤثر على كل شيء آخر.
سنناقش موضوعات ليست موحدة ضمن مفهوم واحد ، فهذه مجرد قضايا واجهتني خلال عدة سنوات من العمل على تقديم النص في Firefox. على سبيل المثال ، لن نناقش بمزيد من التفصيل مشاكل تجزئة النص أو إدارة المكتبات النصية المختلفة لنظام أساسي معين ، حيث أنني لست مهتمًا بهذا الأمر.
1. المصطلحات
طبيعة النص معقدة ، واللغة الإنجليزية تنقل بشكل سيء جميع الفروق الدقيقة. بالنسبة إلى هذا المستند ، سأحاول الالتزام بالشروط التالية. يرجى ملاحظة أن هذه الكلمات "غير صحيحة" ، أجدها مفيدة لنقل المفاهيم الأساسية للمتحدثين باللغة الإنجليزية الذين ليس لديهم خبرة في اللغويات.
الحروف (الحروف):
- العددية (العددية): عددي Unicode ، "أصغر وحدة" في Unicode (وهو أيضًا نقطة رمز).
- الحرف: كتلة موسعة للرموز يونيكود (EGC) ، "أكبر وحدة" في يونيكود (يحتمل أن تتكون من عدة مقاييس).
- Glyph (glyph): الوحدة الذرية للتقديم الموضحة بخط. عادة ما يكون له معرف فريد في الخط.
- Ligature: حرف رسومي يتكون من العديد من الأرقام القياسية وربما حتى عدة أحرف (يمكن أن تمثل المتحدثين الأصليين حرفًا كعدد أحرف ، لكن بالنسبة للخط ، يكون حرفًا واحدًا فقط).
- رموز تعبيرية: "بالألوان الكاملة" الصورة الرمزية.
الخطوط (الخطوط):
- الخط: مستند يعين الحروف إلى حروف رسومية.
- الكتابة / الكتابة (نص): مجموعة من الحروف الرسومية التي تشكل لغة معينة (الخطوط ، كقاعدة عامة ، تقوم بتنفيذ نصوص معينة).
- خط مكتوب بخط اليد (مخطوطة مخطوطة): أي خط تلمس فيه الحروف الرسومية وتتدفق إلى بعضها البعض (على سبيل المثال ، العربية).
- اللون: قيم RGB و alpha للخطوط (غير مطلوبة لبعض حالات الاستخدام ، ولكن هذا مثير للاهتمام).
- النمط: المعدلات الغامقة والمائلة للخطوط (في التطبيقات العملية ، التلميح ، الأسماء المستعارة والإعدادات الأخرى عادة ما يتم توفيرها).
2. هل يعتمد الأسلوب والتخطيط والشكل على بعضهما البعض؟
فيما يلي ملخص موجز لإعطائك فكرة عن كيفية عمل خط أنابيب تقديم النص النموذجي:
- الأسلوب (تحليل العلامات ، نظام الاستعلام عن الخطوط).
- تخطيط (تقسيم النص إلى خطوط).
- تشكيل ، تشكيل (حساب الحروف الرسومية ومواقعها).
- تنقيط الحروف الرسومية المطلوبة على نسيج أطلس / ذاكرة التخزين المؤقت).
- تكوين (نسخ الحروف الرسومية من الأطلس إلى الموضع المطلوب).
لسوء الحظ ، هذه الخطوات ليست بسيطة كما قد تبدو.
معظم الخطوط لا تنتج بالفعل كل الحروف الرسومية الممكنة عند الطلب. هناك العديد من الحروف الرسومية ، لذلك عادة ما تنفذ الخطوط حرفًا معينًا فقط. عادةً ما لا يعرف المستخدمون النهائيون هذا أو لا يهتمون به ، لذلك يجب أن
يتطابق النظام الموثوق مع الخطوط الأخرى إذا لم تتوفر الأحرف.
على سبيل المثال ، على الرغم من أن ترميز النص التالي لا
يتضمن خطوطًا متعددة ، إلا أنه ضروري للتقديم السليم على أي نظام: hello
मनी ب بسم 好. لذلك نحن نقترب بشكل خطير من حقيقة أن الخطوة 1 (الأسلوب) تبدأ في الاعتماد على الخطوة 3 (تشكيل)!
(بدلاً من ذلك ، يمكنك
اتباع نهج Noto واستخدام خط Uber واحد يحتوي على جميع الأحرف. على الرغم من ذلك ، لا يمكن للمستخدمين تخصيص الخط ، ولا يمكنك توفير واجهة نصية "أصلية" للمستخدمين على جميع الأنظمة الأساسية. ولكن لنفترض أنك بحاجة إلى موثوقية أكثر الحل).
وبالمثل ، بالنسبة للتخطيط ، فأنت بحاجة إلى معرفة مقدار المساحة التي يأخذها كل جزء من النص ، ولكن هذا يصبح معروفًا فقط بعد التشكيل! هل تعتمد الخطوة 2 على نتائج الخطوة 3؟
ولكن في الشكل ، تحتاج إلى معرفة التصميم والأناقة ، لذلك يبدو أننا عالقون. ماذا تفعل؟
أولا ، تطبيق الأسلوبية غش. على الرغم من أننا نريد
حقًا الحصول على رموزًا كاملة ، إلا أن
العددية كافية للتصميم. إذا كان الخط لا يدعم الكتابة بشكل صحيح ، فلن يدعي أنه يعرف أي شيء عن مقاييس تلك الكتابة. وبالتالي ، يمكنك بسهولة العثور على الخط "الأفضل" كما يلي:
لكل رمز (EGC) في نصنا ، نقوم باستجواب كل خط في القائمة (تتالي) ما إذا كانت جميع المقاييس التي تشكل هذا الرمز معروفة لها. إذا كان الأمر كذلك ، استخدمها. إذا وصلنا إلى نهاية القائمة دون أي نتيجة ، فسوف نحصل على التوفو (
، مفقود مؤشر الصورة الرمزية).
ربما كنت قد رأيت بالفعل مثل هذا المؤشر عند لقائه مع رموز تعبيرية! نظرًا لأن بعض الرموز التعبيرية هي في الواقع حروف مركبة للعديد من الرموز التعبيرية البسيطة ، يمكن أن يشير الخط إلى دعم الشخصية بإصدار مكونات فردية فقط. بهذه الطريقة
قد تبدو حرفيا مثل
إذا كان الخط "قديم جدًا" للتعرف على الرباط الجديد. يمكن أن يحدث هذا أيضًا إذا كان لديك تطبيق Unicode "قديم جدًا" لا يعرف الطابع الجديد ، مما يضطر نظام النمط إلى قبول مثل هذه المطابقة الجزئية.
لذلك ، نحن الآن نعرف بالضبط الخطوط التي سوف نستخدمها ، دون الحاجة إلى الرجوع إلى التنسيق أو النموذج (على الرغم من أن الشكل يمكن أن يغير ألواننا ، وأكثر في ذلك في الأقسام التالية). هل يمكن أن نتعامل بالمثل مع ترابط التصميم والشكل؟ لا! تمنحك أشياء مثل فواصل الفقرات فاصلًا صارمًا ، لكن الطريقة الوحيدة للتشكيل هي من خلال التشكيل التكراري!
من الضروري افتراض أن النص قد تم وضعه على سطر واحد ، وشكل هذا السطر حتى تنفد المساحة. في هذه المرحلة ، يمكنك إجراء عمليات التنضيد ومعرفة أين يمكن كسر النص وبدء السطر التالي. كرر حتى يتم كل شيء.
3. النص ليس أحرف منفصلة
إذا حكمنا من خلال اللغة الإنجليزية فقط ، فقد تعتقد أن الحروف المركبة هي نوع من الهراء الغريب. أعني ، من يهتم
حقًا بأن "æ" مكتوبة "ae"؟ لكن اتضح أن بعض اللغات تتكون بشكل أساسي من الحروف المركبة. على سبيل المثال ، يتكون ड् ب بسم من الأحرف الفردية «ب ب س م. في أي نظام لتقديم نص متقدم (أي في أي من المتصفحات الرئيسية) ، سيبدو هذان السطرين مختلفين
للغاية .
و لا: لا يتعلق الأمر بالفرق بين عدديات Unicode ومجموعات grapheme الممتدة. إذا طلبت نظام Unicode موثوق (على سبيل المثال ، Swift) لإعطاء مجموعات من الرسوم البيانية الموسعة لهذا الخط ، فسوف يقدم هذه الأحرف الخمسة!
يعتمد شكل الحرف على جيرانه:
لا يمكن للنص عرض حرف بعد حرف بشكل صحيح .
وهذا هو ، يجب عليك استخدام مكتبة تشكيل. معيار الصناعة هنا هو
HarfBuzz ، ومن الصعب للغاية حل هذه المهام بمفردك. لذلك استخدم HarfBuzz.
3.1. تراكب النص
في الخطوط المكتوبة بخط اليد ، تتداخل الحروف الرسومية غالبًا لتجنب اللحامات ، وقد يتسبب ذلك في حدوث مشكلات.
لنلقي نظرة أخرى على मनी م منش. هل تبدو طبيعية؟ زيادة الآن:
لا يزال يبدو جميلًا ، لكن لنجعل النص شفافًا جزئيًا. إذا كنت تستخدم Safari أو Edge ، فقد يبدو النص جيدًا! ولكن في Firefox أو Chrome ، يكون العرض فظيعًا:
المشكلة هي أن Chrome و Firefox يحاولان
الغش . قاموا بتشكيل النص بشكل صحيح ، ولكن بمجرد أن يواجهوا مثل هذه الحروف الرسومية ، ما زالوا يحاولون رسمها بشكل منفصل. هذا عادة ما يعمل بشكل جيد ، إلا عندما يكون هناك شفافية وتداخل ينتج عنه مثل هذا التعتيم.
سيؤدي التنفيذ "الصحيح" إلى نقل النص إلى سطح مؤقت
دون شفافية ، ثم إلى المشهد بشفافية. لا يقوم كل من Firefox و Chrome بذلك لأنه مكلف ولا يحتاج عادة إلى اللغات الغربية الرئيسية. ومن المثير للاهتمام ، أنهم يفهمون المشكلة حقًا ، لأنهم يعالجون على وجه التحديد مثل هذا البرنامج النصي للرموز التعبيرية (لكننا سنعود إلى هذا لاحقًا).
3.2. أسلوب يمكن أن يغير الرباط
حسنًا ، هذا المثال نقوم بتحليله
بشكل أساسي بدافع الفضول حول كيفية كسر العلامات ، على الرغم من أنني لا أعرف أي سيناريوهات معقولة حيث يمكن أن تؤذيها حقًا. فيما يلي نصان لهما نفس المحتوى لكنهما مختلفان:
إليك ما تبدو عليه في Safari:
هذا هو ما يبدو عليه في Chrome (عند استخدام
تطبيق نموذج بالحجم الطبيعي الجديد ):
وها هم في فايرفوكس:
باختصار:
- سفاري غير كافية
- يقوم Chrome بتوزيع الحروف الرسومية ولكنه يسقط العديد من الألوان
- يوزع Firefox في نفس الوقت الحروف الرسومية ويعرض الألوان
أعتقد أن الجميع يجب أن يكونوا على Firefox ، أليس كذلك؟ ولكن إذا قمت بالتكبير ، سنرى أنه يقوم بشيء غريب للغاية:
لقد قام ببساطة بتقسيم هذا الرباط إلى أربعة أجزاء متساوية بألوان مختلفة!
المشكلة هي أنه لا توجد إجابة معقولة عما
يجب القيام به هنا. لقد قسمنا الرباط إلى أنماط مختلفة ، وبما أن الرباط هو ، إلى حد ما ، "وحدة" للتجسيد ، فمن المنطقي ببساطة رفض دعم هذا الفصل (كما يفعل معظمهم).
لسبب
ما ، كان
شخص ما في Firefox متحمسًا حقًا لتنفيذ تطبيق أكثر أناقة . منهجه هو رسم الرباط عدة مرات مع أقنعة مثالية وألوان مختلفة ، والتي تعمل بشكل جيد بشكل مدهش!
هناك
بعض الإحساس بمحاولة دعم هذه "الحروف المركبة الجزئية": يمكن فقط للشكل أن يعرف ما إذا كان سيتم عرض رابط معين ، وهذا يعتمد على خطوط النظام ، لذلك قد تظهر الحروف حيث لم يتوقعها أحد! مثال اللغة الإنجليزية الكلاسيكية هو رابط - من خط مثبت من قبل المستخدم على حد الارتباط التشعبي.
من الغريب أيضًا أن اللغة الإنجليزية يمكن أن تتغير في منتصف الكلمة ، لكن لا تستطيع الخطوط المكتوبة بخط اليد؟
لا تسأل حتى عن الكود الذي يكسر الخطوط ذات الحروف المركبة.
4. الرموز التعبيرية كسر اللون والاسلوب
إذا قمت بعرض الرموز التعبيرية كما يفعل النظام الأصلي ، فستحتاج إلى تجاهل إعدادات لون النص (باستثناء الشفافية):
عادةً ما يكون للرموز التعبيرية ألوانها الأصلية الخاصة ، وقد يكون لهذا اللون معنى دلالي ، كما هو الحال مع معدِّلات لون البشرة. وعلاوة على ذلك: يمكن أن يكون لها عدة ألوان!
بقدر ما أستطيع أن أقول ، لم يكن هناك مشكلة من هذا القبيل قبل الرموز التعبيرية ، لذلك منصات مختلفة لها طرق مختلفة لحلها. يُظهر البعض الرموز التعبيرية كصورة صلبة (Apple) ، بينما يُظهر البعض الآخر
سلسلة من الطبقات أحادية اللون (Microsoft).
النهج الأخير ليس سيئًا ، لأنه يتكامل بشكل جيد مع خطوط أنابيب تقديم النص الحالية ، "فقط" يقسم الحروف الرسومية إلى سلسلة من الحروف الرسومية أحادية اللون التي اعتاد الجميع التعامل معها.
ومع ذلك ، فهذا يعني أنه عند رسم حرف رسومي "فردي" ، فقد يتغير
نمطك مرارًا وتكرارًا . وهذا يعني أيضًا أن الصورة الرمزية "one" يمكن أن تتداخل مع نفسها ، مما يؤدي إلى مشاكل الشفافية المذكورة في القسم السابق. ومع ذلك ، تجمع المتصفحات بشكل صحيح شفافية الطبقات في الرموز التعبيرية!
يمكن تفسير هذا التناقض بثلاث طرق:
- أنت تبحث بالفعل عن رموزًا ملونة لمعالجتها بطريقة خاصة ، لذلك من السهل عليهم اختيار مسار تخطيط خاص.
- تبدو الخطوط المكتوبة بخط اليد ذات الشفافية الضعيفة قبيحة بعض الشيء ، لكن الرموز التعبيرية تتعطل تمامًا وتتحول إلى مجموعة أحرف غير مقروءة ، لذلك فإن العمل الإضافي له ما يبرره.
- يهتم المطورون الغربيون برعاية الرموز التعبيرية أكثر من اللغات مثل العربية والمهاراتية.
اختر الخيار لذوقك.
وحتى الآن ، كيفية تسليط الضوء على التعبيرات المائلة أو جريئة؟ تجاهل هذه الأنماط؟ يجب أن توليفها؟ من يعرف ...
أيضا ، لا تبدو هذه الرموز التعبيرية صغيرة بشكل غريب؟
نعم ، لسبب ما ، تعمل مجموعة من الأنظمة سراً على زيادة حجم الخط لإيموجيس لجعلها تبدو أفضل.
5. تجانس هو الجحيم
الأحرف في النص صغيرة جدًا ومفصلة. من المهم جدًا أن يكون النص سهل القراءة. يبدو وكأنه مهمة تجانس! الجحيم ، 480p هو قرار حقا منخفضة. أكثر تنعيم!
لذلك ، هناك نوعان رئيسيان:
- تدرج الرمادي
- تجانس البكسل الفرعي
تجانس درجات الرمادي هو نهج "طبيعي". الفكرة الأساسية هي أن وحدات البكسل المطلية جزئيًا تحصل على شفافية جزئية. أثناء التكوين ، سيؤدي ذلك إلى الحصول على التدرج المناسب للبكسل ، مما يحسن التفاصيل الإجمالية.
يستخدم المصطلح "ظلال رمادية" للون أحادي البعد ، تمامًا مثل شفافية أحادية البعد (وإلا يتم عرض الحروف الرسومية بلون واحد). بالإضافة إلى ذلك ، في الحالة المعتادة للنص الأسود على خلفية بيضاء ، فإن الحواف التعرجية تعرض حرفيًا ظلال رمادية على الحواف.
Subpixel anti-aliasing عبارة عن خدعة تنتهك الموضع الطبيعي لوحدات البكسل على الشاشات. الأمر أكثر تعقيدًا ، لذا إذا كنت مهتمًا حقًا ، فسيتعين عليك قراءة وثائق أكثر تفصيلًا ، فيما يلي مجرد وصف موجز للمفهوم الرفيع المستوى.
البيكسلات في شاشتك هي في الواقع ثلاثة أعمدة صغيرة من الأحمر والأخضر والأزرق. إذا كنت ترغب في الحصول على اللون الأحمر ، فأنت تقول "أسود أبيض أسود". بنفس الطريقة ، إذا كنت ترغب في الحصول على لون أزرق ، فحدد "أسود أسود أبيض". بمعنى آخر ، إذا كنت العبث بالزهور ، فيمكنك
زيادة الدقة الأفقية
إلى ثلاثة أضعاف والحصول على مزيد من التفاصيل!
قد تعتقد أن مثل هذا "قوس قزح" سيكون قبيحًا للغاية ، ولكن من الناحية العملية ، يعمل النظام جيدًا (على الرغم من أن البعض يختلف مع هذا). العقل البشري يحب التعرف على الأنماط وتنعيمها. ومع ذلك ، إذا قمت بالتقاط لقطة شاشة للنص مع تجانس البكسل الفرعي ، فسترى بوضوح كل الألوان الإضافية إذا قمت بتغيير حجم الصورة أو مجرد إلقاء نظرة عليها على الشاشة مع تخطيط مختلف للبكسل الفرعي. هذا هو السبب في أن لقطات الشاشة التي تحتوي على نص غالباً ما تبدو غريبة وسيئة للغاية.
(بشكل عام ، يعني هذا النظام أيضًا أن لون الأيقونة يمكنه تغيير حجمها ومكانتها المتصورة ، وهو أمر مزعج حقًا).
لذا ، فإن مكافحة البكتيريا الفرعية هي اختراق نظيف حقًا يمكنه تحسين وضوح النص بشكل رائع! ولكن ، لسوء الحظ ، هذا هو أيضا منشقة ضخمة في الحمار!
لاحظ أن
تحولات الحرف الرسومي الفرعي تحدث في أي نظام لمكافحة التعرج. تريد دائمًا قطع الحروف الرسومية المنقطة إلى وحدات بكسل كاملة ، ولكن يتم تصميم التنقيط نفسه لإزاحة بكسل فرعية محددة (قيمة بين 0 و 1).
لفهم هذا ، تخيل مربعًا أسودًا 1 × 1 مع تجانس تدرج الرمادي:
- إذا كانت إزاحة البكسل الفرعي الخاص بها تساوي 0 ، فسيخرج بكسل أسود فقط أثناء التنقيط.
- إذا كانت إزاحة البكسل الفرعي 0.5 ، فعندما يتم تنقيطها ، يتم إنتاج بيكسلتين بلون رمادي بنسبة 50٪.
5.1. إزاحة البكسل الفرعي كسر ذاكرة التخزين المؤقت glyph
يتطلب تنقيط الحروف الرسومية مقدارًا مذهلاً من الحساب ، لذلك من الأفضل تخزينها مؤقتًا في أطلس نسيج. ولكن كيفية تخزين القوام مع إزاحة البكسل الفرعي؟ كل إزاحة له تنقيط فريد من نوعه!
تحتاج هنا إلى إيجاد حل وسط بين الجودة والأداء ، ويمكن القيام بذلك عن طريق تحسين إزاحة البكسل الفرعي. بالنسبة للنص الإنكليزي ، فإن الرصيد المعقول هو الافتقار إلى دقة البكسل الفرعي الرأسي مع الإزاحة الأفقية المرتبطة بربع عدد صحيح. هذا يترك أربعة مواضع بكسل فقط ، والتي لا تزال تحسن بشكل كبير الجودة مع الحفاظ على حجم ذاكرة التخزين المؤقت معقول.
5.2. لا يمكن أن يكون تجانس البكسلات الفرعية مركبًا
ميزة واحدة لطيفة من مكافحة التعرجات في ظلال رمادية هي أنه يمكنك اللعب بحرية معها ، ويتحلل برشاقة. على سبيل المثال ، إذا قمت بتحويل نسيج بنص (تحجيم ، تدوير ، أو تحويل) ، فقد يصبح ضبابيًا قليلاً ، لكنه سيبدو طبيعيًا بشكل عام.
إذا كنت تفعل الشيء نفسه مع subpixel anti-aliasing ، فستبدو فظيعة. فكرته كلها هي معالجة البيكسلات على الشاشة. إذا كانت بكسلات العرض لا تتطابق مع بكسلات نسيجك ، فستكون الحواف الحمراء والزرقاء مرئية بوضوح!
قد تعتقد أن هذا "ثابت" ببساطة عن طريق تنقيط الصورة الرمزية الجديد في موقع جديد. وبالفعل ، إذا كان التحويل ثابتًا ، فقد ينجح هذا. ولكن إذا كان التحول عبارة عن
رسوم متحركة ، فسوف يزداد الأمر سوءًا. : , ,
, .
, , ( ). , JS, «».
بالإضافة إلى ذلك ، من الصعب استخدام تجانس البكسل الفرعي في وجود شفافية جزئية. في الواقع ، نحن هنا نقوم بتكوين قنواتنا R و G و B لتشفير ثلاث قيم شفافية (واحدة لكل بكسل فرعي) ، ولكن النص نفسه يحتوي أيضًا على لون وخلفية ، لذلك يتم فقد المعلومات بسهولة.عند استخدام تدرج اللون الرمادي ، لدينا قناة ألفا مخصصة ، لذلك لا يتم فقد أي شيء. وبالتالي ، عادة ما تستخدم المتصفحات ظلال رمادية للعمل مع كائنات شفافة.... ما عدا فايرفوكس. مرة أخرى ، في هذه المنظمة الغريبة ، قام شخص ما بالارتياح وفعل شيئًا معقدًا: مكون ألفا. لقد اتضح أنه يمكنك بالفعل تأليف النص بشكل صحيح باستخدام البيكسل الفرعي لمنع التعرجات ، ولكن هذا يتطلب ثلاث قنوات شفافية إضافية لكل من R و G و B. وليس من المستغرب أن يضاعف هذا التعرج استهلاك الذاكرة.لحسن الحظ ، على مر السنين ، أصبح تجانس البكسل الفرعي أقل أهمية:- شاشات شبكية العين لا تحتاج إليها على الإطلاق.
- يمنع تخطيط البكسل الفرعي على الهواتف هذه الخدعة (بدون عمل جاد).
- في الإصدارات الأحدث من نظام التشغيل MacOS ، يتم تعطيل نص البكسل الفرعي افتراضيًا على مستوى نظام التشغيل.
- يبدو أن Chrome أكثر عدوانية في تعطيل مكافحة التعرجات في البكسل الفرعي (لست متأكدًا مما إذا كانت هذه هي السياسة المحددة).
- تخلت الواجهة الخلفية الرسومية الجديدة من فايرفوكس (webrender) عن عنصر ألفا للبساطة.
6. مقصور على فئة معينة
هذا الجزء هو مجرد مجموعة من الأشياء الصغيرة التي لا تستحق الكثير من النقاش.6.1. قد تحتوي الخطوط على SVG
أن تمتص. يتم توفير هذه الخطوط في الغالب بواسطة Adobe ، لأنهم دخلوا SVG جيدًا منذ بعض الوقت. في بعض الأحيان ، يمكنك ببساطة تجاهل أجزاء من SVG (أعتقد أن الخط Source Code Pro يحتوي تقنياً على بعض رموز SVG ، لكن في الممارسة العملية لا يتم استخدامها فعليًا بواسطة مواقع الويب) ، ولكن بشكل عام سيتعين عليك تطبيق دعم SVG لدعم جميع الخطوط بشكل رسمي.هل سمعت عن الخطوط المتحركة SVG ؟ لا؟ حسنا.
أعتقد أنها إما مكسورة أو غير مطبقة في كل مكان (فايرفوكس دعمها عن طريق الخطأ لبعض الوقت بسبب نوع من المطور المتحمس).6.2. شخصيات يمكن أن تكون لعنة كبيرة
إذا كنت ترغب في تلبية طلب المستخدم بسذاجة للحصول على خط كبير جدًا (أو مستوى تكبير / تصغير كبير جدًا) ، فستواجه مشكلات بالغة في إدارة الذاكرة لأطلس رسومية بهذا الحجم ، حيث يمكن أن يكون كل حرف أكبر من الشاشة بأكملها. هناك عدة طرق للتعامل مع هذا:- رفض رسم حرف رسومي (مستخدم حزين).
- تنقيط الصورة الرمزية في حجم أصغر وزيادة المقياس أثناء التكوين (هذا أمر سهل ، ولكن أشكال طمس على الحواف).
- تنقيط الصورة الرمزية مباشرة على السطح بعد التكوين (صعبة ، ومكلفة المحتملة).
6.3. التحديد ليس إطارًا ، لكن النص ينتقل في كل الاتجاهات
يعرف الأشخاص عادة أن الاتجاه الرئيسي للنص يمكن أن يكون من اليسار إلى اليمين (الإنجليزية) ، من اليمين إلى اليسار (العربية) ، أو من الأعلى إلى الأسفل (اليابانية).لذلك ، إليك نص مضحك لك:مرحبا بالجميع بسم الله لا beep beep !!
إذا حددت نصًا على سطح المكتب باستخدام الماوس من اليسار إلى اليمين ، يصبح التحديد متقطعًا وخلطًا غريبًا بطريقة ما في المنتصف. هذا لأننا نمزج النص في سطر واحد من اليسار إلى اليمين ومن اليمين إلى اليسار ، وهو ما يحدث طوال الوقت.أولاً ، يؤدي التحديد إلى اليمين إلى زيادة التحديد ، ولكنه يقلله حتى يبدأ في الزيادة مرة أخرى بشكل مفاجئ. هذا صحيح تمامًا: لا يزال الاختيار مستمرًا على السطر الفعلي . وبالتالي ، يمكنك نسخ جزء من النص بشكل صحيح.يجب أن تأخذ ذلك في الاعتبار في الكود الخاص بك لتمييز النص ، وكذلك في خوارزمية فاصل الأسطر للتخطيط.لكن هذا ليس كل شيء.
آمل ألا يكون عليك التعامل مع مثل هذه الأشياء.6.4. كيف تكتب ما هو مستحيل أن تكتب؟
عند عدم وجود أحرف في الخط ، سيكون من الجيد إعلام المستخدم بذلك. الصورة الرمزية "التوفو" مخصصة لهذا الغرض. يمكنك ببساطة رسم التوفو الفارغ (المستطيل) وتقييد نفسك بذلك. ولكن إذا كنت تريد تقديم معلومات مفيدة حقًا ، يمكنك كتابة قيمة الحرف المفقود لتبسيط تصحيح الأخطاء.ولكن مهلا ، نستخدم النص لشرح أنه لا يمكننا إخراج النص؟ هم.
يمكنك أن تقول أنه يجب أن يكون هناك خط أساسي في النظام يعرض دائمًا الأحرف من 0 إلى 9 و AF ، ولكن هذا هو الافتراض بالنسبة إلى wimps. إذا قام المستخدم بتدمير أدواته بالفعل باستخدام أدواته ، فإن Firefox يوفر مخرجًا: خط صغير!يوجد داخل Firefox مجموعة صغيرة مشفرة من الفن ذي البيكسل الواحد مع أطلس صغير يتألف من 16 حرفًا بالضبط. لذلك عند رسم التوفو يمكنه إعادة توجيه هذه الأحرف دون القلق بشأن الخطوط.
6.5. النمط جزء من الخط (ما لم يكن كذلك)
والأصل المضمنة الخطوط ذات جودة عالية مع أنماط مثل مائل و جريئة ، لأنه لا يوجد طريقة حسابي بسيط جميل أن نستنتج من هذه الآثار.ومع ذلك ، تأتي بعض الخطوط بدون هذه الأنماط ، لذلك لا تزال بحاجة إلى طريقة حسابية بسيطة لإجراء هذه التأثيرات.يعتمد الكشف الدقيق للأنماط ومعالجتها اعتمادًا كبيرًا على النظام وخارج مجال خبرتي ، لذلك لا يمكنني شرحه جيدًا. أود فقط الخوض في رمز التعامل مع الخطوط في Webrender .في أي حال ، تحتاج إلى احتياطي الاصطناعية . لحسن الحظ ، فإن التنفيذ بسيط للغاية:المائل الاصطناعية: إمالة كل حرف رسومي.غامق اصطناعي: ارسم كل حرف رسومي عدة مرات مع إزاحة بسيطة في اتجاه النص.بصراحة ، هذه الأساليب تعمل بشكل جيد! لكن قد يلاحظ المستخدمون أن كل شيء يبدو "خطأ". لذلك ، يمكنك أن تفعل أفضل إذا بذلت جهدا.6.6. لا يوجد نص مثالي
كان لكل منصة أخطاءها ، والتحسينات ، والمراوغات لفترة طويلة حتى أصبحت جماليات. لذلك ، حتى لو كنت تعتقد اعتقادا راسخا أن بعض الأشياء مثالية أو مهمة ، سيكون هناك دائما مجموعة كبيرة من المستخدمين مع تفضيلات مختلفة. يدعم نظام التصور القوي للنص هذه التفضيلات المختلفة (عند اختيار الإعدادات الافتراضية المعقولة).يجب أن تأخذ التكوينات الخاصة بك في الاعتبار نظام المستخدم والخطوط المحددة والتطبيقات المحددة والنصوص المحددة. يجب أيضًا محاولة مطابقة "المظهر" الأصلي لكل منصة (مثل المراوغات).وهذا يشمل:- القدرة على تعطيل البكسل الفرعي لمكافحة التعرجات (بعضها يكرهها حقًا).
- القدرة على إيقاف أي مكافحة التعرجات (نعم ، الناس يفعلون ذلك).
- الكثير من الخصائص الخاصة بالنظام / التنسيق مثل التلميح والتمليس والاختلافات وجاما ، إلخ.
وهذا يعني أيضًا أنه يجب استخدام مكتبات النصوص الأصلية لمطابقة جماليات كل نظام (Core Text و DirectWrite و FreeType على الأنظمة الأساسية الخاصة بكل منها).7. روابط إضافية
فيما يلي بعض المقالات الإضافية حول النص الذي يعرض الكابوس: