As we start 2013 it hit me that we’re still failing to describe precisely what it is that we do at Dotvita. It’s particularly challenging because saying “we build websites” misses the fundamental passion we have for small biz.

There’s no doubt I would be a reckless entrepreneur who incubates new businesses as often as the wind moves if I weren’t able to live vicariously through our customers. They are what motivates our team to invest so much time into getting the user experience right. This drive means we routinely look past branding and marketing to solve our customers’ business design challenges.  Be it a customer focus issue, a product problem or something more abstract, we continually find ourselves working on the operational challenges of our customers’ businesses that have far-reaching implications (for the better). Think of us like a managing partner without giving up equity.

So in the wee hours of the night I began to start what will probably become our manifesto at Dotvita. This smattering of thoughts helps capture our core beliefs and what we see when looking in the mirror.

• We are intentionally lean so as to remain agile but our product is the opposite of cheap. Value is at the heart of our pricing strategy.
• We’re are highly selective when choosing our clients because we want to serve them exceptionally well.
• We speak candidly and clearly because neither of us has time to act like politicians.
• We provide an objective, outsider’s point of view on your business.
• We teach you to fish by providing a design strategy for each point of customer interaction.
• While the end result is often something tangible like a website or logo, our emphasis is to create a remarkable experience for your customers, legitimize your business and help you be wildly successful at your craft.

To be fair, mobile sites had their place when cellular bandwidth was limited and people were using their mobile web browser to quickly access a phone number, business hours or physical addresses.

But things have changed. The phone has become an integral part of our multi-screen lifestyle. We have grown accustomed to rich, compelling and beautiful interfaces – we can thank the app revolution for raising the bar to this level. Today’s businesses need to understand the value of carrying the same brand aesthetic. Also, functional goals set for their desktop website need to be met by their mobile equivalent.

But there’s a problem

Mobile sites are usually designed for a limited range of devices – a.k.a. mobile phones. Worse, the design and content layout often caters to the capabilities of a pre-smartphone device. But what happens when you have an iPad, an Android tablet or something with a high-resolution display?

These days, the vast variety of screen sizes and resolutions will torment the average mobile web developer. What used to be a simple decision (website: yes, mobile: yes/no) has become a very complex matter. Bear in mind that most mobile sites are built, updated and maintained as entirely unique entity. Sounds like a mess, no?

Imagine a site that adapts automatically

Responsive web design is the art of adapting content (text and images) to different screen sizes. It will detect how big your browser window or device display is and serve up a layout that fits best – think of it as one website using a common set of colors, textures, fonts, text and images but rendered using various content arrangements.

For example, text boxes or photos often live in four columns on a large monitor, rearrange to three columns on an iPad and on an iPhone they reorganize to a single column. The beauty of this process is a single, manageable site controlled by a single CMS which means updates are automatically cascaded across all devices.

Times are a changin’

There’s one more thing we need to contend with. The web is undergoing a radical shift of standards. Remember when standard definition televisions made the transition to HD? Yeah, it’s kind of like that.

Currently the vast majority of screens operate at a fairly low resolution (72 dots per inch in nerd speak). Apple championed the idea of increased pixel density with the advent of the iPhone 4 and iPad 3…others have followed. And with the recent introduction of the Macbook Pro retina we now have to deal with multiple resolutions across every form of device.

Exceptional responsive websites will take single and high-resolution design into consideration. Photos, icons and textures are prepared in multiple versions and intuitively load according to the detected browser resolution and client’s available bandwidth. A well-crafted responsive site is a powerful thing when ubiquitous accessibility is required.

Ready to take the plunge?

Not every site needs to be scrapped and rebuilt using responsive, retina-friendly design techniques. From our perspective only about 25% of our clients need this functionality today.  The challenge is most businesses can only afford a radical site upgrade every 3-5 years so what’s decided now can greatly determine whether your website appears dated in the not-so-distant future.

Go to the Living With Nest page and take a look. The story is told in chronological fashion and takes the user through installation, setup and the thermostat learning process using the number of days as the driving unit. Unlike a lot of other companies that use happy stock people to support benefit descriptions, Nest uses the device itself to illustrate the process. This make sense, as it is absolutely gorgeous and its industrial design deserves to be celebrated.

Everything is geared to tell the story

While scrolling through the individual sections of the page, the subtle animations and the ever present day indicator elevate the continuous narrative. Most sites using modern methods of animation and scrolling effects tend to take it too far and end up distracting from the story they are trying to tell. Aesthetically, Nest supports its message through the use of generous clear space and limiting the amount of visual clutter to a minimum. Adding depth to the experience, the seamlessly-integrated video clips are well executed and play only when upon request.

Of course I have to nit-pick

