Formatting ADA

  • This is Title
    This is Subtitle:

     

    This is the paragraph content with information for the enduser. You will need a hard break (extra return) to show spaces between paragraphs.

     

    Use the F and T to set other "styles". District pages should use:

    • App Title as "Page Name" (if multiple apps set each app to show name if desired)
    • Main Header = Title from Template Styles (F)
    • Sub Header = Subtitle for Template Styles (F)
    • Main information = normal typing in <p>, no settings required

     

    Other information:

    • Headings allow screen readers to ID titles, etc
    • If you use other template style titles within lists/etc it will not offset that text but the screen reader will READ THAT AS A TITLE
    • If you use other template style headers within lists/etc it will offset that text and the screen reader will READ THAT AS A HEADER
    • Need to use Alt Text/Title/Tooltip for ADA compliance
    • Alt text for images should explain the context of the image and why it adds to your page.
      • Alt text should include target window behaviors
      • Alt text should include any words contained in the image
    • Longer link text is for coordination and contrast - make the link describe where it is taking you
    • Contrast is important - colors need to be different enough for visual differentiation
    • Left align is best for ADA. Justify is bad.
    • Tables are not good for ADA. Should be used to present data only. Also bad for responsive design
    • No background color
    • Keep text color very visible - so it doesn't blend into white page
    • Can also create content in word, using headers.
    • Save PDF as a tagged PDF for headers to be recognized. Yammer post here - https://www.yammer.com/matsuk12.us/#/Threads/show?threadId=979740983&search_origin=global&scoring=linear1Y-prankie-group-private-higher&match=any-exact&search_sort=relevance&page=1&search=adobe
    • Create page with text+audio with and without title/image text, title/etc
    • Check third party apps (smore, etc) for ADA

     

    MAIN ADA ISSUES - These are things we should concentrate on

    • Headers
    • Alt Text,Titles,etc
    • Plain writing with average readability
    • Tagged PDFs

Blackboard Training: WCM and Parentlink

  • HELP resources

     

    ADA resources at https://sw00000004.schoolwires.net/Page/3702

    • Screen reader tool
    • Color Contrast tool

     

    Join Yammer - send this to anyone who needs to be in the group.

     

    Megamenu for schools - Channel navigation like the district site, hover over the channel name and you can categorize up to 5 lists of like content. If you want to do this at school we can assist you.

    District Megamenu

     

    100px = about an inch

    • pages with left navigation are about 600px
    • pages with no left navigation are about 900px

     

    COPE = Create Once Publish Everywhere -Yammer conversation and how-to for the COPE process is here: https://www.yammer.com/matsuk12.us/#/Threads/show?threadId=996615389&search_origin=global&scoring=linear1Y-prankie-group-private-higher&match=any-exact&search_sort=relevance&page=1&search=cope

     

    • Uses connection between Blackboard Mass Notification, Mobile App, Website (WCM) and Facebook to enter info in one place and send to any/all of these, particularly useful for weather notices:
    • Mass Notification to student/parent - email, phone, Text/SMS
    • Push Notification on District Mobile App
    • School Facebook Page
    • Website announcement on school homepage
    • Onscreen alert popup on school homepage.

     

     

    APPS/LAYOUTS & NEW EDITING EXPERIENCE HINTS

    • It is easy to Right Click on images and links for more choices (be in the link, don't highlight it).
    • Hover on tables to get more choices like delete/add row/column, etc.
    • Content - basic text app
      • Use F&T for Headers so screen readers can identify categories (ADA).  See more on ADA below.
      • Use Clear Formatting icon if everything is wonky
      • Paste as text - use to remove formatting from original source (word doc or other webpage, etc)
      • No plain returns or the style (header/lists) will follow.
        • You can force a plain return by clicking Shift + Enter together. No space between lines and it will continue style.
        • You can always use the Clear Formatting to remove the style from the second line.
      • Add content then choose style. Examples here: https://www.matsuk12.us/Page/38288
        • F=District types - These seem to work better. 
        • T=Template types
      • Once Header type is picked you can then change formatting using the feather size change
      • See what your header is by putting curser in the text and seeing tag at bottom.
    • Image App (or image insert)
      • Image align - default will not wrap, it'll be new line. Left and Right will wrap the text around your image. This is true with any image insert wizard.
      • Border with white at about 10 px for white space. Your preference...
    • Google Folder App - can display Google Folders
    • Embed Code (not necessarily responsive as it is based on the app you are embedding, i.e. Google Map. You can change the iFrame dimensions)
    • Table App - only use for data due to ADA compliance. See more below
    • Homework options
      • Blog
      • Article Library
      • Homework app
    • Minibase
      • Staff Photo Directory = No purge, merges unique system ID. Adds new records, deletes absent one.
    • Layouts - use 3 wide instead of table

TEMPLATE STYLES (Under F)

  • TEMPLATE STYLES (F)  

    F Headers ADA

    Header1

    Header2

    Header3

    Header4

    Header5

    Header6

    Title

    Subtitle

     

    HEADER STYLES (T)

    T Headers ADA  

    Title (H1)

    Sub-Title(H2)

    Heading (H3)

    Sub-Heading(H4)

Microsoft Accessibility Features

 
 

Accessibility & Translator Tools