اندازه فونت در طراحی سایت ریسپانسیو

طراحی سایت

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

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

اندازه فونت در طراحی سایت ریسپانسیو

کاربران متن‌ های آنلاین را برای رفع نیازهای خود انتخاب می‌کنند: آن‌ها به دنبال اطلاعات هستند و سعی دارند در مورد مطلبی که به آن نیاز دارند را در موتورهای جستجو سرچ کنند و به ایده‌های جدید و مواردی برسند که بتواند آن‌ها را در زندگی کمک کند و نیاز آن‌ها را برآورده سازد.

کاربران به سه روش می‌خوانند:

 در سال ۲۰۰۶، گروه نیلسن نورمن براساس تحقیقی که بر روی چشم کاربران در حال مطالعه متن آنلاین انجام دادند تصاویری از نقشه‌های حرارتی چشم را منتشر کردند که این تصاویر نشان می‌دهند ناحیه‌هایی که با رنگ قرمز معلوم شدند بیشترین حساسیت و دقت کاربران را در پی داشته و نواحی زرد رنگ کمتر دیده شده‌اند و نواحی که بازدید خیلی کمی داشته‌اند با رنگ آبی نمایش داده شده است.
همانطور که در تصویر هم می‌بینید، نواحی قرمز و زرد تشکیل سه نوع از یک الگوی F-شکل را داده‌اند. این تغییرات نشان می‌دهند که کاربران به سه روش مختلف متن‌ها را می‌خوانند.
کاربران معمولی، کاربرانی که کمی دقت بیشتری بر روی متن به خرج می‌دهند و کاربرانی که کلمه‌ها و جمله‌های متن را با دقت می‌خوانند و سعی دارند از آن‌ها معنایی را برای خود بردارند. کابرانی که معمولی می‌خوانند چشم آن‌ها صرفا حالتی گذرا به مطالب دارند و چشمشان بر روی مطلبی متمرکز نمی‌شود آن‌ها همه مطالب را از چشم می‌گذراند و در واقع با چشم برای خودشان اسکنی از مطالب سایت تهیه می‌کنند و تا بتوانند هر چه سریع‌تر لیستی برای خودشان بپینند و رد شوند.
کاربران اغلب با هدف اسکن مطالب، و پریدن از بخشی به بخش دیگر، به دنبال یک قطعه خاص از پازل اطلاعات موردنیازشان هستند. در نوع اول خواندن ممکن است یک کلمه یا حرفی خاص را بر روی صفحه نمایش برای خودشان لیست کنند و رد شوند. اما در نوع خواندن دومی حرکت چشم آهسته‌تر می‌شود و چشم برای پریدن از بخشی به بخشی دیگر همراه با طمانینه و کند عمل می‌کند کاربر کلمه‌ای را جستجو می‌کند به همین خاطر همه کلمه‌ها را مرور می‌کند تا به آن کلمه خاص خودش برسد کلمه‌ها را می‌بیند اما بر روی آن‌ها دقتی ندارد آنچه در ذهنش حک شده فقط آن کلمه خاص خودش است.
آخر سر کاربرانی قرار دارند که همه کلمه‌های متن را با دقت مطالعه می‌کنند و به دنبال حرکت شتابزده و یا کلمه‌ای خاص نیستند می‌خواهند مقاله‌ای یا مطلبی را از اول تا انتها مطالعه کنند. و زمان بیشتری را برای یک متن صرف می‌کنند و بر روی آن فوکوس می‌کنند.
با دانستن این سه روش خواندن کاربران، اولین چیزی که در طراحی وب سایت باید مدنظر قرار گیرد فونت متن و خط فاصله بین خطوط متن است چون این موارد با چشم کاربر در ارتباط هستند و او را در امر خواندن یاری می‌کنند. چشم کاربر در بین خطوط و فونت‌ها به حرکت در می‌آید و با حرکت‌های افقی و عمودی در بین متن جولان می‌خورد پس باید در انتخاب این موارد در ساخت وب سایت نهایت دقت را داشت.

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

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


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

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

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

Save

Save

Save

چاپایمیل