Website Redesign Tips and Tricks

  • View
    194

  • Download
    1

  • Category

    Design

Preview:

Citation preview

#learnsleek

April 3, 2015

IS YOUR WEBSITE UP TO SPEED?

May 15, 2015

#learnsleek

Who Is This Guy?

Graphic Designer

• Owner, Metropolis Creative — 16 years in business

• Graduate of RIT with a BFA in Graphic Design

• Teach at Northeastern University

• Have 3 kids — ages 11, 15, and 21

• Brew beer and play hockey

Michael Flint

#learnsleek

Today’s TopicsBranding and Messaging Who you are, identify targets, define messaging

1

Site Architecture Organizing your content and navigation

2

Design Goals and Trends Visual hierarchy, readability, responsive

3

Development (Coding & CMS) Page load time, site updates

4

S.E.O. and Social Media Both go hand-in-hand

5

Working With Your Web Designer Tips for success!

6

Getting Started

#learnsleek

Web Design is a Process

Creative Process

DISCOVERY CREATIVE TECHNICAL REVIEW

Follow the Process in Order!

#learnsleek

1. Discovery & BrandingWhat is a Brand? All marketing materials work together.

• Emails

• Social channels

• Printed materials

• Your staff

• Your office

Discovery

#learnsleek

Define Your BrandAsking the Right Questions Let’s take a closer look.

• Brand rediscovery/definition

• Look at competitors

• What is your Unique Value Proposition (UVP)?

• Define target audience(s) and prioritize them

• Define your goals

• Define your calls-to-action (CTAs ) clearly

• Define your messaging for each audience

• Lastly – what do you like visually?

Discovery

YOURBRAND

IDENTIT

Y

P

ERC

EPTIO

N

VALUE

UNIQUE VALUE PROP

NAME LOG

O

MESSA

GE

PA

ST

PR

ESEN

T FUTURE

#learnsleek

Content and HierarchyArchitecture & Sitemap The core foundation of the website.

• Wireframe defines content and hierarchy

• Sitemap defines architecture and navigation

Discovery

#learnsleek

2. DesignEstablish the Visual Tone Determine user interface.

• Set the brand

• Clean design

• Clear messaging

• Clear calls-to-action

• Great photography

• Use color intentionally

• Responsive for mobile and tablets

Design

#learnsleek

Good Design Just Works

Design

Alpine Bearing

Motormart Garage

McGarry & Sons

CHEN PR

#learnsleek

Design TrendsNot Determine user interface.

• Social media feeds for the sake of having social media on your site

• A gazillion social media chicklets

• The search tool

• Flash

• Black hat SEO

Design

Hot Determine user interface.

• Mobile / Responsive

• True Responsive Design

• Full screen content (text, images, video)

• Functional animation

• Keep it simple

• Mobile navigation

• Smarter sites (cookies, data, dynamic, taxonomy)

• Helpful, relevant content

#learnsleek

BrandingFull Screen Design

#learnsleek

BrandingResponsive Design

#learnsleek

3. DevelopmentThe Website Build-Out Making the website usable.

• Involve the dev team from day one

• Lead with the concept, not the solution

• Discovery: include time to determine the best approach early

• CMS / platforms to consider

• Hosting: which host is right for you (and your developer)?

• Other tools / plugins: why reinvent the wheel?

• Responsive / mobile

• Prototypes and staging

• Content entry: who and how?

• Testing, and launch

Development

#learnsleek

Social MediaInbound Marketing Communicating with your customers.

• See my content: direct link to channels

• Subscribe to my channel: like, follow, subscribe

• Engage with me: retweet, comment

• Twitter, Facebook, and more

• Blogs, RSS, commenting

• Other social tools: Pinterest, Google Maps, Yelp, Instagram

Development

SEO & Social

#learnsleek

Search Engine Optimization (S.E.O.)What does Google Want? Google wants what YOU want.

Keywords are key phrases. Use them in context, consistently, and repetitively.

Development

• Domain name

• File names

• Page titles

• Headers

• Page content (and alt-tags)

• Meta description

• Links (In & Out) with keywords

Write for humans first, then insert keywords.

#learnsleek

4. Review

Review

Test, Refine and Repeat How is your website working for you?

• How are you driving traffic?

• Google analytics

• Conversions

• Site maintenance

• Landing pages

• Co-branded marketing

• Social / inbound campaigns

#learnsleek

Tips For SuccessWebsite Design Experience Have you gone through a website design before? How was that experience? What worked and didn’t?

Branding You and your designer need to understand your brand, marketing goals, and website goals.

Communication Single point of contact. What works well for you?Frequency of meetings. Project Management

Working With a Designer

Decisions Who makes the decisions? What is your process? Timeframes for decisions?

Changes in Scope How did you handle these? Phase in later or add to the project scope? What can incur additional costs? (Rounds of changes, new functionality, illustrations and other content…)

Budget & Billing Staying on budget. Change orders. Who should invoices go to?

Technology/IT CMS. Point of contact? Hosting? Access to servers? Email? CRMs, Any additional APIs or technology considerations?

Content Who is creating content? (Copy, product photos, staff photos, video, animation, technical documents.)

Scheduling/Timing Due dates, milestones. Is there a reason to go live on a certain date?

$

#learnsleek

THANK YOU!

Recommended