1. The Key to Conversions
2016 Web Design Checklist
“The key to creating a standout campaign is data.” ~ Google
2. Jane Clark
Creative 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.
3. 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
5. What do you want your
website to do for you?
Sell products or services
Generate leads
Establish credentials
Become an authority in your industry
7. “
”
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
9. 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.
13. “
”
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
15. 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.
16. 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
17. 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.
18. 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. Vivamus
vitae nibh vel orci posuere posuere id et quam. In vel diam venenatis, venenatis lacus id, imperdiet
urna. Nullam sodales erat ipsum, at tincidunt lorem feugiat eu. Aenean sit amet vulputate ligula. Donec
vulputate 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 varius
lorem lacinia molestie. Pellentesque id eros in enim blandit consectetur vitae eu neque. Sed feugiat
congue 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, sed
dignissim 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. Phasellus
viverra 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, aliquet
eu arcu. Ut aliquet vehicula nibh, eget auctor ex. Ut.
19. 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.
23. 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.
25. 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
26. 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?
31. 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)
35. 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.
40. 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
42. 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.
43. 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.
45. 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)
46. You can have the best site in the galaxy,
but if you don’t follow up, there is no ROI.
47. 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.