SlideShare a Scribd company logo
1 of 32
Setting Your Style
Creating a Style Guide to
Empower Your Organization
Chad Haefele
Interim Head of User Experience
Sarah Arnold
Instructional Technology Librarian
Types of style guides
● Editorial
● Specifications
● Toolkits
Editorial
● Word Lists
● Formatting
● Language choices
● See also: MLA, Chicago, etc.
Editorial
Specifications
● Technical
● Self-enforcing
● Easy to validate
Toolkits
● Building Blocks
● Mix of code and
other resources
● Can be brand
guidelines
Toolkits
● Building Blocks
● Mix of code and
other resources
● Can be brand
guidelines
Material Design
material.google.com
AP Stylebook
apstylebook.com
HTML5
w3.org/TR/html5/
Bootstrap
getbootstrap.com/
MailChimp
styleguide.mailchimp.com
ux.mailchimp.com/patterns
Gov.uk
gov.uk/guidance/style-guide
govuk-elements.herokuapp.com
Apple’s ID Guidelines
Identity.unc.edu
U of Illinois Library
publish.illinois.edu/libraryweb/content-style-guide/
U of Virginia Library
styleguide.library.virginia.edu
Ours
Planning Process
● There’s a problem
○ Annual content audit processes for
LibGuides and Wordpress site
○ Inconsistency and uncertainty
● First steps
○ Research and examples
○ Developed principles and sections
○ Working meetings with UX and
Communications Department
Photo: Jolene Thompson
What to Consider
● Type of style guide that
works best
● Institutional goals and
priorities
● Strategic plan and/or
mission
More Planning
● Edit, edit, edit
○ Feedback and adjustments
○ Putting our guidelines to work
● Principles and goals
○ Focus on user needs
○ Voice and Tone
● Broad versus exhaustive
○ Accessibility standards
○ Keep in mind what already
exists
More to Consider
● Does a guide already exist?
○ Communications Department
○ Publicity or Print style guide
○ Other platforms
What We Learned
● It’s not a style guide in the
traditional sense
○ Writing for the web approach
● Educate yourself
● Explain why it matters
● Collaboration and
communication are key
● Always a draft, never a final
version
Workshops
● Promotional and
educational
● Practice, practice, practice
● Empower library staff and
create advocates
● Collaboration gets results
Workshops
Our Current Guide
Before
After
Before
After
Questions?
Special thanks to:
Daniel Pshock
UX & Web Content Strategy Coordinator
University of Houston

More Related Content

Similar to Setting Your Style: Creating a Style Guide to Empower Your Organization

Front-end style guides - fronteers @ WHITE (30/08/12)
Front-end style guides - fronteers @ WHITE (30/08/12)Front-end style guides - fronteers @ WHITE (30/08/12)
Front-end style guides - fronteers @ WHITE (30/08/12)
Stijn Janssen
 
Search Engine Optimization - The eye-opening presentation for beginners
Search Engine Optimization - The eye-opening presentation for beginnersSearch Engine Optimization - The eye-opening presentation for beginners
Search Engine Optimization - The eye-opening presentation for beginners
Up2 Technology
 
Introduction to Webdev2
Introduction to Webdev2Introduction to Webdev2
Introduction to Webdev2
ayehl612
 

Similar to Setting Your Style: Creating a Style Guide to Empower Your Organization (20)

Content hustle. How to build a strategy and grow a blog
Content hustle. How to build a strategy and grow a blogContent hustle. How to build a strategy and grow a blog
Content hustle. How to build a strategy and grow a blog
 
Front-end style guides - fronteers @ WHITE (30/08/12)
Front-end style guides - fronteers @ WHITE (30/08/12)Front-end style guides - fronteers @ WHITE (30/08/12)
Front-end style guides - fronteers @ WHITE (30/08/12)
 
Improving Accessibility for Higher Education
Improving Accessibility for Higher EducationImproving Accessibility for Higher Education
Improving Accessibility for Higher Education
 
