عرض استاندارد طراحی سایت چقدر است؟

عرض استاندارد طراحی سایت چقدر است؟

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

اهمیت توجه به رزولوشن صفحه نمایش

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

سایز صفحه نمایش و ابعاد سایت

 

سایز صفحه نمایش و ابعاد سایت

 

در سال 1995 میلادی مانیتورهایی که از وضوح استاندارد 480*640 برخوردار بودند، پرکاربردترین و بهترین مانیتورها محسوب می‌شدند. برای همین طراحان در آن زمان این ابعاد را اولویت کار خود قرار می‌دادند. طراحان سایت‌ها را به گونه‌ای طراحی می‌کردند که حداکثر بر روی مانیتور 12 اینچی تا 14 اینچی خروجی مناسبی داشته باشد. اما در حال حاضر شرایط تغییر پیدا کرده است و سایت‌هایی با وضوح 480*640 کمتر از یک درصد ترافیک سایت‌ها را تشکیل می‌دهند. چرا که ابعاد مانیتورها و وضوح آنها متفاوت شده است. امروزه رایانه‌هایی با وضوح بالاتر از 1366*768، 1600*900 و 5120*2880 بیشترین میزان استفاده را دارند. این گستردگی صفحات نمایش هم باعث شده تا طراحان کار راحت‌تری برای انتخاب رزولوشن مناسب در طراحی سایت داشته باشند. به عبارتی میتوان گفت در حال حاضر در نقطه‌ای قرار داریم که طراحان نگرانی زیادی نسبت به وضوح صفحه نمایش ندارند و کار طراحی سایت برای طراحان راحت‌تر شده است.

چرا طراحی استاندارد صفحات وب مهم است؟

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

بهترین رزولوشن صفحه نمایش در طراحی سایت

 

بهترین رزولوشن صفحه نمایش در طراحی سایت

 

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

  • 1920*1080 – 8.97%
  • 1366*768 – 6.62%
  • 360*640 – 2.84%
  • 1440*900 – 2.27%
  • 1280*720 – 2.32%

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

سایز صفحه نمایش‌های دسکتاپ در طراحی سایت

در رابطه با سایز صفحه نمایش‌های دسکتاپ در طراحی سایت هم نمودارهای زیادی موجود است. با بررسی این نمودارها میتوان نسبت به برترین صفحه نمایش‌های جهان اطلاع پیدا کرد. بیشترین آمار سایز صفحه نمایش‌های دسکتاپ عبارت است از:

  • 1366*768 – 17.67%
  • 1920*1080 – 23.56%
  • 1440*900 – 6.07%
  • 1600*900 – 3.56%
  • 1280*720 – 6.09%
  • 1280*10024 – 1.86%

سایز استاندارد رزولوشن صفحه نمایش موبایل و تبلت

 

سایز استاندارد رزولوشن صفحه نمایش موبایل و تبلت

 

برای اطلاع از سایز استاندارد رزولوشن صفحه نمایش موبایل هم میتوان از نمودارهای موجود استفاده کرد. این نمودارها برای صفحه نمایش‌های موبایل یا اسمارت‌ فون‌ها در دسترس هستند که بر اساس آنها میتوان از بهترین سایز مطلع شده و آنها را در طراحی سایت لحاظ کرد. محبوبترین سایز صفحه نمایش موبایل عبارت است از:

  • 360*800 – 9.22%
  • 414*896 – 6.01%
  • 390*844 – 5.95%
  • 412*915 – 4.61%
  • 360*640 – 4.59%

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

  • 768*1024 – 30.54%
  • 810*1080 – 7.07%
  • 800*1280 – 7.02%
  • 601*962 – 4.85%

چرا عرض 960 پیکسل، عرض استانداردی برای صفحات سایت است؟

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

یک نکته قابل توجه این است که بسیاری از مراکز دولتی و ادارات همچنان از مانیتورهای دارای رزولوشن 800*600 پیکسل استفاده می‌کنند که این عدد برای عرض استاندارد تعریف نشده است. برای همین باید به این موضوع هم توجه کرده و مشکل را برطرف کرد. برای برطرف کردن این مشکل میتوان از دستورات CSS جهت کنترل صفحات در رزولوشن‌های مختلف استفاده کرد. همچنین میتوان یک سایت با عرض متغیر برای تمام رزولوشن‌ها طراحی کرد که این کار بسیار تخصصی و دشوار است.

اندازه استاندارد تصاویر وب سایت

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

از آنجایی که صفحه مانیتور ابعاد کوچکی دارد، کیفیت 72 dpi و 300 dpi در آن به چشم نمی‌آیند. حجم یک عکس با این دو کیفیت بسیار متفاوت است و ممکن است حجم تصاویر با کیفیت 300 dpi تا 6 برابر 72 dpi هم برسد. برای همین تصاویر معمولا با کیفیت 72 dpi در سایت قرار داده می‌شوند.

اندازه تصاویر سایت و تصاویر شاخص محصول

 

اندازه تصاویر سایت و تصاویر شاخص محصول

 

ابعاد استاندارد یک عکس در محتوای متنی دارای 800 پیکسل عرض و 600 پیکسل ارتفاع است. این ابعاد از نظر زیبایی‌شناسی بسیار حائز اهمیت است. ابعاد 600*800 و همچنین 400*600 برای نمایش تصویر با جزئیات بسیار مناسب هستند. ابعاد اشاره شده ابعاد استاندارد تصویر در سایت هستند که بسته به سلیقه طراح یا کارفرما میتوانند مورد تغییر قرار بگیرند. هیچ محدودیتی هم در این رابطه وجود ندارد.

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

جمع بندی

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

 

0 0 رای ها
امتیاز شما به این مطلب
اشتراک در
اطلاع از
guest
0 نظرات
بازخورد (Feedback) های اینلاین
مشاهده همه دیدگاه ها
0
افکار شما را دوست داریم، لطفا نظر دهید.x