15 web design trends for 2013

62
15 david lee king | davidleeking.com topeka & shawnee county public library Web Trends for 2013

Upload: david-king

Post on 27-Jan-2015

106 views

Category:

Technology


1 download

DESCRIPTION

What's happening in the web design world? Here are 15 trends in web design - check them out, see if you use them, and see if you think these are useful!

TRANSCRIPT

Page 1: 15 Web Design Trends for 2013

15david lee king | davidleeking.com

topeka & shawnee county public library

Web Trendsfor 2013

Page 2: 15 Web Design Trends for 2013

tempus, laoreet et massa. Morbi nec dignissim turpis. Lorem ipsum dolor sit amet, consectetur adipiscing

elit. Curabitur interdum rhoncus diam, vitae aliquam velit tincidunt ac. Aliquam vel nisi non felis pretium fermentum quis quis augue. Pellentesque lobortis

gravida nisl, sed rhoncus ante volutpat at. Aenean id purus arcu, et sagittis sapien.

Donec sed lorem in elit aliquam convallis quis et eros. Sed auctor mollis lacus, non fermentum odio

vulputate sed. Curabitur pretium ligula purus. Aliquam quis leo nisi, quis consequat lacus. Class

aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. In mattis, est sed pulvinar facilisis, tortor magna gravida ipsum, at condimentum turpis velit rhoncus purus. Donec

1. content first.

Page 3: 15 Web Design Trends for 2013

flickr.com/photos/aquan/2795141674/

“good web designstarts with content”

jeffrey zeldman.smart web dude.

Page 4: 15 Web Design Trends for 2013
Page 5: 15 Web Design Trends for 2013
Page 6: 15 Web Design Trends for 2013

2. design simplicity.

Page 7: 15 Web Design Trends for 2013
Page 8: 15 Web Design Trends for 2013
Page 9: 15 Web Design Trends for 2013
Page 10: 15 Web Design Trends for 2013

3. UX Centered Design

Page 11: 15 Web Design Trends for 2013

3. UX Centered Design

flickr.com/photos/ficofranco/5932086668/

Page 12: 15 Web Design Trends for 2013

3. UX Centered Design

flickr.com/photos/jenny-pics/5661879987/

don’t make me think

Page 13: 15 Web Design Trends for 2013

4. app style interfaces.

Page 14: 15 Web Design Trends for 2013

4. app style interfaces.

Page 15: 15 Web Design Trends for 2013

5. responsive design.

flickr.com/photos/zergev/8430388219/

Page 16: 15 Web Design Trends for 2013

5. responsive design.

flickr.com/photos/69797234@N06/7203485148/

Page 17: 15 Web Design Trends for 2013

5. responsive design.

Page 18: 15 Web Design Trends for 2013
Page 19: 15 Web Design Trends for 2013

5. responsive design.

Page 20: 15 Web Design Trends for 2013

6. no skeuomorphism

Page 21: 15 Web Design Trends for 2013

huh?

Page 22: 15 Web Design Trends for 2013

... a physical ornament or design on an object made to resemble another material or technique.

[ed., yay wikipedia]

Page 23: 15 Web Design Trends for 2013

simulated wood grain, baby!http://en.wikipedia.org/wiki/File:1986ChryslerLeBaronTownCountryStationWagon.jpg

Page 24: 15 Web Design Trends for 2013

Text

Page 25: 15 Web Design Trends for 2013

Text

Page 26: 15 Web Design Trends for 2013

Text

Page 27: 15 Web Design Trends for 2013

Text

Page 28: 15 Web Design Trends for 2013

Text

Page 29: 15 Web Design Trends for 2013

7. coding languages

Page 30: 15 Web Design Trends for 2013

HTML/CSS/Javascript

Page 31: 15 Web Design Trends for 2013

HTML/CSS/Javascript

flickr.com/photos/josefdunne/5410923901/

Page 32: 15 Web Design Trends for 2013

8. Fixed Header Bars

Page 33: 15 Web Design Trends for 2013

Text

Fixed Header

Page 34: 15 Web Design Trends for 2013

Text

Fixed stuff

Page 35: 15 Web Design Trends for 2013

9. large photo backgrounds

Page 36: 15 Web Design Trends for 2013

9. large photo backgrounds

Page 37: 15 Web Design Trends for 2013

9. large photo backgrounds

Page 38: 15 Web Design Trends for 2013

9. large photo backgrounds

Page 39: 15 Web Design Trends for 2013

9. large photo backgrounds

Page 40: 15 Web Design Trends for 2013

10. CSSTransparency

Page 41: 15 Web Design Trends for 2013

10. CSS Transparency

Page 42: 15 Web Design Trends for 2013

11. Social Media Badges

Page 43: 15 Web Design Trends for 2013

11. Social Media Badges

Page 44: 15 Web Design Trends for 2013

11. Social Media Badges

http://www.skyblue-pink.com/wp-content/themes/BlackPower/images/button_twitter.png

Page 45: 15 Web Design Trends for 2013

12. Infinite Scrolling

Page 46: 15 Web Design Trends for 2013

12. Infinite Scrolling

Page 47: 15 Web Design Trends for 2013

12. Infinite Scrollingscroll ... forever!

Page 48: 15 Web Design Trends for 2013

13. homepage feature tours

Page 49: 15 Web Design Trends for 2013
Page 50: 15 Web Design Trends for 2013
Page 51: 15 Web Design Trends for 2013

13. homepage feature tours

Page 52: 15 Web Design Trends for 2013

14. Sliding panels

Page 53: 15 Web Design Trends for 2013

14. Sliding webpage panels

Page 54: 15 Web Design Trends for 2013

15. Parallax Design

Page 55: 15 Web Design Trends for 2013

who names this stuff, anyway?

Page 56: 15 Web Design Trends for 2013

15. Parallax Design

Page 57: 15 Web Design Trends for 2013

To recap:

Page 58: 15 Web Design Trends for 2013

To recap:

1. content first - yay2. design simplicity - yay3. UX centered design - yay

5. responsive design - yay

7. coding languages - yay (will change soon)

11. social media badges - yay

Page 59: 15 Web Design Trends for 2013

To recap:

1. content first - yay2. design simplicity - yay3. UX centered design - yay4. app style interfaces - meh5. responsive design - yay

7. coding languages - yay (will change soon)8. fixed header bars - meh

11. social media badges - yay12. infinite scrolling - meh

Page 60: 15 Web Design Trends for 2013

To recap:

1. content first - yay2. design simplicity - yay3. UX centered design - yay4. app style interfaces - meh5. responsive design - yay6. no skeuomorphism - depends7. coding languages - yay (will change soon)8. fixed header bars - meh9. large photo backgrounds - hmm…

11. social media badges - yay12. infinite scrolling - meh13. homepage feature tours - hmm…

Page 61: 15 Web Design Trends for 2013

To recap:

1. content first - yay2. design simplicity - yay3. UX centered design - yay4. app style interfaces - meh5. responsive design - yay6. no skeuomorphism - depends7. coding languages - yay (will change soon)8. fixed header bars - meh9. large photo backgrounds - hmm…10. CSS Transparency - geeks rejoice11. social media badges - yay12. infinite scrolling - meh13. homepage feature tours - hmm…14. sliding panels - geeks rejoice15. Parallax design - geeks rejoice

Page 62: 15 Web Design Trends for 2013

Thanks!

davidleeking.com