SLD OHI TBI OI Curriculum
SLD OHI TBI OI CurriculumSLD OHI TBI OI Curriculum
SLD OHI TBI OI Curriculum
 
404 Pages are inevitable so make the most out of it.
404 Pages are inevitable so make the most out of it.404 Pages are inevitable so make the most out of it.
404 Pages are inevitable so make the most out of it.
 
BITM3730 8-29.pptx
BITM3730 8-29.pptxBITM3730 8-29.pptx
BITM3730 8-29.pptx
 
BITM3730 8-29.pptx
BITM3730 8-29.pptxBITM3730 8-29.pptx
BITM3730 8-29.pptx
 
BITM3730 8-30.pptx
BITM3730 8-30.pptxBITM3730 8-30.pptx
BITM3730 8-30.pptx
 
BITM3730 8-30.pptx
BITM3730 8-30.pptxBITM3730 8-30.pptx
BITM3730 8-30.pptx
 
Search Engine Optimization - The eye-opening presentation for beginners
Search Engine Optimization - The eye-opening presentation for beginnersSearch Engine Optimization - The eye-opening presentation for beginners
Search Engine Optimization - The eye-opening presentation for beginners
 
Introduction to Webdev2
Introduction to Webdev2Introduction to Webdev2
Introduction to Webdev2
 
Enforcing Style Guide Rules for Technical Documents
Enforcing Style Guide Rules for Technical DocumentsEnforcing Style Guide Rules for Technical Documents
Enforcing Style Guide Rules for Technical Documents
 
Style guide tools - May 2015
Style guide tools - May 2015Style guide tools - May 2015
Style guide tools - May 2015
 
How to Get Started with a Cross Functional Approach to Content Management - T...
How to Get Started with a Cross Functional Approach to Content Management - T...How to Get Started with a Cross Functional Approach to Content Management - T...
How to Get Started with a Cross Functional Approach to Content Management - T...
 
You Should Really Have an Online Portfolio
You Should Really Have an Online PortfolioYou Should Really Have an Online Portfolio
You Should Really Have an Online Portfolio
 
Web development | Derin Dolen
Web development | Derin Dolen Web development | Derin Dolen
Web development | Derin Dolen
 
Successful Single-Source Content Development
Successful Single-Source Content Development Successful Single-Source Content Development
Successful Single-Source Content Development
 
Kickstarting career as an Android developer.pdf
Kickstarting career as an Android developer.pdfKickstarting career as an Android developer.pdf
Kickstarting career as an Android developer.pdf
 
Go Brand Yourself!
Go Brand Yourself!Go Brand Yourself!
Go Brand Yourself!
 
NHSPUG April 2017 - We Need to Talk: How to Converse with Regular People Abou...
NHSPUG April 2017 - We Need to Talk: How to Converse with Regular People Abou...NHSPUG April 2017 - We Need to Talk: How to Converse with Regular People Abou...
NHSPUG April 2017 - We Need to Talk: How to Converse with Regular People Abou...
 

More from Sarah Joy Arnold

Test Fest: Catching up on Your Usability Testing Backlog
Test Fest: Catching up on Your Usability Testing BacklogTest Fest: Catching up on Your Usability Testing Backlog
Test Fest: Catching up on Your Usability Testing Backlog
Sarah Joy Arnold
 

More from Sarah Joy Arnold (11)

Test Fest and the Tale of Too Many Post-its
Test Fest and the Tale of Too Many Post-itsTest Fest and the Tale of Too Many Post-its
Test Fest and the Tale of Too Many Post-its
 
How to Handle a Whole Lot of Content: A Case Study of What We've Learned
How to Handle a Whole Lot of Content: A Case Study of What We've LearnedHow to Handle a Whole Lot of Content: A Case Study of What We've Learned
How to Handle a Whole Lot of Content: A Case Study of What We've Learned
 
Post-it Up: Qualitative Data Analysis of a Test Fest
Post-it Up: Qualitative Data Analysis of a Test FestPost-it Up: Qualitative Data Analysis of a Test Fest
Post-it Up: Qualitative Data Analysis of a Test Fest
 
