The Key to Conversions2016 Web Design Checklist

“The key to creating a standout campaign is data.” ~ Google

Jane ClarkCreative Director of multi award-winning design studio Teakettica

I’m a multi-discipline graphic designer and front-end developer. I’ve been making websites for over 15 years for small, large, and

celebrity clients.

Let’s talk...

1. Purpose

2. Planning

3. Content

4. Web Design & Development

5. Search Engine Optimization (SEO)

6. Google Analytics & Search Console

7. Follow up

PurposeWhy are you making this website?

What do you want your website to do for you?

Sell products or services

Generate leads

Establish credentials

Become an authority in your industry

Which of these sites has a clear purpose?

“

”

Users often leave web pages in 10-20 seconds, but pages with a clear value proposition can hold people's attention for much longer…

The average page visit lasts a little less than a minute.

~ Jakob Nielsen

PlanningIf you fail to plan, you plan to fail. What makes your company unique?

Don’t skip these steps…

Research: What are your competitors doing? What is conventional for the industry? Dos and Don’ts. A good designer will help you avoid pitfalls.

Content Outline: What content do you want to feature? What order should it be in? What is the most important information your users need to know?

Mood Board: An arrangement of images, materials, pieces of text, etc., intended to evoke or project a particular style or concept.

Wireframe: A sketch or simple image that serves as a skeleton or blueprint of your site.

Mockup: The design comes to life. This is exactly how it’s going to be coded.

Research

Mood Board Wireframe

Old siteMockup

“

”

Building a website without a plan is like constructing a building without blueprints.

Things end up in the wrong place, features are overlooked, and the situation is ripe for miscommunication between website builder and client.

~ Taylor Hawes

ContentInformation Architecture

What it’s all about.

Content Outline: Create a simple outline of your website pages.

Voice: Your brand personality should be expressed here to separate you form your competitors and reinforce your brand.

Quality over Quantity: Keep your pages short & sweet, to 300 words (for SEO), and break it up with pictures and call to actions.

Have clear call to actions: Don’t give everything away – offer an incentive for them to contact you for more information to capture the lead.

Example Content Outline Home About

Our Team Jane Clark

Jayne Bayquen

Josette Boettcher

Emily Martin

Mission & History

Services Web Design

Logo Design

SEO

Contact Us Blog

Brand Voice

If your brand was a person, how would you describe its personality to someone? Examples:

Passionate

Quirky

Authentic

Sincere

Rugged

This is important for your content strategy. You are positioning yourself as an easily identified and authoritative source for your area of expertise.

300 words looks like: Lorem ipsum dolor sit amet, consectetur adipiscing elit. Maecenas luctus risus in nisl tincidunt gravida.

Curabitur ullamcorper dolor massa, eu imperdiet lacus eleifend quis. Mauris sed risus felis. Vivamusvitae nibh vel orci posuere posuere id et quam. In vel diam venenatis, venenatis lacus id, imperdieturna. Nullam sodales erat ipsum, at tincidunt lorem feugiat eu. Aenean sit amet vulputate ligula. Donecvulputate eros ac justo pulvinar, vitae hendrerit enim dapibus. Proin augue velit, aliquam sed velit vel, aliquam posuere urna. Pellentesque a gravida ligula.

Proin eget arcu tellus. In a efficitur lorem. Sed lectus neque, semper commodo ultricies pellentesque, tempus in felis. Donec tempor lectus eu sodales viverra. Suspendisse ullamcorper dolor orci, ac variuslorem lacinia molestie. Pellentesque id eros in enim blandit consectetur vitae eu neque. Sed feugiatcongue porta. Sed luctus tellus at dictum convallis. Curabitur condimentum non dui vitae fermentum.

Integer nec neque risus. Suspendisse dapibus, tortor in laoreet ultricies, nulla nunc aliquam dui, seddignissim felis libero consectetur lacus. Nullam eget quam eu nisi condimentum euismod ac non mauris. Cras id dolor justo. Duis tincidunt lectus a libero lacinia sagittis. In purus enim, facilisis eu semper nec, euismod ut neque. Vivamus efficitur lorem nec leo tempor, ut sollicitudin dolor pharetra. Phasellusviverra placerat nunc, a placerat lectus aliquam quis.

Quisque id elementum tortor, a consequat quam. Interdum et malesuada fames ac ante ipsum primis in faucibus. Cras urna tortor, consequat a augue vel, fermentum dictum ipsum. Mauris porttitor gravida est ac eleifend. Vestibulum et justo lacinia, euismod diam non, placerat sapien. Morbi dui magna, mollis et quam at, interdum lacinia purus. Proin magna tellus, elementum nec commodo in, pharetra eget nibh. Nam ultrices mauris in sagittis elementum. Nam risus nibh, pharetra id mollis non, aliqueteu arcu. Ut aliquet vehicula nibh, eget auctor ex. Ut.

Call to Actions (CTAs)Sometimes all you have to do is ask.

Examples

Buy buttons/“Add to cart”

Information-gathering forms

Subscription signups

“Read More”

“Try it Now”

Help

Social media share buttons/widgets

In order to easily spot the CTA, it has to be placed correctly and designed well. It should also be crystal clear and compelling.

Great call to action examples

More…

More…

Above the fold

All important content should go above the fold, right?

