Modern Web Concepts
•
0 gefällt mir•696 views
Sharing my thoughts and process when creating web sites and apps. My goal is to promote some "best practices" that will help you make better websites with less frustration (as well as dispel a few myths).
Empfohlen
Empfohlen
Weitere ähnliche Inhalte
Was ist angesagt?
Was ist angesagt? (20)
Ähnlich wie Modern Web Concepts
Ähnlich wie Modern Web Concepts (20)
Kürzlich hochgeladen
Kürzlich hochgeladen (20)
Modern Web Concepts
- 1. Modern Web Concepts Ryan Parsley Linxter.com 2011.02.12
- 2. How Do You Work Now?
- 3. How Do You Work Now? • Designer works first • Developer works first • We don’t need no stinking designers
- 4. A Stitch In Time... • Less investment fosters more iterations • Process is not wasted time • Learn to let go • Reusability is overrated
- 5. Let Go, Let Cloud
- 7. Think About Why Before How “If you don’t know where you are going, any road will get you there.” —Lewis Carroll • Identify your target audience • Identify with your target audience
- 8. User Centric? • Good design is the baseline • Great design is a feature • Customer’s goals... not your goals • Users probably don’t work for your company
- 9. Usability?
- 10. What Does The User Expect? • Consistency is great! • Cohesiveness is what you really need. • If you don’t fancy yourself a design expert... there is no shame in striving for obvious. • You don’t have to be *that* clever
- 11. Design Patterns “The only ‘intuitive’ interface is the nipple. After that it’s all learned.” —Bruce Ediger
- 16. The Grid Is Your Friend • Logical solution for creating layouts • Consistency comes baked in • Great learning tool
- 19. Responsive Design • Augment grids • @media screen and (max-width:480px) • Every screen can have a custom feel
- 20. HTML5 Is Not A Myth • <!DOCTYPE html> • Focus on the structural bits first • Fill in the gaps with modernizer.js
- 21. Mind The Gap? • Progressive enhancement • Define “support” • There is no need to look the same in all browsers
- 22. Image Credits • http://www.flickr.com/photos/joeandy/147678902 • http://www.flickr.com/photos/eliotreeves/3865454969 • http://www.flickr.com/photos/24868561@ N07/3981525301 • http://www.flickr.com/photos/joshsimerman/3444223835 • http://www.flickr.com/photos/adactio/1799116343/
- 23. Resources • http://www.modernizr.com • http://adactio.com/articles • http://www.alistapart.com/articles/responsive-web-design • http://www.alistapart.com/articles/taking-advantage-of-html5-and-css3-with-modernizr • http://www.joelonsoftware.com/uibook/fog0000000249.html • http://gettingreal.37signals.com/ch09_Interface_First.php • http://thinkvitamin.com/business/how-to-increase-sign-ups-by-200-percent • http://www-01.ibm.com/software/ucd/ucd.html • http://blog.reybango.com/2010/09/21/how-to-create-html5-website-and-page-templates-for- visual-studio-2010