Henry Adams (Descendant of 2 presidents: great-grandson to John Adams and grandson to John Quincy Adams). He lived between the civil war and world war 1. He witnessed the industrial revolution.
Chaos was the law of nature, Order was the dream of man
Samuel Johnson – funniest man in the 17th Century…
Responsive Design:
1. Flexible of fluid grid
2. Flexible images and media
3. Media Queries
“Solve the parts, not the whole problem.” – Mr Kaizer
1. Layout
2. Staring Small
3. Advertising
4. Media Queries
Formula:
target / context = result
thegreatdiscontent.com
Bootstrap and dribbble and great discontent star big and go small.
We should start small and go big – Yiibu
Site > Structure > Skin > Services > Space Plan > Stuff
Slow constants quick, slow controls quick – Stewart Brad – How Buildings Learn.
Trent Walton – “trade control in photoshop for a network of context” in Responsive designs
Layout is most susceptible to change
Width, hierarchy, density, interaction.
Don’t just hide content on mobile – simplify before you suppress.
Move nav into footer? Link to it in the header
We’ve been too focused on layout and columns and grids.
paul robert lloyd.com
Ads: Keep relative position but have it adapt it’s position. document.write is not friendly. Responsive Advertising: Mark Boulton and Roger Black.
Images and Media:
Images with width: 100%
Media set via javascript? No we don’t need to, let’s use css only, it’s more fluid! Althoug it does require a bit of un-semantic mark-up.
Width x Height = Aspect Ratio
Wrap media in div. Give container a padding-top matching the aspect ratio percentage, position rellative. Give media inside position absolute and width and height both 100%!
BBC – responsivenews.com
Bandwidth is a blind spot. and now extra complicated with image prefetching.
categorizr and craig mod – bibliotype
– Give users choice/options to view content they aer interested in.
Art is Messy – Andrew Stanton, Pixar
Many hands make light work