What resolutions should I create for photos that are uploaded - image

I'm currently working on my church's new website which includes a gallery. The one hiccup I ran into is that they like to upload photos that are 6mbs which is obviously not web friendly. At the time, I used a php script to thumbnail and output the image, but this time I'd like to just do that all on the upload. In other words, I want the photo to be uploaded in several different sizes - a thumbnail size, a full size for the lightbox and the original for download.
My question is what sizes should I consider. The thumbnail is obviously going to be according to the design of the site, but what about the one meant for a lightbox and should I include another resolution for let's say, mobile?
EDIT: If I'm going about this all wrong, then please lead me in the right direction!

Related

How to make thumbnails in wordpress play audio after click through stratus

I probably searched through the entire web but couldn't find any help on this. Before I ask the question I must mention that I am a complete novice in web development.
I went through a lot of websites that enable you to play audio through stratus after clicking on a thumbnail. Although websites like indieshuffle.com and themusicninja do not use stratus, I was wondering how they get their photos to play songs in their audio players.
Similarly, I don't want my thumbnails to link to the post but instead I want people to play the corresponding soundcloud track after clicking on the thumbnail. Also, if it is possible to have play/pause buttons on the thumbnails it will be great.
Of course, I have ajax and stratus as well as the full width audio player installed as plugins.
I am guessing this has to do with embedding the shortcode for the track somewhere in the image.
Please help!!!
since you are complete new your best bet here is an album plugin or something
that will let you attach an image and have a mp3 file to relate to, and be displayed without much knowledge in coding.

Webmatrix image uploader (change quality to 72dpi)

I am currently building a new website in WebMatrix, and have successfully added functionality to upload and resize images using the image helper. My question is, does this tool have the functionality to change resolution too? i'm concerned that people will upload pics taken with high resolution cameras, and even though i resize the images, they are still large in file size?
The WebImage helper (if that's what you are using) doesn't incorporate advanced image manipulation features. You can write your own code to change an image's resolution once the image has been saved - or borrow some that someone else has already written, such as the highest voted answer to this SO question on the same topic.

PHP Image Upload Resize, Watermark, Title & Copyright Info

Ive written an image upload and resize script for my website which allows users to upload images, and then the script resizes the images in 3 different sizes and adds a watermark image (my website logo) on the top.
The problem I have is, that if a user then tries to upload one of the resized photos again, it will then add the logo watermark on top of it again.
What I want is to maybe add some information to the uploaded image (i.e. author, which I could set to my website name), so that if a user uploads an image which has already been watermarked, I can put a check in my script so that I dont add the watermark logo again.
Is this possible with PHP?
Take a look at this http://www.php.net/manual/en/function.iptcembed.php

Flash image upload with mandatory crop?

Anyone know of a Flash file (image) uploader that will force a user to resize and/or crop their image BEFORE uploading it? To then upload it as well.
Basically, I don't want my server processing the image resize/crop. I want to specify a target aspect ratio and have the user resize and crop their image to make it fit.
I've seen cropping uploaders before but they all seem to be server side. I saw a Flex one but I'm not sure it's "mandatory" -- Basically if the user just uploads the image without making edits, then I'd like the Flash to scale and fit the image into set dimensions...Leaving it I guess short in one direction to not stretch.
Anything like this out there?
Thanks!
I have a bounty running with a very similar question, be sure to take a peek - there isn't anything there yet that does client side resizing, though.
Also, SWFUpload is said to support it in the new Beta, but the feature is very sparsely documented right now. You would probably have to work on it to get it running the way you want.
http://www.adylevy.com/index.php/2009/07/22/multiple-files-uploader-with-preview-on-client-side/
there was another one called resize before upload but the site went down. though while I'm updating this and we're on the subject -- I don't see why you'd want to use Flash these days for this task. There are plenty of JavaScript options and now we also have Google's Dart (which builds JavaScript).

AJAX Thumbnails

Does anyone know of any free frameworks that help you create thumbnails for web pages, that when clicked, the original image loads ontop of the page (modal like), as oppossed to opening a separate page.
Thanks!
This is really 2 questions in 1. The "lightbox" display of the original, larger sized, images in a modal box is handled in JavaScript with a library such as ThickBox. The resizing of the images can be done manually, or via some kind of code on the server side. Sitepoint has a decent guide on how to resize server side with PHP. I hope this helps point you in the right direction.
Lightbox.
http://planetozh.com/projects/lightbox-clones/
I've used DhoniShow a few times in the past, and clients really liked it. It's not AJAX, as it loads all the full sized images on page load, but if you were motivated I'm sure you could make that change pretty easily.
As have been already said, you can use Lightbox to get the effect to the user, I would use it with its ajax mode, loading the thumbnail as its contents.
Now for the thumbnail, I would recommend you something like http://megasnaps.com/ wich you can use for free.
Good luck.

Resources