Skip to main content

Home/ Web Accessibility/ Group items tagged using

Rss Feed Group items tagged

Vernon Fowler

How To Force Subtitles In An Embedded YouTube Video - 0 views

  • To enable subtitles by default, you will need to use &cc_load_policy=1 parameter
  • 3. Linking to Videos with Captions If you want to share a link to the video for viewers to see captions by default, you need to add this code at the end of the URL string: &yt:cc=on
  • &yt:cc=on
    • Vernon Fowler
       
      If there aren't any existing URL parameters, instead of appending &yt:cc=on you may need to use /?yt:cc=on For example https://youtu.be/GUfCPMCMORM/?yt:cc=on
Vernon Fowler

Using ARIA - 0 views

  • aria-describedby with single or multiple id references
  • aria-label and aria-labelledby have similar behaviour in screen readers and the Accessibility API, but aria-label should be reserved for when there is no visible text on the page to reference or when keeping track of id values would be too difficult.
Vernon Fowler

How do you figure? | scottohara.me - 0 views

  •  
    A figure can be used with or without a figcaption. However, without a caption, or an alternate means of providing an accessible name (e.g. aria-label) a figure may not provide much value in conveying its semantics alone. In some cases, it may not convey any semantics at all if its given no accessible name.
Vernon Fowler

Links that don't go anywhere should be buttons | Christian Heilmann - 0 views

  • there is no point in confusing your users with a link that goes nowhere and won’t open anything in another tab. Use a button and you won’t promise any functionality you don’t have.
  • links keep getting used for functionality that doesn’t go anywhere on the web or in the document
Vernon Fowler

