عرض استاندارد طراحی سایت چقدر است؟
5 دقیقه
عرض استاندارد برای طراحی سایت چقدر است؟ این اولین نکته ای که بیشتر طراحان هنگام طراحی سایت در نظر می گیرند این است که چه رزولوشنی را برای طراحی انتخاب کنند. برای آنها واقعا مهم است که سایتی که طراحی می کنند به همان شکلی برای کاربران به نمایش درآید که آنها طراحی کرده اند. حال با توجه به اینکه هر کدام از کاربران از یک نوع صفحه نمایش با ابعادی متفاوت ( تبلت،موبایل و...) نسبت به هم استفاده می کنند رعایت کردن یک سری اصول یکسان و ثابت به سایت استاندارد کمک شایانی می کند. در این نوشتار در نظر داریم تا اصول و قواعدی که یک طراح وب برای طراحی استاندارد ابعاد سایت ملزم به رعایت آنهاست را بیان کنیم. با ما همراه باشید.
تاریخچه چگونگی طراحی صفحات وب
در سال 1995 ، مانیتورهایی با وضوح استاندارد 480*640 بزرگترین و بهترین مانیتور در میان مانیتور های موجود بودند. این بدان معنی است که طراحان وب برای ساخت صفحاتی که از نظر ظاهری خوب به نظر برسد ، می بایست طراحی خود را به گونه ای انجام می دادند که حداکثر بر روی مانیتور 12 اینچی تا 14 اینچی خروجی مناسب و قابل قبولی داشته باشد.این روزها ، وب سایت هایی با وضوح 480*640 کمتر از 1 درصد از بیشترین ترافیک وب سایت ها را تشکیل می دهد چرا که مردم نیز اکثرا از رایانه هایی با وضوح بسیار بالاتر از 1366*768 ، 1600*900 و 5120*2880 استفاده می کنند . این گستردگی صفحات نمایش کار طراحان را برای انتخاب رزولیشن مناسب در طراحی سایت کمی ساده تر کرده است.
در واقع می توان چنین گفت که ما در نقطه ای از تاریخ طراحی وب قرار داریم که نیازی به نگرانی درباره وضوح نداریم. بیشتر افراد از مانیتورهای صفحه گسترده استفاده می کنند و همین عامل موجب می شود تا نیازی به حداکثر کردن پنجره مرورگر خود نداشته باشند و این یعنی ساده تر شدن کارسایت برای طراحان.
چرا طراحی استاندارد صفحات وب از اهمیت بالایی برخوردار است؟
با توجه به اینکه کاربران ما از صفحه های نمایشگر مختلف با ابعاد متفاوت و رزولیشن های مختلف استفاده می کنند و حتی کیقیت نمایش رنگ در آنها نیز متفاوت است ما نمی توانیم طراحی خود را به گونه ای انجام دهیم که برای همه آنها خروجی یکسانی داشته باشد. از طرفی فرصت و شرایط آن هم وجود ندارد که وب سایت خود را در تمامی مرورگر ها و تمامی نمایشگر ها تست کنیم، پس در چنین شرایطی دنبال کردن خط مشیی به نام استاندارد اهمیت پیدا می کند.
در یک نظرسنجی غیررسمی از کارکنان یک شرکت که همه از لپ تاپ هایی با وضوح تصویر 1024*760 استفاده می کردند ، دو نفر تمام برنامه های خود را در حالت حداکثر نگه داشته و بقیه به دلایل مختلف دارای پنجره هایی با اندازه های متفاوت بودند. این آمار نشان می دهد که اگر شما برای سایت این شرکت عرض 1024 پیکسل را انتخاب کرده باشید ، 85 درصد از کاربران برای دیدن کل صفحه باید به صورت افقی حرکت کنند.
عرض استاندارد طراحی صفحات وب چقدر است؟
پس از یک بررسی کلی و نظر سنجی دریافتیم که اکثر مخاطبان این روز ها از نمایشگرهایی با رزولیشن 768*1024 استفاده می کنند .بنابراین عرض استاندارد ابعاد سایت متناسب با این رزولیشن می تواند ۹۶۰ پیکسل در نظر گرقته شود. در واقع این عرض باید به گونه ای انتخاب شود که اکثر کاربران بتوانند بدون مشکل و بدون تغییرات ظاهری از وب سایت استفاده کنند.با توجه به اینکه اندازه استاندارد تصاویر وب سایت به نوع محتوای وب سایت و گرافیک آن نیز بستگی دارد قبل از هر چیز در طراحی سایت باید به کاربرد سایت و موضوع آن توجه ویژه کرد.
اما چرا عرض 960 پیکسل به عنوان عرض استاندارد طراحی صفحات وب تعیین شده است؟
یکی از دلایل استفاده از این اندازه که، مهمترین دلیل آن نیز هست این است که بسیاری از مخاطبان از تمام صفحه مانیتور یا نمایشگر خود برای دیدن صفحات وب استفاده نمی کنند( FullScreen) و مقداری از فضا در صفحات مرورگرشان به، عنوان صفحه ، قسمتهای مربوط به آدرس صفحات وScroll ها منوها، و. اختصاص دارد که در مرورگرهای مختلف متفاوت است.
در نظر گرفتن عرض ۹۶۰پیکسل به عنوان عرض استاندارد به شما کمک می کند تا با وجود این اجزاء عرض صفحه شما به Scroll کردن احتیاج نداشته باشد. در تعیین این اندازه فضاهایی که این اجزاء اشغال می کنند هم در نظر گرفته شده بنابر این ، نگران این اجزاء نباشید وبه راحتی از این اندازه استفاده کنید.
این عرض بر طبق استانداردهای صفحه بندی سایت انتخاب شده است، به این معنی که شما می توانید به راحتی از استانداردهای صفحه بندی در صفحات وب خودتان استفاده کنید و نگران چیزی نباشید. این اندازه می تواند شما را در پیاده کردن طرح های مختلف از نظر صفحه بندی و ساختاری و البته استاندارد یاری کند.
نکته قابل توجه این است که بسیاری از مراکز دولتی، ادارات و … کماکان از مانیتورهایی با رزولوشن ۸۰۰×۶۰۰ استفاده میکنند که این عدد برای عرض استاندارد تعیین شده برای صفحات وب قابل قبول نیست. اما باید برای آنها هم فکری کرد چون مخاطبان مهمی هستند در عین اینکه کاربران به روزی نیستند.
چند روش برای بر طرف کردن این مشکل وجود دارد:
اول اینکه از دستورات CSS برای کنترل صفحات در رزولوشن های مختلف استفاده کنیم و دوم اینکه یک وب سایت با عرض متغیر برای تمامی رزولوشن ها طراحی کنیم که البته کار بسیار تخصصی و دشواری است.
نکات مهم در طراحی سایت با عرض 960 پیکسل
در ادامه این مقاله فرض میکنیم که اندازه عرض وب سایت ما به صورت ثابت ۹۶۰px در نظر گرفته شده که برای رزولوشن ۱۰۲۴×۷۶۸ مناسب است.گام بعدی چیست؟
در ادامه باید به نکات زیر توجه کنید:
اگر ( دایرکشن ) و یا چینش وب سایت ما(که معمولا با زبان فارسی نوشته شده است) از راست به چپ باشد تنها قسمتی از سایت، که در دید اولیه نمایش داده نمیشود منوهای سمت راست آن است و تمامی محتوای وب سایت که بخش اصلی آن نیز هست بدون اینکه احتیاج به Scroll صفحه باشد، نمایش داده میشود!البته این یک راه حل حرفه ای و۱۰۰% نیست .چرا که اگر چینش و یا Dir از چپ به راست باشد قسمتی که نمایش داده نمیشود منوهای سمت راست هستند که بیشتر در وب سایتهای انگلیسی زبان استفاده می شود.
بیشتر بخوانید: نکات مهم طراحی فروشگاه اینترنتی حرفه ای
سخن آخر
در کل هر روشی مزایا و معایب خاص خود را دارد اما شما باید روشی را برای کار خود برگزینید که مزایای آن بیشتر از معایبش باشد. می توانید با کارشناسان رایا پارس مشورت کنید تا بتوانید بهترین روش را انتخاب کنید.
انتخاب عرض 960 پیکسل به طور ثابت برای سایت ممکن است معایبی نیز داشته باشد ( در رزولوشن های ۸۰۰×۶۰۰) ولی محاسنش بسیار بیشتر از معایب آن است و به همین علت اکثر طراحان این استاندارد را طراحی خود به کار می گیرند.