PDA

نسخه کامل مشاهده نسخه کامل : طراحی سایت روان یا Liquid Design



shokribahare
19-10-2013, 17:08
می دانیم برای طراحی سایت ([ برای مشاهده لینک ، لطفا با نام کاربری خود وارد شوید یا ثبت نام کنید ]) باید به نوع فعالیت سایت،بودجه و میزان جلب توجه کاربران باید به نوع سایت از قبیل طراحی روان،ثابت و یا Responsive باید توجه نمود.در اینجا قصد داریم تا به معرفی طراحی سایت روان یا Liquid Design همراه با مزایای و معایب این نوع طراحی بپردازیم.
[ برای مشاهده لینک ، لطفا با نام کاربری خود وارد شوید یا ثبت نام کنید ] DB%8C%D8%AA%20%D8%B1%D9%88%D8%A7%D9%86.jpg
یک طراح سایت باید به تفاوت های احتمالی میان بازدیدکنندگان یک سایت را بداند و به این تفاوت ها توجه داشته باشد،این تفاوت ها شامل موارد زیر می باشند:

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

[ برای مشاهده لینک ، لطفا با نام کاربری خود وارد شوید یا ثبت نام کنید ] D8%A7%D8%AD%DB%8C-%D8%B3%D8%A7%DB%8C%D8%AA-%D8%AB%D8%A7%D8%A8%D8%AA.jpg
در طراحی سایت ثابت معمولا بخش های مختلف دارای ابعادی مشخص و تعیین شده بر اساس پیکسل هستند و در بخش های مختلف با تغییر صفحه نمایش کاربر اندازه خود را حفظ می کند.در طراحی سایت ثابت پهنای کلی صفحه بر روی ۹۶۰ پیکسل تنظیم شده است و به سه بخش اصلی به پهنای ۵۲۰، ۲۰۰ و ۲۰۰ پیکسل تقسیم شده است. عدد ۹۶۰ یک استاندارد رایج در این روش است زیرا عموم کاربران با رزولوشن ۱۰۲۴*۷۶۸ پیکسل از صفحات اینترنتی بازدید می کنند.
درتکنیک Fluid یا Liquid بخش های اصلی صفحه و پهنای کلی آن براساس درصد تعریف شده و پیکسل آنها با عرض صفحه نمایش کاربر تعیین میشود. تصویر پایین یک نمونه طراحی سایت روان را نمایش میدهد و همانطور که مشاهده میکنید پهنای بخش های مختلف براساس عرض صفحه نمایش یا رزولوشن تصویر کاربر تعیین میشود. حتی برای تعیین فاصله بین دو بخش نیز میتوان از درصد استفاده کرد تا جایگیری المان های سایت در هر شرایطی یکسان باشد.

[ برای مشاهده لینک ، لطفا با نام کاربری خود وارد شوید یا ثبت نام کنید ] D8%A7%D8%AD%DB%8C-%D8%B3%D8%A7%DB%8C%D8%AA-%D8%B1%D9%88%D8%A7%D9%86.jpg
مزایای طراحی سایت روان



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





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





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


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



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





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





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


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


منبع : طراحی سایت ([ برای مشاهده لینک ، لطفا با نام کاربری خود وارد شوید یا ثبت نام کنید ])