Image management is one of the main areas which novice web users struggle with.
These days images taken on modern smart phones can be very good quality can be enormous in size in their native form which is not suitable for use on web articles.
Similarly stock images tend to come in a very large size, most often more suitable for print that web.
To get the very best presentation on yoru website images should generally be exactly the same size and should ideally be optimised for web.
Whilst we use Photoshop for our own image manipulation there are thankfully a lot of easier, and cheaper, alternatives for end users. We recoomend using Canva (www.canva.com)
So, let's look at an example here where we want to create a "Poster Image" for a news article we want to write.
A poster image is just the headline of the article that will take up the full width of the article.
In most of our container based blogs we recommend an image size of 1300 x 650 which is a 2 x 1 landscape image size.
So, let's assume we have a source image that is massive and we want to crop and resize to match our 1300 x 650 pixels specification, here's how we do it.
1. Create a free account on www.canva.com.
Canva is a very user friendly web application which can be used on any computer to create powerful images. Once you've created your account, log in to canva.
2. Click "Use Custom Dimensions" in the top right corner
3. Enter your dimensions as 1300 x 650 and click the Green Design button.
4. The Canva Editor opens with a 1300 x 650 canvas on the right. Your available layouts are shown on the left. Just click the top layout in this case which is a single image;
5. Now click on Uploads in the left menu and click on "Upload Your Own Images" to upload your source photo(s) to Canva. These can be any size at all, taken direct from your stock images, camera or smart phone. Just drag them right into your Canva library.
6.Once the image has uploaded you will see it in your library on the left. Now just drag the image from the left library to the screen on the right where your blank canvas is.
Your screen should look something like this;
7. Now use the "Crop" function to move your image around inside the frame till you get the perfect image for your poster. Click the Tick icon to accept the change.
8. Experiment by playing around with the Filters option and also the "Text" option on the left that allows you to add some very rich text effects on top of your image. Canva is VERY powerful once you get used to the interface;
9. When you have finished and are happy with your image click the "Download" button to save to your computer ready to upload to your website when you are creating your article. Download as either a JPG or a PNG file and save to your local machine in a folder you will remember using a name that means something relevant to the article you are going to publish!
10. That concludes your image lesson! Canva is a very powerful tool which many completely free applications such as those outlined above. You can also use the stock image library and some more advanced text effects for a fee but master the basics first and you will see what a fantastic toolset it is for any website owner.
Comments
0 comments
Please sign in to leave a comment.