modern web design 

modern web design 

No content

What is ? Markup language for the web Describes the structure & content to be rendered by the browser It can be styled and modified using CSS and Javascript 

What changed? Browsers don’t suck anymore New APIs allow for more advanced rendering (audio, video, canvas, etc.) 

What is ? Stylesheets for the web Describes how to present the content to the browser It can be dynamically added and removed using Javascript 

What changed? Improved accessibly and mobile phone support Better colour & font support Hardware accelerated transformations Other nice graphical enhancements (gradients, borders, etc.) 

What is ? Functional programming language built into every browser Executes in your browser, on your computer – not the server Built-in API for manipulating the DOM (HTML, CSS) 

What is ? Functional programming language built into every browser Executes in your browser, on your computer – not the server Built-in API for manipulating the DOM (HTML, CSS) 

What changed? Major VM improvements; it got a lot faster (1000x over ~10 years) AJAX aka asynchronous requests Most popular programming language in the world Absolutely insane open-source community (great libraries) Becoming an intermediate language 

modern web design 

modern web design 

The Grid Stolen from print design Define content using a grid using rows across fixed # of columns Makes it much easier to create flexible interfaces, fast 

The Grid 

Where do we go from here? Design for mobile first Support modern browsers, no one cares about IE anymore Make use of amazing open source libraries Forget Flash, HTML5 supports rich media Make use of frameworks such as Twitter’s Bootstrap