نکاتی که باید برای گالری تصاویر در طراحی سایت واکنش گرا رعایت بشن

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

طراحی سایت

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

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

طراحی سایت کنش گرا

دکمه های ناوبری رو در اسلایدشو هوشمندانه به کار ببرین

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

طراحی سایت حرفه ای

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

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

طراحی تجربه کاربردی

کپشن تصاویر رو حذف کنین

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

طراحی وب سایت

به عرض تصاویر در طراحی سایت واکنش گرا دقت کنین

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

طراحی وب سایت کنش گرا

گالری تصاویر و ویدئو رو با هم ترکیب نکنین

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

مقیاس دهی تصاویر رو دستی انجام بدین

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

حسی که کاربر در حین کار با سایت شما داره، تاثیر زیادی در بالا رفتن رتبه اون از نظر سئو داره. به همین خاطر در کنار طراحی سایت باید تا به تجربه ی کاربردی و واکنش گرا بودن سایت توجه بشه. زمانی طراحی تجربه ی کاربردی میتونه به نتیجه ی مطلوب دست پیدا کنه که از توجه به کوچکترین نکات غافل نشین. برای داشتن طراحی سایت با بهترین تجربه ی کاربردی میتونین با تیم طراحی سایت ظریف گرافیک تماس بگیرین.

46 بازدید | نوشته شده در 05 خرداد 97
توسط تیم ظریف گرافیک |

تگ ها : طراحی طراحی گرافیک طراحی سایت طراحی تجربه کاربردی طراحی ux ux ui طراحی رابط کاربری ظریف گرافیک
ثبت نظر

مقالات مرتبط


به ظریف گرافیک امتیاز دهید