wcag

问题 I'm using aria-described by on a few radio buttons so that screen readers will first read the radio label and then the description text to give more information. Due to the structure of the page I can't use a fieldset. Many source accessibility validators will show an error if you have a label without a for attribute so I am using a div for the description text. <div id="desc">Choose a fruit</div> ... <label><input type="radio" aria-describedby="desc" />Apple</label> <label><input type="radio

问题 I'm using aria-described by on a few radio buttons so that screen readers will first read the radio label and then the description text to give more information. Due to the structure of the page I can't use a fieldset. Many source accessibility validators will show an error if you have a label without a for attribute so I am using a div for the description text. <div id="desc">Choose a fruit</div> ... <label><input type="radio" aria-describedby="desc" />Apple</label> <label><input type="radio

问题 I am using JSF to code my application and it has a datatable. Each row of the datatable has a checkbox in the first column, and some text in the rest of the columns. My application needs to comply to the WCAG 2.0 and I'm using a Chrome Extension "Axe" to scan my application. The "Axe" tool flagged out that the datatable with the checkboxes is not complying to the clause "Ensure every form element has a label" and the proposed solution is to add the "aria-label" attribute. However JSF

问题 I'm creating a form, that is following some WCAG guidelines. One of those is: G165: Using the default focus indicator for the platform so that high visibility default focus indicators will carry over. The summary of this rule is: Operating systems have a native indication of focus, which is available in many user agents. The default rendering of the focus indicator isn't always highly visible and may even be difficult to see against certain backgrounds. However, many platforms allow the user

问题 I'm creating a form, that is following some WCAG guidelines. One of those is: G165: Using the default focus indicator for the platform so that high visibility default focus indicators will carry over. The summary of this rule is: Operating systems have a native indication of focus, which is available in many user agents. The default rendering of the focus indicator isn't always highly visible and may even be difficult to see against certain backgrounds. However, many platforms allow the user

问题 I'm creating a form, that is following some WCAG guidelines. One of those is: G165: Using the default focus indicator for the platform so that high visibility default focus indicators will carry over. The summary of this rule is: Operating systems have a native indication of focus, which is available in many user agents. The default rendering of the focus indicator isn't always highly visible and may even be difficult to see against certain backgrounds. However, many platforms allow the user

问题 I'm creating a form, that is following some WCAG guidelines. One of those is: G165: Using the default focus indicator for the platform so that high visibility default focus indicators will carry over. The summary of this rule is: Operating systems have a native indication of focus, which is available in many user agents. The default rendering of the focus indicator isn't always highly visible and may even be difficult to see against certain backgrounds. However, many platforms allow the user

问题 I'm writing some css style sheets for my website and having a mass use of "vw" and "vh" css units. I noticed that when I'm trying to enlarge (resize?) the font size with the browser magnifier or using Ctrl+Scrolling up with mouse, the font size doesn't incrase and stays static. I have to make this website accessible (AA Level) and one of the main requirements are Ensure Your Site Responds Well to Increased Text-Size (1.4) Got it from here. Using "rem" or "em" do resize, but they don't have

问题 I currently have a form like so: <form action="#"> <select {if $isPostRequest}disabled="disabled" {/if}size="1" name="locale" onchange="location.href={if $languageToggleNoUser}'{$currentUrl|escape}{if strstr($currentUrl, '?')}&{else}?{/if}setLocale='+this.options[this.selectedIndex].value{else}('{url|escape:"javascript" page="user" op="setLocale" path="NEW_LOCALE" source=$smarty.server.REQUEST_URI}'.replace('NEW_LOCALE', this.options[this.selectedIndex].value)){/if}" class="selectMenu">{html

问题 I'm trying to understand the details of WCAG AA compliance. Would the unselected checkboxes in this image be considered too low-contrast to be compliant? Is there anything we can do (other than change the color) to make it more compliant? If tab-focus makes the contrast go up, is that enough? Or do we really just need to boost the contrast? 回答1: This point is covered by the new WCAG 2.1 guideline: 1.4.11 Non-text Contrast For controls on the page, such as buttons and form fields, the visual