Skip to Main Content

Information Literacy Objectives & Assessment

ILOs and Assessments for the Library, Updated Spring 2022

Good Practices for Accessibility

Here are some tips to making libguides WCAG compliant.

Images

ALT TEXT

Think about if you're on the phone with someone and how you would describe images!

  • Image for fun or decoration
    • use the alt-text provided in the libguide image editor
      • provide BRIEF description of image
        • use context if it's important: "Photo of" "illustration of", "diagram of" etc ... although "image of" is never used
      • use "" to indicate null attribute and the screen reader will ignore it
        • *if you're adding alt text in the source code, use alt = “”
  • Infographics or images with lots of content
    • leave alt-text blank
    • INSTEAD, include visible text commentary that covers all the infographic content
    • OR include full-content screen-readable alt-text added in the source code 
      • Code: <div class="sr-only"> replace this text with full content </div> 

Responsive Size

  • It's best to use a smaller image, less than 1200 pixels wide (as a maximum) - easier to load on devices
    • reduce size in another program - making it smaller within libguides doesn't actually reduce size
  • For height and width, use %, not pixels. That makes the image responsive for mobile devices
    • Example: If you want the image to take up half of your box, use 50% width and height

Colors

  • Font and background color should be pretty high contrast. (In fact, as of June 2020, the GHC web developer said the default Libguides blue with the white font does not meet the newly-released standards.) 
    • GHC blue is 002B7F
    • GHC orange is E87511
    • White on GHC blue is the absolute best option, orange on blue acceptable, white on orange not good, blue on orange not good

Fonts

  • The fonts should be able to be zoomed in by 200% without adaptive technology. I think most standard fonts do this, but double check if you use the funky stuff. 8-)

Audio / Video

  • Provide an alternative for equivalent information
    • If you have an audio-only clip (like a podcast) there should be a visible full-text transcription
    • If you have a video-only clip there should be an audio track or a screen-readable full text transcription (either coded or visible)
    • If you have an audio/video clip (like most of our content) there should be captioning or a transcript
  • Responsive size for Embedded Video
    • YouTube embed code is not responsive. We've added some custom code to the admin side, and to make a youtube video responsive you need to put a "wrapper" around the YouTube code which will go out and "grab" that admin code we added.
      • How to add the code:
        • Copy your code in YouTube and paste it in the embed code are for the libguide box
        • In FRONT of that code, paste: 

          <div class="youtube-container" style="max-width:560px;"> <div class="youtube-responsive-container">

        • AFTER the Youtube embed code, paste:    </div>  </div>

           

Good Practices for Copyright

Images

  • Image found online
    • locate the original source, when possible
    • include CC license, or Copyright notice
      • (this can be in tiny font below the image!)
  • Image you create
    • best to add "created by" notice if you want to claim full copyright
    • add CC license, if desired
  • Image you adapt
    • attribute original image based on their license
      • Even if it's CC-0 (Public domain) it's good to note where you got it in case someone else finds your guide and wants to use it - they know it's public domain and not yours)
    • if original image CC license is SA, you must use same license
      • Example: "Cat Sleeping" by Susanna Smith, CC-BY-SA. Image adapted from dudeface<link>
    • Images where copyright isn't known
      • If you can, find a substitute.
      • If you absolutely must use it, cite it as above.
©2023 Georgia Highlands College | ask@highlands.libanswers.com