Best Practices of Web Site Design

Preview:

Citation preview

Starmark

Branding

AdvertisingInteractive

Public RelationsDirect Response

STARMARK.COM

954 874-9000

TXT “ETIP” to 247565

@STARMARKINTL

/STARMARKINTL

/STARMARKINTL

© STARMARK INTL

Welcome

STARMARK.COM

954 874-9000

TXT “ETIP” to 247565

@STARMARKINTL

/STARMARKINTL

/STARMARKINTL

© STARMARK INTL

Company Founded on Integrated Marketing

Interactive, Social & New Technology

Return On Investment Focused

Top-10 Diversity Owned Company in Florida

Nationwide Recruitment

Recognized Top South Florida CEO

Starmark: 30 Years of Excellence

Fort Lauderdale

Celebration

STARMARK.COM

954 874-9000

TXT “ETIP” to 247565

@STARMARKINTL

/STARMARKINTL

/STARMARKINTL

© STARMARK INTL

Starmark: eTips

• Based on Current Trends• Weekly eTip Newsletters

• Co-Authored In-house By Experts Within Discipline

• Industry Benchmarks

• Ongoing App, Web & Media Testing

STARMARK.COM

954 874-9000

TXT “ETIP” to 247565

@STARMARKINTL

/STARMARKINTL

/STARMARKINTL

© STARMARK INTL

Best Practices Of Website Design

STARMARK.COM

954 874-9000

TXT “ETIP” to 247565

@STARMARKINTL

/STARMARKINTL

/STARMARKINTL

© STARMARK INTL

• Website Goals • Competitive Assessment• Informational Architecture• Technology Usage• Modularity & Phasing• Layout Scenarios• Navigational Styles• Wire-framing & Prototyping• Viewable Area & Content

Prioritization

• Voice & Demographic• Fonts, Colors & Sizes• Content Directive & SEO• Social Integration• Search & Site-map Footers• Mobile/Tablet Ready• Testing & Design Optimization• Ongoing Content Development

What We Cover Today

STARMARK.COM

954 874-9000

TXT “ETIP” to 247565

@STARMARKINTL

/STARMARKINTL

/STARMARKINTL

© STARMARK INTL

Ten-step Process For Success

COMPETITIVEREVIEW

INFORMATIONARCHITECTUREUNDERSTANDING DESIGN

ROLLOUT

TEMPLATEPRODUCTION

CREATIVE

PROGRAMMING QUALITYASSURANCE

DEPLOYMENT &TRACKINGCONTENT

STARMARK.COM

954 874-9000

TXT “ETIP” to 247565

@STARMARKINTL

/STARMARKINTL

/STARMARKINTL

© STARMARK INTL

Sales

• Awareness

What Are The Goals Of Your Website?

STARMARK.COM

954 874-9000

TXT “ETIP” to 247565

@STARMARKINTL

/STARMARKINTL

/STARMARKINTL

© STARMARK INTL

• Sales

• Awareness

What Are The Goals Of Your Website?

STARMARK.COM

954 874-9000

TXT “ETIP” to 247565

@STARMARKINTL

/STARMARKINTL

/STARMARKINTL

© STARMARK INTL

• What is your competitor doing right?• What are they doing wrong?• What key differentiators make them unique with your landscape?• How well are they covering social media?• Are the mobile? Are they on the ground?

Competitive Assessment

STARMARK.COM

954 874-9000

TXT “ETIP” to 247565

@STARMARKINTL

/STARMARKINTL

/STARMARKINTL

© STARMARK INTL

Information Architecture• Get Meta

STARMARK.COM

954 874-9000

TXT “ETIP” to 247565

@STARMARKINTL

/STARMARKINTL

/STARMARKINTL

© STARMARK INTL

Information Architecture

STARMARK.COM

954 874-9000

TXT “ETIP” to 247565

@STARMARKINTL

/STARMARKINTL

/STARMARKINTL

© STARMARK INTL

• Adobe Flash/HTML5• Social Tools/Video• Dynamically Generated• Applications (Apps)• Content Management Systems

Technology Usage

STARMARK.COM

954 874-9000

TXT “ETIP” to 247565

@STARMARKINTL

/STARMARKINTL

/STARMARKINTL

© STARMARK INTL

Modularity & Phasing

Resources

Case Studies

Brochures

White Papers

Event Calendar

Videos

Media Gallery

Associations

Industry News

Recent News

Twitter Feed

Launch

Phase 2

Phase 3

STARMARK.COM

954 874-9000

TXT “ETIP” to 247565

@STARMARKINTL

/STARMARKINTL

/STARMARKINTL

© STARMARK INTL

Content Layout Scenarios

STARMARK.COM

954 874-9000

TXT “ETIP” to 247565

@STARMARKINTL

/STARMARKINTL

/STARMARKINTL

© STARMARK INTL

• Top “Horizontal” Navigation• Left/Right Hand Side

Navigation• Cluster Navigation• Grid Navigation• Panoramic

• Sub Navigation• Drop Down• Exposed• Transitional

Navigation Styles

STARMARK.COM

