انواع قالب سایت
فضاهای خالی در طراحی سایت
دانش چگونگی استفاده از «فضای خالی» (white space) می‌تواند در طراحی بسیار مهم باشد. فضای خالی می‌تواند هر ناحیه‌ای از طرح باشد که هیچ متن، تصویر یا عنصر دیگری در آن وجود نداشته، و لزوماً نباید به رنگ سفید باشد. این عنصر، یکی از عناصر مورد علاقه طراحان است زیرا با استفاده از آن می‌توان دیگر عناصر را بهتر گروه‌بندی کرد، بر روی یک عنصر خاص تأکید اضافه نمود و خوانایی مطالب را بهبود بخشید. در این مقاله، دلیل اهمیت کاربرد فضای خالی و چگونگی بهبود طرح‌ها با استفاده از این عنصر را بررسی خواهیم کرد.
فضای خالی چیست؟
«فضای خالی» (white space) برخلاف نام آن، تنها در بخش‌های با رنگ سفید استفاده نمی‌شود، بلکه در بخشی از طراحی بکار می‌رود که حاوی هیچ عنصری مانند متن یا تصویر نباشد. هر رنگی را می‌توان برای فضای خالی در نظر گرفت؛ در اغلب موارد رنگ این عنصر با پس‌زمینه طرح هم‌رنگ است.
اهمیت استفاده از فضای خالی
تصاویر و فونت‌ها انتقال دهنده یک پیام هستند اما فضای خالی برای تأکید بر اهمیت اطلاعات خاصی بکار برده می‌شود. هنگام استفاده از هر عنصری در طراحی، مفهوم «کم‌تر غنی‌تر است» را در نظر بگیرید و استفاده بهینه‌ای از عناصر طراحی داشته باشید.
همان‌طور که باید از کاربرد بیش از حد فضای خالی در یک طرح اجتناب کرد، عناصر غیر ضروری را نیز نباید در آن جای داد. فضای خالی، توجه بیننده را به سمت محتوا جلب می‌کند و پیام طرح را برجسته می‌کند. افزایش «وضوح» (Clarity) طرح به معنای خسته کننده بودن آن نیست، هر اندازه که یک طراحی قوی‌تر و واضح‌تر باشد، به همان نسبت می‌تواند توجه مخاطب را جلب کند. لوگو و تبلیغات برند اپل را در نظر بگیرید. شرکت اپل برای ارائه حس سادگی و کاربر دوستانه محصولاتش در طراحی‌های مرتبط، نواحی وسیعی از فضاهای خالی را بکار می‌برد.
کتاب‌ها و مجلات، نمونه‌های بسیار خوبی از اهمیت فضای سفید هستند. حاشیه صفحات، فضای خالی بین متن و لبه صفحه، باعث افزایش خوانایی متن می‌شود.
چگونه باید فضای خالی را در طراحی بکار برد؟
فضای خالی به عنوان یک عنصر می‌تواند باعث یکپارچگی طرح شده و در بهبود آن نقش مؤثری داشته باشد. در زیر، ۸ روش استفاده از فضای خالی در طراحی ذکر شده است.
بخشی از فضای طرح را خالی بگذارید
اعمال فضای خالی در اطراف یک عنصر باعث می‌شود که تمرکز بر روی آن عنصر افزایش یابد بنابراین از خالی گذاشتن نواحی زیادی از طرح خود نترسید.
خطوط مرزی طرح را حذف کنید
حذف عناصر غیر ضروری مانند «خطوط مرزی» (Border) می‌تواند فضای بیش‌تر و بازتری به طرح ببخشد. به یاد داشته باشید که خطوط مرزی، شکل‌ها، آیکون‌ها و دیگر عناصر تنها زمانی باید بکار برده شوند که باعث افزایش ارزش طرح شوند.
اندازه تصویر پس‌زمینه را افزایش دهید
برای پس‌زمینه از تصاویری استفاده کنید که فضای کافی برای پوشش متن مورد نظرتان را داشته باشند، یا همانند تصویر زیر، به منظور ایجاد فضای خالی بیش‌تر برای نوشتن متن، اندازه تصویر را افزایش دهید.
از پس‌زمینه رنگی استفاده کنید
یک پس‌زمینه رنگی می‌تواند برای ایجاد فضای زیادی در اطراف متن استفاده شود، در عین حال باعث افزایش توجه به آن نیز می‌شود.
فاصله بین حروف را تنظیم کنید
افزایش یا کاهش فضای بین حروف باعث تراز شدن متن در بلوک‌های متنی می‌شود و آن بلوک متنی به صورت یک عنصر یکپارچه به نظر خواهد رسید. علاوه بر این، انجام این کار قابلیت خوانایی متن را نیز افزایش می‌دهد.
از حاشیه استفاده کنید
هر عنصر در طراحی باید دارای حاشیه یا فضای خالی در محدوده اطراف خود باشد. به فضای خالی موجود در اطراف عبارت «Cooking: Back to Basics»، فاصله درج شده در زیر آدرس وب‌سایت و فاصله بدون استفاده بین کادر متنی و تصویر پس‌زمینه توجه کنید.
در صورت نیاز خط مرزی اضافه کنید
ایجاد «خط مرزی» (Border) در اطراف یک عنصر باعث می‌شود تا آن عنصر در مرکز توجه قرار گیرد. برای بهره‌گیری از این قاعده در طراحی، در اطراف عناصر اصلی مانند متن یا تصویر خط مرزی ایجاد کنید. اطمینان حاصل کنید که تمام عناصر در مرکز قاب قرار می‌گیرند و فضاهای خالی اطراف آن عنصر به‌طور منظم درج شده است.
یکی از جنبه‌های طراحی خود را برجسته کنید
افزایش اندازه یک عنصر مهم در طراحی، همانند کلمه «Eat» در طرح فوق، باعث منظم‌تر شدن طرح می‌شود. برای افزایش فضای خالی، اندازه دیگر عناصر را کوچک کنید.