Webmasters Gallery

Anyone who has been marketing online knows that the lifeblood of a business is the traffic of a site. More visitors equal more sales. However, here are some ways that you can tweak your sites with to improve sales without the need to get more visitors.

The first method is to weave in your personal touch in your sales message. Nobody wants to be sold to by a total stranger, but many people will buy what their close friends recommend to them. If you can convince your audience that you are a personal friend who has their best interest at heart, they will be convinced to buy your products. Remember to speak to an individual in your sales letter, not to your whole audience.

The second method is to publish testimonials and comments from your customers. A good idea would be to publish both good and bad comments; that way prospects will be really convinced that these testimonials are real. When prospects see testimonials on your website, they will have the confidence to buy from you because human beings follow the herd mentality; when others have bought and proven it authentic, they will jump on the bandwagon and buy too.

Use visual representations for the problems and solutions that your product offers. Not everyone will read your text copy from the head to the tail, but most people will pay attention to images on your website.

Offer quality bonuses to accompany the product. When you offer bonuses that complement your product, your prospects will feel it’s a very good deal and it would be stupid to miss it. Be sure to state the monetary value of your bonuses so that people will be even more compelled to grab your good bargain.

Lastly, ask for the sale! Many people entice their prospects with the benefits of their product, sell to them with stories of how it has solved many problems, even offered killer bonuses but forget to ask for the sale. Give a clear instruction on how to buy your product.

Sometimes, it seems absolutely impossible to keep up with all the design work you’ve got coming in. But, other times, it may seem like you just don’t have enough work to meet your income goals.

In these times, it makes sense to offer a few more services to your clients — to make sure that you can make a little more money.

The ten services below can make it easy to boost your income and take advantage of the design skills you’ve developed.

1. Blog Setup

Everybody and their dog wants a blog these days — but a lot of these would-be bloggers aren’t up to much more than opening a free account on Blogger or WordPress. Setting up a hosted blog, installing plugins and customizing a theme are all beyond them. But if you can provide these services, you can pick up some easy cash.

While setting up a blog can require a little technical knowledge, it’s generally a fast process, especially when you get a little practice. In general, customers looking for blog set-up services don’t necessarily want a custom design: they usually have a theme in mind that they just want to slap their own images on. WordPress takes about five minutes to install, making blog set up surprisingly lucrative.

2. Hosting

Many web design clients don’t really want to worry about hosting their own website. If you’re willing to take on that worry, you can make plenty of money and increase your chances of repeat business. After all, if you both designed a website and are hosting it, a customer is unlikely to go to someone else to update his or her site.

You don’t have to mess with servers of your own, either: using a virtual server from one of the many web hosts available can handle the needs of many small websites. There is a little worry that goes along with hosting — if a client’s website isn’t up, it’s on your shoulders — but it remains a relatively easy source of income.

3. Ad Design

For your clients who are buying ad space online, it’s worth their while to use ads that match their website’s design. Offering an online ad design service saves your clients from trying to turn their logo into a banner ad and puts some money in your pocket. Because there are certain common ad sizes, you can offer a single ad design or a package of several common sizes.

4. Templates

Many web design customers aren’t actually looking for a unique design for their website. Instead, they’re more than happy to accept a template — especially if they’ll pay less for it than for a custom-designed site. Some customers are just looking for files they can set up themselves, while others want to hire a web designer to fully implement the template.

Either option allows you to continue making money off a design long after you’ve finalized it. In addition to selling your templates on your own, there are many market places with significant traffic for specific types of templates (i.e. WordPress, Joomla, etc.).

5. Icons

There are certain icons you’ll spot all over the web — such as the RSS icon. While there’s one set symbol, though, there are thousands of design variations upon that theme. Not only can you sell such icons to individuals setting up their own websites, but you can also sell them to other web designers to help them speed up their work. Icons are commonly sold in sets related either by theme or design qualities: you can often earn more with scalable vector icons. There are thousands of potential icons you can work with, as well.

6. Sub-Contracting

Design is not the only aspect of a website that a client might hire out. While you might be given all the text the client wants included in a website, you may not. Rather than trying to help your client find someone up to writing copy, you can agree to take it on as part of the website design. From there you have two options — write it yourself or sub-contract to a writer.

You effectively earn a finder’s fee from providing a writer with the work, and if you have a writer you can work with regularly, you can take on more projects than you might otherwise. You don’t have to limit yourself to writing, either: web applications, marketing and other projects associated with setting up a new website all offer sub-contracting opportunities.

7. User Testing

Putting a website through its paces can require money, leading many web designers to simply skip it. But if you offer this service to your clientele you’ll be able to provide another layer of quality work. User testing can be as simple as sitting down with a couple of people and asking them to try to use the site. It can be as cheap of offering them lunch in exchange for their time. You may have to spend more time explaining to your customers just what user testing is than you might need to spend on your other services, but that bump in income is often worth it.

