تعتبر الطباعة المدروسة والمختارة جيدًا هي المفتاح لتحقيق موقع ويب ممتع من الناحية الجمالية ، والأهم من ذلك - موقع إلكتروني يسهل قراءته. لكن هل تعرف كيفية جعل النص على موقع الويب واضحًا ومتسقًا مع هوية علامتك التجارية؟
لا تقلق. لقد جمعت أهم 8 قواعد للطباعة والتي ستجعل العملية الكاملة لإنشاء الطباعة المثالية لموقعك الإلكتروني سهلة وفعالة. تأكد من اتباع جميع القواعد ، وستتم مكافأتك بنظام طباعة شفاف سيجعل مشروعك يبدو احترافيًا ويحسن تجربة المستخدم.
8 مبادئ الطباعة لمتابعة
1. اختر الخط الصحيح
الشيء الأكثر أهمية هو أن الطباعة يجب أن تعكس الطبيعة الحقيقية لمجال عملك. الصحيح الطباعة مسألة صدفة. فقط لأن الخط شائع ويعجبك لا يعني أنه سيكون مناسبًا لعلامتك التجارية. انتبه لما ينقله الخط وما إذا كان يتطابق مع أسلوب علامتك التجارية.
انتبه لما ينقله الخط وما إذا كان يتطابق مع أسلوب علامتك التجارية. إذا كنت تدير متجرًا للأطفال ، فلن تستخدم خطوط أعمال بسيطة وأنيقة والعكس صحيح. قم دائمًا بمطابقة الخطوط مع اتصالات علامتك التجارية لتكون متوافقة معها.
إذا كنت تريد معرفة ما الذي تبحث عنه عند اختيار أفضل خط لموقعك على الويب ، فراجع مقالتنا حول خطوط موقع الويب .
2. حدد حجم الخط
حجم الخط على الصفحة مهم! إذا اخترت خطًا ليس صغيرًا جدًا أو كبيرًا جدًا ، فستجعل القراءة أسهل كثيرًا للمستخدمين. تستخدم وحدة الطباعة الخاصة لوصف الخطوط "pt" أو "point".
النطاق المفضل لأحجام الخطوط القياسية لمواقع الويب يتراوح بين 14-25 نقطة. يمكن حجز الخطوط الأكبر حجمًا للعناوين - 20 نقطة وما فوق ، وبالنسبة للنص العادي ، فإن النطاق الأفضل هو 14-18 نقطة.
بغض النظر عن حجم الخط الذي تختاره ، تأكد من أن حجم الخط:
أ) يجعل النص مقروءًا - يمكن أن يؤدي حجم الخط الذي يبلغ 12 نقطة وأقل إلى إعاقة إمكانية القراءة بشكل كبير ؛
ب) يطابق الخط - على سبيل المثال ، بالنسبة لخط نظامها ، توصي شركة Roboto Google بحد أدنى 16 نقطة. من ناحية أخرى ، سان فرانسيسكو - الخط المستخدم ، من بين أمور أخرى ، في أجهزة Apple ، يجب ألا يقل حجمه عن 18 نقطة ؛
ج) يعكس الغرض من موقع الويب - إذا لم يسيطر النص على الصفحة ولكن حسب التصميم ، يمكنك استخدام خط أصغر. أيضًا في حالة الصفحات التفاعلية التي تشجع المستخدم على النقر في كل خطوة ، يمكن توفير هذا الحل. من ناحية أخرى ، إذا كنت تتعامل مع موقع ويب حيث يهيمن النص ، وكانت المهمة الرئيسية للمستخدم هي القراءة (على سبيل المثال ، منطقة المدونة ، بوابة المعلومات) - فمن الأفضل اختيار خط أكبر قليلاً.
كيف تختار حجم الرأس؟
هل قررت حجم خط نصك ولكنك لا تعرف كيف تحافظ على حجم العناوين بما يتناسب مع باقي المحتوى؟ هناك العديد من أفضل الممارسات لهذا:
أ) يجب أن يكون رأس H1 300٪ من حجم الخط المستخدم في النص الأساسي. على سبيل المثال ، إذا كان موقع الويب الخاص بك يستخدم خطًا بحجم 18 نقطة للنص الأساسي ، فإن الحجم الأمثل لعناوينك هو 54 نقطة.
ب) يجب أن يكون رأس H2 200٪ من حجم خط النص الأساسي. في هذه الحالة ، مع حجم خط أساسي يبلغ 18 نقطة ، سيكون عنوان H2 المثالي هو 36 نقطة.
نوع BOWWE:
بالنسبة للعناوين المتتالية ، يمكنك تقليل النسبة تدريجيًا ؛ على سبيل المثال ، بالنسبة إلى رأس H4 ، يمكنك مضاعفة حجم الخط الأساسي بنسبة 130-150٪.
الخطوط في النسخة المحمولة
عند اختيار حجم الخط ، يجب أن تجيب على السؤال عن الأجهزة التي سيتم عرض النص عليها. سيبدو حجم الخط مختلفًا على شاشات الكمبيوتر المحمول عن الأجهزة المحمولة. إذا كنت تفضل التركيز على مظهر موقع الويب في الأجهزة المحمولة ، فتذكر هاتين القاعدتين المهمتين:
أ) على شاشات الهواتف الذكية ، لن يبدو الخط الكبير لطيفًا ،
ب) يجب ألا تأخذ العناوين أكثر من سطرين.
لذلك ، عند تصميم موقع ويب للجوال ، يجدر التحقق من شكل النص والتأكد من أن الخط كبير جدًا.
نوع BOWWE:
عند إنشاء موقع ويب في BOWWE builder ، فإنه يستجيب تلقائيًا. هذا يعني ، أولاً وقبل كل شيء ، أنك لست بحاجة إلى إنشاء موقع ويب منفصل مصمم خصيصًا للأجهزة المحمولة. ثانيًا ، يمكن أن يؤدي تحرير موقع الويب إلى التبديل بين معاينة سطح المكتب والجوّال في بضع ثوانٍ. بفضل هذا ، يمكنك بسهولة التحكم في كيفية تصرف الخط الذي تختاره على الأجهزة المحمولة.
3. استخدم مبدأ: الأقل هو الأكثر
عند تصميم مواقع الويب ، من الأفضل اتباع مبدأ التبسيط. قد يؤدي استخدام أكثر من نوعين من الخطوط في مشروع واحد إلى اضطراب جماليات المشروع. الحل الأكثر أمانًا هو اختيار نوعين من الخطوط: العناوين والنص العادي.
أيضًا ، ضع في اعتبارك أنه لا يمكن لجميع الخطوط العمل معًا. هناك أزواج من الخطوط التي تحب بعضها البعض بشكل أفضل ، وبعضها غير متوافق. يجدر التعرف عليهم قبل اتخاذ قرارك النهائي!
نوع BOWWE:
إذا كنت تريد أن تكون متأكدًا بنسبة 100٪ من أنك تختار أفضل اقتران للخطوط ، فيمكنك دائمًا أن تستلهم من اقتران الخطوط على fontpair.co .
4. تطوير هيكل المحتوى
جانب من جوانب الطباعة التي لا تقل أهمية عن اختيار الخط هو تخطيط وهيكل كل المحتوى على الصفحة. لا يهم إذا كان وصفًا موجزًا لعملك أو مقالة شاملة في قسم المدونة - تؤثر بنية كل نوع من المحتوى بشكل كبير على تصور المستخدمين لموقعك على الويب. ما هي قواعد الطباعة من أجل قراءة أفضل؟
ارتفاع السطر أو المسافة البادئة
الحفاظ على ارتفاع كافٍ للخط (أو المسافة بين السطور) والمسافة بين السطور. المسافة القصيرة جدًا ستجعل أسطر النص متداخلة عمليًا. من ناحية أخرى ، سيتم "انفجار" القارئ المرتفع. لذلك من الأفضل إيجاد النسبة الذهبية.
الفقرات وطول السطر
كان معروفًا منذ فترة طويلة أن أجزاء النص القصيرة يمكن قراءتها بشكل أفضل. قد تتسبب الأسطر أو الفقرات الطويلة جدًا في إرهاق العينين وإزعاج إيقاع القراءة. يجب أن يتراوح طول السطر بين 50 و 75 حرفًا حتى لا يستنفد المستخدم. الأمر نفسه ينطبق على الفقرات - فهي تجعل النصوص الطويلة أسهل في القراءة.
محاذاة
في الطباعة ، المحاذاة هي موضع النص بالنسبة إلى الهامش أو حافة الصفحة أو نقطة مرجعية أخرى.
نوع BOWWE:
على الرغم من أنه يبدو من الملائم محاذاة جميع حواف النص ، إلا أننا لا نوصي بضبط محتوى الصفحة في النهاية. القراء المبررون على الإنترنت ببساطة لا يظهرون بشكل جيد ، وعلى عكس المظاهر ، يتدخلون في سهولة القراءة. عند المحاذاة إلى الحافة اليسرى ، يمكنك نقل الكلمات التي لا تتناسب مع السطر التالي مع الحفاظ على نفس التباعد. هذا أكثر طبيعية للعين ويعطي إيقاع القراءة الصحيح.
5. تطابق الألوان
لون الخط هو عنصر من عناصر الطباعة يرتبط ارتباطًا وثيقًا بالهوية المرئية لعلامتك التجارية على الإنترنت. ومع ذلك ، كما هو الحال مع دمج الخطوط ، يجب أيضًا توخي الحذر عند اختيار ألوانها. فيما يلي أهم المعايير الأساسية للون الخط:
حدد 3 ألوان كحد أقصى
أنت تعلم بالفعل أنه من الأفضل اتباع التقليلية في الطباعة. الشيء نفسه ينطبق على الألوان. يمكن أن يتسبب استخدام أكثر من ثلاثة ألوان في النص في حدوث فوضى على الموقع ويجعله يبدو طفوليًا.
اعتني بالتباين
يجب أن يكون للنص تباين كافٍ مع الخلفية. بطبيعة الحال ، فإن المجموعة الأكثر أمانًا هي لون الخط الأسود على خلفية بيضاء أو رمادية فاتحة. إنها مزيج الألوان الأكثر طبيعية ولا تتعب عين المستخدم أثناء القراءة.
تطابق الألوان المتطابقة فقط
تذكر أن بعض الألوان ، مثل الأحمر والأخضر ، لا تتوافق معًا. لا يعمل فصل أنظمة الألوان في حالة الخطوط عادةً.
نوع BOWWE:
لتحديد لون الخط بسرعة وكفاءة أكبر ، يمكنك استخدام Color Tool من material.io . بفضل هذا ، ستتمكن من معرفة ما إذا كان لون الخط المحدد يتناسب جيدًا ، على سبيل المثال ، مع لون الخلفية على موقع الويب الخاص بك.
6. تبرز
باستخدام التسلسل الهرمي للأهمية في النص الخاص بك ، يمكنك التأكيد على أن كلمة واحدة أكثر أهمية من الأخرى. لذلك ، يجب إبراز الكلمات الأكثر أهمية على موقع الويب الخاص بك. يمكنك تكبيرها أو تلوينها أو استخدام خط غامق أو مائل.
نوع BOWWE:
يعد إبراز المزيد من الكلمات الأساسية أو أجزاء النص أمرًا مهمًا جدًا في حالة مواد المدونة. مثل هذا الإجراء يجعلهم أكثر قابلية للقراءة ويسهل تذكرهم. يجدر أيضًا استخدام الكلمات الغامقة للكلمات الرئيسية اللازمة لوضع موقع الويب في مكانة عالية في نتائج البحث.
7. إنشاء مقياس الخط الخاص بك
تحجيم الخط هو عملية زيادة أو تقليل حجم النص على موقع الويب.
قد ترغب في إنشاء مقياس خط لعدة أسباب. أحد الأسباب هو التأكد من أن كل نص صفحتك بنفس الحجم. يمكن أن يكون هذا مهمًا لسهولة الاستخدام ، خاصة إذا كنت تستخدم نصًا لنقل معلومات مهمة للزائرين. كما يمكن أن يجعل صفحتك تبدو أكثر تناسقًا واحترافية.
سبب آخر لاستخدام مقياس الخط هو تسهيل قراءة النص. قد تجد أن بعض الخطوط صغيرة جدًا أو كبيرة جدًا عند عرضها بحجمها الافتراضي. من خلال تغيير حجم النص ، يمكنك جعله أكثر راحة في القراءة.
هناك بعض الأشياء التي يجب تذكرها عند إنشاء مقياس الخط.
أ) تأكد من أن كل النص في صفحتك من نفس الحجم. يتضمن هذا كلاً من النص الأساسي وأي عناوين أو عناصر نصية أخرى.
ب) اختر حجم خط مريح وسهل القراءة. قد تحتاج إلى تجربة أحجام خطوط مختلفة للعثور على الحجم المناسب لك. قد تبدو بعض الخطوط جيدة في الحجم الكبير ولكن يصعب قراءتها عند تصغيرها.
نوع BOWWE:
هناك الكثير من الأدوات المجانية عبر الإنترنت التي يمكنك من خلالها بسهولة إنشاء مقياس للخط. واحد منهم هو type-scale.com .
8. قم بالبحث والبحث عن الإلهام
اعثر على أفضل تصميمات مواقع الويب مع أمثلة للطباعة المثيرة. على مواقع الويب مثل Dribbble ، يمكنك أن تجد الكثير من الإلهام. يمكنك أيضًا استخدام منصات مثل Pinterest التي تسمح لك بإنشاء ما يسمى Boards حيث يمكنك جمع أي شيء يلهمك ومشاركته مع أصدقائك أو زملائك في العمل.
من المفيد أيضًا إجراء بحث بين مواقع الويب المشابهة لموقعك أو منافسيك. ثم ستتعلم كيف ينفذ الآخرون أفضل مبادئ الطباعة وكيف يمكنك القيام بذلك أيضًا!
جاهز لإنشاء موقع الويب الخاص بك؟
استخدم الأكثر ملاءمة منشئ مواقع الويب الذي يثق به آلاف المصممين وأنشئ مواقع الويب التي ستزودك بالعملاء!
ابدأ الآن!
أفضل قواعد الطباعة - ملخص
تذكر أن الطباعة هي مفتاح نجاح أي تصميم ناجح لموقع الويب. باتباع مبادئ الطباعة ، يمكنك التأكد من أن النص لن يكون مقروءًا فحسب ، بل سيخلق أيضًا الحالة المزاجية الصحيحة ويعكس أسلوب علامتك التجارية بأمانة.
باتباع أفضل ممارسات الطباعة الجيدة الموجودة في هذه المقالة ، يمكنك تحسين مظهر موقع الويب الخاص بك بسرعة ، والأهم من ذلك ، تجربة المستخدم.
اقرأ أيضا:
كارول رجل أعمال متسلسل ، ومتحدث في التجارة الإلكترونية ، من بين آخرين للبنك الدولي ، ومؤسس 3 شركات ناشئة ، كجزء منها نصح عدة مئات من الشركات. كما كان مسؤولاً عن مشاريع أكبر المؤسسات المالية في أوروبا ، بقيمة تزيد عن 50 مليون يورو.
حصل على درجتي ماجستير ، إحداهما في علوم الكمبيوتر والأخرى في إدارة التسويق ، خلال دراسته في بولندا والبرتغال. اكتسب خبرة في وادي السيليكون وأثناء إدارته لشركات في العديد من البلدان ، بما في ذلك بولندا والبرتغال والولايات المتحدة وبريطانيا العظمى. لأكثر من عشر سنوات ، كان يساعد الشركات الناشئة والمؤسسات المالية والشركات الصغيرة والمتوسطة الحجم لتحسين أدائها من خلال الرقمنة.
