Building Effective Websites

Posted on April 3, 2013

Building websites can be hard, especially if you’re new to the trade. There’s more to a good website than just the code, and it can be tough to navigate if you’re not artistically inclined. That’s why we’ve put together a short guide with a few tips for aspiring web designers.

1. Focus on the User’s Needs

A web designer should focus on the user’s needs at all times. Learn to see things from a user’s perspective, and be ready to diagnose and fix problems relating to usability, accessibility, and the user experience.

  • Navigation is one of the most important factors affecting user experience. Think of how many sites you’ve clicked away from simply because you couldn’t find what you were looking for. Ideally, your site’s navigational structure should be neat, consistent, and flexible enough to accommodate additional links as the site grows.
  • Layout with lots of white space increases readability.
  • Layouts should be flexible, that is, able to accommodate multiple different screen resolutions without breaking.
  • Avoid using custom fonts. Computers that don’t have the font installed will most often default to using one of the standard fonts, which might ruin your design. It’s best to design your layout around one of the many standard fonts instead.

2. Learn CSS, Use CSS

These days, it’s considered good practice to know how to code a website layout in CSS. It’s cleaner, easier to maintain, and produces layouts better than the old table methods. CSS coding skills are, by far, the most important skills to have as a web designer.

3. Optimize Load Times

Nobody likes waiting for things to load, and it’s very tempting to load up your site with lots of fancy flash animations and high-quality images, but the more you do so, the longer the load times. And studies have shown that long load times are responsible for driving people away from your website. When designing a site, it’s best to ensure that load time is as short as possible.

  • Use web-friendly formats such as .jpg & .gif for all your graphical assets to reduce file size while retaining graphical quality.
  • Optimize HTML and script code to ensure that there are no unwanted tags or unused scripts.
  • Make use of server-side includes, caching, and client caching to reduce load time for repeat visitors. After the first visit, web pages will reside in the client’s local cache, improving load times since they don’t have to be fetched from a remote server.

4. Test, Test, Test

Be sure to test your design on as many different browser configurations as possible. The differences in each one’s implementation of the HTML standard means that a design that works in one might not work in another, and vice versa. Older versions of Internet Explorer were famous for this, to the point that many web designers refuse to support it when building website, Microsoft has been working on it, though, and the latest versions perform much better, but that doesn’t mean you shouldn’t test on it anyways.