8. Training

Especially when you’re setting up a website that a client expects to update on his own, you have to expect lots of questions on how to use the site. Those questions don’t have to be just another cost of doing business, though.

Instead, you can offer a client the service of walking him through every part of the completed website and explaining each step. If you and your client are in the same area, it might be worthwhile to go in and educate the client in person. However, with all the various online conferencing applications that allow you to share your desktop with an observer, physical proximity isn’t necessary.

9. Search Engine Optimization

The methods search engines use rank websites change quite often. Part of good website maintenance is updating a site as necessary to keep up with search engines’ needs. Offering search engine optimization offers you a chance to revisit past clients’ websites: they may not need visible changes, but a little tinkering under the hood may get a website better search results. You can also offer SEO services to potential clients who already have well-designed websites.

10. Marketing

While web marketing can be a full-time job, you can provide your clients with a basic web marketing package: setting up accounts on social networking sites, emailing bloggers on your client’s behalf and other small tasks. Most designers don’t have any interest in doing a large amount of marketing, but a few simple services can help a client get started as well as generate a little income.

If you’re interested in adding any of these services to your web design offerings, consider starting with your existing clientele. Send out an email explaining what you’re adding to your offerings and see if you get any bites. From there, you can start thinking about new customers. It may not be practical to add all ten services in one go (and you may need to brush up on a few skills before marketing your work), but these options can give you a starting point.

Additionally, there are far more than ten services a web designer can offer. Think about how you might combine your non-design skills with your web work and see what you come up with — you might find an option that works better with your skill set than those listed above.

Bonus Income Source: Passive Income

If you’ve still got a couple of hours left over after you finish helping your clients, consider passive income opportunities. Every service you offer results in active income: you’re trading your time directly for money.

With passive income, however, once you’ve established an income source, you get money with only minimal time and effort. Traditionally, passive income came from investments — you needed a large amount of money in order to earn income. However, these days there are plenty of opportunities for web designers to create passive income streams: most require an upfront investment of time (rather than money), but can continue to pay off indefinitely.

• Stock Graphics: You can sell a variety of graphics through stock graphic sites. You create one image, upload it and the stock graphic company sends you money whenever someone purchases a copy of your graphic. You can often sell website templates in much the same way.
• Niche Websites: You can create a website on a specific topic, fill it with content and set up either ads or affiliate programs. With ads, you’ll get money whenever someone visits your site and clicks on an ad. With affiliate programs, you’ll get paid whenever anyone purchases a product through your website.
• Web Application: Projects like web applications can take a lot of upfront work. But, depending on your payment model, you can earn money for every person who uses your web application.

These are just a few examples of passive income streams. There are thousands more available to you, and they’re just a matter of figuring out how you can sell your skills without selling your time.

Type is one of the most-used elements of the web. Think about it. Unless you are YouTube or Flickr, chances are your site visitors are coming for your text content – not the fancy packaging that surrounds it. So why are web designers still treating text like a secondary element?

Good typography brings order to the page and increases legibility. It allows people to process information faster.

A more scannable, readable site means happy visitors. Happy visitors return often, buy products, leave comments, and share the site with friends. See why it might be worth thinking about?

I could blather on forever about how far typography has come on the web, and how far yet it has to go. I have frequently bounced between web and print design. When you’re going from InDesign to TextMate, the limitations of web type are crystal clear.

But plenty has been said about what web type can’t do. This isn’t going to be another rant. Instead, let’s focus on a 5 easy fixes for the typographic eyesores that abound across the Web.

1. Use A Reset Stylesheet

Stupid, but true: No two browsers use the same presentation defaults. Differences in padding, margins, headings, and indentations are rampant. If you want your page layout to be more consistent across browsers, it pays to start with a CSS Reset stylesheet.

Two I recommend:

Yahoo’s CSS Reset Stylesheet
Eric Meyer’s CSS Reset Stylesheet

2. Watch Your Measure

Measure refers to the length of a single line of type. A longer line = a longer Measure. Studies have shown that for optimal readability, running text columns such as your main body copy should be somewhere between 45 – 75 characters (30 – 50 ems) including spaces. This is one of the reasons that fluid designs (ones in which the columns expand and contract to fit the browser width) are harder on the eyes.

Additionally, your leading should increase with the length of your Measure. Leading is the amount of white space between lines of text, and is controlled via the CSS line-height property. If you need to use an extra-long Measure, make sure your leading opens up.

Likewise, if you have a small column such as a sidebar with a short Measure, your leading should be tighter. I find the default value most browsers assign is a little too tight. A line-height of around 1.4em works well for most body content.

