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

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

 

حداقل استفاده از فونت های گوناگون

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

پرهیز از طولانی بودن و کوتاه بودن خطوط متن

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

کاربرد EM در طراحی سایت

در زمان طراحی سایت و برنامه نویسی آن بهتر است بجای استفاده از پیکسل از واحد EM استفاده نمایید تا از کد نویسی بیشتر برای هر سایز (گوشی، تبلت و …)جلوگیری شود. در این صورت فونت های شما از عمل وراثت استفاده می کنند و در نتیجه رزولوشن های مختلف به سایز مورد نظر تغییر می یابند.

ارتفاع مناسب بین خطوط متن های سایت

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