R
R Reyes
Hi!
This discussion may help other programmers get a better idea of how to save
uploaded images through a website.
Why? Well currently, I save 3 versions of every uploaded image on my own
little website:
1. Small: DOWNsize of original image to be used as a thumbnail.
2. Medium: DOWNsize of original image to be used as user avatars/icons in
forums or profiles.
3. Large: Original non-resized version of the image for if a user clicks to
see the image as it was submitted/uploaded to the website.
Obviously, it is a terrible idea to have 3 separate images. Good thing
traffic is low! With that, my thoughts on saving the images are:
1. I *think* that UP-sizing an image messes up the quality more than
DOWN-sizing. So, should I only save the image one time, as its original
size, then do dynamic resizes every time the image is requested from a web
page?
- Concern: Would this also mean I should only allow people to submit
images of larger (and more manageable) sizes to the website such as 400x400
so that I can always DOWN-size and keep up the quality?
2. What about panoramic or vertical view pictures? What's the best way to
resize this specific type of image to fit an exact width/height nicely?
- Problem: If I resize a normal image to 200x300 the image will look
okay, BUT (always a but!) if that same picture was a panoramic version it
would look deformed and weird...not to mention terrible quality! Also,
resizing by percent never does a good job and leaves too much "whitespace" in
the background/canvas.
- Example: If I have a bunch of images, 25 images, which should all be
displayed as 200x300 in a table 5 rows and 5 columns, the resize formula will
work in terms of displaying the images in a table with the correct width and
height.
- HOWEVER, the resize will not work well in the example above UNLESS
all pictures are near same dimensions and none are panoramic/vertical views.
The images will all be displayed as 200x300 neatly in a table but the actual
images may look REALLY deformed (again, terrible quality!). This usually
happens when a mix of panoramic or vertical sized images from a camera are
submitted and displayed in a table with normal 4x6 (inches) camera sized
images.
3. When displaying images in a table, do websites use a specific formula
that works with all kinds of pictures, normal, vertical, and panoramic?
-SUPER FORMULA??: Maybe these websites use a formula that tests
widths/heights to see if a picture if normal, panoramic, vertical, and then
resizes based on that result? I could see it this way, however I haven't
seen any examples for this on the web, so I wouldn't know how to do this.
Most websites I've seen have source/explanation for:
1. Resizing to thumbnail.
2. Resizing to width X and height Y.
3. Resize by percent.
4. Resize for quality.
HOWEVER, they do not take into account the dimensions of the image that was
submitted (panoramic, vertical, or normal).
Hopefully you all understand my issue and can shed some light on the subject
as I'm STILL not sure what is best to do but I hope to code images being
saved the right way some day!
Thanks much for your time!
This discussion may help other programmers get a better idea of how to save
uploaded images through a website.
Why? Well currently, I save 3 versions of every uploaded image on my own
little website:
1. Small: DOWNsize of original image to be used as a thumbnail.
2. Medium: DOWNsize of original image to be used as user avatars/icons in
forums or profiles.
3. Large: Original non-resized version of the image for if a user clicks to
see the image as it was submitted/uploaded to the website.
Obviously, it is a terrible idea to have 3 separate images. Good thing
traffic is low! With that, my thoughts on saving the images are:
1. I *think* that UP-sizing an image messes up the quality more than
DOWN-sizing. So, should I only save the image one time, as its original
size, then do dynamic resizes every time the image is requested from a web
page?
- Concern: Would this also mean I should only allow people to submit
images of larger (and more manageable) sizes to the website such as 400x400
so that I can always DOWN-size and keep up the quality?
2. What about panoramic or vertical view pictures? What's the best way to
resize this specific type of image to fit an exact width/height nicely?
- Problem: If I resize a normal image to 200x300 the image will look
okay, BUT (always a but!) if that same picture was a panoramic version it
would look deformed and weird...not to mention terrible quality! Also,
resizing by percent never does a good job and leaves too much "whitespace" in
the background/canvas.
- Example: If I have a bunch of images, 25 images, which should all be
displayed as 200x300 in a table 5 rows and 5 columns, the resize formula will
work in terms of displaying the images in a table with the correct width and
height.
- HOWEVER, the resize will not work well in the example above UNLESS
all pictures are near same dimensions and none are panoramic/vertical views.
The images will all be displayed as 200x300 neatly in a table but the actual
images may look REALLY deformed (again, terrible quality!). This usually
happens when a mix of panoramic or vertical sized images from a camera are
submitted and displayed in a table with normal 4x6 (inches) camera sized
images.
3. When displaying images in a table, do websites use a specific formula
that works with all kinds of pictures, normal, vertical, and panoramic?
-SUPER FORMULA??: Maybe these websites use a formula that tests
widths/heights to see if a picture if normal, panoramic, vertical, and then
resizes based on that result? I could see it this way, however I haven't
seen any examples for this on the web, so I wouldn't know how to do this.
Most websites I've seen have source/explanation for:
1. Resizing to thumbnail.
2. Resizing to width X and height Y.
3. Resize by percent.
4. Resize for quality.
HOWEVER, they do not take into account the dimensions of the image that was
submitted (panoramic, vertical, or normal).
Hopefully you all understand my issue and can shed some light on the subject
as I'm STILL not sure what is best to do but I hope to code images being
saved the right way some day!
Thanks much for your time!