لطفا صبر کنید ...

مزایای استفاده از فضای سفید در طراحی ظاهر یک سایت

الهام غایب

توسط الهام غایب

نویسنده
دیدگاه ها: 0
بازدید ها : 305
رایگان
هدف ما این است که شما، در بالاترین سطح طراحی و توسعه وب باشید.

ثبت نام کنید

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


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

۱. جلب توجه

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

فضای سفید در طرح

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

۲. ایجاد نظم بصری

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

فضای سفید در طرح

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

صفحات فرود معمولا نمونه فوق‌العاده‌ای از این روش هستند. شما یک عنوان بزرگ دارید که حاوی فضای سفید بیشتری از متنی است که در ادامه می‌آید. و متن هم ادامه می‌یابد تا به دکمه بزرگ «اشتراک در خبرنامه» برسد که بیشترین میزان فضای سفید را در اطراف خود دارد. این نمونه را می‌توان تقریبا در تمام وب‌ سایت‌ها مشاهده کرد. بیایید با هم نگاهی به وب سایت GTmetrix بیاندازیم.

فضای سفید در طرح

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

۳. جدا کردن گروه ها از یکدیگر

 بیشتر بخوانید:

 اگر هنوز هم فکر می‌کنید فضای سفید و فضای پِرت یک معنا را دارند پس اجازه دهید نشان دهم چگونه می‌توانید با استفاده از فضای سفید در فضا صرفه جویی کنید. اگر به این مشکل کمبود فضا در صفحات وب‌ سایت خود برخورد کردید و هنوز محصولات، خدمات یا هر چیز دیگری که می‌خواهید توجه بیننده را به خود جلب کند روی هم جمع شده است در این صورت ریسک به صف کردن آن‌ها در فضای سمت چپ و قرار دادن آیتم‌ها را در فاصله نزدیک به یکدیگر را بپذیرید. این باعث می‌شود، آیتم‌ها در آن بخش مشابه به نظر رسیده و توجه اندکی جلب کنند. یک راه حل برای این مشکل می‌تواند این باشد که به جای برجسته کردن محصولات فقط اندازه، چینش و جهت گیری آن‌ها را تغییر دهید. این کار باعث ایجاد فضای سفید بیشتر بین اشیاء شده، آن‌ها را از هم جدا کرده و بیننده راحت‌تر آن‌ها را انتخاب می‌کند. نگاه کنید که چگونه CoSchedule بخش features خود را طراحی کرده است:

فضای سفید در طرح

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

فضای سفید در طرح

در بالا مثالی از دو فرم را مشاهده می‌کنید که یکی با فضای سفید و دیگری بدون فضای سفید است. ببینید چگونه فرمی که تقسیم کننده دارد فضای سفید بیشتری داشته و باعث شده که فیلدهای فرم باهم گروه بندی شوند.

 ۴. خوانایی بهتر

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

فضای سفید در طرح

به کار بردن فضای سفید اندک باعث فشردگی بیشتر متن و دشواری مطالعه آن می‌شود. استفاده بیش از حد از فضای سفید باعث هدر رفتن فضا و نامتصل به نظر رسیدن متن خواهد شد. به همین دلیل است که طراحان برتر دنیا تاکید بسیاری روی فونت و تایپوگرافی دارند. فونت‌های گوگل که در بالا آمده است دو نوع فونت BioRhyme Expanded و Cookie را نشان می‌دهد. که در اولی از فضای سفید زیاد استفاده شده در حالی که در دومی حداقل فضای سفید به کار رفته است و خواندن آن دشوار است. حالا این دو را با دو فونت متعادل مقایسه می‌کنیم:

فضای سفید در طرح

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

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

منبع :

5 از 1 رای

 مطالب مرتبط  

در قسمت زیر مطالبی وجود دارند که با مقاله فعلی مرتبط هستند

متاسفانه فقط اعضای سایت قادر به ثبت دیدگاه هستند

برترین های