یک ترفند ساده تایپوگرافی برای افزایش خوانایی متن تا 30٪

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

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

چند کار وجود دارد که تایپوگراف‌ها می‌توانند برای جلوگیری از این مشکل انجام دهند، و آنها به‌ویژه در مقادیر زیاد متن، مانند گزارش‌های خبری یا وبلاگ‌ها، مهم هستند: اولاً، مطمئن شوید که کاراکترهای شما در هر خط خیلی زیاد نیستند. بالا، هر چه چشم باید بیشتر سفر کند، شانس گم شدنش بیشتر می شود. ثانیاً یک قلم سریف را در نظر بگیرید، تأثیر افقی بیشتر، تمایز بصری بیشتری بین خطوط متن و فضای سفید ایجاد می‌کند و نقشی مشابه انگشت کودک فوق‌الذکر دارد. در نهایت توجه زیادی به فاصله بین خطوط پیشرو خود داشته باشید، کانال های واضح تری را برای چشم شما ایجاد می کند.

علاوه بر این توصیه سنتی، تکنیک جدیدی نیز کشف شده است. BeeLine Reader یک افزونه جدید و جذاب برای Chrome است که نحوه عملکرد آن را نشان می‌دهد.

BeeLine Reader یک گرادیان رنگ به خطوط متن اضافه می‌کند و انتقال از انتهای یک خط به ابتدای خط بعدی را برای چشم آسان‌تر می‌کند. دانشگاه استنفورد آزمایشی را با استفاده از این افزونه انجام داد و به این نتیجه رسید که BeeLine Reader منجر به افزایش میانگین سرعت خواندن 10٪ شده است. سایت خود افزونه ادعا می کند که یک خواننده با تجربه افزایش 25 تا 30% را تجربه خواهد کرد.

شما باید بتوانید متن سمت راست را بسیار سریعتر از متن سمت چپ بخوانید.

در حالی که نمی‌توانم بگویم که افزونه را که متن را به یک ستون تکی تحمیل می‌کند، یا رنگ‌هایی که استفاده کرده‌اند (برای بیشتر زشت و برای هر کسی که کوررنگی پروتانوپیک دارد بی‌فایده است) تأیید می‌کنم، اصل صدا است. نمونه‌ای در مقیاس خاکستری در سایت BeeLine Reader وجود دارد که خوانایی را بهبود می‌بخشد، اما برند کسی را نقض نمی‌کند. یک آزمایش سریع از آزمون خواندن نشان داد که با استفاده از نسخه خاکستری 22٪ پیشرفت کردم. .

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

اگر حجم زیادی از متن در حال اجرا را طراحی می‌کنید – به‌ویژه اگر محدودیت‌های دیگر شما را مجبور به استفاده از ستون‌هایی با عرض زیاد یا ارتفاع خط خیلی کوچک می‌کنند – از این تکنیک برای جبران استفاده کنید.

 

نظر شما در مورد تکنیک BeeLine Reader چیست؟ در آزمون ریدینگ آنها چگونه عمل کردید؟ در نظرات به ما اطلاع دهید.

تصویر/تصویر کوچک ویژه، تصویر با کد رنگی از طریق Shutterstock