نمایش نتایج 1 تا 8 از 8

نام تاپیک: روش صحیح نمایش عکس در صفحه ی وب

  1. #1

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

    سلام عرض میکنم خدمت اعضای محترم انجمن
    ببخشید یک سوال داشتم:

    من یک
    carousel
    دارم که تعدادی عکس رو نمایش میده. زیر این عکس ها هم یک سری متن دارم.
    مشکل اینه که وقتی کاربر عکس ها رو میبینه به دلیل اینکه ارتفاع عکس ها متغیره نوشته های زیر هم جابجا میشن هی میرن بالا هی میان پایین.
    من برای رفع این مشکل به ذهنم رسید که به عکس ها
    height
    بدم مثلا بگم ارتفاعشون ۵۰۰ پیکسله. اما این باعث میشه که عکس ها کشییییدگی داشته باشن و خیلی زشت نمایش داده بشن.

    حالا رویکرد درست چیه؟ ایا من میتونم از سرور انتظار داشته باشم که عکس هایی که برام میفرسته همه یک اندازه باشن؟
    ایا باید با سی اس اس مشکل رو حل کنم؟
    این عکس ها رو درواقع کاربر خودش اپلود کرده و حالا باید بتونه ببینه و کاربر ممکنه عکساش هراندازه ای داشته باشن.

    خیلی ممنون بابت راهنمایی یا هرگونه لینک و فیدبک

  2. #2

    نقل قول: روش صحیح نمایش عکس در صفحه ی وب

    مشکل شما اینجاس که فکر میکنید کاربر میتونی هر عکسی رو قرار بده و سرور هم کاملا هوشمنده میتونه هر کاری بکنه
    شما باید تصاویر رو دقیقا توی یک سایت قرار بدید
    حتی بدونی اینکه 1px بالا پایین داشته باشه
    زمانی که سایت رو آپلود کردید به مشتری میگید مثلا سایز اسلایدر 750 در 300 هست

  3. #3

    نقل قول: روش صحیح نمایش عکس در صفحه ی وب

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

  4. #4

    نقل قول: روش صحیح نمایش عکس در صفحه ی وب

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

  5. #5

    نقل قول: روش صحیح نمایش عکس در صفحه ی وب

    نقل قول نوشته شده توسط سعید کشاورز مشاهده تاپیک
    سایت هایی مثل شیپور و دیوار عکس رو ریسایز نمیکنن Crop میکنن.
    crop کردن عکس باعث میشه یک سری از قسمت های عکس برش بخوره
    شما دارید در مورد اسلایدر صحبت میکنید. اسلایدر یعنی یک سری تصویر پشت سر هم. خب وقتی ارتفاع هر کدوم نا هماهنگ باشه مثلا پله میکنه و بالا پایین میشه
    شما به سایت دیجی کالا برید و تصاویر محصولات رو ذخیره کنید. میبینید که حتی یک پیکسل بالا پایین نداره
    طبق گفته ی شما به سایت دیجی کالا رفتم و عکس ها رو ذخیره کردم و بله حرف شما کاملا درست بود چون تمام عکس هایی که ذخیره کردم ابعاد
    500 *500 داشتن و حالا این اندازه های یکسان چطور بدست اومده؟ وقتی کاربر عکس رو اپلود میکرده سمت بک اند به ابعاد پانصد در پانصد resize شده؟

    به سایت شیپور رفتم و چند عکس رو ذخیره کردم. هیچ کدام از عکس ها ابعاد یکسان نداشت. و اینکه شما میگید شیپور کراپ میکنه خلاف چیزیه که من دیدم چون من
    رفتم وارد سایت شیپور شدم که یک آگهی ایجاد کنم و موقع اپلود عکس ها ازم نخواست کراپ کنم. آیا منظورتون این بود که سمت بک اند دارن عکس ها رو کراپ میکنن؟

  6. #6

    نقل قول: روش صحیح نمایش عکس در صفحه ی وب

    نقل قول نوشته شده توسط سعید کشاورز مشاهده تاپیک
    مشکل شما اینجاس که فکر میکنید کاربر میتونی هر عکسی رو قرار بده و سرور هم کاملا هوشمنده میتونه هر کاری بکنه
    شما باید تصاویر رو دقیقا توی یک سایت قرار بدید
    حتی بدونی اینکه 1px بالا پایین داشته باشه
    زمانی که سایت رو آپلود کردید به مشتری میگید مثلا سایز اسلایدر 750 در 300 هست
    این پست شما با پست بعدی کاملا در تناقض هست. اینجا گفتید که سرور نمیتونه کاری بکنه و فرانت اند کار باید ابعاد عکس رو برای ذخیره در پایگاه داده یکسان کنه که بتونه
    موقع نمایش هم ابعاد یکسانی داشته باشه.
    اما در پست بعدی گفتید که شیپور عکس ها رو کراپ میکنه که با توجه به اینکه اینکار سمت فرانت اند انجام نمیشه پس قطعا داره سمت سرور کراپ میشه.

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

  7. #7
    کاربر دائمی آواتار rahmatipoor
    تاریخ عضویت
    شهریور 1392
    محل زندگی
    ---
    پست
    418

    نقل قول: روش صحیح نمایش عکس در صفحه ی وب

    با استفاده از کلاس ImageResizer که لینکش رو براتون قرار دادم، تصاویر رو بعد از اینکه آپلود شد ، تغییر اندازه بدید و بعدش ذخیره کنید

    ImageResizer.cs

  8. #8

    نقل قول: روش صحیح نمایش عکس در صفحه ی وب

    نقل قول نوشته شده توسط rahmatipoor مشاهده تاپیک
    با استفاده از کلاس ImageResizer که لینکش رو براتون قرار دادم، تصاویر رو بعد از اینکه آپلود شد ، تغییر اندازه بدید و بعدش ذخیره کنید

    ImageResizer.cs
    سرور من با سی شارپ نیست اما نکته ای که از پیام شما میشه دریافت کرد این هست که تغییر اندازه ی عکس در سمت سرور انجام میشه. مثلا من خودم در پایتون با کتابخانه ی pillow
    تغییر اندازه داده ام.
    بعضی از سایت ها هستند که اندازه ی عکس ها را تغییر نمی دهند و باز هم بدون کشیدگی نمایش می دهند من خودم برای حل این مشکل از
    https://www.w3schools.com/css/css3_object-fit.asp
    استفاده کردم هرچند گمان می کنم هنوز پاسخ نهایی را نیافته ام و امیدوارم افرادی که تجربه ای در این زمینه دارند روزی چشمشون به این تایپیک بیفته و راهنمایی کنند

برچسب های این تاپیک

قوانین ایجاد تاپیک در تالار

  • شما نمی توانید تاپیک جدید ایجاد کنید
  • شما نمی توانید به تاپیک ها پاسخ دهید
  • شما نمی توانید ضمیمه ارسال کنید
  • شما نمی توانید پاسخ هایتان را ویرایش کنید
  •