A11yAdvice

@A11yAdvice

Daily advice and tips on digital accessibility and inclusive design. Share posts with colleagues in need. Let's get the word out! Curated by .

Vrijeme pridruživanja: prosinac 2019.
33 fotografije ili videozapisa Fotografije i videozapisi

Tweetovi

Blokirali ste korisnika/cu @A11yAdvice

Jeste li sigurni da želite vidjeti te tweetove? Time nećete deblokirati korisnika/cu @A11yAdvice

  1. prije 18 sati

    Identify the default language of a web page by providing the lang attribute on the html element. This assists assistive technology in properly announcing and interpreting content on a page.

    HTML markup with the lang=en attribute on the HTML element
    3 proslijeđena tweeta 6 korisnika označava da im se sviđa
    Poništi
  2. 2. velj

    Each link that opens a new browser window or tab must communicate this to assistive technology, such as screen readers, as part of the link text.

    New browser window icon
    6 proslijeđenih tweetova 9 korisnika označava da im se sviđa
    Poništi
  3. 1. velj

    All table th elements should have a scope attribute. While screen readers may correctly guess whether a header is a header for a column or row, assigning a scope makes this explicit.

    HTML markup illustrating the scope attribute on column th elements with a value of col
    5 proslijeđenih tweetova 9 korisnika označava da im se sviđa
    Poništi
  4. 31. sij

    Ensure any frames and iframes provide a title attribute that describes the purpose of the frame. People using assistive technology such as a screen reader can then determine whether to navigate into the frame or skip it.

    HTML code with a title attribute on an iframe
    1 reply 14 proslijeđenih tweetova 16 korisnika označava da im se sviđa
    Poništi
  5. 30. sij

    Ensure that controls and features are labelled consistently across pages on a web site.

    Search input with a button labelled Search
    Search input with button labelled Find
    1 proslijeđeni tweet 2 korisnika označavaju da im se sviđa
    Poništi
  6. 29. sij

    If your web site is more than a few years old, check your code for bad practices, such as using white space characters to simulate multiple columns.

    HTML code illustrating non-breaking space code to horizontally space text to visually emulate columns
    4 proslijeđena tweeta 6 korisnika označava da im se sviđa
    Poništi
  7. 28. sij

    Do you have groups of images and text links and multiple instances of links referencing the same URL? Combine them to reduce duplication, which can be laborious for people using a screen reader.

    News site with each article represented by a card, with photo and text
    4 proslijeđena tweeta 9 korisnika označava da im se sviđa
    Poništi
  8. 27. sij

    Do you use native or custom select elements that automatically navigates people to a different URL when an option is selected? Remove that onchange event and add a button to allow the individual to manually activate it.

    Select control with go button
    9 proslijeđenih tweetova 11 korisnika označava da im se sviđa
    Poništi
  9. 26. sij

    Do you present elements or features that automatically move, blink or update? Add a control that stops the motion or updates, which can present issues for some people.

    Pause button
    2 proslijeđena tweeta 3 korisnika označavaju da im se sviđa
    Poništi
  10. 25. sij

    Validate your code, ensuring it is coded to HTML specification. Parsing issues, such as improperly nested and unclosed elements, missing or duplicate ids, etc. can impact accessibility. Validate:

    Example of a validation error; element p not allowed as child of element h4 in this context
    4 proslijeđena tweeta 5 korisnika označava da im se sviđa
    Poništi
  11. 24. sij

    Un-fix your sticky headers and footers via media queries when the screen does not provide enough room to view the content (mobile dimensions in landscape orientation, zoomed in).

    Screenshot of website with both sticky header & footer in landscape orientation
    10 proslijeđenih tweetova 7 korisnika označava da im se sviđa
    Poništi
  12. 23. sij

    You "can" use role="heading" (along with aria-level) to identify content as a heading. But remember the first rule of ARIA ... if you can use a native HTML element, then do so.

    An HTML h2 heading compared with a div with role=heading and aria-level=2
    5 proslijeđenih tweetova 5 korisnika označava da im se sviđa
    Poništi
  13. 22. sij

    Do not use CSS background images to present images that communicate contextually important information.

    CSS code showing a background image related to author
    1 reply 3 proslijeđena tweeta 7 korisnika označava da im se sviđa
    Poništi
  14. 21. sij

    Creating custom controls? Besides ensuring they are keyboard accessible (focusable), make sure it's label/accessible name is applied on the same element.

    Label maker
    3 proslijeđena tweeta 3 korisnika označavaju da im se sviđa
    Poništi
  15. 20. sij

    Give the user control of their experience. Never lock the screen orientation in landscape or portrait; allow the user to use their preferred orientation.

    screen orientation icon
    3 proslijeđena tweeta 8 korisnika označava da im se sviđa
    Poništi
  16. 19. sij

    Individuals with low vision may not be able to see that trendy light grey text on a white background. Ensure you present a color contrast ratio of at least 3:1 between the foreground text color and background color.

    Light grey text on a white background
    3 proslijeđena tweeta 5 korisnika označava da im se sviđa
    Poništi
  17. 18. sij

    Watch the IDs you use in your code. Do not use an ID more than once on a given page, even if, in the case of multiple, only one is visible/accessible at any one time.

    HTML code illustrating an ID used multiple times
    8 proslijeđenih tweetova 12 korisnika označava da im se sviđa
    Poništi
  18. 17. sij

    The text alternative for images in PDFs needs the same amount of attention for accessibility. Decorative images should be hidden from assistive technology such as screen readers. You can, by using the Artifact tag.

    Hidden image
    3 proslijeđena tweeta 5 korisnika označava da im se sviđa
    Poništi
  19. 16. sij

    The HTML5 autocomplete attribute provides information on the expected input for users. When using this attribute, make sure you are using a valid value. Valid autocomplete values:

    HTML5 markup with an input element and autocomplete attribute with a value of username
    5 proslijeđenih tweetova 11 korisnika označava da im se sviđa
    Poništi
  20. 15. sij

    The <img> element should have an alt attribute. The value of alt: - if informational or functional, provide a description; - if decorative, leave blank An alt Decision Tree:

    HTML markup, the first showing an alt attribute with no value, the second with an alt value of John Cleese
    7 proslijeđenih tweetova 8 korisnika označava da im se sviđa
    Poništi

@A11yAdvice još nije objavio nijedan Tweet.

Čini se da učitavanje traje već neko vrijeme.

Twitter je možda preopterećen ili ima kratkotrajnih poteškoća u radu. Pokušajte ponovno ili potražite dodatne informacije u odjeljku Status Twittera.

    Možda bi vam se svidjelo i ovo:

    ·