Plan your Chunks!

2014 April 5

DrupalCamp Pune

@adellefrank

Win the Future with Information Architecture NOW

2

3

A bit about me & about DrupalA bit about me & about Drupal

Hi, I’m drupal

I make websites …with help from Adelle

and YOU!

4

Who are Y’ALL?Who are Y’ALL?

5

What we’ll discussWhat we’ll discuss

• Our Plan

– Slides will be posted on my blog.

– For Beginners (also good for Intermediate)

• No Coding!

• Short definitions of strange Drupal words

• What is Information Architecture (IA) & why do we need it?

• Best Practices for: Fields; Naming & Language; Paths; Entities (Taxonomy; Content Types; Users; Media; Blocks); Views & Rules; Features

• Q & A

6

What is Information Architecture (IA)?What is Information Architecture (IA)?

DEFINITION:

Designing and building

STRUCTURES

that make it easier to

FIND, USE, & MANAGE

shared information

on any DEVICE.

Photo Credits: hello world by Windell Oskay (https://www.flickr.com/photos/oskay/472097903); Samsung Galaxy Gear by Hi-tech@Mail.Ru (http://commons.wikimedia.org/wiki/File:Samsung_Galaxy_Gear_Comparison.jpg); Flat Screen LCD television by Vector Fresh (http://vector4free.com/vector/flat-screen-lcd-television)

7

Why do we need (IA)?Why do we need (IA)?

"It’s a war of blobs versus chunks: sloppy blobs of where there’s no distinction between content and form versus clean, flexible, presentation-independent chunks.”

Karen McGrane (DrupalCon Portland 2013)

Photo Credits:Mystery blob of jelly in the woods by Lairich Rig (http://commons.wikimedia.org/wiki/File:Mystery_blob_of_jelly_in_the_woods_-_geograph.org.uk_-_1000481.jpg); Paneer from http://www.loveandlentil.com/2011/06/orange-paneer.html

8

Best practices for IA in DrupalBest practices for IA in Drupal

• Fields• Naming & Language• Paths• Entities

– Taxonomy– Content Types– Users– Media/Images– Blocks

• Views & Rules• Features

9

FieldsFields

• DEFINITION: place on a form where people add data.

• PARTS: – Label: tells person what kind of data to add.– Machine name: computer-friendly name used in database.– Data type: kind of data stored in this field (numbers, text, etc.).

For type details, see: https://drupal.org/node/774742 and http://drupalwatchdog.com/1/1/introduction-field-ui

– Widget: interface people use to add data (checkbox, list, etc.)– Configuration: varies by type of data and widget.– Display: what people see (view mode in D7 vs. form mode in D8),

more information at: http://www.acquia.com/blog/tutorial-drupal-8-sitebuilding-modeling-data-fields

10

Fields (continued)Fields (continued)

BEST PRACTICES:

• Do not share fields, because of conflicts in Field Permissions.

• Machine name: Keep it short; Only use underscores “_” instead of spaces between the letters; and follow a pre-set pattern for naming, such as: mct_data_herein (mct = my content type). This will make managing your database easier and require less developer documentation.

• Label: Keep it short and use simple language; If you need longer instructions, use the Markup field; If you have a lot of fields, use Field Groups to organize your fields so that the user is not overwhelmed.

• Configuration: think ahead when setting this, as it can be VERY difficult to change after data has already been collected (especially ‘unlimited‘ and removing options from a list).

11

Naming & LanguageNaming & Language

BEST PRACTICES:

•Build Multilingual in from the beginning (Title, Entity Translation, etc.). This is even easier in D8 and helps future-proof, because adding it later is VERY difficult (it impacts many parts of your site.)

•Make ALL your names meaningful and easy to understand!

•When choosing short Machine names, decide on a pattern and name all your stuff the same way. These mostly helps the developers of the site (but can sometimes impact users, too).

•When choosing Labels (people-facing descriptions), keep them short and use simple, clear words to describe them. These are to help the people using the site, not the developers.

12

PathsPaths

• DEFINITION: The text at the end of your web address that shows for each individual page (gostem.gatech.edu/en/planned-path).

• Multi-lingual often depends on this to determine WHICH language to show.

• Menu, the underlying part of Drupal which manages paths, is crucial to your site working correctly.

• Using PathAuto, and create patterns that:

– Are guaranteed to be unique (and so don’t overlap/conflict),

– Increase your SEO (search engine optimization)

– Are easy for people to type into their browser

– You can use for other purposes (such as showing specific related content, making filters in lists/views, and automatically creating breadcrumb navigation).

13

EntitiesEntities

• DEFINITION: A container for a “bundle” of fields.• Common types of entities include:

– Taxonomy– Content Types– Users– Media

14

TaxonomyTaxonomy

• DEFINITION: Tags in Lists.

• Most helpful if SHARED (but must be thought out to work well)

• Can be used as “List” data type in a Field.

15

Content TypesContent Types

• DEFINITION: a flexible type of entity that site builders can make when Core entities do not meet their needs.

• How many & when to make fields?

– Device variety

– Purposeful

– Do NOT want to change later (data loss concerns)

– Not TOO many (100 or more) for good performance

• Special field types

– Date

– Entity Reference

16

UsersUsers

• Think CAREFULLY about Roles people will play on the site

• Give MEANINGFUL labels

• Carefully set & test permissions.

• Be conscious that Users have accounts on the system (and are different from managed Contacts)

17

Media & ImagesMedia & Images

• Good default Configurations matter (Image Styles, Transliteration, Filefield Paths)

• How you organize your files on the server matters

• Media vs. IMCE

18

BlocksBlocks

• DEFINITION: a container (often box-like) that displays data in some area/region of your theme/design.

• Blocks are full entities that can add Fields in D8, but need Beans to make them entities in D7.

• Default interface for managing them in D7 is not user friendly (some people plan layouts with Display Suite to make this less painful).

19

Views & RulesViews & Rules

• DEFINITION (Views): List of entities, may be shown in different ways.

• DEFINITION (Rules): workflows that occur when other events happen in the system.

• Use Tags to organize & A scan-able naming scheme

• Rules

• Re-use components when possible (example = Emails)

• Views

– Can be displayed as a block.

– Displays in SAME vs. SEPARATE views?

– Entity Reference and Views

– Views Data Export & Views Bulk Operations (D7)

20

FeaturesFeatures

• DEFINITION: Exports entities and configurations as code that can be imported into another Drupal site.

• Configuration management is in Core in D8, but Features is a crucial way of managing this in D7.

• If you use Features, there are already best practices for structuring them to avoid conflicts: https://drupal.org/project/kit

21

Questions & Answers with Y’allQuestions & Answers with Y’all