3. Tend To The Space Between

It’s not just about your text – its about the space that surrounds it. Too little space makes text hard to read, but so does too much. The key is to find a simple balance that guides the eye from one element to the next.

 

One of the common mistakes new designers make is to fill every inch of space. White space refers to the empty or “negative” space around your content, and it is crucial. Take a look at a well-designed magazine such as Dwell or Good and you’ll see that even though it costs the publisher money to print each page, they leave abundant amounts of white space around the text. The page will be in balance and your eye will move from space to space effectively.

In addition to adjusting your line-height (as mentioned in #1), try increasing your padding and margins. Unless you’re trying to pull of a crazy visual trick, there should always be a good amount of white space around your text. Don’t let it butt up against other elements, especially images. Let your content chunks (headings, paragraphs, sidebars, etc.) breathe.

Mark Boulton wrote a very informative article about White Space for A List Apart, check it out.

4. Don’t Go Font Crazy

A good rule of thumb for any designer is: use no more than two font faces in your design. Two font faces can look very stylish. A List Apart uses variations of Georgia and Verdana to create an elegant and polished look. But continuing to add font faces to your interface creates unnecessary confusion. Similarly, avoid using too many font sizes, colors, or treatments on a page or in a paragraph or they will compete with each other instead of adding emphasis as intended.

Although font stacks and technologies like sIFR and Typeface.js allow you to specify just about any font you want as the default, resist the temptation to go wild with the body copy. Decorative fonts are best kept to headlines because they affect readability. Think about it – when is the last time you picked up a paperback novel set entirely in Comic Sans?

When creating font stacks, pay attention to the size of your pairings. Some fonts that look similar render at very different sizes. Verdana and Arial are a great example of this. Typetester is a great tool for comparing core web fonts and creating a successful stack. Another useful tool called Font Stack Builder shows you what percentage of users will see each variation.

Regardless of what fonts you decide to use, make sure they are not teeny tiny. I know its hard… tiny text looks cool. But think about the poor, squinting users! Keep body text above 10 or 12 pixels. If you insist on teeny tiny, at least use relative sizing for all those IE 6.0 users who otherwise couldn’t make it larger. Read Wilson Miner’s article on font sizes for a great take on the debate.

5) Don’t Neglect The Details

The client provided the content. Adding it to the site is just a matter of copying and pasting, right? Wrong, wrong, wrong. This is a trap web designers fall into all too often.

Even those of us who diligently add heading tags, format each paragraph and organize bulleted lists with care forget some important typographic details. Many (including me) missed out on formal typography training, so you can’t blame us entirely. But the devil is in the details. Its time we embrace these basics:

Use smart quotes

What’s the difference between smart quotes and dumb quotes? Smart quotes (also known as book or curly) are curved and have both an opening and closing style. Dumb (straight) quotes are usually straight up and down. An apostrophe is typographically just a single quote so the same problem applies. A dumb quote (also called a prime) should only be used between measurements. For example, 6?4? uses double and single prime quotes.

 

Unfortunately our keyboards default to prime quotes. Microsoft Word and other text editors just correct them for us as we write. Adding smart quotes to HTML pages requires more work from the web developer because you need to use markup to produce opening and closing quote symbols. I see the same problem with em and en-dashes, ellipsis, trademark and copyright symbols. Coders take the easy way out by replacing them with hyphens, multiple periods, a large TM and the infamous (C). Using the right symbols does make a difference visually. Do it right and make editors everywhere smile.

How to make smart quotes:

#8216; = opening single quote
&#8217 = closing single quote
&#8220 = opening double quote
&#8221 = closing double quote

I know – no one wants to spend all day hunting down quotes. Luckily, tools like SmartyPants and Textism can do much of the legwork for you by automatically formatting text that includes smart quotes and the like.

Read “The Trouble with EM and EN” from A List Apart for more detail on the subject and the UTF-8 character encoding for most common special characters.

One caveat – lots of CMS text editors (like the one this site uses) won’t let you implement smart quotes without extra plugins. Sad, but true.

Stop putting two spaces after a period. Please! It’s not necessary and its actually rather annoying.

On your links, use border-bottom: 1px solid instead of text-decoration: underline. Underlines can run through the descender characters (g, j, p, q, y) making them hard to read, especially when using smaller font sizes.

And while it has nothing to do with typography, running a quick spell check never killed anyone. Even if all you did was copy and paste, a spelling error that slips through to a live site reflects badly on everyone involved.

Pay attention to those 5 fixes and your site designs are sure to improve. Remember that these are just a starting point. Good typography is a learned skill just like anything else, and it requires study and practice. Always keep an eye out for sites that are getting it right and make note of what they are doing. Need inspiration? Check out the sites below for examples of great web typography and post examples you find to be inspirational.