Reading Assignment: Accessibility and HTML

  1. Accessibility is making sure that the website is usable by as many people and as possible, particularly people with disabilities.

  2. Via screen reader. There are many different paid and free software products available.

  3. In semantic HTML there is an order that makes it better to understand website content for Google, other developers, or website users.

  4. Using

    's when you can use semantic elements;

  5. Not using proper HTML semantics. For instance, n to separating the content into headers, main, footers, articles, etc.

  6. tabindex is an attribute used to focus HTML elements.

1 accessibility is when you make sure that everyone can understand the content of your website
2 people interpret website without vision thanks to different tool like screen reader
3 Semantic HTML is compatible with screen readers program and can also help dev creating better websites
4 using

instead of the right class, manipulating instead of using , using
to create separate lines in paragraph instead of using . also it is important to avoid abbreviations, dashes and spaces.
5 a tab index is used when a not tabbable elements need to be tabbable

What is accessibility?

Accessibility is the ability of a website or page to be interactable for all humans, but more specifically, mentally and sensory impaired.

How do people interpret websites without vision?

Visually impaired interpret websites with screen readers and amazon Alexa/ google.

How does semantic HTML help make websites accessible?

By making a way for the website to be accessed, interacted with, and produce results without errors so that every human can use it.

Name a few practices to avoid when writing HTML.

Don’t use slang.

Remember to keep it simple so that its more accessible

Don’t use dashes

Don’t abbreviate, write the entire word.

What is a tab index?

The tab index is what keyboards users use to navigate through a pages elements. This is why its important to have clean, in order coder, so that an individual may easily access the website.

1 Like
  1. What is accessibility?

Accessibility is the use of all available coding resources to make your webpage understandable and easy to navigate for all the people visiting it no matter if they have a disability of any type or the kind of assisting technology devices they might use.

  1. How do people interpret websites without vision?

They interpret websites with the use of assisted technology software/devices such as voice readers that can read out not only the text included in the website, but also the descriptions made available through the corresponding coding elements that help this devices to interpret what the people are navigating through.

  1. How does semantic HTML help make websites accessible?

Semantic HTML helps people with or without a disability or users that don’t have some type of hardware available (like a mouse) to navigate, understand and interpret every element of a webpage when properly used.

  1. Name a few practices to avoid when writing HTML.

Avoid using images without any alternate description, using alternate description for images that only have a decorative function in the website, avoid using language that is not suitable or that might be confusing,

  1. What is a tab index?

It is an attribute that allows an element to receive focus when solely using the keyboard to navigate through the webpage.

1 Like
  1. What is accessibility? Making websites usable by as many people as possible.

  2. How do people interpret websites without vision? Magnifiers and screen readers are tools used.

  3. How does semantic HTML help make websites accessible? Improves functionality of screen readers. It makes it possible to use CSS and JavaScript.

  4. Name a few practices to avoid when writing HTML. Avoid confusing language. Don’t use the improper elements or tags.

  5. What is a tab index? An attribute allows developers to make HTML elements focusable, allow or prevent them from being sequentially focusable.

  1. How usable your website is for people accessing it through different ways, like a screen reader
  2. They use a screen reader to read out the contents to them
  3. It is easier for a screen reader to read out in a logical way
  4. Using divs and spans for everything, using tables for things that are not data tables, don’t use slang
  5. It is an attribute you can use to customise the order that elements are tabbed through
  1. What is accessibility? Accessibility refers to the design of products, devices, services, or environments for people who experience disabilities.
  2. How do people interpret websites without vision? People without vision often use screen readers to interpret websites.
  3. How does semantic HTML help make websites accessible? Semantic HTML helps make websites accessible by using the correct HTML elements for their intended purpose as much as possible. This means that the code inherently carries information about how to interact with it.
  4. Name a few practices to avoid when writing HTML. Some practices to avoid when writing HTML include:
  • Using non-semantic HTML: This can lead to issues with accessibility, as non-semantic HTML does not provide enough information about the content of the elements.
  • Ignoring proper file structure: A website consists of many files and when building a website, you need to assemble these files into a sensible structure and make sure they can talk to one another.
  • Not closing tags: Failing to add a closing tag is one of the standard beginner errors and can lead to strange results.
  1. What is a tab index? The tabindex attribute specifies the tab order of an element. You can use it to define which element in a page should be focused when a user presses the Tab key.
