content strategy for responsive websites
out of 94
Post on 17-Aug-2014
Embed Size (px)
DESCRIPTIONPresentation to: Madison Web Design & Development Meetup - February 11, 2013. Web Content Mavens, Washington, DC - January 8, 2013. NYC Web Design Meetup -January 24, 2013.
- Content Strategyfor Responsive WebsitesWeb Content MavensJanuary 8, 2013 Washington, DC Clarissa Peterson @clarissa
- So youre going to make websiteswork better on mobile phones?Because right now they mostly all suck. my friend whos not a web designer
- Mobile Strategy?
- Mobile strategy is the same thing as web strategy, but without ignoring mobile.
- What is Responsive Design?
- Flexible & Adjustable
- But Its Not Magic
- Its not like our industry nailed webdesign before we started doingresponsive design. Its still a work inprogress. Dan Willis @uxcrank
- Fixed-Width(just doesnt work)
- Separate Mobile Site (wheres all the content?)
- Photo credit: Brad Frost via Creative Commons http://ic.kr/p/cfQwL7
- Stop making assumptions.
- Photo credit: Kai Chan Vong via Creative Commons http://ic.kr/p/5c4Sfv
- Photo credit: Carlos Smith via Creative Commons http://ic.kr/p/8tLb4P
- There is no Mobile Web. There is onlyThe Web, which we view in differentways. There is also no Desktop Web. OrTablet Web. Stephen Hay @stephenhay
- Why It Matters
- 85% of American adultsown a cell phonehttp://pewinternet.org/Reports/2012/Smartphone-Update-Sept-2012.aspx
- 45% of American adultsown a smartphonehttp://pewinternet.org/Reports/2012/Smartphone-Update-Sept-2012.aspx
- 40% have a cell phone thatsnot a smartphonehttp://pewinternet.org/Reports/2012/Smartphone-Update-Sept-2012.aspx
- 17%do most of their online browsing on their phone http://pewinternet.org/Reports/2012/Smartphone-Update-Sept-2012.aspx
- But most of them also have a desktop or laptop.http://pewinternet.org/Reports/2012/Smartphone-Update-Sept-2012.aspx
- Fluid boundaries between devices.
- 1. Everything for Everybody
- Content Parity
- The beauty of the web is its openness.Dont arbitrarily lock people out becauseof browser, device or conguration. Brad Frost @brad_frost
- 2. Content First
- Design Process
- Design Develop
- Responsive Prototyping
- Design forSmall Screen First
- Mobile use case: I just transferredmoney at my desk using my phonebecause logging into my banking apprequires fewer steps. Stephanie Rieger @stephanierieger
- Make it easy for everyone.
- Context of Use
- Put the important stuff rstbut dont get rid of the rest of it.
- Mobile Devices
- If you cant make it responsive, at least make sure it works.
- 3. Independent Content
- It can go anywhere
- via Instapaper
- via Instapaper
- Content Strategy
- 1. Everything for Everybody 2. Content First 3. Independent Content
- Some responsive websites:
- BooksContent Strategy for MobileKaren McGrane (2012)http://www.abookapart.com/products/content-strategy-for-mobileResponsive Web DesignEthan Marcotte (2011)http://www.abookapart.com/products/responsive-web-design/Content Strategy for the Web, 2nd Ed.Kristina Halvorson & Melissa Rach (2012)http://contentstrategy.com/
- ArticlesResponsive Web Design - Ethan Marcotte (May 2010)http://www.alistapart.com/articles/responsive-web-design
View more >