1. IANR WEB MANAGER NETWORK
Meeting 10/20/ :00am

2. Meeting Agenda IANR Web Manager Network Update – Anne Holz
Content Strategy – Anne Holz

3. Update Next meeting will be in January 2017, date TBA
UNLcms Updates: page title, promo image, image caption
Forms security update
Webaudit changes
WDN Board Nomination

4. Hide Page Title Do not hide unless necessary for the design
Update
Hide Page Title
Do not hide unless necessary for the design
<h1> element does not need to be inserted manually.

5. Update
Page Title
Hide Page Title

6. Image Frame with Caption
Update
Image Frame with Caption
San-serif font, easier to read small text

7. WDN Board Nominations 3 seats open, 2 year term
Submit nomination form on wdn.unl.edu by Nov 1, 2016
Voting Nov 8 – Dec 1
New board announced Tuesday, Dec 13
Board meets twice a month, 4-6 hours a month commitment
WDN Board Nominations

8. Why do you need a content strategy?
Keeps content unique, fresh and up- to-date
Helps content show up in search engines
Delivers content in the best format for a good user experience
Ensures a professional look and feel that is consistent with the brand
Why do you need a content strategy?

9. Who is your target audience?
Students
Educators
Community
Stakeholders
Knowing who your target audience is helps you decide which content to feature more prominently on the home page

10. What type of content would interest your audience?
Content Strategy
What type of content would interest your audience?
Degree and Program information
Research information
Stats/Awards
Tools and resources
Maps
Staff directory
How to apply
Events
Extension/Outreach
News and announcements

11. Content Strategy
Workflow

12. Get Content Identify content contributors
Determine the best way for contributors to deliver content to you ( , upload to Box, enter into UNLcms)
Communicate the best file format for content to be delivered (word doc, excel spreadsheet, text file, jpg image, PDF)
Get Content

13. Get Content Establish a publishing frequency to keep content fresh
Set dates to periodically review site content and make sure it’s up-to-date
Search IANR sites, IANR News, IANR faculty blogs and Extension Publications for related news and content you can link to
Get Content

14. Determine Where Content Should Go on the Site
Should it be featured on the Home page?
Which main section does it fall under?
Does at least one other page link to it?
Should it be in the event calendar?
Should it be on the site?
Determine Where Content Should Go on the Site

15. Text
Images
Links
Responsiveness
Accessibility
Add Content

16. When formatting text on the Web, form follows function.
Content strategy

17. Search Engine Optimization (SEO) is the process of making your site more discoverable in search engines. Search keywords are phrases someone might type in Google to find the type of content that is on your site.
Page Title
One of the most important elements for search engine optimization (SEO)
Can display in Google search results
Should contain good search keywords
Automatically displays in the URL, <title> tag and <h1> tag by default

18. Places the Title Displays
Content Strategy
Places the Title Displays
Title in Url
Breadcrumbs
Browser title
Page title
<h1>

19. Title in Google Search Results
Content Strategy
Title in Google Search Results
Title

20. Headings Organizes content into sections on the page
Important for SEO and screen readers
In the editor start with <h2>, the page title is already using <h1> and there can only be one <h1>
As you step down a level, the number gets larger, you can repeat a number but don’t skip over one
Should have non-heading text directly under them
Should Include relevant keywords when possible
Headings
The <h1> tag is generally reserved for the page title text. This is dynamically generated in UNLcms.
Start with <h2> in the UNLcms editor.
Usually display bigger and bolder than paragraph text
<h1>…<h6> where <h1> is the most important
Use heading tags only on headings and not to format text that isn’t a heading

21. Which headings are in the proper order from top to bottom?
Content Strategy
Which headings are in the proper order from top to bottom? a)
<h1>
<h2>
<h4>
<h3> b)
<h1>
<h2>
<h3> c)
<h1>
<h2>
<h3> NO NO
YES
Repeating is ok
Can not skip over 3 when going down a level
Can not have more than one <h1>

22. Colors Use accent colors only for emphasis
Content Strategy
Colors
Use accent colors only for emphasis
Avoid using link color on text that isn’t a link

23. Colors Text on a background color must have a contrast ratio of 4.5:1
Content Strategy
Colors
Text on a background color must have a contrast ratio of 4.5:1
How it might look to someone with Color-Blindness

24. Color Contrast Checker
Content Strategy
WCAG 2 AA must display YES to pass
Color Contrast Checker

25. Images should reflect the organization’s brand
Content strategy

26. Post Good Quality Images
Shoot with the highest resolution available on your camera, in a well lit area and make sure the image is in focus
Collect and sort through photos taken in the field or at an event
Buy photos from Ucomm
Avoid scaling an image to make it larger (it can make it blurry or cause jagged edges)
Post Good Quality Images

27. Hero Image Replaces the old Promo Image code Optimized for mobile
Content Strategy
Hero Image
Replaces the old Promo Image code
Optimized for mobile
1600 x 900px recommended size
Avoid using images that have text embedded in them, use HTML text instead
Hero Code