Test Fest: Catching up on Your Usability Testing Backlog
Test Fest: Catching up on Your Usability Testing BacklogTest Fest: Catching up on Your Usability Testing Backlog
Test Fest: Catching up on Your Usability Testing Backlog
 
Test Fest and the Tale of Too Many Post-its
Test Fest and the Tale of Too Many Post-itsTest Fest and the Tale of Too Many Post-its
Test Fest and the Tale of Too Many Post-its
 
Tear Down This Wall! Removing Boundaries to Create an Accessible Website
Tear Down This Wall! Removing Boundaries to Create an Accessible WebsiteTear Down This Wall! Removing Boundaries to Create an Accessible Website
Tear Down This Wall! Removing Boundaries to Create an Accessible Website
 
Maximizing New Tools
Maximizing New ToolsMaximizing New Tools
Maximizing New Tools
 
Advocating for usability: When, why, and how to improve user experiences
Advocating for usability: When, why, and how to improve user experiencesAdvocating for usability: When, why, and how to improve user experiences
Advocating for usability: When, why, and how to improve user experiences
 
Top Technology Trends 2015: User Experience and Usability in Academic Libraries
Top Technology Trends 2015: User Experience and Usability in Academic LibrariesTop Technology Trends 2015: User Experience and Usability in Academic Libraries
Top Technology Trends 2015: User Experience and Usability in Academic Libraries
 
Quick Searching at the Library: A usability study on combining web scale disc...
Quick Searching at the Library: A usability study on combining web scale disc...Quick Searching at the Library: A usability study on combining web scale disc...
Quick Searching at the Library: A usability study on combining web scale disc...
 
Straight from the user's mouth: Usability testing UNC's LibGuides
Straight from the user's mouth: Usability testing UNC's LibGuidesStraight from the user's mouth: Usability testing UNC's LibGuides
Straight from the user's mouth: Usability testing UNC's LibGuides
 

Recently uploaded

Salient Features of India constitution especially power and functions
Salient Features of India constitution especially power and functionsSalient Features of India constitution especially power and functions
Salient Features of India constitution especially power and functions
KarakKing
 
1029-Danh muc Sach Giao Khoa khoi 6.pdf
1029-Danh muc Sach Giao Khoa khoi  6.pdf1029-Danh muc Sach Giao Khoa khoi  6.pdf
1029-Danh muc Sach Giao Khoa khoi 6.pdf
QucHHunhnh
 
Spellings Wk 3 English CAPS CARES Please Practise
Spellings Wk 3 English CAPS CARES Please PractiseSpellings Wk 3 English CAPS CARES Please Practise
Spellings Wk 3 English CAPS CARES Please Practise
AnaAcapella
 

Recently uploaded (20)

How to Create and Manage Wizard in Odoo 17
How to Create and Manage Wizard in Odoo 17How to Create and Manage Wizard in Odoo 17
How to Create and Manage Wizard in Odoo 17
 
UGC NET Paper 1 Mathematical Reasoning & Aptitude.pdf
UGC NET Paper 1 Mathematical Reasoning & Aptitude.pdfUGC NET Paper 1 Mathematical Reasoning & Aptitude.pdf
UGC NET Paper 1 Mathematical Reasoning & Aptitude.pdf
 
SKILL OF INTRODUCING THE LESSON MICRO SKILLS.pptx
SKILL OF INTRODUCING THE LESSON MICRO SKILLS.pptxSKILL OF INTRODUCING THE LESSON MICRO SKILLS.pptx
SKILL OF INTRODUCING THE LESSON MICRO SKILLS.pptx
 
Unit-IV- Pharma. Marketing Channels.pptx
Unit-IV- Pharma. Marketing Channels.pptxUnit-IV- Pharma. Marketing Channels.pptx
Unit-IV- Pharma. Marketing Channels.pptx
 
Mixin Classes in Odoo 17 How to Extend Models Using Mixin Classes
Mixin Classes in Odoo 17  How to Extend Models Using Mixin ClassesMixin Classes in Odoo 17  How to Extend Models Using Mixin Classes
Mixin Classes in Odoo 17 How to Extend Models Using Mixin Classes
 
