Website Design Trends in 2014
41
Website Design Trends in 2014 PRESENTED BY THALIA DRIESSEN
description
Learn the hot trends for dynamic and engaging websites that function across all platforms.
Transcript of Website Design Trends in 2014
Website Design Trends in 2014PRESENTED BY THALIA DRIESSEN
Introductions
2 #bbcon - Presented by Thalia Driessen of Adcieo
Thalia DriessenCreative Director, Chief Trend Spotter
Adcieo, Inc.
Debbie Snyder
VP of Client SolutionsAdcieo, Inc.
Agenda
• 2014 Web Design Trends: The Standouts
• The Future: Near and Far
• Toolbox: Resources to Keep Ahead of the Curve
• Q&A
2 #bbcon - Presented by Thalia Driessen of Adcieo
But First … Why Talk About Trends?
2 #bbcon - Presented by Thalia Driessen of Adcieo
2 #bbcon - Presented by Thalia Driessen of Adcieo
2014 Web Design Trends
What is Responsive Web Design (RWD)?
• Single Codebase• Any Screen Size• Any Platform • Any Orientation
2 #bbcon - Presented by Thalia Driessen of Adcieo
Why It Matters
Credit: cruxcollaborative.com / data: exacttarget.com
2 #bbcon - Presented by Thalia Driessen of Adcieo
Fixed Layout
2 #bbcon - Presented by Thalia Driessen of Adcieo
Fluid Layout
2 #bbcon - Presented by Thalia Driessen of Adcieo
Adaptive Web Design
2 #bbcon - Presented by Thalia Driessen of Adcieo
Responsive Web Design
2 #bbcon - Presented by Thalia Driessen of Adcieo
• Grid-Based / Modular• Content Driven• Use of Typography
packdog.com
• Ample White Space• Good Sized Mobile Buttons• Fast Load Time
2 #bbcon - Presented by Thalia Driessen of Adcieo
Example
2 #bbcon - Presented by Thalia Driessen of Adcieo
Is It Right for You?
• Budget – Short-term vs. long-term value
• Resources – Coding and content editing can happen in one place
• SEO – Responsive is recommended by major search engines
2 #bbcon - Presented by Thalia Driessen of Adcieo
“You put water in a cup,
it becomes the cup; You put water into a
bottle, it becomes the
bottle… Be water, my
friend.”
- Bruce Lee
2 #bbcon - Presented by Thalia Driessen of Adcieo
What is Sticky Content?
• Content that keeps visitors on your site• Encourages visitors to return frequently• Inspires visitors to share your content
2 #bbcon - Presented by Thalia Driessen of Adcieo
What Makes it Stick
• Memorable• Emotional • Credible• Unexpected• Simple & Concrete• Relatable
2 #bbcon - Presented by Thalia Driessen of Adcieo
Example
2 #bbcon - Presented by Thalia Driessen of Adcieo
2 #bbcon - Presented by Thalia Driessen of Adcieo
Is It Right for You?
• Audience – How much do you know about yours
• Resources – Do you have content creators (external or internal)
• Technology – Does your website support a dynamic approach to content creation
2 #bbcon - Presented by Thalia Driessen of Adcieo
“…Make it memorable. Make it inviting to look at. Make it fun to read.”
2 #bbcon - Presented by Thalia Driessen of Adcieo
What is Flat Design?
Flats where its at
Wordcloud - usabilla.com
2 #bbcon - Presented by Thalia Driessen of Adcieo
Skeuomorphic vs. Flat
Flats where its at
2 #bbcon - Presented by Thalia Driessen of Adcieo
• Few / No Added Effects• Solid, Vibrant Colors• Unique Typography
• Simple shapes• Large Hero Graphics• Illustration / Iconography
Is It Right for You?
• Good User Experience - Clean uncluttered design that lends itself to responsive layouts.
• Navigation and Content – Can you streamline it
• Branding – Does it correlate
2 #bbcon - Presented by Thalia Driessen of Adcieo
“Simplicity is the keynote of elegance”
- Coco Chanel
2 #bbcon - Presented by Thalia Driessen of Adcieo
Non-Boring Fonts
• No more limiting to the old-school styles• Use with discretion• Google Fonts• Font Embedding - @font-face
Large Hero Area
Floating Navigation
blog.leadpages.net | sean bester
Parallax
2 #bbcon - Presented by Thalia Driessen of Adcieo
The Future…The Internet of Things
2 #bbcon - Presented by Thalia Driessen of Adcieo
The Future…Natural User Interface
2 #bbcon - Presented by Thalia Driessen of Adcieo
The Future…Virtual Reality
2 #bbcon - Presented by Thalia Driessen of Adcieo
“The future depends on what you do today.”
-Mahatma Gandhi
2 #bbcon - Presented by Thalia Driessen of Adcieo
Trend Toolbox - RWD
Test Your Site:• The Responsinator - responsinator.com• Responsive Design Checker - responsivedesignchecker.com
Ideas:• A List Apart –alistapart.com (search for responsive) • This Is Responsive - responsive.rga.com
Visualizing Responsive• Style Tiles - styletil.es
Inspiration:• Media Queries - mediaqueri.es
2 #bbcon - Presented by Thalia Driessen of Adcieo
Trend Toolbox
Ideas• Sethgodin.typepad.com• Techsoup.org• Ideas.ted.com
Design Inspiration• Webbyawards.com• SmashingMagazine.com
Typography• www.google.com/fonts• designinstruct.com/inspiration-web-design/google-fonts-examples/• fontsquirrel.com/tools/webfont-generator
Content (Sticky)• jeffbullas.com
2 #bbcon - Presented by Thalia Driessen of Adcieo
“The more I learn the more excited I get.”
- Johnny Cash
2 #bbcon - Presented by Thalia Driessen of Adcieo
Thank You for Joining Us Today!
Technology Solutions
Virtual Assistant
Web Design &
Development
Chat Support
Custom Development & Implementation
2 #bbcon - Presented by Thalia Driessen of Adcieo
Questions / Comments?
2 #bbcon - Presented by Thalia Driessen of Adcieo
