Using a photo, pattern or texture as a background on sections of your website can add interest and help your site to appear attractive and memorable.
You should take into account your site’s audience and consider adding only subtle decorative touches. It’s also important to make sure that any images you include are not so large that they will significantly increase the loading time of your site.
Here are a few suggestions of ways in which you could use background images.
A large background photo, like this one by valiunic at Pixabay can be effective, but it won’t work for every type of website and you need to be extra careful with the size of the image, to ensure it doesn’t slow down the loading time of the site too much.
You may prefer to use a background image for a smaller section, rather than for the whole site, as with this wave from NeuPaddy (also a free image from Pixabay). I’ve added a colour overlay to this example.
These can look appealing.
As always, you need to think about the type of image you are trying to create – texture effects may be appropriate for a site focusing on handicrafts, fashion, cookery, pets or children but may not appear professional for an accountant or technology website.
Here’s an example using a free seamless brick effect background from Pixeden.
You can also find textures giving the appearance of marble, watercolour paintings, fabric, gold, wood, paper etc.
As mentioned above, you don’t need to use images just for the background of your entire website. It may be more effective to add backgrounds to the header, menu bar, footer, buttons, sections or panels.
This marble texture, shown as the footer background, is from Laras Wonderland.
This watercolour header background is by Julia Dreams.
The seamless fabric background, used below for the footer widget area’s background image, is a free texture from Fuzzimo.
There are many sources of paper effect backgrounds including:
- Various Paper Patterns from Subtle Patterns at Toptal
- Seamless Rice Paper from Media Loot
- Subtle Paper from Pixeden
- Digital Paper Textures by Co-op Goods Co at Creative Market
- Seamless Paper & Cardboard Textures by MihaiNegru at Creative Market
- Seamless Paper Textures by Dezajno at the Hungry Jpeg
The example below is Rice Paper 2 by Atle Mo – one of the free Subtle Patterns.
A seamless pattern is ideal for use on a website because the size of each individual file is small, but it can be tiled to fill large areas.
These patterns are readily available online in just about every style of design imaginable.
Here’s an example of a watercolour flower pattern from Julia Dreams.
My previous post, Where to Find Free Website Graphics, listed some of my favourite websites for downloading free images, backgrounds and other graphical resources. This follow up post contains a few more suggested sources of freebies. These ones are perhaps a little less well known and may not have such a great selection – but they are worth a look.