1.
The Art of Rhetoric:Flexible Content with DrupalRob Carr@robertgcarr

2.
30 minutes of me• Current problems• What is content• Responsive design• Information Architecture• Flexible content• Discussion

3.
Too much stuff•Dropbox:1bn files/day uploaded•1m websiteslaunched/day•Duplicateinformation• 2M+ ways to unblock asink?http://mashable.com/2012/06/22/data-created-every-minute/

4.
Death to the Web Page•Pages != web content:• Boundaries• Fixed structure• Dead ends•Inflexible blobs•Information silos•Difficult to recycleImage:Wikimedia

5.
Many shapes and formsBrowser window != printed page

6.
Mobile != mobileFT.com figures via themediabriefing.com

7.
Good Content•Appropriate•Useful•User-centered•Clear & concise•SupportedErin Kissane The Elements of Content Strategy A Book Apart

8.
Aristotle? Who?•Rhetoric•Logic•Grammar

9.
RhetoricLOGOSideas/factsETHOScredibility/mannerPATHOSEmotion

10.
Five Canons ofRhetoric•invention deciding what to say•arrangement timing or structure•style graphic/information design•memory contextual messages•delivery interaction design

11.
Don’t Lose theMessageRhetoric. Rhetoric. RhetoricNeed structure and rules tofree ourselves from the page

12.
Content for Robots• Group similar content• Look for common chunktypes:• Files/media• Addresses• Lists• Product data• Pull quotes,asides etc...• Sketch out content types• Identify relationshipsBookAuthorPublisherFormatGenre

13.
Chunks of Content•Think structure and markup:• ♡ Friendly fields• ☠ Death to WYSIWYG•Use of taxonomy•Context: data reuse and transport

14.
Adaptable Content•COPE:CreateOnce PublishAnywhere• eg BBC,NPR,Amazon•Content stores•Cultural change?•Use ofAPIs

15.
Evolution... ?Desktop browser iPad browseriPhonebrowseriPad app WP8 appBook cover dominates;‘Buy Now’ prominent

16.
Responsive design• Fluid grids & typography• Flexible images• Change of flow• Client-side CSS3 media queriesImage: http://trentwalton.com/2012/06/19/fluid-type/

17.
Adaptive design• Different layouts/content for specificbreakpoints• Progressive enhancement• Call separate markup or scripts• Can be less effort than a responsiverebuild• Ultimately doomed

18.
Isn’t This a DrupalCamp?• Entities, Fields and Relationships• Adaptive Themes• Omega,AT etc• ‘Adaptive’ modules:• CTools - page templates• Browscap - browser inspector• Browscap CTools - Rules/conditions• Spark distribution• Layout/Grid builders• In Place Editing (IPE)• Mobile theme + device previews• CTools, Panels,Views, Panelizer, Breakpoints includedAs with all things Drupal, couldalso use blocks withViews andContext... or Adaptivecontentmodule... or Display Suite... orTheme cunningness... (etc)

19.
TaxonomyBook Format Genre

20.
Need to Enable, then Editnode_view template

21.
Create 2nd BookVariantVariant 2: Book nodetype, and Is Mobile

22.
DesktopHeaderSidebar 1 Sidebar 2MainFooter

23.
Mobile: ResponsiveiPad - Landscape iPhoneSidebar BodyFooter ASidebarBodySameDOM

24.
Lego-time• Pane content very flexible• Render different fields• But:don’t punish mobile• Views could also give usrelated content:• Similar books within genre• Books by same author• Customers also purchased...• Keep pane contentappropriate to context...

25.
Adaptive Layout•Device detection allows us toadapt layouts & content.•Change visual hierarchy withadaptive selection.•Responsive design changes floatof containers for accessibility.

26.
So?•Discussed wider problems•What is content?•Data modelling•Responsive vs.Adaptive•Drupal Spark: Flexible layouts