Reading Assignment: Accessibility and HTML

Javascript Course 2021
#41

  1. Accessibility is the modification of programs/websites to assist visual or audible impairment. This can be making your website friendly to screen readers. So that a visually impaired person could still use your website.

  2. The use of screen readers that read text. They read things like alt text to describe a photo rather than see it.

  3. It gives context to how information is connected.

  4. Don’t just use div for all block elements and span for inline.

  5. Tab index allows either softwear or tab button to more to a specific peice of content. Negitive values are used for software to navigate page. Positive values allow a user to tab through the page. Though positive values should not be used as it creates problems with accessability.

3 Likes
#42

  1. What is accessibility?
    it describes how usable the website is for people with disabilities, on mobile devices or with a slow internet connection, etc. in some countries the law requires your site to be accesible to lot of people. good usage of semantic elements boosts this and its just basic human respect.

  2. How do people interpret websites without vision?
    they use ai reading programs

  3. How does semantic HTML help make websites accessible?
    it helps screenreaders and makes the page faster and better for algorithms too

  4. Name a few practices to avoid when writing HTML.
    using too few semantic elements. or using them wrong.
    not documenting well with comments

  5. What is a tab index?
    its the index that saves in which order you can select the next element by pressing tab

2 Likes
#43
  1. Accessibility is making the content of a website available to people with disabilities (someone blind for example)
  2. With the use of screen readers, that read out loud the content of the website
  3. Correct semantic will guarantee the order/organisation of the website, when interpreted by the screen readers. Some functionalities are inherent to the language and will be read aloud properly. The user will also be able to select options (return/enter) or navigate through a list with the keyboard. Using presentational html will not allow that (unless extra script is written in JS to allow it, but this is less efficient than using the semantic that would allow it automatically)
  4. We should use semantic html and not presentational html like div, otherwise some functionalities will not be compatible with the screen readers. For example, buttons should be coded as <button> to be interpreted correctly and be tabbable. We shouldn’t use abbreviations or acronyms that cannot be read out loud.
  5. tab index allows the user to select items with the tab key. tabindex="0" make non tabbable elements now tabbable.
2 Likes
#44

What is accessibility?

It is ability of the content to serve it`s purpose.

How do people interpret websites without vision?

They use specific software which read description of the website`s content through the code and text.

How does semantic HTML help make websites accessible?

It makes website`s structure and descriptions in clear way for people without vision and for SEO systems to access and to interact with the content.

Name a few practices to avoid when writing HTML.

Use < div > instead of ordering elements properly;
Put image description in it`s name;

