Skip to main content

Home/ Web Accessibility/ Group items tagged check

Rss Feed Group items tagged

Vernon Fowler

HTML_CodeSniffer - 0 views

  •  
    HTML_CodeSniffer is a client-side script that checks HTML source code and detects violations of a defined coding standard. HTML_CodeSniffer is written entirely in JavaScript, does not require any server-side processing and can be extended by developers to enforce custom coding standards by creating your own "sniffs". To get you started, HTML_CodeSniffer comes with standards that enforce the three conformance levels of the Web Content Accessibility Guidelines (WCAG) 2.0, and the web-related components of the U.S. "Section 508" legislation. An auditor interface is provided by a bookmarklet to let you try out these accessibility checks on any web page.
Vernon Fowler

Juicy Studio: CSS Analyser - 0 views

  •  
    "This service has been provided to allow you to check the validity of your CSS against the W3C's validation service, along with a colour contrast test, and a test to ensure that relevant sizes are specified in relative units of measurement. If the CSS is specified by a URL, it will be loaded into the text area to offer an option to make changes for testing without having to re-upload. "
Vernon Fowler

Accessibility Not-Checklist | Brewed by team Intopia - 0 views

  •  
    ICYMI: As a part of #GAAD, we launched an Accessibility Not-Checklist. It's a resource that will help any person work towards an accessible and inclusive digital user experience, no matter your level of accessibility knowledge. Check it out: https://t.co/
Vernon Fowler

WebAIM: Creating Accessible Forms - Screen Reader Form Accessibility - 0 views

  • This can be solved by associating form labels to form items on the page. The label should almost always be located adjacent to the form item itself. When a screen reader accesses a form item that has a <label> element associated with it, it will read the text within the <label> element and indicate the type of form item it is (e.g., "First Name. Text box" or "Age. Check box"). Labels are needed for all form elements, except for buttons; the screen reader reads the text that is on the button (e.g., "Submit button").
  • Let's hear what the form sounds like to a screen reader:
  • Let's hear what the form sounds like now, with the improvements that we made:
Vernon Fowler

Customizing the Read More « WordPress Codex - 0 views

  • To customize this text, add the following code to your functions.php file.
  • If you are using a Child Theme, the above code will not work without modification if the parent theme has its own filters setting its own "more" link.
  • The following code is an example of the additional code needed to get the above code to work from a child theme of the parent theme Twenty Eleven. You will need to examine your actual parent theme's code for the correct parameters in the remove_filter() code, they must exactly match the add_filter() parameters used by the parent.
  • ...1 more annotation...
  • If you want to include the title of the post in the more text, use the_title() template tag
    • Vernon Fowler
       
      Already done for you in accessibility-ready themes like twentyseventeen. If unsure, check by either looking for a screen-reader-text span inside the "Continue reading" link; or install the WP Accessibility plugin to confirm under Miscellaneous Accessibility Settings. https://wordpress.org/plugins/wp-accessibility/
  •  
    "Modify the Read More text when using the the_excerpt()"
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

How Can I Validate (X)HTML + ARIA? | The Paciello Group BlogThe Paciello Group Blog - 0 views

  • The DTD I have used is the HTML 4.01 loose DTD with ARIA attributes added
  • A way I have developed to do this is by creating a bookmarklet that takes the innerHTML of a document (without the DOCTYPE) and adds the custom DOCTYPE to it and then sends it to the W3C validator: HTML4.01-loose+ARIA Checker (add as a favorite to try it out)
Vernon Fowler

Tools | Joseph Karr O'Connor - 0 views

  • go with Jim Thatcher’s Favelets if you’re just starting out and can only afford one
  • While the WAVE Toolbar is comprehensive, the Favelets provide a more approachable environment for newcomers.
  • the toolbar can check intranet, password-protected, dynamically generated, or sensitive web pages
Sandra Earl

Multiple form labels and screen readers | 456 Berea Street - 0 views

  • Well, it turns out you can do that. From The LABEL element in the HTML 4.01 specification: The LABEL element may be used to attach information to controls. Each LABEL element is associated with exactly one form control. The for attribute associates a label with another control explicitly: the value of the for attribute must be the same as the value of the id attribute of the associated control element. More than one LABEL may be associated with the same control by creating multiple references via the for attribute. Sounds great, doesn’t it? A quick check in graphical web browsers shows that they associate multiple labels with the input field (as evidenced by the input field gaining focus when either label is clicked). But what about screen readers? It would be so useful if this would work… Unfortunately, and perhaps unsurprisingly, it looks like it doesn’t quite work as well as you’d hope. I mentioned this briefly in Use the label element to make your HTML forms accessible, but I think it’s worth bringing up again since full support for multiple labels would help us make forms more accessible to screen reader users while keeping visual designers happy. I am far from an expert user when it comes to screen readers, but I’ve done some limited testing with mostly disappointing results. Apple VoiceOver does not recognise more than one label element associated with a form control and reads only the label that comes first in the document’s source order. JAWS and Window-Eyes both do the opposite and read only the last label when an input field gains focus. The only screen reader of those that I tested that does handle multiple labels is Fire Vox. The exact results may obviously depend on user configuration and reading modes, and there may be other screen readers that get it right, but these results indicate that screen reader behaviour is too inconsistent for multiple labels to be a reliable technique.
