A Pen by tahjay

Thumbnail
This awesome code was written by -_-Tahj_B_LIT-_-, you can see more from this user in the personal repository.
You can find the original code on Codepen.io
Copyright -_-Tahj_B_LIT-_- ©

Technologies

  • HTML
  • CSS
  • JavaScript
<!DOCTYPE html>
<html lang="en" >

<head>
  <meta charset="UTF-8">
  <title>A Pen by  tahjay</title>
  
  
  
      <link rel="stylesheet" href="css/style.css">

  
</head>

<body>

  
<html>
  <head> <title> tahj </title>
    <h1> Web Accessibility </h1>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>

</head>
<body>
  
 
<div id="flip">Menu</div>
<div id="panel">Voice recognition Software</div>
  <div id="panel">Voice recognition Software</div>
  <div id="panel">Voice recognition Software</div>
  <div id="panel">Voice recognition Software</div>
 
  
  <h2>
    <ul>
      <li>Voice Recognition </li>
      <p>Mr. Jones is a reporter for an on-line journal who must submit his articles using a web-based tool (called content management system — CMS) provided by the publisher. Over his twenty-year career, Mr. Jones developed repetitive stress injury (RSI) in his hands and arms, and it has become painful for him to type.</p>
      <p>He does not use a mouse because it strains his wrists. He also cannot type for long periods of time without serious pain. After dedicated research and consultation, Mr. Jones developed an approach that allows him to continue working as a reporter. He uses:

Keyboard with ergonomical layout to relieve strain on his hands and arms
Web browser with keyboard support to use websites without a mouse
Voice recognition software to dictate passages of text rather than to type
It took him several months to become sufficiently accustomed to using voice recognition software and to be comfortable working with it for many hours at a time. It also took him a while to learn the keyboard commands built into his web browser and to use them effectively on different types of web pages.
        
        <li>
          Color Indication
        </li>
      <p> He has difficulty reading the text on many websites. When he first started using the Web, it seemed to him the text and images on a lot of websites used poor color contrast, since they appeared to use similar shades of brown. He realized that many websites were using colors that were indistinguishable to him because of his red/green color blindness. In some cases, the site instructions explained that discounted prices were indicated by red text, but all of the text looked brown to him. In other cases, the required fields on forms were indicated by red text, but again he could not tell which fields had red text.

Mr. Lee has found that he prefers websites that use sufficient color contrast, and redundant information for color. The websites accomplish this by including names of the colors of clothing as well as showing a sample of the color; by adding text cues such as an asterisk to discounted prices in addition to showing them in a different color; and by clearly indicating the required fields on the order form in addition to indicating them by color.</p>
      <li>Subtitles
      </li>
      <p>Ms. Martinez is taking several distance learning courses in physics. She is 62 years old, and has been hard of hearing since birth. She can hear some sounds but not enough to understand all speech, so she learned sign language in addition to written language.
      </p> <p>She had little trouble with the curriculum until the university upgraded their online material to a multimedia approach, using an extensive collection of audio lectures. For classroom-based lectures the university provided sign language interpreters and CART writers (professionals typing what is being said verbatim). However, for web-based instruction, they initially did not realize that accessibility was an issue, then said they had no idea how to provide the material in accessible format.

With the help of a local disability organization, Ms. Martinez was able to point out that the university was clearly covered by a policy requiring accessibility of online educational material. She was also able to point to the Web Content Accessibility Guidelines (WCAG) as a resource providing guidance on how to make websites accessible, including those with multimedia content.

The university had the audio-only lectures (no video) transcribed and made these transcripts available through their website along with audio files. For multimedia presentations that include video and audio, the university provides captioning of the audio. Ms. Martinez uses a media player that displays these captions directly below the video so that she can better understand the context of what is being said.</p>
      <li>Attention Deficit Hyperactivity Disorder (ADHD) and dyslexia</li> <p> Ms. Olsen attends middle school, and particularly likes her literature class. She has attention deficit hyperactivity disorder (ADHD) with dyslexia, and the combination leads to substantial difficulty reading. However, with recent accommodations to the curriculum she has become enthusiastic about this class.</p>
      <p>Her school recently started to use more online curricula to supplement class textbooks. She was initially worried about the reading load, since she reads slowly. She experimented with text-to-speech software that highlighted the text on the screen and read it aloud at the same time, and found that she was able to read much more easily when she could hear certain sections of it read to her, instead of struggling over every word.

When she goes onto the Web, she finds that some websites are much easier for her to use than others. Some of the web pages have a lot of graphics and illustrations that help her focus in quickly on sections she wants to read. In some cases, though, where the graphics are animated, it is very hard for her to focus and she is constantly distracted by the movement. She set her web browser to freeze or hide animated graphics so that she can focus on the relevant information but that does not always work on every website.

One of the most important things for her has been the level of accessibility of the web-based online library catalogues and the general search functions on the Web. Until recently, Ms. Olsen often needed to visit the library and to seek assistance to find the information that she needs. Today, the accessible online library catalogue of the school enables her to find the right information without any assistance.

Her teacher taught a number of different search strategies but sometimes the search options are still quite confusing for her. She finds that websites that provide error corrections and suggest alternative spellings assist her significantly. Also websites that provide multiple navigation mechanisms such as a navigation bar, a search box, a sitemap, or bread-crumb trails, are easier for her to use.</p>
      
    </ul>
  </h2>

</body>
</html>
  
  

    <script  src="js/index.js"></script>




</body>

</html>

/*Downloaded from https://www.codeseek.co/-_-Tahj_B_LIT-_-/a-pen-by-tahjay-ozJrJK */
#panel, #flip {
    padding: 5px;
    text-align: center;
    background-color: grey;
    border: solid 6px #c3c3c3;
  border-color: black
}

#panel{
    padding: 50px;
    display: none;
  
}
#panel{
    padding: 50px;
    display: none;
  text-align: left;
  
}
#color{
    padding: 50px;
    display: none;
  
}

h1 {
  color: orange;
  text-align: center;
  
}
  
body  {
    background-image: url("https://images.freecreatives.com/wp-content/uploads/2015/10/Free-Vector-Vintage-Seamless-Floral-Pattern.jpg");
}

h2 {
  Font-style: times new roman;
  font-size: 20px;
  border-style: solid;
  background-color: grey;
  margin-right: 0%;
  margin-left: 0%;
  border-radius: 20px
  
}

/*Downloaded from https://www.codeseek.co/-_-Tahj_B_LIT-_-/a-pen-by-tahjay-ozJrJK */
$(document).ready(function(){
    $("#flip").click(function(){
        $("#panel").slideToggle("slow");
    });
});

Comments