954 874-9000

TXT “ETIP” to 247565

@STARMARKINTL

/STARMARKINTL

/STARMARKINTL

© STARMARK INTL

Advertising

http://www.iab.net/iab_products_and_industry_services/508676/508767/Ad_Unit

STARMARK.COM

954 874-9000

TXT “ETIP” to 247565

@STARMARKINTL

/STARMARKINTL

/STARMARKINTL

© STARMARK INTL

• Home Page• Sub Pages• “Process Pages” - Registration & eCommerce• Resource & Documentation Pages• Profile Pages• Admin Pages

Wire-framing & Prototyping

STARMARK.COM

954 874-9000

TXT “ETIP” to 247565

@STARMARKINTL

/STARMARKINTL

/STARMARKINTL

© STARMARK INTL

• Mobile/Tablet• Registration• Email/Newsletters• Events/Calendars

Call To Action Drivers

STARMARK.COM

954 874-9000

TXT “ETIP” to 247565

@STARMARKINTL

/STARMARKINTL

/STARMARKINTL

© STARMARK INTL

Wire-framing & Prototyping

Home PageProcess PagesResourceProfile PagesAdmin Pages

STARMARK.COM

954 874-9000

TXT “ETIP” to 247565

@STARMARKINTL

/STARMARKINTL

/STARMARKINTL

© STARMARK INTL

Wire-framing & Prototyping

NAVIGATION | NAVIGATION | NAVIGATION | NAVIGATION | NAVIGATION | NAVIGATION |

Rudus veniam. Bene tation praesent velit suscipit reprobo exputo regula luptatum, vero cogo acsi. Ulciscor feugiat zelus patria metuo vel dignissim te sudo olim.Opes, jugis esse nulla euismod aliquip oppeto luptatum ad saluto demoveo ut quae magna. Magna, paulatim vero iaceo aliquip vero validus, vel. Tum, aliquip mos nisl in reprobo quae ad abluo nullus conventio defui, quidem capto tation. Validus illum eum ille quae accumsan facilisis neo, adipiscing melior pecus neque premo tego eros.

Occuro quis dignissim sudo singularis oppeto nisl similis suscipit proprius ymo causa virtus.Molior consectetuer, roto abico duis erat macto iusto quidem feugait blandit, fere lobortis. Feugiat paulatim jugis sino ibidem diam, molior, praemitto feugiat nulla ad quae neo volutpat antehabeo. Persto hendrerit iriure torqueo autem nostrud saepius ea iusto euismod ut. Validus te premo jus lucidus consequat tation ex.

Rerat macto iusto quidem feugait blandit, fere lobortis. Feugiat paulatim jugis sino ibidem diam, molior, praemitto feugiat nulla ad quae neo volutpat antehabeo. Persto hendrerit iriure torqueo autem nostrud saepius ea iusto euismod ut. Validus te premo jus lucidus

MORE «

|

Rudus veniam. Bene tation praesent velit suscipit reprobo exputo regula luptatum, vero cogo acsi. Ulciscor feugiat zelus patria metuo vel dignissim te sudo olim.

Opes, jugis esse nulla euismod aliquip oppeto luptatum ad saluto demoveo ut quae magna.

Magna, paulatim vero iaceo aliquip vero validus, vel. Tum, aliquip mos nisl in reprobo quae ad abluo nullus co

nventio defui, quidem capto tation. Validus illum eum ille quae accumsan facilisis neo, adipiscing melior pecus neque premo tego eros.

Occuro quis dignissim sudo singularis oppeto nisl similis suscipit proprius ymo causa virtus.Molio

Rudus veniam. Bene tation praesent velit suscipit reprobo exputo regula luptatum, vero cogo acsi. Ulciscor feugiat zelus patria metuo vel dignissim te sudo olim.Opes, jugis esse nulla euismod aliquip oppeto luptatum ad saluto demoveo ut quae magna.

Magna, paulatim vero iaceo aliquip vero validus, vel. Tum, aliquip mos nisl in reprobo quae ad abluo nullus conventio defui, quidem capto tation. Validus illum eum ille quae accumsan facilisis neo, adipiscing melior pecus neque premo tego eros.

Occuro quis dignissim sudo singularis oppeto nisl similis suscipit proprius ymo causa virtus.Molior consectetuer, roto abico duis erat macto iusto quidem feugait blandit, fere lobortis. Feugiat

Rudus veniam. Bene tation praesent velit suscipit reprobo exputo regula luptatum, vero cogo acsi. Ulciscor feugiat zelus patria metuo vel dignissim te sudo olim.Opes, jugis esse nulla euismod aliquip oppeto luptatum ad saluto demoveo ut quae magna. Magna, paulatim vero iaceo aliquip vero validus, vel. Tum, aliquip mos nisl in reprobo quae ad abluo nullus conventio defui, quidem capto tation. Validus illum eum ille quae accumsan facilisis neo, adipiscing melior pecus neque premo tego eros.

Occuro quis dignissim sudo singularis

NEWS

|

960 px

600 px

Viewable Area & Content Prioritization