Use < div > instead of < button>s;
Anchors and links without description of it`s path.

What is a tab index?

It allows elements to become tabbable.

3 Likes
#45
  1. Accessibility in HTML refers to how accessible a page is for people with all different types of backgrounds; this could mean people with physical, mental, or other impairments; or even mobile users, that would prevent said person from interacting with a page like the average user. Making a page Accessible makes the structure of an HTML page all the more important.
  2. A person without vision could interpret a website using something called a screen reader.
  3. Semantic HTML makes websites more accessible by giving proper structure to a webpage. When the different elements and content are laid out properly, it organizes a page properly for development, screen readers, search engines using “key words,” and accessibility in general.
  4. When writing HTML its best to avoid using elements that visually achieve the same outcome, but accessibility wise don’t achieve the same result. A good example would be someone separating text on their page using simple breaks as opposed to paragraph elements.
  5. A tab index is used to program the tab key to cycle through different elements of a page. It is written with a numerical value, and will follow that order. Using a tab index helps with accessibility.
2 Likes
#46

What is accessibility?

A: Using POSH HTML or Plain Old Semantic HTML, which means using the correct HTML elements in their correct purpose. This allows for a better user experience. For example, users can navigate between buttons using the tab key and activate their selection using the enter button on their keyboard.

How do people interpret websites without vision?

A: They use voice screening software programs that read the website out loud to the user.

How does semantic HTML help make websites accessible?

A: They make it easier to develop so user functionality is at a high level. It makes it better for mobile accessibility. It is also good for search engine optimization.

Name a few practices to avoid when writing HTML.

A: Do not use dashes, expand abbreviations, and inform of acronyms.

What is a tab index?

A: The primary intention of tab index is to all tabbable elements to have a custom tab order.

2 Likes
#47

Hi, I have a question on the html quiz. I don’t understand how this line of code is stated as correct in the quiz. For me it is missing some elements (closing the strong and opening the paragraph for example).

First <strong>paragraph.</p> <img src="./leftarrow.png" alt="left arrow" />

Could someone explain to me what I am missing?

Many thanks!

2 Likes
#48
  1. What is accessibility? making the website usable for as many people as possible.
  2. They use dedicated screen readers.
  3. How does semantic HTML help make websites accessible? First it improve SEO and also make it easy for the screen readers and interpreted to work.
  4. Name a few practices to avoid when writing HTML. avoid spaces, abbreviations, use correct semantic.
  5. What is a tab index? an attribute that allow users to focus on an element when for example pressing a tab key, the order is determined by writing giving a number that determine the order.
2 Likes
#49
  1. What is accessibility?
  • Accessibility is how users can interact with the web page either via mouse clicks or keyboard interactions.
  1. How do people interpret websites without vision?
  • By using screen reader
  1. How does semantic HTML help make websites accessible?
  • Good semantic HTML makes it easier for the developer and machine to read.
  1. Name a few practices to avoid when writing HTML.
  • Always use clear language, use proper page layouts, have good ui control and meaningful ui text labels
  1. What is a tab index?
  • tab index allows elements that are not normally tabbable to become tabbable.
1 Like
#50

Accessibility is making your web page to be usable by all types of users!

People without vision interpret websites through screen readers!

Semantic HTML help us to navigate on the website and its better for SEO and graphic designers!

We need to avoid using dashes, acronyms, abbreviations and unclear language! also avoid tables Div tags and more!

Good for navigation and improve accessibility! its allows tabable elements !

this video can help to understand accessibility! enjoy and good luck!

2 Likes
#51

Accessibility is the practice of making your website usable for everyone to have an easy workflow especially those with disabilities. It’s the standard, it’s like treating everyone the same. It’s like excluding people with wheelchairs from a building because you don’t provide a ramp.Think beyond your own computer and how you use the website. Think about how others use the website. YOU ARE NOT YOUR USER.

People without vision interpret a website through

  • Screen Magnifiers
  • Software zoom
  • Screen Readers = Reads text out loud

Semantic HTML helps make websites accessible.From improving SEO. Correct HTML elements for their intended purpose as much as possible. Doesn’t take any longer than non-semantic. The GOAL isn’t 100% but close enough

  • Easier to develop = Easier to understand

  • Better on mobile = Lighter file size easier to make responsive

  • Don’t use unnecessary jargon

  • NO 5-7 YES 5 to 7 WHY dash can cause confusion

  • NO Jan YES January WHY user may not understand abbreviations

  • NO NASA WHY user may not understand acronyms

Tab Index is primary to allow tabbable elements to have custom tab order. ( Specified in numerical order)Rather, then being tabbed through inter default source order. WHY because it can cause major confusion. KEY Tabindex=“0” Allows elements that are not normally tabbable to become tabbable.

2 Likes
#52
  1. What is accessibility?

The practice of making websites as usable as possible by using proper semantics.

  1. How do people interpret websites without vision?

Screen readers are used for people without vision.

  1. How does semantic HTML help make websites accessible?

Semantic HTML provides proper order for interpretation, and improves SEO which help users find and consume the content much easier.

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

Avoid using the div tag, any code outside of proper semantics, don’t use abbreviations, dashes or acronyms.

  1. What is a tab index?

A tab index is an attribute that provides order of navigation to elements in the an html document via the tab button.

2 Likes
#53
  1. What is accessibility?
    Users being able to interact with webpage.
  2. How do people interpret websites without vision?
    By using the screen reader
  3. How does semantic HTML help make websites accessible?
    It makes the website clear and concise. Higher user functionality. Better SEO.
  4. Name a few practices to avoid when writing HTML.
    Avoid dashes, abbreviation, acronyms.
  5. What is a tab index?
    Allow tabbable elements to have a custom tab order.
3 Likes
#54

What is accessibility?

Accessibility is the practice of making your websites usable by as many people as possible. Treating everyone the same, and giving them equal opportunities, no matter what their ability or circumstances.

How do people interpret websites without vision?

Screen magnifiers or screen readers

How does semantic HTML help make websites accessible?

semantic HTML is arguably lighter in file size than non-semantic spaghetti code, and easier to make responsive. Also screen readers notify you what is a heading, what is a paragraph and stops after each element. You can bring up a list of headings to find specific content and you can jump front forwards and backwards between headings. By using semantic HTML you also get native keyboard accessibility. By labeling inputs, the screen reader will read out which input should be given.

Name a few practices to avoid when writing HTML.

writing headings, paragraphs, etc. using only presentational HTML and line breaks. Avoid using dashes if possible, avoid abbreviations and acronyms if possible. Acronyms can be used after using the full text once or twice. Avoid table layouts and if you do use tables, use the ‘th’ element to make table headers, specify if they are headers for rows or columns using the scope attribute, ‘caption’ or ‘table’ summary give alt text for a table. Never include text content inside an image.

What is a tab index?

It can allow elements that are not normally tabbable to become tabbable: tabindex=”0”. It can also allow not normally tabbable elements to receive focus programmatically: tabindex=”-1”. This does not activate them via the enter/return key, this can be done with an Javascript workaround but it is better to use the right element for the right job in the first place.

2 Likes
#55

What is accessibility?

Making things usable by as many people as possible, in different situations: big screens, small screens, no screens, poor or no sight, and even command line Linux users with no GUI. Also things like slow or unreliable internet, no computer (is the page printable?).

How do people interpret websites without vision?

Using screen readers that read out text and contextual information.

How does semantic HTML help make websites accessible?

Supplies accessibility tools with contextual information:

  • Helps navigation (skipping between navs, articles and sections for example)
  • Explains the context (from big things like nav and main, to emphasis on a single word)

Name a few practices to avoid when writing HTML.

  • Using only divs/spans with classes or inline styles for things that have meaning, such as headings, emphasis, buttons, and code blocks.
  • Lacking descriptions on images.
  • Using onClick instead of links, accessibilty tools don’t know the element is meant to be a link.

What is a tab index?

It is the priority for navigating to an element using the tab key (or other tool that uses it); lower numbers get tabbed to first.

2 Likes
#56
  1. What is accessibility?
    Making your website usable for as many people as possible
  2. How do people interpret websites without vision?
    Screen readers
  3. How does semantic HTML help make websites accessible?
    Easier to develop with, better on mobile, and good for SEO.
  4. Name a few practices to avoid when writing HTML.
    Using presentational HTML like line breaks
  5. 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.
2 Likes
#57

  1. What is accessibility?
    Accessibility is the ease at which a website might be used by “everyone!”, including people with limited auditory, visual, physical or cognitive abilities. Accessibility can include mouse clicks, touch screens, keyboards or voice assistances.

  2. How do people interpret websites without vision?
    Voice assistances (screen readers).

  3. How does semantic HTML help make websites accessible?
    Good semantics help with website navigation, provides free functionality, mobile friendly, and makes your documents easier to find.

  4. Name a few practices to avoid when writing HTML.
    Practices to avoid include not using clear language, acronyms, dashes, abbreviations.

  5. What is a tab index?
    by using the appropriate elements you can use the tab key to navigate through a web page.

2 Likes
#58

1.What is accessibility?

Accessibility is what is built into html to allow websites to be accessed to all, including those with impairments.

  1. How do people interpret websites without vision?

They are navigating with aid of screen reading technology.

  1. How does sematic HTML help make websites accessible?

Using the correct semantic elements helps the user with reading.

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

  • Don’t use dashes if you can avoid it. instead writing 5-7, write 5 to 7.

  • Expand abbreviations - instead of writing Jan, write January.

  • Expand acronyms, at least once or twice. Instead of writing HTML in the first instance, write Hypertext Markup Language.**emphasized text

5.What is a tab index?

The tab index attributes and specifies the tab order of an element.

2 Likes
#59

[quote=“thecil, post:1, topic:41229”]
While reading, try to answer the following questions.

  1. What is accessibility?
    Accessibility is the way in which all users, be it on desktop or mobile devices, can index and navigate through your website with ease regardless of disabilities or difficulties. This is achieved through using the correct HTML elements.

  2. How do people interpret websites without vision?
    With the help of screen readers.

  3. How does semantic HTML help make websites accessible?
    Through structuring the content on a website it gives a website order and through the use of the correct elements (like nesting elements) we can make it easier for the search engine spiders to find relevant or important or relevant information on our site.

  4. Name a few practices to avoid when writing HTML.
    We should try and avoid the use of less specific elements like using
    “line break” in a list as opposed to

      or
      in stead of . We should also avoid unclear language like acronyms without having expanded it once or twice, expand abbreviations and try to avoid using dashes where possible.

    1. What is a tab index?
      A tabindex attribute allows tabbable elements to have a custom tab order specified in numerical order.
      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" — allows not normally tabbable elements to receive focus programmatically, e.g., via JavaScript, or as the target of links.

2 Likes
#60

1.) Being able to choose between different button configurations
2.) Screen reader
3.) You get extra functionality built-in, works better on mobile platforms
4.) Do not use dashes, Expand abbreviations and acronyms
5.)This attribute allows tabbable elements to have a custom tab

1 Like