1 Like
  1. Accessibility refers to the principle of designing products, services, environments, or information in a way that ensures they can be used and understood by a broad range of people, including those with disabilities. It’s about removing barriers and providing accommodations to enable equal access and participation for everyone, regardless of their physical, sensory, cognitive, or other abilities.

  2. People without vision use screen readers, which are software programs, to navigate and read websites. These screen readers convert on-screen text into synthesized speech or braille output, allowing users to interact with web content. To ensure accessibility, websites should have semantic HTML, descriptive alt text for images, and proper structure, making it easier for screen readers to convey information to individuals with visual impairments.

  3. Making web content accessible in HTML is like ensuring that everyone, including those with disabilities, can easily use and understand websites. It’s done by using special HTML code to describe the content correctly, organizing it neatly with headings, adding descriptions to pictures, making sure buttons and forms can be used with a keyboard, and using extra tools for dynamic stuff. Plus, you regularly check and fix any problems to make sure everyone can use the web smoothly.

  4. Several common bad practices include overusing non-semantic elements like

    and , which can confuse screen readers, and neglecting to provide descriptive alt text for images, making it difficult for users with visual impairments to understand them. Misusing heading tags or skipping them altogether disrupts the logical structure of the content, impairing navigation and comprehension for screen reader users. To ensure accessibility, web developers should use semantic elements, provide meaningful alt text for images, and use proper heading tags to enhance the overall user experience.
  5. Keyboard focus order is crucial for users who rely on keyboard navigation, such as those with mobility impairments. It determines the sequence in which interactive elements on a webpage receive keyboard input focus when users press the “Tab” key. This order ensures a logical and predictable path for users to interact with web content, making it accessible and usable for everyone, especially those who cannot use a mouse. The tabindex function allows this kind of interactivity on a website.

1 Like
  1. Accessibility is about using the right HTML elements to help people with disabilities navigate your website in a correct way

  2. They use a screen reader, which interprets the semantics and HTML elements. Accessibility can be badly broken if this is not handled properly.

  3. By writing semantically correct HTML, the browser knows what type of content it’s dealing with and how that content relates to other content. By doing this, screen readers and assistive technology can do its job more easily.

  4. It’s important to use clear language and avoid using language and characters that don’t get read out clearly by the screen reader. For example:

  • Don’t using dashes, if avoidable. Instead of writing 5–7, write 5 to 7.
  • Expand abbreviations — instead of writing Jan, write January.
  • Expand acronyms, at least once or twice, then use the <abbr> tag to describe them.
  1. Basically, the tabindex attribute is primarily intended to allow tabbable elements to have a custom tab order (specified in positive numerical order), instead of just being tabbed through in their default source order. This is nearly always a bad idea, as it can cause major confusion. Use it only if you really need to, for example, if the layout shows things in a very different visual order to the source code, and you want to make things work more logically.
1 Like
  1. Accessiblity is making websites usable to as many people as possible.
  2. Using screen reader tools or magnifiers.
  3. It uses structure which enables screen readers and mobile devices to render it.
  4. Using dashes, using abbreviations, acronymns and using html tables
  5. Tab index is an attribute which causes tabbable elements to have a certain tab order
  1. Accessiblity is making websites usable to as many people as possible.
  2. Using screen reader tools or magnifiers.
  3. It uses structure which enables screen readers and mobile devices to render it.
  4. Using dashes, using abbreviations, acronymns and using html tables
  5. Tab index is an attribute which causes tabbable elements to have a certain tab order
  1. What is accessibility?

Accessibility is the practice of making your websites usable by as many people as possible.

  1. How do people interpret websites without vision?

People with visual impairments include people with blindness, low-level vision, and color blindness. Many people with visual impairments use screen magnifiers that are either physical magnifiers or software zoom capabilities. Most browsers and operating systems these days have zoom capabilities. Some users will rely on screen readers, which is software that reads digital text aloud

  1. How does semantic HTML help make websites accessible?

Accessibility is achieved through the use of Assistive Technologies which make use and consumption of semantic information to do their job properly and efficiently. This information is structured in a tree of information called the accessibility tree

Assistive technologies may include zoom capabilities, screen readers. To provide access, textual alternatives must be provided. Videos should be manually captioned, and transcripts should be provided for audio content.

  1. Name a few practices to avoid when writing HTML.

