Modern Web Concepts

Modern Web Concepts Ryan Parsley Linxter.com

How Do You Work Now?

Designer works first • • Developer works first • •
We don’t need no stinking designers • • How Do You Work Now?

Less investment fosters more iterations • • Process is not
wasted time • • Learn to let go • • Reusability is overrated • • A Stitch In Time...

Let Go, Let Cloud

Cloudy Thoughts

“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 Think About Why Before How

Good design is the baseline • • Great design is
a feature • • Customer’s goals... not your goals • • Users probably don’t work for your company • • User Centric?

Usability?

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 • • What Does The User Expect?

“The only ‘intuitive’ interface is the nipple. After that it’s
all learned.” —Bruce Ediger Design Patterns

Beware The Antipatterns

The Grid Is Your Friend Logical solution for creating layouts
• • Consistency comes baked in • • Great learning tool • •

Thoughts On Mobile

Responsive Design Augment grids • • @media screen and (max-width:480px)
• • Every screen can have a custom feel • •

HTML5 Is Not A Myth <!DOCTYPE html> • • Focus
on the structural bits first • • Fill in the gaps with modernizer.js • •

Mind The Gap? Progressive enhancement • • Define “support” •
• There is no need to look the same in all browsers • •

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/ • • Image Credits

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 Resources

Modern Web Concepts

Modern Web Concepts

Ryan Parsley

Other Decks in Programming

Featured

Transcript