StarmarkBrandingAdvertisingInteractivePublic RelationsDirect Response
WelcomeSTARMARK.COM954 874-9000TXT “ETIP” to 247565@STARMARKINTL/STARMARKINTL/STARMARKINTL© STARMARK INTL
Starmark: 30 Years of Excellence                       Company Founded on Integrated Marketing                       Inter...
Starmark: eTips                                  •   Based on Current Trends                                  •   Weekly e...
Best Practices Of Website DesignSTARMARK.COM954 874-9000TXT “ETIP” to 247565@STARMARKINTL/STARMARKINTL/STARMARKINTL© STARM...
What We Cover Today                       •   Website Goals                •   Voice & Demographic                       •...
Ten-step Process For Success                                        COMPETITIVE   INFORMATION                   DESIGN    ...
What Are The Goals Of Your Website?                            Sales                       •   AwarenessSTARMARK.COM954 87...
What Are The Goals Of Your Website?                       •   Sales                       •   AwarenessSTARMARK.COM954 874...
Competitive Assessment                       •   What is your competitor doing right?                       •   What are t...
Information Architecture                       •   Get MetaSTARMARK.COM954 874-9000TXT “ETIP” to 247565@STARMARKINTL/STARM...
Information ArchitectureSTARMARK.COM954 874-9000TXT “ETIP” to 247565@STARMARKINTL/STARMARKINTL/STARMARKINTL© STARMARK INTL
Technology Usage                       •   Adobe Flash/HTML5                       •   Social Tools/Video                 ...
Modularity & Phasing                                         Resources                                       Case Studies ...
Content Layout ScenariosSTARMARK.COM954 874-9000TXT “ETIP” to 247565@STARMARKINTL/STARMARKINTL/STARMARKINTL© STARMARK INTL
Navigation Styles                       •   Top “Horizontal” Navigation   •   Sub Navigation                       •   Lef...
AdvertisingSTARMARK.COM954 874-9000TXT “ETIP” to 247565@STARMARKINTL/STARMARKINTL/STARMARKINTL© STARMARK INTL             ...
Wire-framing & Prototyping                       •   Home Page                       •   Sub Pages                       •...
Call To Action Drivers                       •   Mobile/Tablet                       •   Registration                     ...
Wire-framing & Prototyping                                                    Home Page                                   ...
Wire-framing & Prototyping                                    960 px                                                      ...
Viewable Area & Content Prioritization
Viewable Area & Content Prioritization                           Premiere                           Secondary             ...
Voice & DemographicSTARMARK.COM954 874-9000TXT “ETIP” to 247565@STARMARKINTL/STARMARKINTL/STARMARKINTL© STARMARK INTL
Fonts, Colors & Sizes                       •   Voice & Volume                       •   Emotional extension of the conten...
Content Directive & SEO                       •   Allow user to skim information                       •   Let user digest...
Content Directive & SEO                       •   What’s a graphic (Alt. tagging)                       •   What’s ASCII (...
Social Integration                       •   Increase the ability to pollenate your content to where your users           ...
Social IntegrationSTARMARK.COM954 874-9000TXT “ETIP” to 247565@STARMARKINTL/STARMARKINTL/STARMARKINTL© STARMARK INTL
Social IntegrationSTARMARK.COM954 874-9000TXT “ETIP” to 247565@STARMARKINTL/STARMARKINTL/STARMARKINTL© STARMARK INTL
Repurpose Media                       •   Where else can it go?STARMARK.COM954 874-9000TXT “ETIP” to 247565@STARMARKINTL/S...
Search & Site-map Footers                       •   Search is not simply a tool, it speaks to results of an action        ...
Search & Site-map Footers•   Search is not simply a tool, it speaks to results of an action•   Make dead space (such as fo...
Mobile/Tablet Ready                       •   Not all designs work on mobile and tablet architecture                      ...
Testing & Design Optimization                       •   Create an internal “Alpha” group                           •   Eas...
Testing & Design Optimization
Ongoing Content Development                        •   Optimize to design and content that converts most effectively      ...
Questions:                       •   Website Goals                •   Voice & Demographic                       •   Compet...
Thank You                       For More See Us At: Starmark.com                       Text “ETIP” to 24-7-365 to get our ...
Upcoming SlideShare
Loading in...5
×

Best Practices of Web Site Design

2,024

Published on

The Starmark's presentation "Best Practices In Web Design" can help your business understand the best ways to prepare, design and deploy your next website. There's a vast array of complexities in today's modern website design. Think of this program as an foundational framework that your business must have in place as it prepares the next generation of its online marketing. Your website is THE hub of your social graph and the key directive to all your integrated messaging.

0 Comments
1 Like
Statistics
Notes
  • Be the first to comment

No Downloads
Views
Total Views
2,024
On Slideshare
0
From Embeds
0
Number of Embeds
1
Actions
Shares
0
Downloads
44
Comments
0
Likes
1
Embeds 0
No embeds

No notes for slide

Transcript of "Best Practices of Web Site Design"

  1. 1. StarmarkBrandingAdvertisingInteractivePublic RelationsDirect Response
  2. 2. WelcomeSTARMARK.COM954 874-9000TXT “ETIP” to 247565@STARMARKINTL/STARMARKINTL/STARMARKINTL© STARMARK INTL
  3. 3. Starmark: 30 Years of Excellence Company Founded on Integrated Marketing Interactive, Social & New Technology Return On Investment Focused Top-10 Diversity Owned Company in Florida Nationwide Recruitment Fort Lauderdale Recognized Top South Florida CEOSTARMARK.COM954 874-9000TXT “ETIP” to 247565 Celebration@STARMARKINTL/STARMARKINTL/STARMARKINTL© STARMARK INTL
  4. 4. Starmark: eTips • Based on Current Trends • Weekly eTip Newsletters • Co-Authored In-house By Experts Within Discipline • Industry Benchmarks • Ongoing App, Web & Media TestingSTARMARK.COM954 874-9000TXT “ETIP” to 247565@STARMARKINTL/STARMARKINTL/STARMARKINTL© STARMARK INTL
  5. 5. Best Practices Of Website DesignSTARMARK.COM954 874-9000TXT “ETIP” to 247565@STARMARKINTL/STARMARKINTL/STARMARKINTL© STARMARK INTL
  6. 6. What We Cover Today • Website Goals • Voice & Demographic • Competitive Assessment • Fonts, Colors & Sizes • Informational Architecture • Content Directive & SEO • Technology Usage • Social Integration • Modularity & Phasing • Search & Site-map Footers • Layout Scenarios • Mobile/Tablet Ready • Navigational Styles • Testing & Design Optimization • Wire-framing & Prototyping • Ongoing Content Development • Viewable Area & Content PrioritizationSTARMARK.COM954 874-9000TXT “ETIP” to 247565@STARMARKINTL/STARMARKINTL/STARMARKINTL© STARMARK INTL
  7. 7. Ten-step Process For Success COMPETITIVE INFORMATION DESIGN UNDERSTANDING CREATIVE REVIEW ARCHITECTURE ROLLOUTSTARMARK.COM TEMPLATE QUALITY DEPLOYMENT &954 874-9000 CONTENT PROGRAMMING PRODUCTION ASSURANCE TRACKINGTXT “ETIP” to 247565@STARMARKINTL/STARMARKINTL/STARMARKINTL© STARMARK INTL
  8. 8. What Are The Goals Of Your Website? Sales • AwarenessSTARMARK.COM954 874-9000TXT “ETIP” to 247565@STARMARKINTL/STARMARKINTL/STARMARKINTL© STARMARK INTL
  9. 9. What Are The Goals Of Your Website? • Sales • AwarenessSTARMARK.COM954 874-9000TXT “ETIP” to 247565@STARMARKINTL/STARMARKINTL/STARMARKINTL© STARMARK INTL
  10. 10. Competitive Assessment • 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?STARMARK.COM954 874-9000TXT “ETIP” to 247565@STARMARKINTL/STARMARKINTL/STARMARKINTL© STARMARK INTL
  11. 11. Information Architecture • Get MetaSTARMARK.COM954 874-9000TXT “ETIP” to 247565@STARMARKINTL/STARMARKINTL/STARMARKINTL© STARMARK INTL
  12. 12. Information ArchitectureSTARMARK.COM954 874-9000TXT “ETIP” to 247565@STARMARKINTL/STARMARKINTL/STARMARKINTL© STARMARK INTL
  13. 13. Technology Usage • Adobe Flash/HTML5 • Social Tools/Video • Dynamically Generated • Applications (Apps) • Content Management SystemsSTARMARK.COM954 874-9000TXT “ETIP” to 247565@STARMARKINTL/STARMARKINTL/STARMARKINTL© STARMARK INTL
  14. 14. Modularity & Phasing Resources Case Studies Brochures Launch White Papers Event Calendar Videos Phase 2 Media Gallery AssociationsSTARMARK.COM Recent News954 874-9000TXT “ETIP” to 247565 Industry News Phase 3@STARMARKINTL Twitter Feed/STARMARKINTL/STARMARKINTL© STARMARK INTL
  15. 15. Content Layout ScenariosSTARMARK.COM954 874-9000TXT “ETIP” to 247565@STARMARKINTL/STARMARKINTL/STARMARKINTL© STARMARK INTL
  16. 16. Navigation Styles • Top “Horizontal” Navigation • Sub Navigation • Left/Right Hand Side • Drop Down Navigation • Exposed • Cluster Navigation • Transitional • Grid Navigation • PanoramicSTARMARK.COM954 874-9000TXT “ETIP” to 247565@STARMARKINTL/STARMARKINTL/STARMARKINTL© STARMARK INTL
  17. 17. AdvertisingSTARMARK.COM954 874-9000TXT “ETIP” to 247565@STARMARKINTL/STARMARKINTL/STARMARKINTL© STARMARK INTL http://www.iab.net/iab_products_and_industry_services/508676/508767/Ad_Unit
  18. 18. Wire-framing & Prototyping • Home Page • Sub Pages • “Process Pages” - Registration & eCommerce • Resource & Documentation Pages • Profile Pages • Admin PagesSTARMARK.COM954 874-9000TXT “ETIP” to 247565@STARMARKINTL/STARMARKINTL/STARMARKINTL© STARMARK INTL
  19. 19. Call To Action Drivers • Mobile/Tablet • Registration • Email/Newsletters • Events/CalendarsSTARMARK.COM954 874-9000TXT “ETIP” to 247565@STARMARKINTL/STARMARKINTL/STARMARKINTL© STARMARK INTL
  20. 20. Wire-framing & Prototyping Home Page Process Pages Resource Profile Pages Admin PagesSTARMARK.COM954 874-9000TXT “ETIP” to 247565@STARMARKINTL/STARMARKINTL/STARMARKINTL© STARMARK INTL
  21. 21. Wire-framing & Prototyping 960 px NAVIGATION | NAVIGATION | NAVIGATION | NAVIGATION | NAVIGATION | NAVIGATION | 600 px | 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 Rudus veniam. Bene tation praesent Rudus veniam. Bene tation praesent velit suscipit reprobo exputo regula luptatum, vero cogo acsi. velit suscipit reprobo exputo regula reprobo exputo regula luptatum, vero cogo acsi. NEWS Ulciscor feugiat zelus patria metuo vel dignissim te luptatum, vero cogo acsi. Ulciscor Ulciscor feugiat zelus patria metuo vel dignissim te sudo sudo olim.Opes, jugis esse nulla euismod aliquip feugiat zelus patria metuo vel dignissim olim. oppeto luptatum ad saluto demoveo ut quae te sudo olim.Opes, jugis esse nulla Opes, jugis esse nulla euismod aliquip oppeto luptatum magna. euismod aliquip oppeto luptatum ad ad saluto demoveo ut quae magna. saluto demoveo ut quae magna. Magna, Magna, paulatim vero iaceo aliquip vero validus, paulatim vero iaceo aliquip vero validus, Magna, paulatim vero iaceo aliquip vero validus, vel. vel. Tum, aliquip mos nisl in reprobo quae ad abluo vel. Tum, aliquip mos nisl in reprobo Tum, aliquip mos nisl in reprobo quae ad abluo nullus nullus conventio defui, quidem capto tation. quae ad abluo nullus conventio defui, co Validus illum eum ille quae accumsan facilisis neo, quidem capto tation. Validus illum eum adipiscing melior pecus neque premo tego eros. ille quae accumsan facilisis neo, nventio defui, quidem capto tation. Validus illum eum ille adipiscing melior pecus neque premo quae accumsan facilisis neo, adipiscing melior pecus Occuro quis dignissim sudo singularis oppeto nisl tego eros. neque premo tego eros. similis suscipit proprius ymo causa virtus.Molior Occuro quis dignissim sudo singularis oppeto nisl similis consectetuer, roto abico duis erat macto iusto Occuro quis dignissim sudo singularis suscipit proprius ymo causa virtus.Molio quidem feugait blandit, fere lobortis. Feugiat |STARMARK.COM954 874-9000TXT “ETIP” to 247565@STARMARKINTL/STARMARKINTL/STARMARKINTL© STARMARK INTL
  22. 22. Viewable Area & Content Prioritization
  23. 23. Viewable Area & Content Prioritization Premiere Secondary Third TierSTARMARK.COM954 874-9000TXT “ETIP” to 247565@STARMARKINTL/STARMARKINTL/STARMARKINTL© STARMARK INTL
  24. 24. Voice & DemographicSTARMARK.COM954 874-9000TXT “ETIP” to 247565@STARMARKINTL/STARMARKINTL/STARMARKINTL© STARMARK INTL
  25. 25. Fonts, Colors & Sizes • Voice & Volume • Emotional extension of the contentSTARMARK.COM954 874-9000TXT “ETIP” to 247565@STARMARKINTL/STARMARKINTL/STARMARKINTL© STARMARK INTL
  26. 26. Content Directive & SEO • Allow user to skim information • Let user digest content in tiers • Allow for sharing • Always link to more internally (dwell time) Call To Action Begin The StorySTARMARK.COM954 874-9000 Invite Them InTXT “ETIP” to 247565 Create Searchability@STARMARKINTL/STARMARKINTL/STARMARKINTL© STARMARK INTL
  27. 27. Content Directive & SEO • What’s a graphic (Alt. tagging) • What’s ASCII (raw text) • If it’s a linkSTARMARK.COM954 874-9000TXT “ETIP” to 247565@STARMARKINTL/STARMARKINTL/STARMARKINTL© STARMARK INTL
  28. 28. 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 & launchesSTARMARK.COM954 874-9000TXT “ETIP” to 247565@STARMARKINTL/STARMARKINTL/STARMARKINTL© STARMARK INTL
  29. 29. Social IntegrationSTARMARK.COM954 874-9000TXT “ETIP” to 247565@STARMARKINTL/STARMARKINTL/STARMARKINTL© STARMARK INTL
  30. 30. Social IntegrationSTARMARK.COM954 874-9000TXT “ETIP” to 247565@STARMARKINTL/STARMARKINTL/STARMARKINTL© STARMARK INTL
  31. 31. Repurpose Media • Where else can it go?STARMARK.COM954 874-9000TXT “ETIP” to 247565@STARMARKINTL/STARMARKINTL/STARMARKINTL© STARMARK INTL
  32. 32. Search & Site-map Footers • Search is not simply a tool, it speaks to results of an action • Make dead space (such as footers) effective toolsSTARMARK.COM954 874-9000TXT “ETIP” to 247565@STARMARKINTL/STARMARKINTL/STARMARKINTL© STARMARK INTL
  33. 33. 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
  34. 34. Mobile/Tablet Ready • Not all designs work on mobile and tablet architecture • Tablets: Design in both horizontal and vertical executions for contentSTARMARK.COM954 874-9000TXT “ETIP” to 247565@STARMARKINTL/STARMARKINTL/STARMARKINTL© STARMARK INTL
  35. 35. Testing & Design Optimization • 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-outSTARMARK.COM954 874-9000TXT “ETIP” to 247565@STARMARKINTL/STARMARKINTL/STARMARKINTL© STARMARK INTL
  36. 36. Testing & Design Optimization
  37. 37. Ongoing Content Development • Optimize to design and content that converts most effectively • Create a content schedule and content SOP • Consistent designs across social graph • Design to content topicsSTARMARK.COM954 874-9000TXT “ETIP” to 247565@STARMARKINTL/STARMARKINTL/STARMARKINTL© STARMARK INTL
  38. 38. Questions: • Website Goals • Voice & Demographic • Competitive Assessment • Fonts, Colors & Sizes • Informational Architecture • Content Directive & SEO • Technology Usage • Social Integration • Modularity & Phasing • Search & Site-map Footers • Layout Scenarios • Mobile/Tablet Ready • Navigational Styles • Testing & Design Optimization • Wire-framing & Prototyping • Ongoing Content Development • Viewable Area & Content PrioritizationSTARMARK.COM954 874-9000TXT “ETIP” to 247565@STARMARKINTL/STARMARKINTL/STARMARKINTL© STARMARK INTL
  39. 39. Thank You For 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: justicemitchellSTARMARK.COM954 874-9000TXT “ETIP” to 247565@STARMARKINTL/STARMARKINTL/STARMARKINTL© STARMARK INTL
  1. A particular slide catching your eye?

    Clipping is a handy way to collect important slides you want to go back to later.

×