Posts Tagged ‘web design tips’

Little Tips to Improve Your Website – Part Two

Continued from Part One:

Web Forms - using web forms adds professionalism, function, and a splash of flair to your site. Many webmasters and (especially bloggers) still use a simple “mailto:whoever@whateverdomain.com” instead of using a contact web form page. This isn’t a good idea for a lot of reasons. When you display your email address on your page, you are more setting yourself up to receive lots of spam. Spambots crawl the internet and collect email addresses from websites so that you get lots of junk in your inbox. When you use mail forms you have the option to use CAPTCHAs. The use of CAPTCHAs will not stop all spammers from sending you junk, but it will significantly reduce the amount. If you aren’t “tech-savvy” enough to write your own contact form, there are services such as Icebrrg that can do it for you. For Wordpress users, I recommend the cformsII plugin. Using cformsII allows you to easily create, manage, customize, and style forms for your Wordpress blog.

Unobtrusive Advertisements - No one likes advertisements on websites, but I think that most people understand that they are a necessary evil. Ads keep a lot of free services free. They can also make bloggers Pop-up Adand webmasters a little money to help keep their sites afloat. Advertisements are usually placed in areas of high visibility: in the header, sidebar, before and after posts – and that’s fine. What isn’t fine, in my opinion, are ads that are obtrusive and annoying. I’ve said it before and I’ll say it again: your message and content should be the main focus of your site. Pop-ups, those talking ads (ie – You’ve won a free iPod!), and ads that expand across the width of the page aren’t just annoying, they really detract from your page! Anything that diverts your visitors’ attention away from your content is just plain bad. So in summary, advertisements are fine, as long as they are tasteful and noninvasive.

diggAdd Social Bookmarking & Sharing - Most blogs these days include links to sites such as Digg, Reddit, Technorati, Mixx, Del.icio.us, Stumble Upon, etc. at the end of their posts. But believe it or not, I still see a number of blogs without any sharing links. Adding social bookmarking to your blog is a must if you want to increase traffic. You shouldn’t rely on your visitors to go to these sites and “manually” submit your posts – you have to do the first step for them. It’s relatively easy to add the links to your posts, but if you’d rather, you can always use sharing buttons such as ShareThis or AddThis.

Encourage Comments On Your Blog – Visitors who leave comments will often return to your blog to check for replies. Getting return visits is always a good thing! One way to encourage people to leave comments is by using a “Recent Comments” plugin / widget. People are more likely to leave a comment if they can see their name, usually linked to their own website, on the main page or sidebar of your blog. Also, keep in mind that requiring visitors to be logged in discourages a lot of people from commenting.

If you have anything to add or tips of your own, please feel free to leave a comment and share!

Little Tips to Improve Your Website – Part One

Over the next while, I will be compiling a list of little tips that can improve the appearance, visibility, and function of your website. Here are the first five:

Favicons - Now-a-days, mosts sites use favicons:

Favicons (or favorite icons) are a good way to “brand” your site. Especially with tabbed browsing and bookmark toolbars, they help to visually distinguish your site from others. A favicon is nothing more than a 16×16 pixel .ico file. You can make your own using your favorite graphic editing software or you can use one of the many free online favicon generators.

Tutorials to check out:
How To Create a Favicon (using Gimp) from publisheraid.com
How To Create A Favicon In Photoshop from photoshopsupport.com

Online favicon Generators:
Favicon.cc - www.favicon.cc
FavIcon Generator from dynamicdrive.com - http://tools.dynamicdrive.com/favicon/
Favicon generator from degraeve.com - http://www.degraeve.com/favicon/

CSS Navigation Lists - In my opinion, site navigation should be written in HTML as a list – its just good structure. The use of lists make it possible for visitors to navigate your site if they are using a text-only browser or if their browser don’t support CSS. Plus, well-structured HTML is essential for web crawlers to index your site accurately. In this example from blendetta.com, you will see how the navigation structure stays intact with or without CSS support:

Example: CSS Navigation List

Since most of your visitors aren’t using text-only, non-CSS supporting browsers, you can make a big difference to your sites appearance by styling your navigation lists! As stated in my 10 Awesome Free Resources… article, “Listamatic is the place to go if you are looking for tutorials on CSS based navigation lists”. For a good example of how to make a list like the one seen on blendetta.com, check out Listamatic’s Bulleted Rollover List tutorial.

Get Rid of the Music - Let me restate that: don’t have music on your page that automatically plays when the page is loaded. A lot of people find it to be annoying. You don’t want people to leave your site over something silly like a music player.

Use PNG Images Whenever Possible - Let’s say that your web page has a blue background. You used JPEG images, also with blue backgrounds for your design. What happens when you decide to revise your page and change the background color? Yup. You’d have to change the background color of all of your images. Hopefully you still have the layered PSD file stored somewhere on your computer or you’d have to start over.

If you keep in mind that you may want to make some simple changes to your site one day (ie – change the background!), you should probably save your images as PNGs with transparent backgrounds. Displayed on different CSS styled background colors, here is a PNG of a cat that I drew in Photoshop many years ago:

All I had to do was change the background color of the page from #FF9900 to #990099 - I never had to edit the image. Whatever you do, don’t open that JPEG with the blue background in Photoshop and simply select and delete the background color - it leaves all of those ugly extra colored pixels behind!!

Don’t Junk it Up - It looks nice when a page has a minimal amount of buttons, banners and link images as long as they are well organized. I see way too many blogs with hundreds of link images, “latest visitor” type widgets, and other items that slow down and clutter the page. The content of the site should always be the main focus. All of the items that link to other pages should definitely be a secondary concern. Other things to avoid: adding too many colors, lots of scrolling text and excessive amounts animated anything. You don’t want your page to end up looking like HavenWorks.com!

Part two of the list will be coming soon! And as always - comments are welcomed.