Category Archives: Web Design
- by Matthew McNairy, April 30, 2013
Ask five experts how they define great web design and you’re likely to get 25 different answers. Why? Because they all value different elements. And every client has different needs. Depending on the industry they cover, what constitutes greatness is subjective. Throw out all the editorial components, however, and you’ll hit three – four, really, but we’ll come back to that – factors that are critical.
1) Look and Feel – Aesthetics matter. The first reaction from a new visitor is important and the visual appeal must be high. Take the time to work with your designer to flesh out the color, layout, and intent of your site. Clients may choose whether to work with you from the way they react to your website. Take the time to make sure it’s appealing.
2) Functionality – Your website must not only be well designed but easy to use, too. A visitor to your site isn’t going to want to waste time having to dig for information or click multiple times to find what they’re looking for. Your site should be intuitive and functional, enabling prospective clients to reach you without having to go through hurdles.
3) Measurement – A nice looking, easy-to-navigate site is crucial, but so is understanding how people are coming to your site and whether they’re spending time learning about your company or product. Good design incorporates analytics that allow you to peek behind the curtain and see what works and what drives away traffic. Simple measurement tools are a necessity.
4) Content – This is the piece that often gets overlooked but is just as important as the visual elements. Though not technically related to design, content determines whether visitors to your site are going to keep coming back. If you’re not providing quality content that resonates with your audience, your site has little value.
Does your current website successfully incorporate these factors? If not, what isn’t working?
- by Matthew McNairy, March 19, 2013
The first quarter of 2013 is drawing to a close and some web design trends will start to take hold. Predictions are just that, so it’s always interesting to see what comes to fruition. Of the four below, one is a guarantee while the others fall into the wait-and-see category.
1) Responsive Design – It’s almost a cheat to call this a prediction because it’s such an obvious direction. As screen sizes on phones, tablets, and computers continue to change, it’s going to be impossible for every website owner to modify their product for the multiplying range of resolutions. The cost and time would be prohibitive. Responsive design enables developers to create options that will work for all tools. This one’s a guarantee.
2) Single-Page Layouts – HTML5 has opened several new doors for designers, including the ability to create dynamic single-page layouts. Users will be dazzled by the scope and designers get to exercise their wide-screen sensibilities.
3) Touch Screen Efficiencies – The release of Microsoft’s Surface officially means that all the big dogs have jumped into the touch screen pool. To capitalize on the growing market, designers will have to create elements that work smoothly with the technology. That means bigger buttons, larger arrows, and simpler navigation. Hiding icons and getting cute with tiny imagery isn’t going to work.
4) Vertical Scrolling – In line with the touch screen efficiencies, simplicity and intuitive features will continue to be in demand. By building headers that move up and down the screen as the person scrolls, designers are enabling users to get the full experience of a page without the frustration of having to go back and forth as they browse. Frankly, it’s a surprise this hasn’t taken hold sooner.
What trends do you see on the design horizon for 2013? What would you like to see disappear?
- 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?
- 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.
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.
- 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.
