People don’t usually notice the amount of graphics a website has until they’re asked to submit some images for their own. Good use of images is important for harmonious web design and helps give a better impression to the visitors. You can’t use just any picture either. Low resolution and oddly shaped pictures will give the feeling of an unkempt website, and in return speaks for the business it is advertising. Sometimes it’s hard to find the right images and custom images can be very expensive.
Here are some tips on making and selecting images that show professionalism and help with company branding.
High-Quality images: The bigger, the better
Getting the highest resolution and size for an image to start is recommended. You can always compress the picture and resize it down, but its a lot harder to increase the resolution of a small, low-quality image.
Even at this size, the grass looks blurry
Sharp looking grass!
A good example is just looking out into the web to see all the sites that can help you optimize your images for the web. Tinyjpg, Iloveimg are some examples and many are free! Making smaller images larger require some paid software. There are many ways to optimize an image for web use, but the best way to start is to start big.
If taking pictures isn’t your thing, there are many sites online that offer stock photos for commercial use.
Make sure the images have web-friendly extensions
There are a lot of file extensions out there for images and it can get confusing which to save your pictures as. The simplest answer is your photographs should be saved and uploaded as JPGs. They may come out a bit compressed, but a little color loss is negligible compared to the loss of time a large photo puts on a website.
If you have to, save your graphics in PNG format. This can include images such as your logo, or big graphics that are a single color or need crisp lines when zoomed onto.
Rumble and Bustle
Beep Boop, graphics here!
Resize images to fit the area it requires on the website
If your image is 10x larger than the little space it will take up on your page, resize it! Image compressing can only do so much for reducing the number of bytes it takes up on your computer. Resizing the images will help reduce the load it takes to bring the image up on the site.
- Images should be no larger than 1MB
- Graphics should be smaller than 300KB
- Always pick the option to “save for web” when you can with images
- make sure to keep the image proportions the same when resizing to prevent distortion
Consistency in the message of your images
Images on your website should have a consistent tone to them. If your images convey a certain feeling, like warmth and brightness, you wouldn’t include a dimly lit picture. Images can feel out of place when they don’t give the same aura. One way to match the tone with other images is to give each one a filter that will help keep the images looking coherent.
Filter for coherency
Give your pictures a matching tone!
Need some help?
It can be hard to manage what makes a good photo or getting down to even taking it. But that’s why 360 Web Designs is is here to give you the information you need to succeed in creating a good website! We build websites as well as offer ways to model your brand. Give us a contact if you have any questions or check out our other blog posts for more tips and tricks!
