Web Design Trends 2014

  • 4,395 views
Uploaded on

My presentation at http://www.informslovakia.sk/en/konferencia/daily-web-2013 about the web design trends in 2014. …

My presentation at http://www.informslovakia.sk/en/konferencia/daily-web-2013 about the web design trends in 2014.

Find out more here: http://designolymp.com

The major topic are:
- Responsive web design
- Content-Centered design
- Storytelling
- Bold typography and decent colors
- Videos

More in: Design , Technology , Business
  • Full Name Full Name Comment goes here.
    Are you sure you want to
    Your message goes here
    Be the first to comment
No Downloads

Views

Total Views
4,395
On Slideshare
0
From Embeds
0
Number of Embeds
5

Actions

Shares
Downloads
139
Comments
0
Likes
13

Embeds 0

No embeds

Report content

Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
    No notes for slide

Transcript

  • 1. Web Design Trends 2014 5 major trends and how you should use them for your business. Web Design Trends 2014 - www.tobiasgebauer.com
  • 2. Today - About me - Responsive web design - 5 major trends - Final thoughts Web Design Trends 2014 - www.tobiasgebauer.com
  • 3. #1 About Web Design Trends 2014 - www.tobiasgebauer.com
  • 4. About me - Web Developer for - 15 years Online Marketing I love Web Design Web Design Trends 2014 - www.tobiasgebauer.com
  • 5. About me Working at 4c media www.cccc.de in Germany Web Design Trends 2014 - www.tobiasgebauer.com
  • 6. #2 Responsive Web Design Trends 2014 - www.tobiasgebauer.com
  • 7. Mobile Website - Parallel website besides the main website - Different content - Optimized for a few devices - m.yourwebite.com - 2007 to 2009 Web Design Trends 2014 - www.tobiasgebauer.com
  • 8. Technology - Tablets & Smartphones - New devices monthly - Desktop 22” or more - No one screen size has more than 20% of the market share (Source: Mobify Research & Development) Web Design Trends 2014 - www.tobiasgebauer.com
  • 9. Responsive Web Design - First mentioned 2010 - by Ethan Marcotte Proportion-Based Grid CSS3 media queries Became the standard Web Design Trends 2014 - www.tobiasgebauer.com
  • 10. Responsive vs. mobile website - No duplicate content issues - Completely device independent - Full functionality and content - Better long-term solution - Recommended by Google Web Design Trends 2014 - www.tobiasgebauer.com
  • 11. http://theme-fusion.com/avada/
  • 12. http://hogash-demo.com/kallyas_wp/
  • 13. Standard 2010-2012 - Website optimized for the desktop - Too many content elements on the website - Too long pages on smartphones and tablets - Lost control over the sequence of content (i.e. sidebar below main content) Web Design Trends 2014 - www.tobiasgebauer.com
  • 14. Graceful Degradation - Bad performance - “Weak” systems - are not considered Difficult to upgrade Web Design Trends 2014 - www.tobiasgebauer.com
  • 15. Mobile first in 2013 - Mobile first and content first approach with progressive enhancement became popular Web Design Trends 2014 - www.tobiasgebauer.com
  • 16. Content First - Concise content - Optimal - presentation on all devices Best performance Easy extendable Content -> Design Web Design Trends 2014 - www.tobiasgebauer.com -> Behavior
  • 17. http://wootten.com.au/process/
  • 18. http://wootten.com.au/process/
  • 19. http://myrainbownursery.co.uk/programmes
  • 20. http://myrainbownursery.co.uk/programmes
  • 21. http://kinhr.com/
  • 22. http://kinhr.com/
  • 23. Trends 2013 - Sticky header - Flat design and bold colors - CSS3 Animations and - parallax effects One-Page website Grid websites like Pinterest Web Design Trends 2014 - www.tobiasgebauer.com
  • 24. #3 Trends 2014 Web Design Trends 2014 - www.tobiasgebauer.com
  • 25. Content-Centered “Design should never say ‘Look at me.’ It should always say, ‘Look at this.’” - David Craib Web Design Trends 2014 - www.tobiasgebauer.com
  • 26. 5 major trends 2014 - Storytelling - Big content blocks - Bold typography and decent colors - High-Quality pictures and videos - One-Page websites Web Design Trends 2014 - www.tobiasgebauer.com
  • 27. https://signwithenvoy.com/
  • 28. https://signwithenvoy.com/
  • 29. http://www.michieldegraaf.com/tone
  • 30. http://www.michieldegraaf.com/tone
  • 31. http://focuslabllc.com/services
  • 32. http://focuslabllc.com/services
  • 33. http://www.martinasperl.at/
  • 34. http://www.martinasperl.at/
  • 35. http://sidigital.co/lab
  • 36. http://sidigital.co/lab
  • 37. Big Content Blocks - Great for responsive web design - Good for storytelling - Focus the readers attention on ONE statement - Use bold web fonts and a lot of whitespace - Separation with color - Combine with pictures Web Design Trends 2014 - www.tobiasgebauer.com
  • 38. http://whiteboard.is/ http://www.squarespace.com/stories/ http://www.internet.org/ https://www.numbrs.com/uk http://getgoingtoday.org/
  • 39. Videos - Perfect for storytelling - Create emotions and a closer connection - Users stay much longer on your website - Visitors perceive a higher quality of your company, product or service Web Design Trends 2014 - www.tobiasgebauer.com
  • 40. #4 Thoughts Web Design Trends 2014 - www.tobiasgebauer.com
  • 41. Good Design “Design must reflect the practical and aesthetic in business but above all... good design must primarily serve people.” - Thomas J. Watson Web Design Trends 2014 - www.tobiasgebauer.com
  • 42. For your business - Responsive web design is a MUST HAVE! - Invest in high quality pictures and videos - and avoid stock images at all Tell a story and concentrate on the benefits for your customers Expect a new web design every 2-3 years Web Design Trends 2014 - www.tobiasgebauer.com
  • 43. Thank you! - See the presentation here www.slideshare.net/tobiasgebauer47/ webdesign-trends2014 Web Design Trends 2014 - www.tobiasgebauer.com