background preloader

Color Safe - accessible web color combinations

Color Safe - accessible web color combinations

Related:  VisualAccessibilité/publics empêchésנגישות Negishutaccessibilité

The Paciello Group – Your Accessibility Partner (WCAG 2.0/508 audits, VPAT, usability and accessible user experience) This tool provides two useful core functionalities: a pass/fail assessment against WCAG 2.0 color contrast success criteriaa simulation of certain visual conditions, including dichromatic color-blindness and cataracts, to demonstrate how your web content appears to people with less than 20/20 vision The CCA is available for Windows and Mac, and in multiple languages including English, French, Dutch, Italian, German, Hindi, Korean and traditional Chinese. WCAG 2.0 checklist - a free and simple guide to WCAG 2.0 It’s extremely useful to have a WCAG 2.0 checklist to hand when you’re working through the guidelines. A WCAG 2.0 checklist helps you to check your web accessibility progress, record how far you’ve come and set your targets out for the future. Wuhcag is all about holistic web accessibility – that means taking everything about your website into account. That’s why I don’t rush you to make every web accessibility change at once – it’s too much for you to do and so it’s bad for your users. I love a structured approach to everything in life, and your website is no exception. I’ve created a three checklists for you below, with link to articles about each guideline.

Accessibilité numérique – Tosca consultants Bienvenue sur cette page consacrée à l’accessibilité numérique, et plus particulièrement à l’accessibilité des sites web. Cette page vous donne accès à des ressources et décrit nos prestations dans le domaine de l’accessibilité. Ressources Cette page vous donne accès aux ressources suivantes : Nos prestations Tosca consultants réalise depuis de nombreuses années des missions globales d’assistance à maîtrise d’ouvrage dans le cadre de projets d’informatisation, de numérisation, de valorisation et de publication de ressources et de services en ligne. slick - the last carousel you'll ever need Set up your HTML markup. <div class="your-class"><div>your content</div><div>your content</div><div>your content</div></div> Move the /slick folder into your project Add slick.css in your <head> <link rel="stylesheet" type="text/css" href="slick/slick.css"/> // Add the new slick-theme.css if you want the default styling <link rel="stylesheet" type="text/css" href="slick/slick-theme.css"/> Add slick.js before your closing <body> tag, after jQuery (requires jQuery 1.7 +)

Make a Simple JavaScript Slideshow without jQuery This article was peer reviewed by Dan Prince and Chris Perry. Thanks to all of SitePoint’s peer reviewers for making SitePoint content the best it can be! “I just want to make a simple JavaScript slideshow without jQuery.” The slideshow — also known as the image carousel, the slider, or the rotating banner — is a commonly requested tutorial among people who are learning JavaScript. In this tutorial, we’ll cover the following topics: make a basic slideshow without any external libraries like jQueryunderstand UX and accessibility issues, including whether you should use a slideshow at alladd controls to your slideshow.

Edit Source HTML or CSS in Free Weebly Site » WebNots Though Weebly offers “Embed Code” element to add custom HTML, CSS and JavaScript code on your page content, sometimes it is necessary to modify the source HTML / CSS of your site. Weebly allows both free and premium users to edit the source HTML / CSS code of a site in order to encourage adding more customization to make a good looking site with needed features. Here is a step by step tutorial on how to edit source HTML or CSS in free Weebly site and things you can do with Weebly code editor.

Keyboard functionality for websites – creating order, avoiding traps In recent years, developers have embraced the idea that there are many different ways for people to navigate around a website. In a traditional office environment, it’s likely that the mouse is the most popular navigation tool, while for people on the go it is increasingly likely that fingers on a touchscreen is the favoured way to interact. Yet for people with a vision or mobility impairment there is a third option that is often overlooked: accessing content using only the keyboard. For a person who is blind, the mouse is a difficult tool to use as there’s no easy way to figure out where the mouse pointer is located. For people with a mobility impairment, it may be difficult to move the mouse if their hand is constantly shaking, for instance. In both cases, navigation can be much quicker and easier if keyboard commands and shortcuts are used to get around.

HTML5: Techniques for providing useful text alternatives 1. Requirements for providing text to act as an alternative for images Text alternatives,[WCAG] are a primary way of making visual information accessible, because they can be rendered through any sensory modality (for example, visual, auditory or tactile) to match the needs of the user. Providing text alternatives allows the information to be rendered in a variety of ways by a variety of user agents. For example, a person who cannot see a picture can have the text alternative read aloud using synthesized speech.

Example - Menubar: ARIA CSS Selectors $(document).ready(function() { var menu1 = new menubar('mb1', false); }); // end ready() /////////////// begin textArea widget definition //////////////////////// // // Function textArea() is the constructor of a widget to manipulate the // properties of a text area. // // @param(id string) id is the HTML id of the text area to bind to // // @return N/A // function textArea(id) {

Improving Your Website's Accessibility So, you followed the WAI guidelines from the W3C found at and you hope your site is accessible. Let's talk about some of the most elementary and easiest to understand aspects of a site that contribute to accessibility to users of assistive technology. Be Explicit: Label Graphics and Images First, did you label everything on your web site that isn't strictly text? In most cases, this means using alternative text to describe the function of the item. In HTML, you can provide alternative text for images by adding alt="your description of the image" within the image tag.