IA Summit 2015 presentation
Audio available via IA Summit Library: http://library.iasummit.org/speakers/lacey-kruger/
With the rise of responsive design, a content model and a CMS are necessities for any content-rich web presence. Once you’ve designed the front-end user experience, it’s important to consider the content structure that will support your design. Content models define:
the underlying structure of each type of content
the user experience for content authors and editors within the CMS
Luckily, designing a content model is a natural extension of IA for a front-end user experience. In this talk, we'll get into the details of HOW to content model. We'll dissect the content model for a single content type for a nonprofit website. The goals for this content model were:
to be adaptive and portable for any device or context
to contain a lot of content, yet display it in a simple way
a successful user experience for administrators creating and editing the content
a delightful user experience for end users of the content
In content modeling, there are often multiple approaches you could take so I’ll also cover the alternate models we explored and describe the process that led us to our end result.
Session Takeaways
Define a content model
Evaluate a content item and create a content model based on that item
Learn best practices for adaptive content models
2. What is a Content Model?
• A document defining the structureof each content type
and the user experience for content authors and
editors within a CMS
9. Background
Website Redesign for National Military Family Association
• Moved to a new CMS
• Responsive Design
• Client responsible for developing Sitemap
22. The Challenges
1. 4,000 character (~500 word) limit on Rich Text fields
2. Request to add 2 additional sections
3. Ability to insert Videos
4. Tabs within Tabs (yikes!)
5. Page with 8 Tabs
23. The Result
The feedback from our staff, volunteers, and users has been
great. It definitely was a learning curve the first week, but
overall has been a major improvement to the organization of
our content.
-NMFA Web Team
“
25. Want More?
• Karen McGrane
– Presentations:
• Adapting Ourselves to Adaptive Content
• Content Strategy for Mobile
– Book: Content Strategy for Mobile
• Sara Wachter-Boettcher
– Book: Content Everywhere
Hinweis der Redaktion
Today I want you to learn HOW to content model
Preserves integrity of your design
Minimizes risk of client mucking up the website
Preserves integrity of your design
Minimizes risk of client mucking up the website
WYSIWYG editors are great for desktop website publishing
When you use a WYSIWYG for an entire page, all of your content is contained in a single “field”
Content modeling chunks the content
Each piece of data resides in a separate field
Gives us more control over the display for tablet and mobile
Today I want you to learn HOW to content model
NMFA fights for benefits and programs that strengthen and protect Uniformed Services families and reflect the Nation’s respect for their service.
comprehensive child care
accessible health care
spouse employment options
Project started with Stakeholder and User Research
We developed wireframes based on research and the client-provided sitemap
Even through wireframing, I was thinking ahead to the content model
Limiting options for individual section layouts would be key to streamline build and authoring
The first solution we discussed was to have 3 content types to support this design
Grandparent would be the whole Health Care page
Parent would be each tab
Child would be each section within each tab
The alternative solution we discussed was to have 2 content types
Parent would be the whole Health Care page
Child would be all of the content in each tab
Today I want you to learn HOW to content model
These are screenshots from my content model deliverable
This document is used by the web developers to build the CMS
Also used to vet requirements with the client and get approval before build begins
Screenshots from the authoring form in our proprietary CMS
You could achieve this in any CMS that allows you to customize authoring forms (i.e. Drupal)