How to Use Graphics to Enhance Your Website

Why Use Graphics?

The cliché saying that a picture is worth a thousand words is true; at least it is when it comes to using graphics on your website. Graphics grab your readers’ attention and enhance your content.

If creating a more visually appealing site isn’t incentive enough, know that including images on your page also improves your search engine optimization (SEO). Studies have shown that pages with photos and videos attract significantly more visitors than those that don’t.

How to Use Graphics

There are multiple ways to incorporate graphics onto your site. Let’s take a look at a few different places where you can use images throughout your website:

  1. Header — Your website will look more professional if you have a customized graphic as your header. Make sure it includes your company name, logo, and/or motto. Also make sure it’s not too busy and complements your site’s color scheme as well. This will also allow you to use your site for branding purposes.
  2. Enhance Data — If you are presenting data, using charts and graphs will help get your point across better. Humans are naturally drawn to visuals that aid them in understanding overarching messages.
  3. Break Up Text — There’s nothing worse than going to a site which has paragraphs and paragraphs of information, with no images to break up the text. While generic graphics are better than none at all, make sure to use graphics that complement and support your content.

Where to Get Graphics

The next question you may be asking is: where do I get these images? There are a few sources you can go to for your graphics:

  1. You — The first place to look for images is on your very own computer. You will likely have images that relate exactly to what your text is about. If not, you are always able to take some new pictures. Make sure that the images are content-appropriate and of good quality.
  2. Flickr — Flickr offers lots of images for free. The images you find here are taken and shared by the common person. While you may have to do a little searching, there is an extensive selection and you’ll be sure to find a high quality photo that relates to your text.
  3. Stock.XCHNG — This site offers stock photography for free. The fact that it is stock photography means you don’t have to worry about browsing through images that are inappropriate or unappealing; however your options are relatively limited.
  4. iStockPhoto — This site also offers stock photography, but requires you to pay a fee for their service. However, it may be worth it since their site combines the best of both words: great variety and great quality.

How to Format Graphics

You can easily format and edit your pictures using the Webs photo app. Just make sure that the file size of each photo is not too large. The bigger the file size, the longer it takes to load, and the more likely it is a first time visitor will leave your site. You can also use more advanced photo editing software such as PhotoShop and Macromedia Fireworks to enhance your photos.

Final Tips on Graphics

Now that you have an idea of how to use graphics to enhance your website, here is a final list of do’s and don’ts:

  1. Don’t use clip art. You want your website to be professional, not childish and kiddie.
  2. Don’t use graphics that have too much going on, clash with your site’s colors, or that flash. Graphics should add to, not detract, from your content.
  3. Don’t use blurry images! This is an automatic turn-off for first time site visitors.
  4. Do balance your text and images. Don’t use images that are too large or too small, and don’t use too many images on one page.
  5. Do use file names for your graphics that contain keywords related to your site’s content. This will help your SEO.

While the tips presented above should be used as general guidelines, there are of course exceptions to the rule. Feel free to play around with graphics on your site. Remember that a first impression is everything, so be sure to use graphics to add an oomph factor to your site.

About the Author: Irina Kabigting is Webs’ Social Media Marketing Manager. Get more from Irina on Webs’ Blog and Google+.