Not necessarily. As more and more devices were created, the fold kept changing.

Don’t worry. People will scroll.

Web Design & DevelopmentThe good stuff.

Web Design Donts

Don’t over do it: 1-3 fonts are usually perfect for a website. Stick to a limited color palette, under 5 colors.

Don’t use sliders: I know, they look awesome. But they seriously hurt your conversions because they divide your users attention

Don't use background music on your web pages.

Don’t forget to test what your website looks like on mobile before launch

Don’t skimp on copywriting and SEO

Don’t expect to get to home base on the first date: Just like you, consumers do their research and check for negative experiences before purchasing

Don’t use illegal content

Web Design Dos

Use landing pages instead of sliders Make sure your website is compatible with all major browsers Matter to your users: Enough about you, let’s talk about your soon-to-be-clients

and their pain points. Be User-friendly & User-centric: Good usability helps to provide a seamless

experience for visitors and improves your chances of success. Do they use the same verbiage you do to reference your products?

Be Mobile friendly: Displays correctly on smartphones & tablets. Mobile phone screens are roughly 1/5th the size of desktop computers.

Track: Track the effectiveness of your campaigns and call to actions with coupon codes, forms, and Google analytics.

Optimize your load times: Visitors are impatient. Your website should load in about 1-3 seconds. Resize your images! Data plans are getting smaller.

Target your audience: What age are they? What is their experience with technology?

Internet Users

Education & Income

Ethnicity & Community

Desktop vs. Mobile Users

Conversion rates and visit share for Ecommerce sites

Smartphone add-to-cart and conversion rates are much lower than for desktop

90% of Time on Mobile is Spent in Apps (chrome, firefox, games, news, etc)

80% of internet users own a smartphone

Test, test, and test again

Look for the following issues….

Browser bugs

Functionality issues

Accessibility issues

Error tolerance

Search Engine Optimization (SEO)Help Google find your site.

What the heck is SEO?!

SEO stands for Search Engine Optimization.

SEO is a bunch of strategies, and techniques to increase your placement in the search results of Google, Bing, etc.

SEO is not a black-hat tactic. It is a checklist of things you can do to make your site as relevant as possible to your visitors so they can find you. Some items are worth more points than others. Content is still #1.

How to edit your web page for SEO

title

Meta desc

What else can you do to improve your rankings?

Register your domain for at least 5 years

Forward relevant domains to appropriate content. Example: Forward webdesignerdelaware.com to Teakettica web design page

Create a google plus business page and get verified (also on bing places)

Update your content often, like a blog

Connect on social media and directories: yelp, manta, angie’s list, bbb, chamber sites, twitter, facebook, linked in, state directories, etc

Install an SSL certificate, even if you don’t sell anything online – NEW

Analyze your focus keyphrase. Ie, Web design vs. web design Newark, Delaware.

Make sure you have a site map

Google Analytics & Search ConsoleDon’t forget!

Tracking your results

Google Analytics Will show you who your users are

by location, sex, age, how many users per day, and more.

Google Search Console Helps you monitor and maintain

your site's presence in Google Search results. Will show you broken links and other errors.

More tools of the trade

Google PageSpeed Insights: Check the speed and usability of your site on multiple devices

Is your website mobile friendly? Find out: https://www.google.com/webmasters/tools/mobile-friendly/

Keywordtool.io: 700+ keyword ideas based on a single keyword

Google Keyword Planner: Enter a keyword or group of keywords into the tool, and Google will return all sorts of helpful stats to guide your keyword strategy

XML Sitemaps: Build a Sitemap

Link to all tools provided On references slide.

Follow up.The most neglected marketing principle

The difference between you and the competition is that you are going to follow up. That is how you stand out.

When you get a lead from your site, email or call right away.

After the call, send a short bullet point list confirming the next steps

Send a handwritten thank you note

A brief phone call a few days later

Try to connect with them every quarter if appropriate.

Add them to your newsletter (with their permission)

You can have the best site in the galaxy, but if you don’t follow up, there is no ROI.

How can we help?We can design you a stunning website that generates leads.

Visit us at www.teakettica.com or call Jane at 302-525-8195.

References https://www.nngroup.com/articles/how-long-do-users-stay-on-web-pages/

http://contentmarketinginstitute.com/2015/10/define-brand-voice/

http://marketingland.com/power-call-action-strength-boosts-conversions-145845

http://www.wordstream.com/blog/ws/2014/10/20/call-to-action-examples

https://www.hostgator.com/blog/2013/09/26/9-practical-steps-planning-website/

http://iampaddy.com/lifebelow600/

http://www.socialmediatoday.com/content/web-design-11-characteristics-user-friendly-website

http://www.seascapewebdesign.com/blog/what-mobile-friendly-website

https://webdesignledger.com/20-dos-and-donts-of-effective-web-design/

http://www.webs.com/blog/2015/12/02/10-small-business-website-dos-donts/

https://www.jeffalytics.com/your-website-sucks/

http://www.pewinternet.org/2015/06/26/americans-internet-access-2000-2015/

http://www.smartinsights.com/mobile-marketing/mobile-marketing-analytics/mobile-marketing-statistics/

https://blog.bufferapp.com/free-seo-tools

Join our mailing list @ www.teakettica.com302-525-8195

jane@teakettica.com

© 2016 Teakettica LLC. All rights reserved.