WebAIM: Usable and Accessible Form Validation and Error Recovery - 0 views

  • Errors on top
  • As one would guess, the "Errors on top" approach causes the error message to appear before the form. When presented, focus should generally be set directly to this error message. This allows screen reader and keyboard users to immediately access the error message without having to find it amongst the rest of the page contents. The message should also be visually apparent. Focus can be set to the message with client-side scripting using JavaScript focus() or similar, or the server-generated page can include an anchor name in the URI (e.g., http://myserver.com/form.php#errormessage) which will set focus directly to a named anchor or element id located at the beginning of the feedback message.
  • also helpful to inform the user as to the number of errors that were detected
  • ...2 more annotations...
  • provide a link within the error message that will set focus to the appropriate form control
  • Regardless of the mechanism used to identify and recover from form errors, aria-invalid="true" should generally be set on each invalid form control. This attribute causes screen readers to identify the control as being "invalid" or in need of attention.
Vernon Fowler

Data show small improvements in accessibility of course materials - 0 views

  •  
    But new data from Blackboard show that the most common types of course content that students use on a daily basis -- images, PDFs, presentations and other documents -- continue to be riddled with accessibility issues. And while colleges have made some slight improvements over the last five years, the issues are widespread.
Vernon Fowler

Don't Rely on Default Browser Error Messages - Intopia - 0 views

  • Another issue is that the messages are temporary. As soon as you put focus on the input with mouse, keyboard or touch, the message disappears. People with cognitive impairments will find it difficult to use these, and I think anyone trying to fill in the form while they’re distracted will have trouble as well. People who rely on the keyboard for navigation (which includes both sighted users and screen reader users) will also lose these messages as they move around the form.
  • If you’re confident of your error messages, you can remove the browser validation by adding the novalidate attribute to the wrapping form element, like this: <form novalidate>...</form>
  • You can style this with CSS, using the :valid and :invalid pseudo-classes
  • ...2 more annotations...
  • Only the first error is noted with a message.
  • The rest rely on a change of border colour, which is, again, not evident to screen reader users.
  •  
    "When I found out the major browsers were beginning to include error validation into their support for forms, I was pretty excited. Form validation is always a fiddly part of accessibility, so I'm always looking out for ways to make it easier for developers to do properly. I read MDN's form data validation tutorial and a CSS Tricks article on client-side form validation and immediately made some test forms. Sadly, I was disappointed with the results. The default error validation in browsers is almost completely inaccessible. I was hoping we'd get default "you've forgotten to fill this in" messages that could be customised. I might have been a bit too optimistic! Validation at the browser level has many of the same issues we find at the website level."
Vernon Fowler

Validation messages - 0 views

  • If there are any validation messages, the focus is set to the first invalid input: this way, a screen reader will immediately announce the associated message, so the user knows that there is at least one invalid input to be fixed.
  • For multiple radio buttons or checkboxes, the message is associated to the surrounding <fieldset>.
  • In addition to this, each invalid input is associated to its message using aria-describedby. This is important, as it makes sure that screen readers also announce the messages when navigating through the inputs using the Tab key.
  •  
    "Data submitted in a form is usually validated in some way. And if there is any unacceptable data, the form is traditionally re-displayed, together with validation messages. In such a case, it is important to immediately inform screen reader users, so they know that they have to look at their data and submit again. "
Vernon Fowler

Introduction to Understanding WCAG 2.0 | Understanding WCAG 2.0 - 0 views

  • Perceivable - Information and user interface components must be presentable to users in ways they can perceive.This means that users must be able to perceive the information being presented (it can't be invisible to all of their senses)Operable - User interface components and navigation must be operable.This means that users must be able to operate the interface (the interface cannot require interaction that a user cannot perform)
  • users must be able to understand the information as well as the operation of the user interface
  • robust enough that it can be interpreted reliably by a wide variety of user agents, including assistive technologies
  •  
    "The guidelines and Success Criteria are organized around the following four principles, which lay the foundation necessary for anyone to access and use Web content."
timothy999

Digital transformation - 3 views

Digital transformation can be a complex process, but Docufree has been an invaluable partner in my organization's journey. It has to be noted that docufree customer service team https://www.pissedc...

development resources

Vernon Fowler

Hiding Content for Accessibility - Snook.ca - 0 views

  • This clip technique is also what's provided in the .visuallyhidden helper class in HTML5 Boilerplate.
  • We've only begun using and testing this technique, so even this may not be perfect. Any feedback and suggestions are quite welcome.
Vernon Fowler

Examples of 'skip links' on some bank sites | The Paciello Group Blog - 0 views

  • Currently browsers do not support keyboard navigation via landmark roles, so for keyboard users who do not also use assistive tech, a visible skip link is needed.
Felipp Crawly

Thank You Onward Process! - 1 views

started by Felipp Crawly on 28 Jan 13 no follow-up yet
Justin Pierce

The Best Bookkeeping Service - 1 views

started by Justin Pierce on 27 Jan 13 no follow-up yet
Vernon Fowler

On Alt Text ∙ An A List Apart Blog Post - 0 views

  • Any web designer or developer with her heart in the right place knows that, to be accessible, every image requires an alt text. Except when it doesn’t.
  • In this case, then, it is better to use the null alt (alt=”“), and that is what we did in the A List Apart redesign.
Vernon Fowler

Free Web Accessibility Software Suite | Deque FireEyes - 0 views

  • FireEyes is offered free of charge from the makers of WorldSpace Sync, the most powerful accessibility software suite available. FireEyes is for individual, non-commercial use, and provides developers and QA testers the ability to check pages for accessibility issues, and provides help and support to solve the issues.
Vernon Fowler

Complex Data Table Markup Toolbar - 0 views

  • Please note that simple data tables are more accessible than complex data tables and that badly structured or marked up complex tables are not accessible.
  • Simple tables rather than complex tables should be implemented whenever possible, and when complex tables are used, please ensure that structure and mark-up is sound.
Vernon Fowler

WebAIM: Creating Accessible Tables - Data Tables - 0 views

  • Another way to associate data cells and headers is to use the headers and id attributes. This method is NOT generally recommended because scope is usually sufficient for most tables, even if if the table is complex with multiple levels of headers.
  •  
    " scope="row""
« First ‹ Previous 61 - 80 of 121 Next › Last »
Showing 20 items per page