Category Archives: Web Design

The Perfect Website Myth

  • by Matthew McNairy, March 27, 2012

The self-proclaimed experts in the web design field love to boast when they think they’re ahead of the curve. Posts appear on an almost daily basis touting the ingredients of the perfect website or, conversely, what’s wrong with almost every website on the internet. The truth is that the “experts” don’t really know because everyone is at the mercy of the search engine companies. What Google and Bing say goes – the rest is just noise. So what are they saying? It’s really not that complicated.

1)     Include good content: That’s what everyone out there is looking for – quality copy, useful information, nice pictures, engaging video. If you’re disregarding the content, your site is worthless. You can try to game the search engine optimization (SEO) system, but your life will be a lot simpler if you simplify and isolate the targets. The result? Visitor numbers that build organically over time. Keep the content fresh and readers will keep coming back.

2)     Create a visually appealing site: You may like the idea of including every new eye-catching tool in your presentation, but the bottom line is that it needs to be simple and appealing. Readers want comfort and symmetry. Bombarding them with excess design is a ticket to the Back button.

3)     Consider the user: Ultimately, the site is not about you; it’s about what the user wants. Your site architecture needs to be logical and have a navigable flow. If readers struggle to find what they came for, you’ve lost. You need to make it easy for readers to dig around.

The perfect website is a myth. A smart website, on the other hand, is always in reach. Consider the three points above when creating or rebuilding your site.

What are your thoughts on the subject?

Tags: ,

Why web standards are important

  • by Matthew McNairy, February 28, 2012

There have always been web development “standards,” a way developers should construct websites. These standards have changed over time, and it’s important for developers to stay on top of the changing landscape. Organizations like the W3C are responsible for making sure that the proper standards are adopted, and then making recommendations to browser makers like Mozilla, Microsoft, Apple, Google, and Opera for how their rendering engines should interpret the code in the webpages you visit.

To find out if your site is built using valid coding, visit the W3C Validator.

In the early days of the web, designers and developers built each page in one file. If they wanted one paragraph to have red text and the next to have blue text, that was declared in that file. If they wanted the page to have two columns, they built a table with two columns. This worked for a long time, but people started to realize there were problems in going that route.

Table-based designs have a lot more code in them than other alternatives, and all this code makes the page take longer to load completely. Also, if the client decided that they wanted all that red text to be changed to green text, the developer had to go through each and every pages and change those paragraphs one-by-one. Imagine the billable hours that would create with a site that contained hundreds of pages! A third problem relates to the many other devices that can read a webpage. If you try to view a three-column page on a mobile phone, the page will be very small or require a lot of horizontal scrolling.

CSS Sites

Most of the highest trafficked sites in the world now follow web standards.

The solution to these problems was Cascading Style Sheets (CSS). Style sheets are a separate file where all the details of how a page looks is stored separately from the actual page content, like text and images. Developers can create different style sheets for different devices, allowing every user to see the page in the best way possible for their device. Global styles can also set up for pieces of webpages, e.g. every primary page header can be 18pt, bold, and red. If the client wants to change that to 16pt, italicized, and green, it only requires one quick change to the stylesheet, rather than parsing through all the pages of the site. Style sheets also allow for many different types of layouts without using tables. The same layouts that were previously built with tables can be created using CSS at only a fraction of the filesize.

So why should you be sure your site is built using web standards?

  • We’ve already covered that they are easier to edit. Those easier edits translate to dollars in your pocket, because your developers will have fewer billable hours wrapped up in any edits that you ask for.
  • Your pages will be faster loading and use less bandwidth. No one likes to wait for a page to load. Faster pages mean less people leaving your site because of load times.
  • Your pages will be more accessible. Certain screen readers for the blind and other special needs browsers have a much easier time translating valid code. Pages that use nested tables and improper markup are more difficult for these browsers to read. Also of high importance, well coded pages allow much easier readability on mobile devices. The number of mobile internet users is growing very rapidly. You don’t want to miss out on that traffic or give those users a subpar experience.
  • Websites built following current standards will work forever. Future standards are built on top of current standards, so any site that follows the current standards will always work, no matter what changes come in the future. Search Engine Optimization comes along with following standards. Google and Yahoo send spiders to read through your website. That’s how they determine where to put you in their search results. They have an easier time understanding your content if it’s properly marked up, which can lead to better search placement for your keywords.

So, there’s a few reasons why standards are a big deal, and why we are sure to follow them on any website we build. If you’re in the market for a new website or a redesigned website, make sure whoever you have building it is following these standards.

In future posts, I will cover some of the newer trends in HTML, CSS, Javascript, and other standards to show what new capabilities are here now or are coming soon.

Search Engine Optimization (SEO) – Part 2: Site Development

  • by Matthew McNairy, February 14, 2012

Part 1 of this series focused on figuring out the right keywords to optimize your site. The next step is to make sure your site content is attractive to search engines.

The basic formula is simple: Unique content plus unique URLs equals getting found by search engines. And when the search engines find you, so do the readers.

Let’s start with content. Search engines are looking for content that is distinct, so each page of your site should be different. If you’re just repeating the same keywords over and over again without making the information valuable or worthwhile, search engines will notice and your site won’t be indexed. Quality content without duplication is the key to search engine optimization.

The other part of the equation is good URLs. If you have three URLs that all go to the same location – also known as canonical URLs – the search engines know you’re either trying to beat the system or you don’t have good content. You want unique URLs that tell the search engines what can be found on the page. To get the most bang for your buck, find a way to incorporate keywords in the URL. By doing so, you create keyword themes, which is also called siloing. To sum up:

  • Bad: indyrocklive.com/1277939429&bib=394
  • Good: indyrocklive.com/topalbums2011.php

And that, in a nutshell, is what the average person needs to know. You can dig a lot deeper – the next step would be tags and on-page SEO – but that veers into coding territory. Obviously, there’s a tremendous amount of science and strategy involved in getting SEO right – multimillion dollar companies exist for just that reason. But for the average person looking to build site readership without learning code, the formula above is what matters.

Top 3 Web Design Trends for 2012

  • by Matthew McNairy, January 10, 2012

Trends are exactly that. Yesterday’s fashions are tomorrow’s punch lines. Flash is, well, Flash.

Where I feel minimalist design and grand photography will still dominate the Web landscape, a few other trends will be more prevalent.

A new year is upon us. With that in mind, here are my top 3 web design trends for 2012.

 

1. Bigger and Better Social Networking — Any site without all the core social networking portals built in is obsolete. Facebook, Twitter, LinkedIn, Google+, and so on — they’re all integral to creating the most engaging, well-rounded site you can deliver. If you’re not part of the growing social network, you may as well shut down. Maybe that’s a little harsh.

2. Interesting Typography — The old standbys just don’t cut it anymore. Web designers need to use fonts that fly. Designers should experiment with lines and shadows and look for something new. I love that charge when I see an interesting font in an unexpected environment. In 2012, I think the boundaries will continue to expand.

3. Art for Art’s Sake — Some of the best sites I’ve seen recently showcased orginal art and illustrations. The web comic aesthetic opens up so many new doors. With original illustrations, your options are unlimited. After you take a look at something that features glorious originality, the basic stock images just don’t cut it anymore. The everyday graphic is riddled with unappealing nostalgia.  Designers are really going to get creative in 2012.

Here are some other Web trends to consider.

What do you see on the 2012 horizon? What trends do you see popping to the forefront of Web design?