29 Responses

  1. Reply
    Lucian Rudd
    Jul 18, 2011 - 10:42 AM

    Thanks. This is helpful.

  2. Reply
    U WANT
    Jul 18, 2011 - 10:42 AM

    Nice post webs! I am waiting for more..

  3. Reply
    Niiadjei Zeeboray
    Jul 18, 2011 - 10:55 AM

    PLEASE HOW DO I UPLOAD MY PICTURES 2 MY WEBSITE & MY WEBS ACOUNT? HELP ME OUT PLEASE!!!

    • Reply
      the Webs Team
      Jul 18, 2011 - 01:29 PM

      @Niiadjaei: You can add images to your website via the photo gallery or by clicking on the Photo button when editing your website.

  4. Reply
    THOMPSON
    Jul 18, 2011 - 12:58 PM

    i want to get graphics downloaded to my site

  5. Reply
    Georges
    Jul 18, 2011 - 01:47 PM

    Thanks so much to “webs.com” for this invaluable information.

  6. Reply
    fernando
    Jul 18, 2011 - 04:14 PM

    Ha, i’ve got graphics down to a science, or so i though, never thought that the name of the graphic made a differnce in the seo, thanks for the tip webs.

  7. Reply
    James (CyberNetTV)
    Jul 18, 2011 - 04:37 PM

    Thanks Webs for the useful information! I might rename my pictures to improve my SEO.

    I definately agree about not using flashy animated-GIF images; they’re distracting (it makes it hard to read the content, old-fasioned (popular in 1996-1999 due to dial-up not being able to load large content) and also makes it messy aswell.

    Another point is that some websites put copyright restrictions on their images, so it’s not reccommended to use Google Images (and if so, check, or contact the owner if possible).

    You also have to watch that some images on Flickr and StockXCHNG are extremely large, so it’s best to reduce the size in Photoshop/GIMP/Paint.net because 1. It may reduce a lot of your free storage, and 2. The images may not load and/or be extremely slow and may slow down your page loading time, annoying site visitors. *Note that if you resize the image in Webs, remember that the image is still the original large image.

    Some image formats are more suitable for purposes than others. Some may also be faster or slower loading. If you are putting a photograph on your site, it’s best to use a JPEG (.jpg) image, as this will improve loading time. If you are planning to include text in your image, or if you want transparent backgrounds then PNG (.png) image is the best option, although PNG images may take longer to load than JPEG format images.

  8. Reply
    Dele
    Jul 20, 2011 - 06:46 AM

    Pls i want to upload my pictures to my web how do i do it

    • Reply
      the Webs Team
      Jul 20, 2011 - 10:31 AM

      @Dele: You can learn more about how to upload images on your website here: http://ht.ly/5J3jY

  9. Reply
    B M
    Jul 20, 2011 - 11:45 AM

    The problem is that Webs really doesn’t allow you much bandwidth, so you can’t have many pictures. I run a Blender 3d Tutorials site (Blender is a free open source computer animation and modeling application), and I use text tutorials, which means, 40+ pictures on each page. Naturally, that ate up my monthly bandwidth within two days, and I was forced to move to a Google host. It’s a lot cheaper, everything but the domain’s free, but the site design and html restriction are bad and the site builder tool is difficult to use.

  10. Reply
    Elliot
    Jul 21, 2011 - 04:37 PM

    Is there a limit to the amount of images you can upload?

  11. Reply
    Elliot
    Jul 21, 2011 - 04:38 PM

    Is there a maximum to the amount of images you can upload?

    • Reply
      the Webs Team
      Jul 22, 2011 - 02:06 PM

      @elliot: the number of images you can upload on your site depends on how big they are and the type of package you currently have.

  12. Reply
    oscar
    Jul 21, 2011 - 08:30 PM

    thanks web my site is new is there any way i can remove the webs to have just .com in my site i want to try your graphic u guys i really helping

    • Reply
      the Webs Team
      Jul 22, 2011 - 01:35 PM

      @Oscar: You will need to purchase a domain name in order to have the webs portion removed from your site address

  13. Reply
    mani
    Jul 22, 2011 - 05:34 AM

    i have create website in webs.com. how to do next step? please help me

  14. Reply
    Remon
    Jul 22, 2011 - 10:28 AM

    the sitemap is not working for my site, would you please help

    • Reply
      the Webs Team
      Jul 22, 2011 - 01:33 PM

      @Remon: If you need assistance with your site, please don’t hesitate to contact our support team.

  15. Reply
    fernando
    Jul 22, 2011 - 11:57 AM

    you’re forgetting that some images are copywriter, you cant just simply put images at random just cus they look cute. Plus hackers use Image landmines , basically you put an access file so when you open an image, a virus pops up they’re all over google. I recommend using image uploader , and click license free images, don’t download images directly but use a proxy downloaded. drag proxies are so old fashion.

  16. Reply
    Anonymous
    Jul 23, 2011 - 09:58 AM

    how can i edit my header?i’m finding difficulties in doing that.

  17. Reply
    Markamoment
    Jul 25, 2011 - 01:53 AM

    I am in complete agreement because my webiste is related to only graphics and images as we offer daily phot thought for the day.

    We feel its is important to relate to the visitors who come searching for related thigs. If you walk into a vegetarian restaurant, you expect vegetaring food and vice versa. hence it is extremely important that your images meet the visitors expectation otherwise they will only add clutter to your website.

  18. Reply
    Artwork from EMILIO'S DESIGNS
    Jul 25, 2011 - 10:54 PM

    Thank you. helpful. just getting started on the web with web.com, blog, link in, and Face book.

  19. Reply
    Ammad Qureshi
    Jul 28, 2011 - 02:24 AM

    hi please help me as I am finding difficult to upload images and text on my home page.Please help me.
    Ammad Qureshi

  20. Reply
    kroffimedia
    Jul 28, 2011 - 02:28 PM

    Great info webs…

  21. Reply
    Innocent
    Aug 04, 2011 - 06:17 AM

    It really help thanks

  22. Reply
    Sarah Meister
    Aug 04, 2011 - 02:06 PM

    These are good rules but not set-in-stone rules. For instance, don’t have to have all your info in your header image. Could clog the visual appeal.

  23. Reply
    Mike
    Aug 14, 2011 - 09:53 AM

    It’s absolutely necessary to use images that are interesting and pull the reader further into your content. Standard run-of-the-mill images no longer work.

    Mike
    http://www.flooringforgarage.com

  24. Reply
    Ron Mayer
    Dec 07, 2012 - 03:10 AM

    Thanks for the great post. Pictures are always more appealing than long texts. I’ll be sure to use more of them in my site.

Leave a Comment

STYLE SWITCHER

Layout Style

Header Style

Accent Color