15 web design trends for 2013
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](https://reader033.vdocuments.mx/reader033/viewer/2022042714/54c735234a7959551b8b45dc/html5/thumbnails/1.jpg)
15david lee king | davidleeking.com
topeka & shawnee county public library
Web Trendsfor 2013
![Page 2: 15 Web Design Trends for 2013](https://reader033.vdocuments.mx/reader033/viewer/2022042714/54c735234a7959551b8b45dc/html5/thumbnails/2.jpg)
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](https://reader033.vdocuments.mx/reader033/viewer/2022042714/54c735234a7959551b8b45dc/html5/thumbnails/3.jpg)
flickr.com/photos/aquan/2795141674/
“good web designstarts with content”
jeffrey zeldman.smart web dude.
![Page 4: 15 Web Design Trends for 2013](https://reader033.vdocuments.mx/reader033/viewer/2022042714/54c735234a7959551b8b45dc/html5/thumbnails/4.jpg)
![Page 5: 15 Web Design Trends for 2013](https://reader033.vdocuments.mx/reader033/viewer/2022042714/54c735234a7959551b8b45dc/html5/thumbnails/5.jpg)
![Page 6: 15 Web Design Trends for 2013](https://reader033.vdocuments.mx/reader033/viewer/2022042714/54c735234a7959551b8b45dc/html5/thumbnails/6.jpg)
2. design simplicity.
![Page 7: 15 Web Design Trends for 2013](https://reader033.vdocuments.mx/reader033/viewer/2022042714/54c735234a7959551b8b45dc/html5/thumbnails/7.jpg)
![Page 8: 15 Web Design Trends for 2013](https://reader033.vdocuments.mx/reader033/viewer/2022042714/54c735234a7959551b8b45dc/html5/thumbnails/8.jpg)
![Page 9: 15 Web Design Trends for 2013](https://reader033.vdocuments.mx/reader033/viewer/2022042714/54c735234a7959551b8b45dc/html5/thumbnails/9.jpg)
![Page 10: 15 Web Design Trends for 2013](https://reader033.vdocuments.mx/reader033/viewer/2022042714/54c735234a7959551b8b45dc/html5/thumbnails/10.jpg)
3. UX Centered Design
![Page 11: 15 Web Design Trends for 2013](https://reader033.vdocuments.mx/reader033/viewer/2022042714/54c735234a7959551b8b45dc/html5/thumbnails/11.jpg)
3. UX Centered Design
flickr.com/photos/ficofranco/5932086668/
![Page 12: 15 Web Design Trends for 2013](https://reader033.vdocuments.mx/reader033/viewer/2022042714/54c735234a7959551b8b45dc/html5/thumbnails/12.jpg)
3. UX Centered Design
flickr.com/photos/jenny-pics/5661879987/
don’t make me think
![Page 13: 15 Web Design Trends for 2013](https://reader033.vdocuments.mx/reader033/viewer/2022042714/54c735234a7959551b8b45dc/html5/thumbnails/13.jpg)
4. app style interfaces.
![Page 14: 15 Web Design Trends for 2013](https://reader033.vdocuments.mx/reader033/viewer/2022042714/54c735234a7959551b8b45dc/html5/thumbnails/14.jpg)
4. app style interfaces.
![Page 15: 15 Web Design Trends for 2013](https://reader033.vdocuments.mx/reader033/viewer/2022042714/54c735234a7959551b8b45dc/html5/thumbnails/15.jpg)
5. responsive design.
flickr.com/photos/zergev/8430388219/
![Page 16: 15 Web Design Trends for 2013](https://reader033.vdocuments.mx/reader033/viewer/2022042714/54c735234a7959551b8b45dc/html5/thumbnails/16.jpg)
5. responsive design.
flickr.com/photos/69797234@N06/7203485148/
![Page 17: 15 Web Design Trends for 2013](https://reader033.vdocuments.mx/reader033/viewer/2022042714/54c735234a7959551b8b45dc/html5/thumbnails/17.jpg)
5. responsive design.
![Page 18: 15 Web Design Trends for 2013](https://reader033.vdocuments.mx/reader033/viewer/2022042714/54c735234a7959551b8b45dc/html5/thumbnails/18.jpg)
![Page 19: 15 Web Design Trends for 2013](https://reader033.vdocuments.mx/reader033/viewer/2022042714/54c735234a7959551b8b45dc/html5/thumbnails/19.jpg)
5. responsive design.
![Page 20: 15 Web Design Trends for 2013](https://reader033.vdocuments.mx/reader033/viewer/2022042714/54c735234a7959551b8b45dc/html5/thumbnails/20.jpg)
6. no skeuomorphism
![Page 21: 15 Web Design Trends for 2013](https://reader033.vdocuments.mx/reader033/viewer/2022042714/54c735234a7959551b8b45dc/html5/thumbnails/21.jpg)
huh?
![Page 22: 15 Web Design Trends for 2013](https://reader033.vdocuments.mx/reader033/viewer/2022042714/54c735234a7959551b8b45dc/html5/thumbnails/22.jpg)
... 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](https://reader033.vdocuments.mx/reader033/viewer/2022042714/54c735234a7959551b8b45dc/html5/thumbnails/23.jpg)
simulated wood grain, baby!http://en.wikipedia.org/wiki/File:1986ChryslerLeBaronTownCountryStationWagon.jpg
![Page 24: 15 Web Design Trends for 2013](https://reader033.vdocuments.mx/reader033/viewer/2022042714/54c735234a7959551b8b45dc/html5/thumbnails/24.jpg)
Text
![Page 25: 15 Web Design Trends for 2013](https://reader033.vdocuments.mx/reader033/viewer/2022042714/54c735234a7959551b8b45dc/html5/thumbnails/25.jpg)
Text
![Page 26: 15 Web Design Trends for 2013](https://reader033.vdocuments.mx/reader033/viewer/2022042714/54c735234a7959551b8b45dc/html5/thumbnails/26.jpg)
Text
![Page 27: 15 Web Design Trends for 2013](https://reader033.vdocuments.mx/reader033/viewer/2022042714/54c735234a7959551b8b45dc/html5/thumbnails/27.jpg)
Text
![Page 28: 15 Web Design Trends for 2013](https://reader033.vdocuments.mx/reader033/viewer/2022042714/54c735234a7959551b8b45dc/html5/thumbnails/28.jpg)
Text
![Page 29: 15 Web Design Trends for 2013](https://reader033.vdocuments.mx/reader033/viewer/2022042714/54c735234a7959551b8b45dc/html5/thumbnails/29.jpg)
7. coding languages
![Page 30: 15 Web Design Trends for 2013](https://reader033.vdocuments.mx/reader033/viewer/2022042714/54c735234a7959551b8b45dc/html5/thumbnails/30.jpg)
HTML/CSS/Javascript
![Page 31: 15 Web Design Trends for 2013](https://reader033.vdocuments.mx/reader033/viewer/2022042714/54c735234a7959551b8b45dc/html5/thumbnails/31.jpg)
HTML/CSS/Javascript
flickr.com/photos/josefdunne/5410923901/
![Page 32: 15 Web Design Trends for 2013](https://reader033.vdocuments.mx/reader033/viewer/2022042714/54c735234a7959551b8b45dc/html5/thumbnails/32.jpg)
8. Fixed Header Bars
![Page 33: 15 Web Design Trends for 2013](https://reader033.vdocuments.mx/reader033/viewer/2022042714/54c735234a7959551b8b45dc/html5/thumbnails/33.jpg)
Text
Fixed Header
![Page 34: 15 Web Design Trends for 2013](https://reader033.vdocuments.mx/reader033/viewer/2022042714/54c735234a7959551b8b45dc/html5/thumbnails/34.jpg)
Text
Fixed stuff
![Page 35: 15 Web Design Trends for 2013](https://reader033.vdocuments.mx/reader033/viewer/2022042714/54c735234a7959551b8b45dc/html5/thumbnails/35.jpg)
9. large photo backgrounds
![Page 36: 15 Web Design Trends for 2013](https://reader033.vdocuments.mx/reader033/viewer/2022042714/54c735234a7959551b8b45dc/html5/thumbnails/36.jpg)
9. large photo backgrounds
![Page 37: 15 Web Design Trends for 2013](https://reader033.vdocuments.mx/reader033/viewer/2022042714/54c735234a7959551b8b45dc/html5/thumbnails/37.jpg)
9. large photo backgrounds
![Page 38: 15 Web Design Trends for 2013](https://reader033.vdocuments.mx/reader033/viewer/2022042714/54c735234a7959551b8b45dc/html5/thumbnails/38.jpg)
9. large photo backgrounds
![Page 39: 15 Web Design Trends for 2013](https://reader033.vdocuments.mx/reader033/viewer/2022042714/54c735234a7959551b8b45dc/html5/thumbnails/39.jpg)
9. large photo backgrounds
![Page 40: 15 Web Design Trends for 2013](https://reader033.vdocuments.mx/reader033/viewer/2022042714/54c735234a7959551b8b45dc/html5/thumbnails/40.jpg)
10. CSSTransparency
![Page 41: 15 Web Design Trends for 2013](https://reader033.vdocuments.mx/reader033/viewer/2022042714/54c735234a7959551b8b45dc/html5/thumbnails/41.jpg)
10. CSS Transparency
![Page 42: 15 Web Design Trends for 2013](https://reader033.vdocuments.mx/reader033/viewer/2022042714/54c735234a7959551b8b45dc/html5/thumbnails/42.jpg)
11. Social Media Badges
![Page 43: 15 Web Design Trends for 2013](https://reader033.vdocuments.mx/reader033/viewer/2022042714/54c735234a7959551b8b45dc/html5/thumbnails/43.jpg)
11. Social Media Badges
![Page 44: 15 Web Design Trends for 2013](https://reader033.vdocuments.mx/reader033/viewer/2022042714/54c735234a7959551b8b45dc/html5/thumbnails/44.jpg)
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](https://reader033.vdocuments.mx/reader033/viewer/2022042714/54c735234a7959551b8b45dc/html5/thumbnails/45.jpg)
12. Infinite Scrolling
![Page 46: 15 Web Design Trends for 2013](https://reader033.vdocuments.mx/reader033/viewer/2022042714/54c735234a7959551b8b45dc/html5/thumbnails/46.jpg)
12. Infinite Scrolling
![Page 47: 15 Web Design Trends for 2013](https://reader033.vdocuments.mx/reader033/viewer/2022042714/54c735234a7959551b8b45dc/html5/thumbnails/47.jpg)
12. Infinite Scrollingscroll ... forever!
![Page 48: 15 Web Design Trends for 2013](https://reader033.vdocuments.mx/reader033/viewer/2022042714/54c735234a7959551b8b45dc/html5/thumbnails/48.jpg)
13. homepage feature tours
![Page 49: 15 Web Design Trends for 2013](https://reader033.vdocuments.mx/reader033/viewer/2022042714/54c735234a7959551b8b45dc/html5/thumbnails/49.jpg)
![Page 50: 15 Web Design Trends for 2013](https://reader033.vdocuments.mx/reader033/viewer/2022042714/54c735234a7959551b8b45dc/html5/thumbnails/50.jpg)
![Page 51: 15 Web Design Trends for 2013](https://reader033.vdocuments.mx/reader033/viewer/2022042714/54c735234a7959551b8b45dc/html5/thumbnails/51.jpg)
13. homepage feature tours
![Page 52: 15 Web Design Trends for 2013](https://reader033.vdocuments.mx/reader033/viewer/2022042714/54c735234a7959551b8b45dc/html5/thumbnails/52.jpg)
14. Sliding panels
![Page 53: 15 Web Design Trends for 2013](https://reader033.vdocuments.mx/reader033/viewer/2022042714/54c735234a7959551b8b45dc/html5/thumbnails/53.jpg)
14. Sliding webpage panels
![Page 54: 15 Web Design Trends for 2013](https://reader033.vdocuments.mx/reader033/viewer/2022042714/54c735234a7959551b8b45dc/html5/thumbnails/54.jpg)
15. Parallax Design
![Page 55: 15 Web Design Trends for 2013](https://reader033.vdocuments.mx/reader033/viewer/2022042714/54c735234a7959551b8b45dc/html5/thumbnails/55.jpg)
who names this stuff, anyway?
![Page 56: 15 Web Design Trends for 2013](https://reader033.vdocuments.mx/reader033/viewer/2022042714/54c735234a7959551b8b45dc/html5/thumbnails/56.jpg)
15. Parallax Design
![Page 57: 15 Web Design Trends for 2013](https://reader033.vdocuments.mx/reader033/viewer/2022042714/54c735234a7959551b8b45dc/html5/thumbnails/57.jpg)
To recap:
![Page 58: 15 Web Design Trends for 2013](https://reader033.vdocuments.mx/reader033/viewer/2022042714/54c735234a7959551b8b45dc/html5/thumbnails/58.jpg)
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](https://reader033.vdocuments.mx/reader033/viewer/2022042714/54c735234a7959551b8b45dc/html5/thumbnails/59.jpg)
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](https://reader033.vdocuments.mx/reader033/viewer/2022042714/54c735234a7959551b8b45dc/html5/thumbnails/60.jpg)
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](https://reader033.vdocuments.mx/reader033/viewer/2022042714/54c735234a7959551b8b45dc/html5/thumbnails/61.jpg)
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](https://reader033.vdocuments.mx/reader033/viewer/2022042714/54c735234a7959551b8b45dc/html5/thumbnails/62.jpg)
Thanks!
davidleeking.com