How to take Pictures for your WordPress Website

WordPress makes it very easy for you to handle your images. You can literally take pictures straight from your phone and place them into your website via the Media link located in the admin section of your website or you can upload it directly into a Post, Page or other feature that accepts images.

WordPress even provides you with a cool feature that allows you to choose between a Thumbnail option which tends to be the smallest possible size, or a Medium, Large or Full Size option. If that isn’t quite what you are looking for then you can always use the cropping features to get the size that you desire for that specific post.

By default, WordPress has the sizes defined and you can view the current size settings by clicking on the Settings link in the admin section of your website and clicking on the Media Link. There you will see the standard 3 sizes (some themes provide additional sizes). If you want to change the default sizes then you can do that there. Just remember it’s always good to have the sizes in equal proportions so images won’t get distorted.

Portrait Versus Landscape?

Portrait mode is the tall height way and landscape is taking a picture with your camera or phone in the wide way. I tend to favor taking pictures in Landscape mode since most websites and devices are built to favor that type of layout. Taking a picture in Portrait mode tends to take up to much screen real estate and pushes your content down the page.

What about Image File Size and Page Load Time?

This is an important topic and WordPress is great for this. If you are taking an image with your Smart Phone or any modern day camera, the picture size will tend to be large in terms of actual pixels and file size. This can cause a problem if they are being used on a typical website. But since WordPress allows you to decide which image size, Thumbnail, Medium, Large or Full Size to use, that gets you part of the way there.

If you want to get the absolute best results for optimizing your images that are in the JPEG format, then I would recommend taking your raw pictures to the JPEGMINI website and have it process your image (It’s Free to use but they also have paid options) before you upload them to WordPress. The great thing about JPEGMINI is it’s free to use, is drag and drop and by using this service you reduce the picture file size without losing quality.

I also highly recommend using Plugins that help you deal with this issue. My current favorite plugins that I use on my sites and my clients websites are.

  • EWWW Image Optimizer – Reduce file sizes for images in WordPress including NextGEN, GRAND FlAGallery and more using lossless/lossy methods and image format conversion.
  • Imsanity – Imsanity automatically resizes huge image uploads. Are contributors uploading huge photos? Tired of manually scaling? Imsanity to the rescue!
  • WP Smush.it – Reduce image file sizes and improve performance using the Smush.it API within WordPress.

Cropping an Image

NOTE: It’s best to upload an image that might be a little bigger than what you need rather than uploading an image that is too small and trying to scale it up. That never looks good.

Getting a picture to be the exact size in terms of pixels usually means using a tool like Photoshop or Gimp. But because you can crop directly in WordPress, you eliminate the need for any other tools. All you do is

  • upload the image into WordPress
  • click the edit image link to the right
  • then to crop the image you just click and drag on the image. Note I just click and drag a little and then in the Selection input fields to the right I manually put in the size that works for me. I then just drag the crop box until the area selected is what I want. Then click the crop icon and then save.

Featured Image vs Image in Post?

WordPress is awesome because it is always improving and giving developers ways to make their themes and plugins unique and feature rich. Some themes take advantage of the Featured Image option in a Post Page or Custom Post Type. Other themes just use the standard first image placed in your post, others require both. Play around with your theme and see which one it uses. Remember, there are two areas you need your images to show, on the post itself and on your Blog or Home Page that provides excerpts of your latest blog posts.

Image SEO

Finally, you should always make sure to include an Alt Tag and a description when you upload the image. You will find that to the right when you upload the image itself. This will help with Screen Readers and the Search Engines.

Closing

Managing pictures for your WordPress website is easy with all the tools built in and the additional plugins that are free to use.  I hope you found this article to be useful. If you have any questions, feel free to contact me.

Get DevWP - WordPress Development Training Theme

Find Me On