Sandra Earl

Turn Firefox into a screen reader with Fire Vox | 456 Berea Street - 0 views

  • For anyone who hasn’t heard of Fire Vox, it is a free, open source screen reader extension for Firefox that works on Windows, Mac OS X, and Linux. Among other things it has support for WAI-ARIA and the CSS3 Speech Module, and is a good alternative to VoiceOver if you’re on a Mac and need a screen reader for web browsing (or testing).
  • For developers Fire Vox makes it easy to check how their sites work in a screen reader. Sure, it’s just one of several available screen readers, but this one is free and cross-platform. In other words there is no reason for you not to have it installed, so grab a copy right now.
Sandra Earl

Introducing WysiHat: An eventually better open source WYSIWYG editor - (37signals) - 0 views

  • WysiHat is a WYSIWYG JavaScript framework that provides an extensible foundation to design your own rich text editor. WysiHat stays out of your way and leaves the UI design to you. Although WysiHat lets you get up and running with a few lines of code, the focus is on letting you customize it. We are giving developers early access to the project while we continue to work out the remaining issues. Note: It’s extremely early. Contributors are welcome so please check out the project on GitHub and send us your feedback.
Sandra Earl

Captivate Accessibility Hints | SSB BART Group - 0 views

  • Captivate has a number of accessibility features in version 3 and 4 although there are some issues that Adobe is working on.
  • Ensure that the “enable accessibility” checkbox is checked under the File > Publish settings in order for accessibility to be exposed to assistive technologies.
  • Slide Accessibility Text Each slide can contain accessibility text. This can be added by going to the slide properties, activating the Accessibility button and entering text in the text field.
  • ...6 more annotations...
  • Closed Captioning Closed captioning can be added to all audio files. From the record audio dialog, closed caption text can be added under the Caption tab. The playback bar contains a CC button which allows the closed captioning to be displayed or hidden.
  • Button Accessibility Text buttons can be made accessible. The text that appears on-screen becomes the button’s accessible name. To make the buttons keyboard accessible, the “Set Keystroke: Select Keys” button should be used and the keystroke of “enter” should be set in the object’s properties dialog. Other shortcuts can be assigned but enter/space will then not work to activate the button after tabbing to it. The keystroke of “enter” can be assigned to multiple buttons and the button with focus will be activated when Enter is pressed.
  • Audio recordings can be associated with click boxes and thus authors can associate descriptive text to be announced when a shortcut keystroke is pressed to assist users with visual impairments.
  • Text from PowerPoint Much of the text from PowerPoint will come through as text in Microsoft Active Accessibility (MSAA) and will be exposed to users of screen readers. Currently there isn’t a method to change the order or edit this text.
  • Quiz Questions There is some accessibility support for quiz questions. Simple types of questions such as true and false and multiple choice provide accessible names for the radio buttons and the text of the question appears as text in the accessible MSAA structure and is exposed to screen readers.
  • Accessibility Differences Between Captivate 3 and 4 The text in the “text caption” object does not show up as accessible text in Captivate 3 but does in Captivate 4. In addition, it is not possible to set accessible text for specific images in Captivate 3 but it is possible in Captivate 4.
Vernon Fowler

WebAIM: Link Contrast Checker - 0 views

  • For usability and accessibility, links should be underlined by default.
Vernon Fowler

Contrast ratio in devtools - 0 views

  • To enable it (as of August 2017), you need the following steps: Use Chrome CanaryEnable experiments: chrome://flags/#enable-devtools-experiments
  • From devtools, open settings (F1)Open the experiments panelHit shift seven times (no, I'm not kidding)Check the "Color contrast ratio line in color picker"
Vernon Fowler

10 colour contrast checking tools to improve the accessibility of your design | 456 Ber... - 3 views

  • online tool simulates colour blindness on an image that you upload or on a web page that you specify, while the Photoshop plugin changes the colours of the document you are working on
1 - 18 of 18
Showing 20 items per page