![]() While the image in the above example was stretched too big and appears grainy, the problem is even worse when an image is stretched disproportionately. The next most common issue that arises with website images is distortion. This problem is compounded with images that include people and try to convey meaning to a web page. Notice how it becomes grainy and loses its clarity and professionalism. The image below is the same image, but stretched to 300px by 300px. This is how it appears when inserted properly into a page. The above image is sized at 150px by 150px. The image then gets stretched out to meet your new size requirements, and it looks ugly. How does this happen? You upload an image to your website and specify a width or height that is larger than the original image. There are no exceptions to this rule.Īn image becomes grainy when it is stretched to a larger size. ![]() It’s impossible to have a professional-looking website if your images are grainy. When people call me for website help, the most common problem I encounter is grainy images. Let’s look at each image issue a bit more closely. Most problems with images on websites fall into one of three categories: graininess, distortion or improper file sizing. Let’s look at the right way to size your images. This is great, but far too often people size their images incorrectly, which can cause slow loading times, grainy or distorted images. With all of the do-it-yourself website builders available, more and more people are taking to creating their own websites. It will take your regular photo and resize and also crop it to a square.All websites feature a combination of text and images. One of our Free Tools is specifically designed to help you turn any picture into an avatar for you to use on Forums and that is our Create Avatar Tool. An avatar is usually a picture that is square and quite small - between 40 and 150 pixels. ![]() An Avatar is simply a picture that represents you and is usually part of your profile on Message Boards and Forums. There is still one more specialized web image that most people encounter and that is the creation of a Web Avatar. If your blog has a fixed size, you might need to experiment on what size you need and a good starting point is 350px.īy using our free resize images tools you can quickly prepare your pictures and photos for sharing online. A lot of blogs have a fixed width and a 600px image might "blow out" the side. There are some instances where you might need to have smaller images than 600px for displaying on the web, such as posting a photo in your blog. A 600px sized photo is generally large enough to see the details in it on the screen and it has an added benefit of having a file size of around 100k - so when you send it by email it will not clog up your friends inbox! Why 600? well, facebook allows a maximum size of 604px (and actually resizes them to this size if you upload anything any bigger), Granny, might only have 600px without scrolling.Ħ00px is a pretty good size as well if you are interested in protecting your copyright - as we will go over in our tutorial on resizing images for print. ![]() If you do, then in most cases, 600px is an ideal size for viewing web images. So, the reasons are stacking up to make the images smaller, but how small? Well lets look at the examples given above as to how you might use the photos online. You are probably going to post the images on your blog or Facebook account. You might be sending the pictures to your granny, who has the screen set to 800x 600 so her old eyes can read the messages. Why would you want to go smaller? well there are several reasons! Firstly, someone who is viewing your pictures might have an older computer and a smaller screen. In practical terms there are reasons for going even smaller than this. So, it is fair to say that at the absolute most, to view an image on a screen you want it to be just a little bit smaller. ![]() If we look at a typical 17" computer monitor, the native resolution is 1280x1024 Pixels. What we will do is to further explore what size we need to make our pictures for posting on a website and even sending by email for viewing on a computer screen. In our Tutorials on Understanding Pixels and Understanding DPI and PPI we mentioned a bit about how a photo is displayed on screen and how many pixels make up a screen. ![]()
0 Comments
Leave a Reply. |
AuthorWrite something about yourself. No need to be fancy, just an overview. ArchivesCategories |