Salient Features of India constitution especially power and functions
Salient Features of India constitution especially power and functionsSalient Features of India constitution especially power and functions
Salient Features of India constitution especially power and functions
 
Spatium Project Simulation student brief
Spatium Project Simulation student briefSpatium Project Simulation student brief
Spatium Project Simulation student brief
 
TỔNG ÔN TẬP THI VÀO LỚP 10 MÔN TIẾNG ANH NĂM HỌC 2023 - 2024 CÓ ĐÁP ÁN (NGỮ Â...
TỔNG ÔN TẬP THI VÀO LỚP 10 MÔN TIẾNG ANH NĂM HỌC 2023 - 2024 CÓ ĐÁP ÁN (NGỮ Â...TỔNG ÔN TẬP THI VÀO LỚP 10 MÔN TIẾNG ANH NĂM HỌC 2023 - 2024 CÓ ĐÁP ÁN (NGỮ Â...
TỔNG ÔN TẬP THI VÀO LỚP 10 MÔN TIẾNG ANH NĂM HỌC 2023 - 2024 CÓ ĐÁP ÁN (NGỮ Â...
 
Basic Civil Engineering first year Notes- Chapter 4 Building.pptx
Basic Civil Engineering first year Notes- Chapter 4 Building.pptxBasic Civil Engineering first year Notes- Chapter 4 Building.pptx
Basic Civil Engineering first year Notes- Chapter 4 Building.pptx
 
Towards a code of practice for AI in AT.pptx
Towards a code of practice for AI in AT.pptxTowards a code of practice for AI in AT.pptx
Towards a code of practice for AI in AT.pptx
 
Unit-V; Pricing (Pharma Marketing Management).pptx
Unit-V; Pricing (Pharma Marketing Management).pptxUnit-V; Pricing (Pharma Marketing Management).pptx
Unit-V; Pricing (Pharma Marketing Management).pptx
 
SOC 101 Demonstration of Learning Presentation
SOC 101 Demonstration of Learning PresentationSOC 101 Demonstration of Learning Presentation
SOC 101 Demonstration of Learning Presentation
 
ComPTIA Overview | Comptia Security+ Book SY0-701
ComPTIA Overview | Comptia Security+ Book SY0-701ComPTIA Overview | Comptia Security+ Book SY0-701
ComPTIA Overview | Comptia Security+ Book SY0-701
 
On National Teacher Day, meet the 2024-25 Kenan Fellows
On National Teacher Day, meet the 2024-25 Kenan FellowsOn National Teacher Day, meet the 2024-25 Kenan Fellows
On National Teacher Day, meet the 2024-25 Kenan Fellows
 
Understanding Accommodations and Modifications
Understanding  Accommodations and ModificationsUnderstanding  Accommodations and Modifications
Understanding Accommodations and Modifications
 
1029-Danh muc Sach Giao Khoa khoi 6.pdf
1029-Danh muc Sach Giao Khoa khoi  6.pdf1029-Danh muc Sach Giao Khoa khoi  6.pdf
1029-Danh muc Sach Giao Khoa khoi 6.pdf
 
Graduate Outcomes Presentation Slides - English
Graduate Outcomes Presentation Slides - EnglishGraduate Outcomes Presentation Slides - English
Graduate Outcomes Presentation Slides - English
 
Spellings Wk 3 English CAPS CARES Please Practise
Spellings Wk 3 English CAPS CARES Please PractiseSpellings Wk 3 English CAPS CARES Please Practise
Spellings Wk 3 English CAPS CARES Please Practise
 
Mehran University Newsletter Vol-X, Issue-I, 2024
Mehran University Newsletter Vol-X, Issue-I, 2024Mehran University Newsletter Vol-X, Issue-I, 2024
Mehran University Newsletter Vol-X, Issue-I, 2024
 
FSB Advising Checklist - Orientation 2024
FSB Advising Checklist - Orientation 2024FSB Advising Checklist - Orientation 2024
FSB Advising Checklist - Orientation 2024
 

Setting Your Style: Creating a Style Guide to Empower Your Organization

Editor's Notes

  1. False pretenses - what we ended up with isn’t a simple “style guide”. That’s because the term “style guide” is really a broad umbrella. We looked at lots of them in our processes. An element of content strategy - useful, usable, findable Missing component of our regular content audit process
  2. Refworks has untold thousands of them. I don’t want to add another one to that mess.
  3. We already had this a little bit, from Library Communications office. We didn’t want/need to re-invent the wheel here. Automated checker? Was primarily aimed at print publications, but we used it de facto for the web too.
  4. This didn’t make sense for us either, we purposely don’t let most of our content owners have direct code access.
  5. “A living document”
  6. More context given than something like HTML5, so slightly editorial
  7. “This section is non-normative”
  8. Very editorial, despite having a very short “word list” https://ux.mailchimp.com/patterns has lots of code snippets
  9. Has guidelines for how to create alpha and beta labels
  10. Don’t use a trademark next to an Apple logo
  11. “Do not use strobing content”
  12. Largely brand guidelines, but there is a section on writing for the web
  13. Separate annual content audits Wordpress/main site approach from “does this page need to exist?” to in recent years more specific questions Is the content of this page accurate and up to date? Is the page written in plain language, avoiding library jargon? Is the page located in a logical place within the site navigation? LibGuides process asked librarians to fix broken links and determine if a page should still exist based on usage stats Neither had process in place to report back General inconsistency and uncertainty among content creators/staff > some responded, some didn’t First steps Daniel began the process of researching and looking to other style guide examples Working meetings to develop principles and sections Brought Communications department on board early for buy-in and support
  14. Type of style guide as Chad has reviewed Goal and priorities of your institution Is there a strategic plan? Is there a mission statement? At UNC we were working through our 5-year strategic plan: (click) Read Vision: “We aspire to be a leader among academic research libraries in meeting users’ evolving knowledge-creation and knowledge management needs. Building on a foundation of library excellence at the nation’s first public university, we will define and integrate new library roles, practices, partnerships, and technologies in achieving this vision.” + principles include… Identifying users’ needs Promoting and encouraging intelligent risk-taking Develop and employ staff expertise to create a cohesive, team-based culture that meets users’ needs Not only empower staff, but it will help get buy-in because you’ve aligned it to the goals
  15. Once we developed our central principles and sections, we continued editing and reviewing the guide Rewrote to actually follow our own guidelines > positive and plain language, active voice First principle was to focus on user needs and went from there Determined the voice and tone of the library Challenging because each of our libraries is different (Wilson vs. Undergrad) Voice = personality, what distinguishes us from other libraries/institutions Tone = mood or feeling, determined by context Moved away from nitty gritty specifics to broad guidelines that could be interpreted in different ways depending on the situation We also baked in our LibGuides guidelines in addition to main Wordpress site since there’s a lot of overlap between content creators on both platforms
  16. Initially we were writing a style guide, at least that’s what we called it But we also had an already well-used In-house style guide and publicity toolkit created and maintained by the Communications department We wanted out guide to work hand-in-hand with these rather than recreating them In-house style guide = specific language and terms to use in both print and online publications Publicity toolkit = details on logos and print templates like library letterhead
  17. It’s not a style guide > it’s writing for the web Defines content, voice and tone, plain language, and other general ideas to follow No need to confuse staff when you want to bring them on board with you Called “Creating Effective UNC Library Web Content” Educate yourself > research and look at other examples Communications Director suggested we add a purpose to give content creators an idea of why this document matters and how it fits in with their work Collaborate with each other, Communications, and content creators Share it and create an open discussion around it Always a draft > this is one of our principles Always be iterating Web best practices will change, platforms will change, users will change You want this document to be malleable
  18. Empower staff and gain more supporters to promote your goals and help improve the content of your site
  19. Course page/LibGuide: http://guides.lib.unc.edu/aaad298 (Sarah) LibGuides example from workshops Subject expertise is key