Pixel sizes for images.

silvine

Hi,

When I'm posting images into a Wordpress post what pixel and file size should I aim for?

Thanks.

KonFusion

silvine wrote: »

Hi,

When I'm posting images into a Wordpress post what pixel and file size should I aim for?

Thanks.

Pixel size? Depends on the image. Something visible, but not huge?

As for file size, general practice is to compress it to the point where it's almost unbearable

You can use stuff like smush.it, which also has a wordpress plugin, allowing you to 'smush' your entire media library.

Have a look through this: http://www.bookofspeed.com/?goback=%2Egmr_4689337 - It's got a section on optimising images.

Kenny Logins

WordPress will resize automatically but try posting a test image, and see what size it is displayed at.

sheesh

silvine wrote: »

Hi,

When I'm posting images into a Wordpress post what pixel and file size should I aim for?

Thanks.

what width is the page you are posting into

silvine

The theme I am using is 720px in width but I am not sure if I will stick with that theme. The images are ones I've taken with a SLR camera and screenshots of my iPhone. In other words I've images of varying sizes and dimensions.

I am placing the images aligned to the right of my Wordpress post or at the bottom in a gallery.

I'll take a look at the Smush.it plugin and run it on my gallery.

EDIT: I uploaded a 52kb 960x640 image into Wordpress. It converted it to 9KB 300x200. Is this okay?

KonFusion

silvine wrote: »

EDIT: I uploaded a 52kb 960x640 image into Wordpress. It converted it to 9KB 300x200. Is this okay?

Does it look ok?

There is no 'standard image size'.

silvine

Well it's in a gallery and the border Wordpress places around the image cuts off some of the picture. When I click on the image I can see the picture fine.

KonFusion

silvine wrote: »

Well it's in a gallery and the border Wordpress places around the image cuts off some of the picture. When I click on the image I can see the picture fine.

Link or code please.

silvine

The site isn't live yet

.container {
  margin:auto;
  max-width:45em;
  overflow:hidden;
  padding:0 1em;
}

sheesh

silvine wrote: »

Hi,

When I'm posting images into a Wordpress post what pixel and file size should I aim for?

Thanks.

you are going at it completely backwards unless you already have a a theme that you are using. If it is going into a post. try to keep it small enough so it does not break the design of the page

there is no right answer.

Trojan

There's two sizes: dimensions, and file size. You can sort out file size by using Smush.it, and dimensions depend completely on your site design.

silvine

I installed Smush It and I have a new theme. I will post back when I the site is ready for criticism!

mayo.mick

silvine wrote: »

The theme I am using is 720px in width but I am not sure if I will stick with that theme. The images are ones I've taken with a SLR camera and screenshots of my iPhone. In other words I've images of varying sizes and dimensions.

I am placing the images aligned to the right of my Wordpress post or at the bottom in a gallery.

I'll take a look at the Smush.it plugin and run it on my gallery.

EDIT: I uploaded a 52kb 960x640 image into Wordpress. It converted it to 9KB 300x200. Is this okay?

OP, I admin on 3 websites and what I do is resize the photos (which are 7/8MB from my DSLR) to 1024 pix on the long side in photoshop, then upload to the media library in the wordpress website. The resized images are usually around 100Kb. You can resize them to any size in the post or page on the website, but when you click on the photo it will bring you to the full size (1024 pix) photo, as long as you have it linked to its attachment page. All that being said, I might be doing it completely wrong all this time?

Kenny Logins

mayo.mick wrote: »

OP, I admin on 3 websites and what I do is resize the photos (which are 7/8MB from my DSLR) to 1024 pix on the long side in photoshop, then upload to the media library in the wordpress website. The resized images are usually around 100Kb. You can resize them to any size in the post or page on the website, but when you click on the photo it will bring you to the full size (1024 pix) photo, as long as you have it linked to its attachment page. All that being said, I might be doing it completely wrong all this time?

Depending on the theme functions, I'd say you're doing it the right way..

Cianos

The method you use really is dependent on the intended application.

Generally on the screen you don't want images being presented above a 1:1 ratio, so that they don't become more pixelated. For example if you upload an image of 100px x 100px but it's being shown as 200px x 200px on the site, it'll show a reduction in quality. So make sure the original for that space is at least 200px x 200px before uploading.

You also want to maintain their aspect ratio otherwise they're going to look stretched (or squashed), or cropped, so if you've to add an image for a 200px x 100px space, a 200px x 200px image will either be squashed down or you'll lose some of the vertical space of the image.

So it's best to work with the space you have and edit your images accordingly before being added.

Also when working in Photoshop, it's good to Posterize the image first, this lets you specify the range of colours. Below ~40 begins to show quality loss for a crisp photo, but even setting it at 40 significantly reduces the file size. You can then "Save for web and devices" too.