Se ha denunciado esta presentación.
Utilizamos tu perfil de LinkedIn y tus datos de actividad para personalizar los anuncios y mostrarte publicidad más relevante. Puedes cambiar tus preferencias de publicidad en cualquier momento.

Rhetoric and Flexible Content with Drupal

2.090 visualizaciones

Publicado el

Outlines the problems in trends in web design, and how a flexible approach to content can maintain the rhetoric. Outlines a sample solution in Drupal Spark

Publicado en: Tecnología
  • Inicia sesión para ver los comentarios

  • Sé el primero en recomendar esto

Rhetoric and Flexible Content with Drupal

  1. 1. The Art of Rhetoric:Flexible Content with DrupalRob Carr@robertgcarr
  2. 2. 30 minutes of me• Current problems• What is content• Responsive design• Information Architecture• Flexible content• Discussion
  3. 3. Too much stuff•Dropbox:1bn files/day uploaded•1m websiteslaunched/day•Duplicateinformation• 2M+ ways to unblock asink?
  4. 4. Death to the Web Page•Pages != web content:• Boundaries• Fixed structure• Dead ends•Inflexible blobs•Information silos•Difficult to recycleImage:Wikimedia
  5. 5. Many shapes and formsBrowser window != printed page
  6. 6. Mobile != figures via
  7. 7. Good Content•Appropriate•Useful•User-centered•Clear & concise•SupportedErin Kissane The Elements of Content Strategy A Book Apart
  8. 8. Aristotle? Who?•Rhetoric•Logic•Grammar
  9. 9. RhetoricLOGOSideas/factsETHOScredibility/mannerPATHOSEmotion
  10. 10. Five Canons ofRhetoric•invention deciding what to say•arrangement timing or structure•style graphic/information design•memory contextual messages•delivery interaction design
  11. 11. Don’t Lose theMessageRhetoric. Rhetoric. RhetoricNeed structure and rules tofree ourselves from the page
  12. 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. 13. Chunks of Content•Think structure and markup:• ♡ Friendly fields• ☠ Death to WYSIWYG•Use of taxonomy•Context: data reuse and transport
  14. 14. Adaptable Content•COPE:CreateOnce PublishAnywhere• eg BBC,NPR,Amazon•Content stores•Cultural change?•Use ofAPIs
  15. 15. Evolution... ?Desktop browser iPad browseriPhonebrowseriPad app WP8 appBook cover dominates;‘Buy Now’ prominent
  16. 16. Responsive design• Fluid grids & typography• Flexible images• Change of flow• Client-side CSS3 media queriesImage:
  17. 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. 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. 19. TaxonomyBook Format Genre
  20. 20. Need to Enable, then Editnode_view template
  21. 21. Create 2nd BookVariantVariant 2: Book nodetype, and Is Mobile
  22. 22. DesktopHeaderSidebar 1 Sidebar 2MainFooter
  23. 23. Mobile: ResponsiveiPad - Landscape iPhoneSidebar BodyFooter ASidebarBodySameDOM
  24. 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. 25. Adaptive Layout•Device detection allows us toadapt layouts & content.•Change visual hierarchy withadaptive selection.•Responsive design changes floatof containers for accessibility.
  26. 26. So?•Discussed wider problems•What is content?•Data modelling•Responsive vs.Adaptive•Drupal Spark: Flexible layouts