Image Editing for your Website – How to

October 16, 2012 by

Images on your Website

After your website is up and running there may come a time when you need to edit your images to fit in a specific area or to edit your image to increase the contrast and generally make it look better. There are several free online tools that can make this task a little less daunting. But first there are some things to understand about your images for use on the web.

Images are comprised of pixels, hundreds of thousands of tiny squares of color. The picture you take with most cameras nowadays have are way too large for use on the web. You can still upload them, but for the sake of saving space on your server and fast loading times, it is imperative that you decrease the file size. Most images you take with your camera will be between 300-600 DPI or PPI; That’s Dots-per-inch or Pixels-per-inch (which for all intents and purposes are used interchangeably). But for the web these images only need to be 72-100 DPI. Most of these free imaging programs will only have one option, and that is too save your image at 100 DPI. So that takes care of the size issue for you.

When sizing an image for the web, there are two elements to be concerned with…the width and the height of the image. On your website this will be listed in px or pixel dimensions. Some images like for that of an Image Slider like the one on my front page requires a specific sized image (ie.  840 × 270). The first dimension is always the width and the second is the height. When using these online image editing tools, there is usually an image resize option. When resizing the image, make sure that you do not crop the image to less than both the width and height.

Cropping is a matter of resizing your image by cutting out everything but the part of the image you need. Many online image editors have a selection or cropping tool that will allow you to outline the area you want to keep and then click the crop link. This will automatically resize the image to that cropped space selected. The only problem with this, is that the area may be too narrow or too wide and the results will show the image as skewed. When uploading and inserting the image into your website, if for instance the image is too narrow, it will still expand to be the width of the required area, and this results in your image being blurry or pixelated and in some instances being stretched so that it fits the height and width requirement, and overall looking very shoddy. So make sure when cropping your image that it refects the width and height values required.

Free Online tools for Image Editing:

Pixlr Free Online Photo Editor

PIXLR is an online imaging tool that has two online applications. The first is the Pixlr Editor which is my favorite because it resembles Photoshop in form and function. This image editor has options for adding a drop shadow, cropping/resizing, and can save files in a transparent PNG format. The second application is called the Pixlr-o-matic, and gives you multiple options for changing the color spectrum of your image.

Online Image Editor

The Online Image Editor does have some very simple options like resizing, adding borders, and cropping; and while very easy to use, has its share of adverting banners that can be a tad much. But it does the job and that’s what counts.

 

In Conclusion…there are many other free online image editors on the web, just Google them. Once you’ve made your changes on these websites, simply use the Wordpress uploader and insert them into your website pages. They should now look better, take up less space, load more quickly, and be just the right size.

Filed Under: Blog, Merchants, Neato, Web Design Essentials

Things to consider for your first website

September 3, 2011 by

First Website Checklist

Having a website designed is not an instant coffee kind of process, but something that takes time and forethought. As the web designer, I can take what you want and structure it into a living functional website. The most important thing to me is that your are happy with the final result and the new website makes your life easier and makes you money.

Before I even begin a custom website design project, I will discuss it thoroughly with you either in person or over the phone. I will also have you fill out a website design questionnaire that will help me flush out many of your design goals. The questionnaire has multiple questions regarding you overall theme, the look and feel, and what specifically is your goal with the final outcome when the site goes live. Here are some additional things to think about if you are considering your first website:

  • The color scheme
  • The general feel of the website
  • Similar websites
  • Do you have a logo?
  • How many pages of content
  • What is the goal of your website?
  • Do you already have a domain name and hosting? And does your hosting support WordPress?

Thinking about these things in advance will help you develop a better idea for the final outcome of your website but it will also help your web designer with covering all the bases so you are completely satisfied with your completed website.

If you have any questions, don’t hesitate to ask. My job as a web developer is to make your website successful. 

Filed Under: Blog, Merchants, Web Design Essentials

What does your Website’s color theme say about your Brand?

July 19, 2011 by
2506505_m

How your clients see you

Colors have psychological, spiritual, and cultural meanings; and the interpretation of them gives an impression that is long lasting. Advertisers have been using colors as a way of  leading the viewer since the inception of color media. But what does this mean for you as a business owner? For starters, your business colors  and the color theme of your website reflect how people perceive your brand. And knowing is half the battle. Similar to keywords used by Google and other search engines, by knowing what expectation people place in specific words and phrases, by using specific colors you can make a lasting impression on potential customers.

First we need to understand the color meanings. And how they currently represent wants and needs in media today. Have you ever noticed that during the hot summer months, you will see advertisements of cool blue skies and shimmering clear lakes; and then in the chilly winter months you will see advertisements of warm comfortable fires and suntanned people on hot beaches? There is a method to the madness. Weather is an easy trigger, and for advertising media, a predictable campaign.

The following is a list of some colors and their meanings:

  • Red:  Confidence, Vitality, Passion, and Courage
  • Pink:  Love, Beauty
  • Brown: Warmth, Earth, and Convention
  • Orange: Fun, Light-hearted, and Youthful
  • Gold: Wealth, Wisdom, and Good Health
  • Yellow: Wisdom, Joy, and Happiness
  • Green: Life, Nature, Fertility, and Well being
  • Blue: Honesty, Youth, Spirituality, Truth, and Peace
  • Purple: Royalty, Magic, and Mystery
  • White: Purity, Cleanliness
  • Black: Death, Earth, and Stability
  • Silver: Sleek, High-tech, Modern, Pure, and  Graceful
  • Gray: Sorrow, Security,and Maturity

When creating a website, the colors you use are very important. Its like color matching when painting your house. You dont want conflicting colors from room to room. Like Black and Orange, they may be great halloween colors, but mixing the two can be calamitous. Black representing death and orange representing youth, these colors will confuse your clients if not presented correctly (ie. referencing Halloween).

Its not chance that most credit unions have the color green in there logos, nor is it coincidence that most banks have gold or blue in there logos. Not all certainly, but a fair amount of these companies have done their research and found that having a color meaning represented in their logo, creates an impression for their clients. Here is a link to a site called Logo Critiques that shows the representations of color in some popular logos and brands.

Knowing that colors have meaning and power over people’s emotions can help you when you are creating a logo, a website, or marketing campaign. By finding what the potential customer is looking for in a product or service, you can then create a website that caters to them.

 

Filed Under: Blog, Merchants, Neato, Themes, Very Cool, Web Design Essentials