• You are trying to “retrofit” accessibility onto an existing website that has significant accessibility issues.
• You have only started to consider accessibility and uncovered related issues in the late stages of a project.

  1. What is a tab index?
    Basically, the tabindex attribute is primarily intended to allow tabbable elements to have a custom tab order (specified in positive numerical order), instead of just being tabbed through in their default source order. This is nearly always a bad idea, as it can cause major confusion. Use it only if you really need to, for example, if the layout shows things in a very different visual order to the source code, and you want to make things work more logically. There are two other options for tabindex :
  • tabindex="0" — as indicated above, this value allows elements that are not normally tabbable to become tabbable. This is the most useful value of tabindex .
  • tabindex="-1" — this allows not normally tabbable elements to receive focus programmatically, e.g., via JavaScript, or as the target of links.
1. What is accessibility? 

It is to build a website do that it is more accessible for people with disabilities and senior citizens.

2. How do people interpret websites without vision? 

They use a screen reader that reads the text out loud to them, as well as a description of pictures.

3. How does semantic HTML help make websites accessible?

The screen reader knows what to do this sections because the proper tags add that. You can aslo add keyboard accessibility buy using button tags.

4. Name a few practices to avoid when writing HTML.

Do not use slang terms. Do not use break tags. Use modern website structure. Lable your sections so that other coders know what they are for.

5. What is a tab index?

tabindex=“0” — this value allows elements that are not normally tabbable to become tabbable.

tabindex="-1" — this allows not normally tabbable elements to receive focus programmatically, e.g., via JavaScript, or as the target of links.

  1. What is accessibility?

Accessibility is the practice of making websites usable by as many people as possible. This benefits people with disabilities, mobile users, and those with slow network connectivity.

  1. How do people interpret websites without vision?

People interpret websites without vision through screen readers. Therefore, it is important to use correct semantics so they can easily understand the content through the screen reader.

  1. How does semantic HTML help make websites accessible?

Semantic HTML has built-in capabilities that make it easier for screen readers to understand the code and present the content to people with disabilities in a simple and accessible way.

  1. Name a few practices to avoid when writing HTML.

Avoid using div and span elements for interactive components like buttons, as they are not well interpreted by screen readers and lack meaning. For example, using a div for a button removes keyboard functionality and makes it harder for screen readers. Additionally, avoid vague labels like “click here” and instead use descriptive labels like “find out more about whales.”

  1. What is a tab index?

The tabindex attribute lets developers control how users navigate through a web page using the Tab key. It can make elements focusable, determine their focus order, or prevent elements from being focused.

  1. What is accessibility?
    In HTML we are able to define elements so people with vision disabilities can understand.

Ex.: browser will read out loud for user text writen in alternative text *alt)
alt=“login image”

<img src="./assets/LOGIN.png" 
         alt="login image">
  1. How do people interpret websites without vision?
    They have programs that will read alternative text for them out loud.
  2. How does semantic HTML help make websites accessible?
    The search engines recognizes if the web is optimized for dissabled people. by reading alternative text.
  3. Name a few practices to avoid when writing HTML.
    avoiding < dev > as it is outdated from times when there was no < heading > or < footer >.
    Its better to use semantics to gain advantage for search engines like google.
  4. What is a tab index?
    It is an attribute that allows developers to control which elements on a page can be focused by the user with the tab key.
  1. What is Accessibility?
    Accessibility means designing and developing websites so that they are accessible by as many users possible

  2. How do people interpret websites without vision?
    People without vision use screen readers, screen magnifiers, and voice assistants to navigate and understand website content.

  3. How does semantic HTML help make websites accessible?
    Semantic HTML uses meaningful elements like , , , etc… to define the structure and purpose of content. This also improves SEO.

  4. Name a few practices to avoid when writing HTML.

  • Avoid using spaces in filenames use hyphens or underscores instead.
  • Avoid inline CSS and JavaScript when possible.
  • Use lowercase letters in filenames.
  • Use hyphens instead of underscores for better SEO.
  1. What is a tab index?
    The tabindex attribute specifiy the order in which elements are focused when the user navigates using the Tab key. A tabindex=“0” allows natural tabbing order, tabindex="-1" removes the element from the tab order, and positive values define a custom order.