Choosing and using images on websites
Whatever type of website you’re building, you’ll need to include images. Even for the most serious business website, you’ll need some visual interest to engage your visitors. Images break up long pieces of text that be difficult to read on-screen; they provide a hook for casual browsers; and they illustrate what you have to say! But if you’re not a photographer, what sorts of images can you use? And from where can you acquire them? Alannah Moore has some pointers.
If you look at some commercial websites, you’ll see that very often an image is used to underline each of the company’s or product’s unique selling points, whether this is done using a rotating header panel with writing on each of the image slides, or simply pictures interspersed throughout the text.
Images you can use
- your own photos, either scanned, or taken with a digital camera or cell phone
- photos from a stock-photo library, which are very reasonable in cost
Images for the web should be in .jpg (.jpeg), .png, or .gif format.
Image ideas
Some ideas of types of images you can use for business websites are:
- conceptual photographs – for example, skies, puzzles, keys, a handshake, building blocks, a soaring plane, a parachute, smiling people, or your own, more original, ideas
- decorative photographs – flowers, landscapes, or seascapes
- pictures of the location or the town where you’re based – such as local landmarks, buildings, street scenes, and so forth
Consider using illustrations rather than photographs (also available from stock-image sources)—they can look more individual. Get some ideas from other sites in your domain (whether you like or dislike their choices), and also look at the images used in WordPress themes as these always incorporate dummy visuals.
Suggestions for stock sites
Image size
Digital images can be enormous straight out of the camera, and they really don’t need to be all that large for use on the web. It could cost you a fortune in hosting and they’ll take too long to load. You need to choose appropriate sized images for your website. It’s not that tricky, though.
Images for websites are measured in pixels. To give you an idea, the header image of the WordPress “Twenty Twelve” theme is 960 pixels wide. So, when purchasing or preparing an image for your website header image, 960 pixels is the maximum width you will need.
If you’re purchasing stock photos for the pages of your website, rather than the header image, you will be able to buy small, or even extra-small, images. It is unlikely that your photos will ever need to be wider than 630 pixels, so choose a size that accommodates this easily. It’ll be cheaper, if nothing else!
You won’t normally need to resize your photographs before you upload them to the site; WordPress does this for you, but do bear sizes in mind when purchasing stock images or when reducing the size of images yourself, in order to save space on your site.
Image dos and don’ts
- If you’re selling products from your website, consider getting professional photos taken—it can make a big difference as to how professional your site looks.
- Don’t take photographs from other people’s websites without their permission—you’re not allowed to, there could be copyright issues, and you may find yourself slapped with a lawsuit. Stock photos are so inexpensive that it simply isn’t worth it.
Background images
Most themes let you add images to the background of your site; this is a very good way of adding individuality. For a blog-style site, one of your own photographs might be suitable, but you may prefer a pattern, or something more sober for a business site.
[one_whole boxed=”true”]
Create Your Own Website Using WordPress in a Weekend, by Alannah Moore
£6.99 Download the PDF now!
This PDF version retains the styling of the original print book.
RRP for print edition: £14.99
[button color=”Accent-Color” size=”small” url=”https://www.ilexinstant.com/product/create-your-own-website-using-wordpress-in-a-weekend/” text=”Digital Edition”] [button color=”Accent-Color” size=”small” url=”http://www.amazon.co.uk/dp/1781570310/ref=as_sl_pc_tf_lc?tag=ilexpresscom-21&camp=1406&creative=6394&linkCode=as1&creativeASIN=1781570310&adid=1CZH7TYJGRF0KWCNEAYY&&ref-refURL=http%3A%2F%2Fwww.ilexinstant.com%2Fproduct%2Fcreate-your-own-website-using-wordpress-in-a-weekend%2F” text=”Amazon UK (Print)”]
[button color=”Accent-Color” size=”small” url=”http://www.amazon.com/Create-Website-Using-WordPress-Weekend/dp/0415662680/ref=as_sl_pc_qf_sp_asin_til?tag=ilexinst-20&linkCode=w00&linkId=&creativeASIN=0415662680″ text=”Amazon USA (Print)”]
[/one_whole]