The part that confuses me is the stock photo used for the “School’s Out” section. It doesn’t seem to match any of the other treatments. The kids are playing outside, a place at which a thermostat has no bearing. Also, the piggy bank illustration below seems out of place. I might be a stickler for details, but a site with as little elements as Nest needs to get every nuance right. The less there is the more stands out.

All in all Nest does a tremendous job at balancing messages with visuals and deserves recognition. If for anything, it should be used as a reference when looking at ways to limit amounts of information. Nest is a truly people friendly site.

Are we ripping people off?

Not really, and here’s why: An automated or templated design lacks two things that can only be accomplished by a trained, experienced professional.  The first is best practices in modern aesthetic – in other words it looks clean and attractive but I don’t know why. A true designer spends unreasonable amounts of time researching current trends and soaks up emerging innovations like a sponge. He/she is also intimately familiar with what was done 1, 3, 5 and 10 years ago and therefore understands the effect of time.

You’re unique. No really.

The second thing absolutely essential to any design that cannot be substituted by a machine or a process is capturing unique personality. A design can only be considered good if it conveys what the subject matter is about without using words to describe it. I’m not saying people should be able to know the details about a product just by looking at it, but they should be able get the feeling it is attempting to evoke. The only way a designer can effectively deliver such emotions is by understanding not only the client, product or service but also the mission, attitude, target customer and most importantly: differentiation–the one thing that makes it special.

This needs to stop.

You don’t need to communicate your industry with imagery–just say it: Sally smith CPA, Jim Johnson Law Firm. Let the imagery on your site speak to your personality, to what makes you special and unique. It should be done with subtlety by using visuals that indirectly reference your specialties. It’s all about capturing an emotion, about conveying an atmosphere.

What the user sees

SEO usually falls into two categories: on-page and off-page optimization. On-page optimization includes everything you can do on your own site. Page load speed, meta tags, content relevance, etc. are typical examples. At Dotvita, we deal with this sort of optimization daily and happily help our clients get things right. Our strategy is focused on being authentic and providing great value to your website visitors. In other words, if it’s useful for them, it’s worth doing.

What the user doesn’t see

Off-page optimization is far more powerful and an entire industry in and of itself. There are service providers that specialize in placing inbound links on industry relevant sites and come up with viral methods to spread the word. Sadly, in many cases it involves gaming the ever-changing algorithms of Google. Many SEO-optimized sites will have identical clones to their content, will be filled with tons of irrelevant links and uncountable pages of content which have been scraped from other sites.

What search engines favor beyond anything in the world is content combined with credibility (links from reputable 3rd party sites). Creating original content is hard work, and most small businesses can’t commit the resources to write posts, shoot videos or come up with engaging ways to draw people in. For this reason small businesses are looking for the easy button. In other words: a company that they can pay to do it for them.

Now don’t get me wrong, there are reputable companies out there that will do a great job at placing you on relevant, trusted sites by contributing to them in a meaningful way, but you will pay according to effort–and it’s a ton of effort.

It defies logic that in 2012 with fiber optic, cable or next gen wireless internet that there are any performance issues with websites. But the truth is we’re hitting some real challenges, and there’s no end in sight. Web design techniques have evolved quickly, giving us web creators the ability to provide people rich experiences but at the expense of performance.

Why so slow?

I’ll let you in on a little secret: most of the page load issues are caused in large part by us designers and developers. We are tantalized by big imagery, gorgeous web fonts and gee whiz javascript tools. In their own right, these add-ons are not only helpful but they can create an incredible experience for users. Unfortunately, our industry hasn’t been diligent about implementing them efficiently.

Quote by Jeremy Keith:

“When did we get so lazy and decide it was acceptable to send giant unoptimised images down the pipe to our long-suffering visitors?”

From a development point of view, optimizing a website’s page load time can chew up a sizable amount of development time, and it isn’t sexy work by a longshot. Clients often don’t understand the painstaking effort required, so the extra effort often goes unnoticed–giving us even less incentive to do it. The problem is often exacerbated by tight timelines and sometimes unreasonable budgets.

Page speed matters:

People seek out great experiences on the web and flee from everything else. The stats don’t lie: the average website visitor makes the decision to leave (a.k.a. bounce) in under 10 seconds. Slow websites = unhappy people. The fine folks at Google know this and routinely punish websites that load poorly with lowered rankings.

Attacking the problem:

It all starts at the basics. Asses your site using a mobile internet connection. If you find your thoughts wandering before the page is fully loaded you can certainly expect visitors unfamiliar with your brand or company to ditch as well.

There are oodles of nuance-level details (caching, compression, image sprites, CDNs, concatenation, etc.) but we’ve found tremendous benefit by reducing the number of times a browser has to request objects such as images, scripts and stylesheets. Google’s Page Speed Tester is also a great resource for identifying the potential areas of improvement.