1. Small Business Website Design and Credibility

    In today's increasingly computer-centric world, many businesses are discovered online first, brick and mortar second. The customer's first impression often comes from how nice a website looks, not how the actual store looks. While this is certainly a new frontier for most business owners, it should definitely be something that is embraced, not ignored.

    The Online Gauge of Trust

    When a potential customer first visits a site, they start with a clean slate of trust—a clear, unclouded opinion of this world they have just entered. As they take in the information and graphic treatments that make up a site, they judge the site's credibility by the presentation of info, imagery, and general usability. If the site is for a photography business and the photo work is second rate, the visitor is immediately going to lose some of that trust. Likewise if the site is for a copywriter and there are misspellings or bad grammar on the site, there is an instant drop in that gauge of credibility. And all it takes is one tiny slip!

    Watch Those Pixels!

    The human eye has an incredible ability to detect spatial alignment. Even the tiniest inconsistencies in typography, graphic elements, or form elements will be noticed by the observant web surfer. Setting proper CSS margins, padding, floats, and line heights are crucial for a designer, not just because it ‘looks pretty’, but because when things are not well styled, the business takes the hit, not the designer.

    As I mentioned, a site visitor shows up with an unbiased opinion of the business behind the site—after a bit of clicking around, how much of that opinion is still positive? How many times did they think “Hmmm…that looks a little Off…”
    Each little moment of “hmmmm…” is a ding for the business.

    form field and buttonWhat's wrong with this form submit button? Even a quick glance and you can see that the 'Password' label is too high in relation to the field, the 'sign up' text is too far down within the button's border, and the button itself is not lined up with the password field above. In other words, a big mess! And that is only subtle alignment issues. Poor grammar and misspelled words look even worse, lowering that gauge quickly.

    Spending the extra time it takes to polish up every piece of type, layout, or imagery on a website can mean the difference between new customers and lost ones. Don't let tiny pixels make a giant dent in your bottom line!

  2. How to Make Your Website Mobile Friendly

    It’s all you hear these days – “There’s an app for that . . .” or “Get it on now your mobile phone . . .” The fact is, more and more people are surfing the web on these tiny No mobile website yet? mobile devices, so if you don’t already have a mobile site or app, you are certainly missing valuable traffic and possibly losing money. Already have a website?  Read on.

    Been a While Since Your Last Site Redesign?

    Your site probably has fallen behind in some (or many) respects, since web technology moves faster than most of us can predict. In fact, If you don’t freshen things up every few months, your search ranking will suffer, and in turn, your bottom line. The mobile phenomenon is still gaining steam and shows now signs of slowing down. On every website I manage, the number of hits from mobile devices has increased greatly over the last couple of years. If you want your site to stay up-to-date and accessible, you need to learn what it takes to deliver content to these mobile platforms.

    Mobile Devices Have Smaller Screens

    The web browsers on today’s mobile phones are capable of almost the same functionality as their desktop brethren, with one big difference – screen size. Instead of multiple columns like on regular sites, single columns are required for layout and vertical scrolling is expected. Go easy on the images, as they eat up bandwidth and slow down the user experience. While you’re at it, rethink your content—just present the most important stuff, not the fluff.

    A mobile site is often a stripped-down version of your normal site, with mobile-friendly navigation and content that loads quickly. Big, clear buttons and text that can be maneuvered around with just a single clumsy thumb. Let’s hope they’re not driving as well…

    How to Direct Mobile Devices to Your Mobile-formatted Site

    The web browser on every computer and device has what is called the ‘User Agent String’ that identifies the browser type. With some clever site coding, you can use this bit of info to direct visitors to the appropriate version of your site. Other modern techniques such as CSS media queries can detect a device’s actual characteristics such as screen size, enabling you to deliver device-specific styling without altering the actual content.

    Many sites actually create a full mobile-friendly version of their content and put it on a subdomain of the main site, such as: m.google.com or mobi.somesite.com, etc… The ‘.mobi’ domain has even become available, enabling sites to have ‘sitename.mobi’ addresses. There are valid arguments for choosing these different options—your specific situation can determine which way to go.

    Once the user gets to the mobile site, they will see the content presented in the stripped-down format that works on a small screen, but (if you planned well) they won’t miss any important stuff. I sometimes prefer the mobile version of sites because they are simpler and faster to get around in. You can maintain enough of your branding and stylistic flair to keep your marketing team happy, but just stay lean and mean in terms of content.

    The Latest Trend – Responsive Web Design

    Well, maybe not the latest as of the writing of this article, but certainly a new approach if you judge by the sites using it – responsive web design is an amazingly refreshing approach for delivering content that adapts seamlessly to the device being used. Whether you view the site on an iPhone, iPad, Desktop, or some oddball screensize, the site will adapt itself and look good.

    Instead of building separate sites for mobile and desktop, you create one site to serve all. Ethan Marcotte’s Book has some groundbreaking insight into this method, and should be required reading for modern web developers. The simplicity of the concept was enough to grab my attention, and the benefits for a client are: reduced site maintenance costs (you’re only maintaining one site…not two), wider audience reach, more versatile content (folks with 32-inch screens won’t see a narrow little column of content down the middle…) to name a few. The responsive approach may not work in every situation, but it is definitely an exciting tool to have in the box.

    Don’t Treat Web Design Like Print Design

    Print designs require strict pixel-perfect representation of imagery and text. Advertisers spend unheard of amounts of money to make sure their graphics look just right in every situation. When you’re dealing with web displays, (especially mobile devices!) you can’t expect every user to see the same exact thing. Each device, monitor, browser, user setting and more will have an effect on the display of your site’s content. The goal should be delivering content that makes sense and functions as intended, while adapting smoothly to each platform. The old-school method of coding a bunch of hacks and workarounds so that every pixel is a certain fixed way…well, you can see where I’m going with this . . . Focus more on ‘solid & flexible’ than ‘rigid & unyielding’. The number of mobile devices and tablets will continue to skyrocket, and trying to learn all the little quirks that each display presents just isn’t an option. Concentrate on a flexible, adaptive user experience and you will save a lot of headaches.

    Mobile Doesn’t Have to Be a Pain

    Many popular content management systems (CMS) like WordPress (you are reading a WP blog right now) have built-in mobile styling via plug-ins that handle the mobile-specific formatting for you. Mobile users will automatically see the small-screen formatted pages and desktop users still get the full-screen version. Slick!

    Just Don’t Say I Didn’t Warn You!

    If you don’t jump on the bandwagon, you’ll be losing visitors or money or both. the choices are simple: If your website doesn’t work well on a mobile device – have it redesigned to adapt gracefully to different platforms, or build a separate mobile-formatted version of your site. Hurry up – time’s a-wastin’!