28. Image name should be descriptive words separated by hyphens (not spaces %20)
Photos usually work best saved as a .jpg with a Photoshop compression quality of 60
Images inserted in the editor should be at least 350px wide
Always enter an Image Description (alt text) for screen readers
Image Best Practices
A screen reader is assistive technology that converts text to speech for people who are blind or visually impaired.

29. Alt Text in WYSIWYG Editor
Content Strategy
Alt Text in WYSIWYG Editor
Alt Text goes in the Image Description when inserting an image in the WYSIWYG editor.

30. Image Name and Alt Text Image name cattle-feedlot.jpg Alt text
Content Strategy
Image Name and Alt Text
Image name
cattle-feedlot.jpg
Alt text
Alt=“two cows in a feedlot”

31. Art is protected by copyright the moment it’s created
Art is protected by copyright the moment it’s created. Just because you find an image on the Web doesn’t mean you can use it
Ucomm provides over 4,000 icons developed by Streamline that you can download and use
The Icon Factory is a tool you can use to search the Ucomm icon library, select a size and color
Icon Factory
Icon Factory

32. Icon Factory Search by keyword or select a category
Content Strategy
Icon Factory
Search by keyword or select a category
Enter title for accessibility
Select icon
Select color
Enter link if clickable

33. Anchor text should describe the content it links to.
Content strategy

34. Include text, headings and images on the page and not just a list of links
External links should only go to authoritative sites (.gov, .edu etc.)
When possible, link descriptive anchor text instead of “click here” or URLs
Don’t duplicate content or files, link to the original source instead
Links

35. Displaying File Downloads
Content Strategy
Displaying File Downloads
Let user know clicking the link will download a file
Display the type of file (PDF, excel, word, etc.)
Display size of the file (KB, MB, etc.)

36. Content Strategy
Which anchor text (in red) is the best choice to link to
Nebraska Extension is making an incredible impact on the success of our state.
Nebraska Extension is making an incredible impact on the success of our state.
Nebraska Extension is making an incredible impact on the success of our state. Click here.

37. Answer More Accessible Better for Search Engine Optimization (SEO)
Content Strategy
Answer
a) Nebraska Extension is making an incredible impact on the success of our state.
More Accessible
Better for Search Engine Optimization (SEO)
Contains a good keyword phrase
Text is relevant to the page you’re linking to
Gives more context to the link for people who are blind and using a screen reader
Indicates to search engines that the page is relevant when someone searches for “Nebraska Extension”

38. A responsive website automatically adapts to fit the device’s screen size and orientation.
Content strategy

39. Responsive website
Content can be viewed without having to scroll horizontally
Text size is readable without having to pinch-zoom
Media (images, video…) scales to fit when screen orientation changes
Same content is available on all devices
Clickable areas are large enough for the average human finger

40. Responsive page layout
In WYSIWYG editor, select alignment “left” or “right” to wrap text around an image (enter 7-10 for vertical and horizontal space) and enter a width
Use tables for data only, not for page layout
Use grids to display content in columns
Responsive page layout
Responsive Table Generator
Responsive Table Generator
Responsive Table Generator
Responsive Table Generator
Responsive Table Generator

41. Web accessibility is a Federal requirement.
ADA – Education Information Technology Accessibility Policy in October
Content strategy

42. WEB Accessibility
An accessible website allows people with disabilities to navigate, understand and interact with the site without barriers.
It includes visual, auditory, physical, speech, cognitive, and neurological disabilities.

43. Follow Accessibility Guidelines
Proper use and ordering of headings <h1>… <h6>
Image alt text is required
Avoid images with embedded text
Text on a background color must have a color contrast ratio of 4.5:1
Video captions and titles are required
Use valid HTML5

44. Click the "QA Test" link in the footer of your UNLcms site to view errors for the page you are on
The Webaudit Report checks links, HTML and accessibility
Webaudit

45. Webaudit Page Report “notice” does not affect score Does Not Pass
“Fail” needs to be fixed
Passes

46. Webaudit Page Report Review sections with “NP” (no pass)
Review table rows that display “Fail” in the PASS/FAIL column and click “Fix” for more information
“Notices” do not affect your webaudit score
After fixing errors you can click “RESCAN THIS PAGE”
Webaudit Page Report
How to Fix Common Webaudit Errors

47. Promote Content Share on Facebook and Twitter
Link to it in an newsletter
Include a link to the site in print pieces
Ask relevant authoritative sites to link to it
Promote Content

48. Online Resources
Content strategy

49. Online resources Color Contrast Tool
Web Accessibility Image Tutorial
Icon Factory
Responsive Table Generator
UNL Media Hub (supports .mp4 video and .mp3 audio files)
Webaudit Report Strategy for Fixing Errors
Online resources

50. IANR WEB MANAGER NETWORK
Next meeting January, 2017
TBA