STARMARK.COM

954 874-9000

TXT “ETIP” to 247565

@STARMARKINTL

/STARMARKINTL

/STARMARKINTL

© STARMARK INTL

Viewable Area & Content PrioritizationViewable Area & Content Prioritization

Pre

mie

reS

econ

dary

Third

Tie

r

STARMARK.COM

954 874-9000

TXT “ETIP” to 247565

@STARMARKINTL

/STARMARKINTL

/STARMARKINTL

© STARMARK INTL

Voice & Demographic

STARMARK.COM

954 874-9000

TXT “ETIP” to 247565

@STARMARKINTL

/STARMARKINTL

/STARMARKINTL

© STARMARK INTL

• Voice & Volume• Emotional extension of the content

Fonts, Colors & Sizes

STARMARK.COM

954 874-9000

TXT “ETIP” to 247565

@STARMARKINTL

/STARMARKINTL

/STARMARKINTL

© STARMARK INTL

• Allow user to skim information• Let user digest content in tiers• Allow for sharing• Always link to more internally (dwell time)

Content Directive & SEO

Call To Action

Begin The Story

Invite Them InCreate Searchability

STARMARK.COM

954 874-9000

TXT “ETIP” to 247565

@STARMARKINTL

/STARMARKINTL

/STARMARKINTL

© STARMARK INTL

• What’s a graphic (Alt. tagging)• What’s ASCII (raw text)• If it’s a link

Content Directive & SEO

STARMARK.COM

954 874-9000

TXT “ETIP” to 247565

@STARMARKINTL

/STARMARKINTL

/STARMARKINTL

© STARMARK INTL

Social Integration

• Increase the ability to pollenate your content to where your users spend their free time

• Broaden/strengthen your own “social graph”• Make yourself “social ready” for PR firms and press opportunities• Tell people where/who you are: events, seminars & launches

STARMARK.COM

954 874-9000

TXT “ETIP” to 247565

@STARMARKINTL

/STARMARKINTL

/STARMARKINTL

© STARMARK INTL

Social Integration

STARMARK.COM

954 874-9000

TXT “ETIP” to 247565

@STARMARKINTL

/STARMARKINTL

/STARMARKINTL

© STARMARK INTL

Social Integration

STARMARK.COM

954 874-9000

TXT “ETIP” to 247565

@STARMARKINTL

/STARMARKINTL

/STARMARKINTL

© STARMARK INTL

Repurpose Media

• Where else can it go?

STARMARK.COM

954 874-9000

TXT “ETIP” to 247565

@STARMARKINTL

/STARMARKINTL

/STARMARKINTL

© STARMARK INTL

• Search is not simply a tool, it speaks to results of an action• Make dead space (such as footers) effective tools

Search & Site-map Footers

• Search is not simply a tool, it speaks to results of an action• Make dead space (such as footers) effective tools

Search & Site-map Footers

STARMARK.COM

954 874-9000

TXT “ETIP” to 247565

@STARMARKINTL

/STARMARKINTL

/STARMARKINTL

© STARMARK INTL

• Not all designs work on mobile and tablet architecture• Tablets: Design in both horizontal and vertical executions for content

Mobile/Tablet Ready

STARMARK.COM

954 874-9000

TXT “ETIP” to 247565

@STARMARKINTL

/STARMARKINTL

/STARMARKINTL

© STARMARK INTL

• Create an internal “Alpha” group• Ease of use• What “feels” most important• If it feels like a link is it?• Intuition• Would you return?

• External “Beta” group• Public roll-out

Testing & Design Optimization

Testing & Design Optimization

STARMARK.COM

954 874-9000

TXT “ETIP” to 247565

@STARMARKINTL

/STARMARKINTL

/STARMARKINTL

© STARMARK INTL

• Optimize to design and content that converts most effectively• Create a content schedule and content SOP• Consistent designs across social graph• Design to content topics

Ongoing Content Development

STARMARK.COM

954 874-9000

TXT “ETIP” to 247565

@STARMARKINTL

/STARMARKINTL

/STARMARKINTL

© STARMARK INTL

• Website Goals • Competitive Assessment• Informational Architecture• Technology Usage• Modularity & Phasing• Layout Scenarios• Navigational Styles• Wire-framing & Prototyping• Viewable Area & Content

Prioritization

• Voice & Demographic• Fonts, Colors & Sizes• Content Directive & SEO• Social Integration• Search & Site-map Footers• Mobile/Tablet Ready• Testing & Design Optimization• Ongoing Content Development

Questions:

STARMARK.COM

954 874-9000

TXT “ETIP” to 247565

@STARMARKINTL

/STARMARKINTL

/STARMARKINTL

© STARMARK INTL

Thank YouFor More See Us At: Starmark.com

Text “ETIP” to 24-7-365 to get our weekly eTip via SMS

Your Presenter:Justice Mitchell - VP, Interactive Creative Director - Social Media Head

• Twitter: @justicemitchell

• http://www.linkedin.com/in/justicemitchell

• facebook.com/justicewmitchell

• AIM: justicemitchell

Recommended