طراحی سایت روان چیست؟

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

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

اما این ها همه در ایجاد صفحه ی روان و مطابق با پنجره ی مرورگر خلاصه نمیشه. اصل طراحی روان با اصول دسترسی به دست می آید.

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

تفاوت طراحی سایت روان و ثابت

طراحی سایت روان ممکن است اطلاعات این بخش برای طراحان حرفه ای سایت پیش پا افتاده و بدیهی به نظر برسد ولی در این قسمت سعی داریم نگاهی عمیق تر به طراحی Liquid و Fix داشته و تفاوت های ظاهری آنها را برای کاربران با مثال بررسی کنیم.

Fixed Website Layout

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

طراحی سایت ثابت

طراحی سایت روان تصویر بالا یک نمونه از طراحی سایت ثابت است که پهنای کلی صفحه بر روی 960 پیکسل تنظیم شده و به سه بخش اصلی به پهنای 520، 200 و 200 پیکسل تقسیم شده است. عدد 960 یک استاندارد رایج در این روش است زیرا عموم کاربران با رزولوشن 1024*768 پیکسل از صفحات اینترنتی بازدید می کنند.

Fluid Website Layout

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

مزایای طراحی سایت روان

طراحی سایت روان سایت طراحی شده کارایی بهتری دارد زیرا با توجه به تنظیمات کاربران خود را تغییر میدهد.

فضای بین بخش های اصلی تناسب خود را حفظ کرده و نمایش سایت شما در هر شرایطی یکسان خواهد بود.

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

معایب طراحی سایت روان

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

تصویر، ویدئو و محتوایی که باید ابعاد مشخصی داشته باشد نمیتواند با تغییر ابعاد صفحه خود را هماهنگ کند.

در صفحه نمایش های خیلی بزرگ فاصله میان المان ها بیش از حد شده و این فضای خالی ممکن است سایت شما را کم محتوا جلوه دهد.

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

طراحی سایت روان میتوانید با تغییر رزولوشن صفحه نمایش یا بزرگنمایی مرورگر خود نحوه نمایش آن را در شرایط مختلف بررسی کرده و ایرادات احتمالی را شناسایی و رفع کنید. در اکثر مرورگرها با نگه داشته دکمه “Ctrl” و فشردن کلیدهای “+” یا “-” میتوانید بزرگنمایی تصویر را تغییر دهید.

کدام طرح برای سایت شما مناسب است؟

طراحی سایت روان انتخاب بین سایت ثابت یا روان به نوع وب سایت شما خیلی بستگی داره. مزایا و معایب اون رو قیاس کنید تا برای طراحی سایتتون انتخاب درستی داشته باشید.

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

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

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