8 راه آسان برای بهبود تایپوگرافی وب سایت خود در کمتر از 30 دقیقه


تایپوگرافی یکی از مهم ترین عناصر هر سایتی است که تأثیر قابل توجهی بر برند و تجربه دارد.

بسیار اساسی است که ایجاد تغییرات عمده در تایپوگرافی شما – انتخاب فونت جدید، تغییر اندازه گیری، افزایش پیشرو – پیچیده و مملو از زمان بالقوه است.

اما تغییرات ساده‌ای وجود دارد که می‌توانید در تایپوگرافی خود ایجاد کنید که شبکه شما را خراب نمی‌کند و در 30 دقیقه یا کمتر قابل دستیابی است. در اینجا هشت مورد از ساده ترین آنها وجود دارد.

 

1. افزایش کنتراست رنگ

هنگام چیدمان متن، برای طراحان معمول است که متن را به عنوان یک بلوک در یک طرح بصری ببینند. رابطه طراح با متن بسیار متفاوت از رابطه کاربر است. یک طراح متن را به عنوان یک شکل قرار می دهد، کاربر آن را خط به خط می خواند. در نتیجه، طراحان تمایل دارند میزان کنتراست متن مورد نیاز را دست کم بگیرند.

متن خاکستری روشن از نظر زیبایی شناسی زیباست اما از نظر کاربردی بی فایده است. متن برای خواندن نوشته شده است و باید استانداردهای WCAG AA را در دسکتاپ و استانداردهای WCAG AAA در تلفن همراه – یا در هر موقعیتی با منابع نور محیطی زیادی داشته باشد. هرچه متن بزرگتر باشد، آزادی عمل بیشتری دارید.

متن باید کاملاً از نظر کنتراست آزمایش شود، اما به عنوان نقطه شروع، متن 18 پیکسلی روی پس‌زمینه سفید هرگز نباید روشن‌تر از #595959 باشد.

 

2. فاصله سرصفحه

را محکم کنید

اکثریت قریب به اتفاق حروف برای استفاده به عنوان متن اصلی طراحی شده اند – بلوک های بزرگ متن در حال اجرا، چندین خط طولانی. وقتی فونت ساخته شد، برای این استفاده فاصله داشت.

برخلاف متن در حال اجرا، عناوین معمولاً کوتاه هستند و با فضای خالی بیشتری احاطه می شوند – به خصوص در بالا و پایین. فضای خالی اضافی به صورت بصری فضای منفی را در کلمات شکل می دهد و حروف را از هم جدا می کند.

برای جبران، فاصله حروف و فاصله کلمات سرفصل‌ها را 1 تا 5% کاهش دهید.

 

3. فاصله بین کلمات را شل کنید

وقتی می خوانیم، مغز ما کلمات را حرف به حرف هجی نمی کند. اشکال کلمات و حتی اشکال گروه های کلمه را تشخیص می دهد.

بیشتر ریز تایپوگرافی به عدم برهم زدن آن اشکال کلمات مربوط می شود. با این حال، مواقعی وجود دارد که می‌خواهید از شکل‌گیری کلمات جلوگیری کنید و به کاراکترهای فردی اجازه دهید.

فاصله حروف را روی هر متنی که قرار است به‌عنوان یک سری کاراکتر خوانده شود، مانند شماره سریال، کدهای رهگیری و داده‌های جدولی، شل کنید.

 

5. پاراگراف ها را یک بار علامت گذاری کنید

پاراگراف‌های متن نیاز به نشانه بصری دارند که شروع شده‌اند. معمولاً سه روش وجود دارد: دنبال کردن یک عنوان، با فاصله عمودی قبل از پاراگراف، یا تورفتگی در خط اول.

هر پاراگراف باید از یکی از این نشانگرها و فقط یکی استفاده کند. با توجه به ماهیت محتوای وب و مزایای سرفصل ها برای اسکن سریع محتوا، برای اکثر سایت ها، بهترین انتخاب ترکیبی از دنبال کردن یک عنوان و فاصله عمودی است.

 

6. از سبک های اصلی

استفاده کنید

به دلایل مختلف، از در دسترس بودن فونت‌ها تا بهینه‌سازی تهاجمی، معمولاً سایت‌ها با استفاده از CSS سبک‌های جایگزین جعلی می‌کنند. حروف کج را می‌توان به‌عنوان مایل با یک کج جعل کرد، وزن‌های پررنگ را می‌توان با استفاده از پیش‌فرض‌های مرورگر جعل کرد، و حروف کوچک را می‌توان با تنظیم متن روی حروف بزرگ و کاهش اندازه قلم جعلی کرد.

این ترفندها بیشتر از اینکه فایده داشته باشند، آسیب می‌رسانند و شکل‌های کلمه‌ای تحریف شده ایجاد می‌کنند که جریان طبیعی متن را مختل می‌کند.

اگر نمی‌توانید خط‌های مورب، پررنگ و کوچک واقعی را به کار ببرید، آن‌ها را جعل نکنید. راه‌های جایگزین برای ایجاد تاکید، مانند تغییر رنگ‌ها را پیدا کنید.

 

7. از نقل قول های صحیح

استفاده کنید

آپوستروف، تک‌نقل و نقل قول‌های دوگانه کاراکترهای خاصی هستند. بیشتر فونت‌ها علامتی برای آنها ارائه می‌کنند که از کلید سریع تک یا دو نقل قول روی صفحه‌کلید شما متمایز است.

این گیومه‌ها معمولاً به‌عنوان نقل‌قول‌های «هوشمند» شناخته می‌شوند، زیرا برنامه‌های پردازش کلمه معمولاً گزینه «هوشمند بودن» را در مورد اینکه از چه حروفی استفاده می‌کنند دارند.

استفاده از نقل قول‌های صحیح یکی از ساده‌ترین راه‌ها برای ارائه یک متن دقیق است.

 

تصویر ویژه از طریق Unsplash

بدون دیدگاه

دیدگاهتان را بنویسید

نشانی ایمیل شما منتشر نخواهد شد.