Understanding how to properly crop and size your photographs for optimum web viewing is important if you’re trying to share your doll with the community. Although it seems that most everyone is on high-speed internet connections these days, there are still a substantial amount that log on using dial-up. Huge digital images will always time out for a slow internet connection, but can also bog down even higher speed providers. It may very well be true that your images are timing out for some of your viewers or loading so slowly that your potential viewer is navigating away from your page! Nearly every single image you capture digitally is going to require some form of post-capture work in editing software. Not all these programs work the same or have the same options, so please, if any of this information doesn’t seem to fit in with your workflow or your software program, just ask a question! ~***~ There are some users who are uploading photographs directly from their camera – nine times out of ten; these files are just too large to load quickly or at all. If you can downsize your images in-camera and you know you won’t be doing any software editing, then please consult your manual and set your camera options to those best suited for web viewing. ~***~ File size and image size are two different things. Some people prefer to think of their images in pixel sizes, I don’t because I worked with film-based photography for too long to go completely pixelized. I find that cropping to “Industry Standards” for image sizing is the best way to maintain a consistent and easily viewable sized image. However, you need to keep in mind the highest output of YOUR camera – you may or may not be able to print larger image sizes at high resolution. Industry standards for photograph sizes are as follows: 3 ½ x 5, 4 x 5, 4 x6, 5 x7, 8 x 10, 11 x14 and so on. These are standard sizes and these sizes are based on rectangles. Discussions about breaking out of these “standards” are fine – but keep in mind that framing for custom sizes is very expensive as is custom printing, even on home printers; you are going to have paper waste. 4 x 4, 5 x 5, 8 x 8, etc are square images and something that go in and out of fashion. Square for the most part is relegated to an “artier” look than rectangular images. Bear in mind, if you use square you should be using it consciously and with purposeful intent. DaVinci’s Vitruvian Man http://en.wikipedia.org/wiki/Vitruvian_Man is a perfect and flawless example of the best imaginable use of “square.” Cropping and value sizing are important in printing images, not as important online, but still there are dimensions that need to be understood so that the correct crop can be obtained for your image. Obviously, you can disregard this entire thing and crop to whim, but if you are going to pursue photography, either in school or at your local PicturePeople in the Mall, you will need to understand Standard Image Size. (I’m not a conformist by any *cough* stretch of anyone’s imagination, but sometimes you have to go along with the program until you don’t have to anymore. I know that sounds “zen-ish” but think about it.) 4 x 5 is probably the smallest size you want to crop. 3 ½ x 5 is almost too small. 4 x 6 is awkward for most portrait work because it’s narrow (and yes, that is the size print you get back from your store-based printers). A 4 x 5 crop will automatically resize to 8 x 10 which is far too large for online posting, and a 3 ½ x 5 enlarges to a 5 x 7 which is the largest photo that is easiest to view online. Esthetically, if you’re posting multiple images together, you want to keep rectangles with rectangles and squares with squares. Sizes complement each other – 4 x 5 photos should really stay with 8 x 10 and 3 ½ x 5 crops should be used with 5 x 7 enlargements. You should have an idea before you begin image manipulation what size you want your final photo to be, remember that a 4 x 5 enlarges to an 8 x 10 NOT a 5 x 7, so if you create a fantastic 4 x 5 image it will NEVER be a 5 x 7 and the different crop required could very well alter the composition of your beloved image. This is a mathematical situation, obviously, but something that could affect a final size of your finished photograph. ~***~ Here is the mathematical formula needed to figure out the pixel height and width of your image for both print and web use. For print multiply the image size by 300dpi, for web mulitply image size by 72dpi – Example – 5 x 7 inch print will be 1500 x 2400 pixels 5 x 7 inch web image will be 360 x 504 pixels ~***~ Here is my workflow – ask questions or add comments and tips of your own! Set your camera to its highest/finest resolution. Take your photograph. Bring the image into your software. Look at the image for a moment, decide if it’s vertical or horizontal. Decide if it’s a portrait, or part of a photostory. Decide if it’s a 4 x 5 or a 5 x 7. Set your crop options to size the crop in inches. Use your cropping tool to crop the image to that size. Then use “save as” say - ”SmexyShiwoo 1” Close the original image – do not save any changes made to it!!! This is your pristine original and if you have the harddrive space, you should keep it in its raw form or if not, burn it to disc. (You will end up with two more images saved to your harddrive – one that will be a 5 x 7 but at minimum 300 dpi in case you want to print your photo, the other will be a 5 x 7 at 72 dpi – this is the one you’re going to use online.) Begin working on “SmexyShiwoo 1.” This could be a tiff file, a jpg, or any other number of imaging file types. Use your “image size” option and make sure you’ve got the correct size print – ie 5 x 7, then change the dpi to 72. Your image should shrink considerably, tell your software to show you the image at the actual pixel size and you should see your image become the size of your original crop - you should now be looking at a 5 x 7 image. Use “save as” once more, but you will have to change your title to…”SmexyShiwoo 1 lowres” and save it as a jpg file. Now you have three images in the folder – the original raw, titled by your camera’s software, the large res “SmexyShiwoo 1” and the low res “SmexyShiwoo 1 lowres” You are now ready to close the image – you should be prompted with a window that allows you to downsize the image digitally even more. Again, you can lose quality if you go to low, but a mid- point should keep the quality and yet make the image substantially smaller kb-wise. Do others have different experiences/advice?
Just a few things: When resizing for Web, it's often helpful to think more in terms of pixel size versus print size. Print size is great for printing and determining what size frame to get, but many people have different sizes of monitors, so using a print size might render differently on monitors, causing people to scroll either horizontally or vertically. So, if you have a 24 inch monitor...a 5x7 looks great. If you have a 15" monitor, a 5x7 image is a little bit too big, and might cause you to have to scroll pending the size of your browser window. Some things to think about: -- Images should not be too big (causing people to have to scroll) or too small in that people have to squint. 100 x 100 pixels is normally considered "thumbnail" size. It's about the size of an avatar on almost all forums. 300 x 300 pixels (or thereabout) is still small. 500 - 600 (on the longest side) is about where you want to resize your images. If you want something bigger, 800 pixels is the "largest" you should scale your Web image (in the longest size -- either 800 wide or 800 tall). Otherwise, this image size allows people to download your image and print a decent size 5x7 or 8x10 of your photograph. If that's not what you want,then don't make it this big. -- As noted before, Web images are viewed at 72dpi. Consequently, trying to use a "higher quality" of compression is almost fruitless. There's really no difference at all between files where one has a higher compression rate versus another. All it does it create a bigger size file, which translates into a longer rendering time (esp. on dialup.) Select the image quality of compression that results in about a 100KB file size. If you don't have a resizing application, like Photoshop or PaintShop, Flick has a nifty sizing tool on their accounts that you can use to resize your images (you have to be a member tho'). Then you can download that resized image or just link to it. Or you can dowload a simple, free resizer from Microsoft http://www.microsoft.com/windowsxp/downloads/powertoys/xppowertoys.mspx
This is an interesting way to look at resizing. I don't understand how you come up with standard sized images, though. At 600 pixels on your longest side at 72 dpi, you are going to be left with an 8.3 inch long side - how does that translate to online viewing? Because no matter how big your monitor is physically, it's resolution that determines what size image will fill it up. So, if one crops to Print or Image Size and then Resizes at 72dpi, the pixel size is going to be reflected in the mathematical formula I gave above. Hmmm....I love seeing how others work in all this newfangled technology! As far as your personal workflow - how do you crop your image? What options are you using? With compressing UP - definitely, compressing DOWN can result in quality loss.
First, I think you're confusing WEB IMAGING size with PRINT size. I'm not saying your mathematical formula doesn't work, but when you're looking to size images specifically for the Web, you have to think of pixels...not inches. Otherwise, you run the chance of making your images to big. You're trying to make a correlation between Print (inches) and Monitor (pixels) sizes, and they don't convert well using one or the other. Yes, there is a correlation, but you can't interchange the verbage of one to another. (Bear with me on this next part) If you're designing a webpage, you have to consider the average size of monitors is 17"-19", which most users run at about 1280x1024 pixels. So, you take the average size of a monitor, consider the size of the actual web page, which might fill up the entire screen, say 1000 pixels, consider any menus, graphical elements, and other items, then you can see that about 500-600 pixel image (on the longest size) would be about a good decent size image on that 1280x1024 resolution monitor. If you hold up a 5" x 7" picture on your average size monitor, you'll see that it takes up a *lot* of space. If you look on my portfolio, almost all my images are 500-600 pixels on the longest side. Again, in terms of screen, not that large. (Take a look at this URL, which shows you grids for standard monitor sizes. http://www.wpdfd.com/browsergrid.htm. This helps you determine how big a web page is, which in turn helps you figure out the size (by Pixel, not inches) how big something on screen should be.) Another FAQ that's helpful[/quote] Personal workflow: 1) shoot in RAW 2) Convert to TIFF 3) Work image in photoshop. Save Files. 4) Three step process. a -- Batch convert files to SRGB for Web Viewing b -- Batch image resize images to 500-600 pixels on the longest size. Use Save to WEB -- JPG highest quality option. If I want to maintain the EXIF, then use SAVE, with the JPG option set to about medium compression. c -- close files w/o saving. Note: most of my images I can print at minimum sizes of 8x10s on up, so I have to always downsample images. Again, most of the images in my portfolio are 500-600 pixels. Some are 800, but I'm trying to standardize to 500-600 pixels on the longest side.
Actually, I realized I didn't necessarily answer your question regarding cropping. Right now, I try to compose photos prior to shooting according to the Rule of Thirds so I don't have to crop too much later. If I crop, it's minimal. My converted TIFF images are normally at approximately 3500x2400 pixels @ 300ppi, which roughly equals 12x8 @ 300 ppi (more or less) I try to crop so that my minimum print size is 8x10 @ 300 ppi. The biggest I've printed is about 16x20 @ ~150 or so ppi. When I downsample to Web, it's always about 500-600 at 72ppi.
Thanks JadeCat! I'm not confused at all, though. But I do understand what you're saying here. I think if we allow ourselves to lose standard image sizing because of how we want things to look on a webpage, then we need to accept that the entire industry is going to have a Ground Zero point of New Reference and that's absolutely fine. Evolultion in all things. However, for those of us who sell photographs for a living, standard imaging is optimum and the first and foremost consideration. Cropping and sizing for web viewing is secondary, so it just follows after print sizing that a web image should be the same dimensional interpretation. Edit - I think we may be getting a little off topic to what this post is about, however. We aren't actually discussing sizing for building web pages or image sizing for print or magazine style layouts, but rather optimum sizing both dimensionally and resolution wise for the best viewing by members in the Gallery forum. Many photos time out because they are too large of a file size or are difficult to view because they are too large in pixels.
You're right. Definitely off topic. I have helped design web sites for a living for many companies, and so, for web, I always think in terms of pixels for web design and web images. Since I run a part-time photography studio of my own, I always think in terms of standard print sizes for my photos,artwork, and framing. I put my images up on websites, and I have to make sure of two things: a) it's optimzed for web viewing no matter what, because if a person can't see the image they won't purchase the print and b) it's big enough to view, but not so big that someone won't *steal* an image to use for other things. You'd be amazed at how many people think it's "okay" to just download images from your website w/o permission. But, again, off-topic.
I don't think I'm going to get too off-topic by asking this question as I'm sure people would wonder this: Jadecat: As the topic here is about image resizing, file size also plays a part in it as people are concerned about their image files being easy to download (especially for those on slower connections). Sooooo, why do you convert your RAW files to TIFF then to JPG? I'm just curious as I shoot in RAW. When I'm ready to edit my image on Photoshop CS2, I just use the built-in RAW editor (or whatever you call it) and then save my image as a .jpg when I'm done.
That's an interesting workflow. What format do you save your larger res file that has been 'shopped as? I save mine as tiffs - for printing. I do hope everyone is saving their files here as jpgs or gifs....
Well, when I do print them, I've been saving them as jpg but at the highest quality? Should I save them to TIFF?
This is one of those "things" that can be argued for days in certain photography chat rooms. And throw the RAW in there and you've got yourself huge polar opposites on opinions, etc. I, personally, have neither the time nor the massive amount of gig space needed to shoot my pro stuff in RAW - I know, I know, some consider this a sacrosanct format - however because I'm using high-end digital capture - Hasselblad backs and pro Nikons, I feel that those in-camera/back programs actually do a better job with the raw information converted to jpg then I can do. For people. If you're shooting a lot of still life or landscape or product and you're only shooting a small number of frames and you enjoy tweaking post-capture, then RAW is a great bonus, as long as images are saved in another format because not all programs can read RAW and there may come a day that those digital negs could possibly be utterly unreadable. Some cameras shoot in a format that is both RAW and jpg. Saving my printable work as tiff is just something I've always done, caveat - if it ain't broken don't fix it. If you've been printing wonderful prints with a jpg format and you've already saved your pristine original and put it away and saved both your high-res and your low-res as separate files, then I don't see any reason you should change your workflow now. Have you tried having your jpgs printed on different types of printers? That output will be the only indicator you have of any loss your may or may not be experiencing. The other thing about jpg is that it IS lossy, in that every time you open the image you are adding a small amount of change to that image, tiff does not allow that degradation. I truly believe with digital imaging - we can all learn from one another, but if you've got a workflow and resultant product YOU are happy with it, you don't need to change because of what works for others.
Well, once I started shooting in RAW and using PS CS2 to edit it, I found that the colors were much more true to life and sharper? LOL! See, what I do is always save the original files. I wait till I use up all 4 of my 1gig cards, then I burn all the original images to dvd. All the "for the web" and "to be printed" jpgs are stored on my laptop. I eventually burn those to dvd, as well. I learned my lesson bout saving all original image files (unedited) when I had a massive computer crash and couldn't recover a lot of pics. Thing with printing tho, I have a Canon printer (my DSLR is Canon) so I tend to use the software that comes with the printer for printing. It makes it much easier to select the formats and print in large batches. I'm not sure if the program can handle TIFFs but I'll check. I know I can't print with GIFs tho. I did try to get my pics (in jpg) printed at various photo labs here and there was one time when their machines couldn't print my pics. I had already edited the pics with PS and for some reason, their machine would NOT recognize my image files! I went to another place and their machine was able to print my images right away.
Hey, if you've seen a difference in RAW, then I say hallelujah! Keep with it, girl! I use qimage to print - but again, if your proprietary setup is working, there is no need to change. I bet it can print tiffs, though.
I'll defintitely try the printing program with TIFF and see if there is an improvement in quality. So far, it prints my jpgs out really nicely. Yeah, RAW just seems so much more clear and sharp!
In photoshop I usually just resize my images to 20% to 30% of their origional size... Is this effective? I just got photoshop and am still learning these things. PS> This thread is very helpful
Hello Niku-Sama ~ Glad you're finding the thread helpful, we're a bit all over the place with it. I use PS 7.0 and I know there are slight variations between versions. I use the Rectangular Marquee Tool or hit "m" on your keyboard. The toolbar across the top gives me three options for cropping - Normal, Fixed Aspect Ratio, Fixed Size. I really prefer Fixed Aspect Ratio and I enter digits into the "width" and "height" windows - such as 5 and 7 or 4 and 5 and then drag out my marquee to my satisfaction in the opened image then go Image -> Crop. Once the image is cropped, I use Image -> Image Size to create the correpsonding file size. Ask questions if this is not helpful!
I'm barely qualified to post in this thread, but I can tell you what idrisfynn and I do to post photos on DoA. We rarely print anything, but we do plan to someday, so this thread has been very informative. idrisfynn shoots her photos using her Canon DSLR S2 in JPG format (usually 2592 x 1944, 1.6 MB). We dump them directly from the SD card to our 500GB MyBook, and then I open them in PS 7.0 to resize them. Since I know next to nothing about Photoshop, I use the Resize Wizard to resize for viewing on the web, with a fixed aspect ratio of 500 X 667, then save for the web at about 80%, and rename the file something easy like an abreviated form of the post's title and the number in the sequence. I'm sure there's a better way to do this, because it's a pain to resize each one individually. I'm quite interested in this batch resizing...?
Just a thought of advice on those needing help in this topic : 1. Never resize your images using forum tags or html tags one websites. First of all, it does nothing to help with file size, and secondly, depending on the degree of resizing, your image could turn out very spazzy. And you risk resizing in the wrong propotions. 2. Always make sure your pictures are resized proportionally. i.e. the width will automatically resize along with the length. 3. Always be aware that the zoom tool DOES NOT equal to the resizing tool. This is the most common mistake I've seen new people make, especially when using photobuckets, and occasionally on forum threads. When you open up your image in a photoshop or other image editing tool, they commonly zoom out to fit your screen. It is not, however, the actual size of your image. Especially not when the number up at the title bar says "IMG XXXX @ 3.33%". I hope those advice are still within topic, and I hope I didn't sound offending, but the last is my biggest, ever, pet peeve.
I have no software with resizing capabilities, and my camera software doesn't provide me that option as far as I know. So instead, I use resizing options on image hosting websites, Photobucket in particular. I've no idea how it affects file size or DPI (I'm flying half-blind here ), but it does make my pictures significantly smaller, with no noticable affects on the quality. Although, if one were to take a very zoomed-in picture to capture details, that might cause problems. I suppose for images like that, cropping would be the best option. The image hosting resize is rather appealing to me, because I can keep the original image on my computer and only have to store one copy of it on my hard drive space, instead of the two that resizing on my own would require. (Which might be a good option for those with little available storage space.) Like I said before I don't know how it affects image size, so it may end up being only a quick fix; at least it's better than nothing. When I resize my images I use the "Message Board (640 x 480)" option. To resize an image you click the small "edit" button on top of your photo, then choose the "Resize" option. Pick your preferred size from the drop-down menu. The best thing about this is that you can resize this copy of the picture without altering the original, the one that's saved on your own computer. No risk. ^^ Anyway, I hope this was helpful and not off-topic. I don't know much about photography, but maybe this can be of help to people like me with limited capabilities.
I know this may seem a little off topic, but if anyone wants a good, solid art program that will definately make resizing and/or editing photos easier (and is great for beginners)- look into a program called "The Gimp". It's completely free and legal and it can do almost everything that Photoshop and PaintShopPro can do, to boot. Gimp is pretty much self explanitory from the get go, so you don't have to worry about learning through tutorials or figuring out what strange lingo means. To bounce off of what Hyscara said, a lot of what Gimp does will make resizing easier, as the select tool and the zoom tool are completely different. It's well worth looking into.
This isn't so much of a how-to as it is a suggestion -- I never could figure out how to do this, I'm really pretty useless when it comes to photo editing software; but the webhost I use for my pics is free, and it does it automatically for me. thedollpage.com They have 2 albums; the first (for permanent pictures) got so big that they had to close membership. The second is for 90 days. You can also set up a private album, which if you get the code to post, everybody can see, but the album itself is private; good for the naughty pics some of us take. Um. (blush)
Personally, I just resize my pictures down to either 800x600 (or 600x800) for those amazing pictures I just can't make any smaller, and 450x600 (or 600x450) for everything else, add my name tag, and then save it as an uncompressed .jpeg (because I can't -stand- to see the compression, it kills my soul and makes Llana sad. XD). Is there anything wrong with doing it this way? o.o; I do all my resizing in The GIMP (it's an acronym, to explain the caps). One at a time. @.@
Second the vote on how useful the free shareware program The Gimp is for cropping and resizing. Besides changing the color balances and light levels, it can also do other kinds of tweaking that can be useful, such as unsharp and despeckle, as well as photoshop-like art tools such as cloning. I ended up resizing my images to 9" on the longest side (not standard image size, clearly) and also without paying a lot of attention to the standard resolution in the program. I will have to check on that, I may change that to make them faster-loading. I haven't figured out how to do batch editing in the GImp, if it's able to, but then many many of my pix need individual attention to the point it would be fairly useless. However, I do know folks who like the batch editing on Picasa's editing function. It's uploading to an outside website to save them as well as editing them, which is like using a more active form of Photobucket or Flickr.
I do most of my editing for pictures I post here in MS Paint. On my netbook. I have a 9" Eee PC, and when I take a photo on my real camera, I open it in Paint, Ctrl+W, scale it to 20% both sides, and save. Sometimes a rotate is necessary. My cell phone camera is set to take pictures in the size I like to post, 640x480. Yes, it's a bit small. But for showing off a quick in-progress shot, or something for the scavenger hunt, it's a quick and easy way to resize (or not need to resize) my photos. If I'm doing a real photo shoot, I shoot in .raw, edit in CS2, adjust balances and touch up blemishes. Unless I'm documenting an art piece, and then it just goes in to be converted. No digital editing on pictures that will be submitted to shows and contests. It's the rules. Amalia
One thing I notice a lot of is the completely unmanageable file sizes of some folks' photos. Not the actual pixels or crop to size, but the resolution size. Pictures that are over 72 dpi are going to be very slow-loading for anyone not on a dsl connection. They are huge bandwidth thieves and oftentimes won't load at all. This is something that members wanting to share their images should bear in mind. Keep the file sizes appropriate for online viewing!
Though I do like to go through and edit my photos in Photoshop (resizing them, etc) when uploading to DoA, I usually use http://www.imageshack.us They have resizing as an option - but you have to select it - and I usually select 640x480 (For Message Boards).
I do all organising and almost all editing of my and Quiet Queen's photos in iPhoto. The resizing workflow is therefore a snap: Select the images to be resized (usually just press ⌘A, for an entire Event – i.e. shoot). Select File > Export... or press ⇧⌘E [Under "File Export"] Select Kind: [JPEG], JPEG Quality: [Maximum], Size: [Custom] Set Max to [dimension] and type a value of e.g. 600 px – this will set the length of the longest side, whether it be horizontal or vertical. This is very convenient when the selection of images to be exported contains a mix of landscape and portrait photos...! Click Export or hit Enter Select the location you want to save the images to. Click OK or hit Enter All done! This way, resizing a 200 image shoot is just a few seconds' work. The computer does the rest! ...
Irfanview is an image viewing/browsing program with basic image editing functions. One of its even more handy functions is batch renaming/resizing. I usually open up a single image in the image folder I want to resize or otherwise batch edit (it's usually a good thing to save a folder with original sized images, and then make additional ones for resized versions, and name then accordingly). Then I press T, then I select all files, and then I press B, and then select what I want done with the selected images.. should be fairly straight forward from this step, I hope
Thanks for the information! I use photoshop to resize and change the resolution of my photos, so I can post them online.
I would recomend resizing with other photo editor than photoshop. Adobe or Microsoft because they show you more information