10 قواعد الطباعة على شبكة الإنترنت كل مصمم يجب أن يعرف
عندما يزور أحدهم موقعًا إلكترونيًا قمت بتصميمه ، فإن الاحتمالات هي أنهم لا يهتمون كثيرًا بالألوان أو الصور أو الأصوات ، فهم يبحثون على الفور في النص.
بغض النظر عن عدد الأجراس والصافرات التي قمت بإنشائها في موقع ويب ، يعتمد الجميع على النص لإنجاز أي شيء يزورون الموقع للقيام به .
هذا وحده يجب أن يجعل الطباعة ، فن ترتيب النوع ، أولوية لأي مصمم ويب.
في هذه المقالة ، نلقي نظرة على 10 قواعد سهلة يجب مراعاتها عند تصميم مشروع الويب التالي.
1. اقرأ النص بنفسك
مع تصميم مثل JonesingFor كان مصمما دون فهم كبير من النص كافح لوضع الخطوط المطبوعة التي تجعل هذا الموقع يعمل حقا. أثناء معالجة الطباعة الخاصة بك ، ربما لا داعي للقلق بشأن كتابة نص الموقع - ولكن عليك قراءته!
يعتقد بعض مصممي الويب أن مجرد نسخ ولصق ملف نصي يشكل إجمالي واجباتهم النصية. ولكن القراءة من خلال النص توفر فكرة أساسية على الأقل حول كيفية دمج النص في موقع ويب ، مع تجنب الفصل بين كتابة وتصميم موقع الويب.
يمكنك ركلة الطباعة الخاصة بك حتى درجة أخرى ، إذا كنت تستطيع قراءة النص عندما يكون في مكان في التصميم الخاص بك. ضع ملاحظة خاصة حول المساحة حول الحروف . هل لديك أي مساحات كبيرة غير عادية تبدو غريبة؟ يمكن للطباعة حذرا قليلا القضاء على هذه القضايا. يمكنك أيضًا الحصول على فكرة عن الخطوط التي قد تكون طويلة جدًا بحيث لا يمكن قراءتها بسهولة ، أو فواصل الأسطر غير الملائمة ، والمشكلات المشابهة.
2. تفريغ أبجد هوز في أقرب وقت ممكن
هل تعتقد أنك يمكن أن تصمم موقع يسوع رودريغيز فيلاسكو بدون النص الفعلي؟ يعتمد الموقع بشكل كبير على الكلمة المكتوبة - وكلمات محددة جدًا أيضًا. حتى نص النصّ حظي باهتمام خاصّ مع غطاء قطرة وبعض التغيير والتبديل الآخر الذي فقط ما كان ممكن مع Lorem ipsum.
ما لم يكن نص موقع الويب الخاص بك هو بالفعل أبجد هوز ، لن يحمل النص الوهمي أي تشابه مع الشيء الحقيقي . وهذا يعني أن أي قرص قد تصنعه للنص - أو التصميم المحيط به - سيتعين عليه الانتظار حتى تحصل على الشيء الحقيقي. إن طلب النص (والحصول عليه) من العميل في أقرب وقت ممكن في العملية سوف يعطيك القدرة على مطابقة التصميم العام والطباعة.
3. إظهار تسلسل هرمي واضح
عندما تصل ريك كات للصناعات ، تعرف على الفور من أين يجب أن تبدأ القراءة. على الرغم من وجود عدد قليل من الروابط في أعلى الصفحة ، فإن Rik مرحبًا بك أولاً. إنها أكبر بكثير ، باستخدام الطباعة لإنشاء تسلسل هرمي واضح .
يحتاج كل موقع إلى تسلسل هرمي متطور: مؤشرات حول من أين تبدأ في البدء في القراءة وكيفية المضي قدمًا. يمكن أن تقدم طباعتك هذا التسلسل الهرمي - تمامًا كما يفعل ريك - طالما أنك تعرف ترتيبك الهرمي في وقت مبكر. من خلال التفكير في الحجم والحروف ، يمكنك تسليط الضوء على جزء من النص كعنوان رئيسي بطريقة لا يمكن لموضع مختلف في التصميم تقديمها.
إن التسلسل الهرمي للتصميم الخاص بك يتجاوز مجرد الطباعة التي تستخدمها ، بالطبع ، ولكن نظرًا لأن المستخدمين دائمًا يبدأون بالنص ، فمن المنطقي أن يفعل المصممون نفس الشيء.
4. الالتفات إلى كل من الطباعة الكلية والجزئية
الاعتماد كليا على الطباعة لصفحتها الأولى ، و كراولي ويب و Associate’s تم تصميم الموقع مع اثنين من العوامل في الاعتبار: كل من الطباعة الكلية والجزئية .
الطباعة الشاملة هي البنية العامة لنوعك ، وكيف تظهر في سياق تصميمك وجماليته عندما تفكر في النص الخاص بك ككتلة من تلقاء نفسها.
تهتم الطباعة الدقيقة أكثر بتفاصيل المسافات ، وهي القضايا التي تحدد ما إذا كانت الكلمات سهلة القراءة. تعد الطباعة الصغرية ضرورة مطلقة عندما يتعلق الأمر بتجميع مجموعة من النصوص: إذا لم يكن الأمر مقروءًا ، فلا داعي للمضي قدمًا. تناول كرولي ويب والمنتسبين هذا السؤال من خلال الكتابة والمباعدة على حد سواء لتلك الكلمات التي سيبرزها الموقع.
إلا أن الطباعة الشاملة توفر لك فرصة لجعل النص الخاص بك أكثر اتساعًا ، فهو فرصة لجعله يبدو جذابًا وجزءًا من التصميم بأكمله . إن اختيار الخطوط والألوان على هذا الموقع الإلكتروني يؤدي إلى إنشاء مجموعة كاملة قابلة للتطبيق. تجاهل أي جانب من الطباعة هو ضار.
5. الحرص مع ألوان الكتابة
سيكون من السهل جدا أن تفقد النص في الخلفية ArtofElan ، وخاصة أحمر مشرق على تركيبة حمراء داكنة المستخدمة من قبل المصمم. عندما يعمل مصمم الويب بنوع ملون ، تكون الرعاية ضرورية للغاية ، وليس هناك أي ضمان بأن يكون اللون الأحمر على مجموعة حمراء ، أو حتى صفراء على تركيبة حمراء مرئية . بعد كل شيء ، زار الجميع موقعًا على الويب يبدو فيه النص وكأنه ظل واحد فقط من لون الخلفية وأصاب حالة من إجهاد العين عندما حاولوا قراءته.
الحل الأسهل لهذا الموقف هو التأكد من أن لون نوعك مختلف بشكل جذري عن لون الخلفية . تعمل بالأبيض والأسود بشكل جيد لأنها مختلفة تمامًا كما يمكنك الحصول عليها ، ولكن هناك بعض مجموعات الألوان التي تعمل بشكل جيد: شيء ما على طول خطوط زرقاء داكنة على وردي فاتح سوف ينجز المهمة. النص المقلوب صعب جدًا ... بينما يمكنك العمل باستخدام نص وردي فاتح على خلفية زرقاء داكنة ، فمن المرجح أن تحصل على شكوى بشأنه.
6. احصل على جدية حول CSS الخاص بك
إذا كان CSS قويًا ، فيمكنك التنقل بين صفحات موقعك على الويب بسلاسة ، تمامًا مثل الإصدارات المختلفة من Hutchouse.com الاعتماد على أوراق الأنماط المختلفة لخلق بعض الآثار المثيرة للإعجاب. حتى إذا كنت لا تأخذ الأشياء بقدر Hutchhouse ، يمكن أن يساعد CSS على التخلص من مشكلات الطباعة في الهواة مثل تغيير الخطوط والأحجام بين الصفحات.
يمكن أن يوفر CSS تناسقًا سهلاً بين طباعتك على مستوى موقع الويب بأكمله . إذا كنت متناسقاً في كيفية استخدامك للنوع ، إلا أن كسر هذا الاتساق حتى كمية صغيرة يمكن أن تجعل كل ما ترغب في تسليط الضوء عليه مميزًا ، تمامًا مثل إنشاء شبكة وكسرها يمكن أن يكون تصميمًا فعالاً. في الطباعة على شبكة الإنترنت ، يمكن أن يكون الحفاظ على تناسق الخطوط أمرًا بسيطًا في CSS.
7. خيط النص مركز
يمكن أن يؤدي اختيار بديل للنص المركزي إلى جعل تصميم موقع الويب سهل القراءة ، تمامًا كما هو الحال DesignCanChange.org . قد يؤدي اختيار النص المركزي ، وخاصة في صفحة مثل هذه ، إلى إنشاء صفحة معضلة: حيث يؤدي إنشاء الحواف المتعرجة على كل جانب إلى صعوبة في القراءة ، كما أن هناك الكثير من الفرص للنص المتمركز تمامًا لإحداث تشوه للباقي التصميمات الخاصة بك على شاشات مختلفة.
في بعض الدوائر ، يكون النمط المركز في خطوة واحدة فقط من استخدام Comic Sans في تصميم موقع الويب. قد تفكر في العنوان الرئيسي ، ولكن بشكل عام ، فإن محاذاة النص إلى اليسار سيجعل القراء أكثر راحة ، ما لم يقرؤوا من اليمين إلى اليسار .
8. التعامل مع الاقتباسات الذكية والرموز الأخرى
لويجي أوتاني الموقع يعرض ما الاهتمام الدقيق لعلامات الاقتباس والرموز الأخرى سوف تحصل على: نقص كامل في المشاكل عندما يعرض الموقع هذه الرموز. العديد من مواقع الويب منقطة برموز لا يمكن للمتصفح عرضها. إنه تركة من حقيقة أن معظم النص الذي يعمل عليه مصمم الويب قد يكون مكتوبًا في Microsoft Word أو أي جزء آخر من برنامج معالجة النصوص الذي يجعل كل أنواع التغييرات الطفيفة في النص دون أن يولي الكاتب الكثير من الاهتمام.
واحدة من أسوأ التغييرات عبارة عن علامات اقتباس ذكية: علامات الاقتباس المتعرجة يستبدل Word تلقائيًا علامات الاقتباس المستقيمة . تأتي منطقة أخرى من المشاكل عندما تعمل مع نص مكتوب بلغة أخرى: يمكن أن تتسبب اللهجات والأغلفة في نفس القدر من الصعوبة التي قد يواجهها برنامج Word. إذا قمت بنسخ ولصق نص مع هذه التغييرات في التصميم الخاص بك ، فستحتاج إلى الرجوع وإصلاحه لاحقًا ، على الأقل لبعض متصفحات الويب.
بدلاً من ذلك ، يمكنك الحصول عليها في وقت مبكر من عملية التصميم بحيث يمكنك التركيز على جعل النص مناسبًا بشكل أفضل مع التصميم الخاص بك . إذا كنت ترغب في ظهور هذه الرموز المميزة وعلامات الاقتباس الذكية في التصميم النهائي ، فاختر كيانات HTML الخاصة بك.
9. خطة للنص الخاص بك للحصول على أكبر
عندما تقوم بزيادة حجم النص على فيير بيتترز موقع الويب ، فهي ليست جميلة تمامًا إذا كنت تستخدم حجم الخط الذي اخترته. ومع ذلك ، لا يزال بإمكانك قراءة كل شيء وتحديد موقع الروابط وما إلى ذلك ، وهو ما ينطبق على عدد قليل جدًا من مواقع الويب.
ويرجع ذلك إلى أن العديد من المصممين يتأكدون جزئيًا من تنسيق النص بخط 10 نقاط أو حتى أصغر. معظم الناس يشعرون بالراحة عند قراءة مثل هذه الخطوط ، لكن Baby Boomers يشكلون قسمًا كبيرًا من السكان الذين يتصفحون الويب ، والكثير من متصفحي الويب المتقدمين للعمر سوف يكون لديهم متصفحاتهم مضبوطة لعرض النوع بقدر ما يستطيعون . يجب أن يكون نصك ، بالإضافة إلى التصميم الخاص بك ، قادراً على التكيف مع هذه الحقيقة.
من الجدير أيضًا أن نأخذ في الاعتبار حقيقة أن حجم المتصفح يمكن أن يختلف اختلافاً هائلاً ، مما يؤدي إلى نقل النص إلى مواقع غير متوقعة إذا لم تكن حذراً. إذا كان الارتطام بالحجم لأعلى نقطة يخلق مشاكل ، فسينتقل الديموغرافي الأقدم إلى موقع الويب التالي بسرعة. إن التمرير إلى الأبد إلى الجانب سيكون له نتيجة مشابهة.
10. إظهار تفضيل لـ sans serif
إذا نظرت إلى A List Apart يتم تعيين موقع الويب ، إلى حد كبير كل كتلة كبيرة من النص في محرف sans serif ، مما يجعلها أسهل للقراءة. يتم وضع العناوين والكتل الصغيرة الأخرى من النص في الخطوط serifed ، وخلق توازن بين الاثنين.
عندما يتعلق الأمر بوضع النص على الشاشة ، فإن خطوط sans serif تكاد تكون دائمًا أفضل رهان ، خاصة إذا اخترت خطًا مثل Verdana تم تصميمه للعرض على شاشة الكمبيوتر. تتميز الخطوط المشذرة بفرصة أكبر للعرض بشكل سيئ ، بحيث تصبح ضبابية أو حتى متقطعة.
ليس من الممكن تجنب الرقيق تماما ، بالطبع. ولكن بالنسبة للكتل الكبيرة من النص بشكل خاص ، يمكن أن يوفر استخدام خط بدون أحرف خطية مستوى إضافي من الضمانة بحيث يتمكن الزوار من قراءة نص الموقع بسهولة. عندما تقوم باختيار الخطوط لمشروع ، ابحث من خلال خيارات sans serif أولاً .
تعليق نهائي
يمكن التغاضي عن الطباعة بسهولة ، وحتى عندما يأخذها المصمم في الاعتبار ، من السهل شطبها كنشاط وقت مكثف مع القليل من العائد. لكن قضاء بضع دقائق مع النص الذي سيكون محور تصميمك يمكنه تحويله من شيء يمكن لأي مصمم ويب أن يضعه على صفحة إلى عنصر يدعم باقي التصميم.
مكتوبة حصرا ل WDD بحلول يوم الخميس برام.
هل تتبع هذه القواعد وغيرها؟ يرجى مشاركة وجهات نظرك أدناه ...