Reading Assignment: Accessibility and HTML

  1. What is accessibility?
    Accessibility is the practice of making your websites usable by as many people as possible. You do this by using the proper html markup for their intended use as much as possible.

  2. How do people interpret websites without vision?

Screen readers, screen magnifiers and voice assistants

  1. How does semantic HTML help make websites accessible?
    HTML makes it easier to develop websites, easier to read on mobile devices (lighter files), search engines make it more visible on search engines as semtanic html is more findable as opposed to non-semantic elements.

  2. Name a few practices to avoid when writing HTML.
    Don’t use abbreviations, dashes or acronyms and don’t use HTML tables when creating page layouts as it was an old practice developed without mainstream browser access to CSS.

  3. What is a tab index?

The tabindex attribute allows for users to control with the interface, the tab order of an element (when the ā€œtabā€ button is used for navigating), can be used as a way to navigate through the website.

1 Like
  1. What is accessibility?

Accessibility means allowing all users the ability to take advantage of a website despite a user’s physical limitations.

  1. How do people interpret websites without vision?

People interpret websites without vision by using technologies such as Amazon Alexa or Google Home.

  1. How does semantic HTML help make websites accessible?

Semantic HTML introduces meaning to websites by adding descriptive information about a website.

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

A few practices to avoid when writing HTML:

  • Don’t place Block elements within Inline elements such as
**Wrong:** `
<a href="#"><h2>Block inside Inline</h2></a>`
**Right:** `<h2><a href="#">Inline inside Block</a></h2>`

* Always have the alt attribute for the img tag:

**Wrong** :<img src=ā€kittens.jpegā€ />

**Right:** <img src= ā€œkittens.jpegā€ alt = ā€œpicture of small kittensā€/>

* Don’t use <b> and <i> for bolding or italicizing:

**Wrong:** <b>This is not for bolding</b>

**Right:** <strong>This is for bolding</strong>
  1. What is a tab index?

The tab index is used to specify the tab order of an element. It is used when the tab button is used for navigating.

1 Like
  1. The fact a website is accessible to as many people as possible including people with disabilities and accessible to as many technologies used to read it as possible (PC, mobile, etc…)
  2. They use a screen reading technology.
  3. With semantic html you use the right html element for the intended purpose. There are various benefits: they are easier to develop with, good for SEO, better on mobile.
  4. Using unclear labels, using abbreviations, using dashes, using non semantic elements while you could use a semantic for the intended purpose…
  5. It gives a custom tab order to a tabbable element
1 Like

While reading, try to answer the following questions.

  1. What is accessibility?
  • Accessibility means ensuring the Hypertext Markup Language (HTML) elements are used for the correct purpose at all times and therefore easier to read and interpret.
  1. How do people interpret websites without vision?
  • By using screen readers
  • Navigation is done by using the keyboards
  • Scanning the whole web contents
  1. How does semantic HTML help make websites accessible?
  • Good semantics makes it easier for the text content to be read and understood
  1. Name a few practices to avoid when writing HTML.
  • Not using clear language example
    i) Instead of writing 5–7, write 5 to 7.
    ii) * Expand abbreviations — instead of writing Jan, write January.
  1. What is a tab index?
  • 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.
1 Like
  1. Accessibility-Developing content that is in the right context and meets the correct purpose for its use
  2. How do people interpret websites without vision? Through screen reader
  3. How does semantic HTML help make websites accessible? The screen reader reads each header out as you progress through the content, notifying you of where you are in the website and gives the opportunity to stop and start as and when needed.
  4. Name a few practices to avoid when writing HTML. Write appropriate elements and consider the layouts, add the extra semantics to assist the screen reader support network.
  5. What is a tab index? This uses an index to navigate the tab order of an element when the tab button is used for navigating.
1 Like
  1. What is accessibility?

Ensure that the HTML elements are used for the correct purpose. This makes it easier to intrepret and read. Beside that it is the practice of making your website usable by as many peopel as possible.

  1. How do people interpret websites without vision?

Through screenreaders, magnifers and voice assistants.

  1. How does semantic HTML help make websites accessible?

Easier to navigate through the content. Also, the screenreader reads out the content in a better way, such as headers and paragraphs. IT makes it easier to identify.

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

Don’t use overly complex and unnecessary slang terms/ jargon. Avoid using language and characters that don’t get read out clearly by the screenreader.

  1. What is a tab index?

Represents the ordening of objects that can be tapped between. it can be used to navigate through the website.

1 Like

What is accesibility?

1.Accessibility means that you make the website or the PC environment functioning even when you live in a rural part of the world with low network speed.

Therefore it’s important that the website loading time is not too big or those people could not use the website. Overloading with high-resolution pictures or Videos is not appropiate.

There are also other ways to make website functioning better even for those people with visual impairments .

You could use a screan reader or a zooming funcionality reader for making websites and texts look bigger and therefore creating a more readable experience. The website has to be programmed in the way you can zoom it.

Hearing impairments or deaf-of-hard hearing people is another part of people who we as a programmer should take account for and help them with technique like implementing transcripts for videos or audio content or text-to speach. Changing underlined link colours would also help.

The layout should be structred in a very easy to use form. The advantage would be that also people with mobility impairments that e.g. can not make exact hand movements can click a button or use the mouse or other people might use a head pointer when they are paralyzed and the website should still work properly.

  1. How do people interpret websites without vision?The can use a screen reader or zoom and also use a screen reader like dolphin screen reader or nvda or ChromeVox.
  2. How does semantic HTML help make websites accessible? If pictures are described in the html code than also blind people know what is described in that picture. Also semantic html helps with making the content more seo friendly and therefore more findeable*
  3. Name a few practices to avoid when writing HTML.When you use the ā€žimgā€œ code then you should use ā€žaltā€œ for accesibility for impaired people.Don’t overload site with huge picture or distract people with bad navigating funcionality. When using forms and errors occur the errors should be visible and correctable in an easy way. Use changing colours for links when hovering over.
  4. Tabindex is used for focussing and navigating with the tab key of the keyboard. In this way you can navigate with the tab key and therefore have not to use the mouse pad e.g. when you are paralyzed with the hand but e.g. you can use one finger only.
1 Like
  1. What is accessibility?
    Accessibility is the ability of making your website accessible for as many people as possible.

  2. How do people interpret websites without vision?
    Screen Reader, Screen Magnifier.

  3. How does semantic HTML help make websites accessible?
    Semantic HTML makes websites more readable and accessible for disabled users. Offers better user experience.

  4. Name a few practices to avoid when writing HTML.
    Avoid Abbreviations, dashes, acronyms

  5. What is a tab index?
    Tab index allows you focus on elements.

1 Like
  1. What is accessibility?
    Accessibility is making sure that the correct HTML elements are used for the correct purpose all the time.

  2. How do people interpret websites without vision?
    Visually impaired people use screen readers to interact with websites so the sematic should be good for good accuracy for the screen reader.

  3. How does semantic HTML help make websites accessible?
    We have to name our elements in a proper way, so that way the content is organized and these websites are easier to develop, easier to understand, they are better on mobile phone and good for SEO.

  4. Name a few practices to avoid when writing HTML.
    Use good sematic, avoid using dashes (instead of 2-4, write 2 to 4), expand abbreviations (instead of Feb, write February), expand acronyms, not providing any alternative text to images.

  5. What is a tab index?
    Main aim of tab index is to allow tabbable elements to have custom tab order. Recommended to use it only if you need it, for example if layout is in a different visual order to the source code and you want to make things work more logically.

1 Like

While reading, try to answer the following questions.

  1. What is accessibility?
    It is creating HTML pages using the correct semantic elements so that those who are visually impaired can easily navigate the pages using a combination of keyboard shortcuts and screen readers. This is not possible if accessibility is not taken into consideration

  2. How do people interpret websites without vision?
    They use screen readers to read text and images via the alt attribute

  3. How does semantic HTML help make websites accessible?
    By creating a meaningful sequence thats easy to follow whether you can visually read it or not

  4. Name a few practices to avoid when writing HTML.
    Ignoring semantic elements out of laziness, ignoring organized and logical content structure, using unnecessary breaks and tables

  5. What is a tab index?
    Its a global attribute that indicates that its element can be focused, and where it participates in sequential keyboard navigation

1 Like
  1. Accessibility is ability to get the information that is on your website, these is done by browsers, programs, screen readers, search engines and more…
  2. With a screen reader.
  3. It helps search engines etc. to interpret your website and the information on it in a correct way. That helps to know what your website is about. Users can navigate through your website without problems, the website will look the same on different browser and devices. A screen reader program will read your the correct information and in the correct order. If necessary others users can easily work with your code and structure.
  4. Spaghetti code, not using the correct code for lists
      , not using the instead using
      , not using paragraphs and headlines, instead using different font sizes.
      5.It indicates that an element can be focused by a program. It names the order of an element while moving through the website using the Tab-button.
1 Like

1.Accessibility is the practice of making your websites usable by as many people as possible
2.People without vision interpret websites with screen readers.
3.Semantic HTML describes what type of content is displayed on the website so the screen reader can read out to people without vision and content is properly ordered it helps SEO
4. We should avoid abbreviations, acronyms, unclear layouts, line breaks, unclear language, dashes, unclear description
5. Tab index indexes tabs so screen readers can readout tab order of an element when tab is used for navigating

1 Like
  1. Accessibility are best practises referring to code that is created responsibly and can be easily readable by all the users.
  2. People without vision should be able to access them with screen readers or voice assistants like Alexa.
  3. Semantics tackle this by correctly structuring your web content by using correct html elements are used for the right purpose.
  4. Clear content that can be easily read by screen readers, or voice assistants.
    Avoid Abbreviations, dashes, acronyms
  5. Tab index allows you focus on elements.
1 Like
  1. What is accessibility?
    Accessibility in this context refers to an html document being easy to understand and use by anyone, especially accounting for people with disabilities or impairments.
  2. How do people interpret websites without vision?
    Using screen readers.
  3. How does semantic HTML help make websites accessible?
    Semantic HTML can be more easily interpreted by screen readers.
  4. Name a few practices to avoid when writing HTML.
  • Minimize use of slang language.
  • Avoid acronyms where possible.
  • Minimize use of abbreviations.
  • Avoid use of
    and where appropriate semantic elements are available.
  1. What is a tab index?
    Tabindex is an attribute that designates where an element is tabable and manipulatable with keystrokes (usually tab and enter).
1 Like

Accessibility is the ability to build a site that is usable by as many people as possible, including the disabled.

A visually impaired person may use some sort of screen magnifier or a screen reader.

Semantic HTML is readable by screen readers and accessibility API’s.

Neglecting to integrate accessibility into the site design from the beginning of the design.
Neglecting to use semantic HTML.
Not being aware or the User’s Experience (UX).

The tabindex is an HTML attrilbute the specifies the order of focus as the user moves through the web page with the Tab key.

1 Like
  • What is accessibility?

Making sure that websites are visible, accessible by as many people as possible despite limitations in disabilities or other issues such as slow internet connections or the user having a mobile device.

  • How do people interpret websites without vision?
    They use voice over technology such as Jaws, Orca, NVDA

  • How does semantic HTML help make websites accessible?
    Its easier for developers to understand, its better on mobile devices, it improves search engine optimization.

  • Name a few practices to avoid when writing HTML.
    avoid using HTML tables, different table cells to contain, headers,footers, etc, instead make it more clearly laid out, also use good semantics, not bad semantics, avoid dashes, avoid abbreviations

  • What is a tab index?
    a global attribute that gives direction for a user navigating the site through the tab button

1 Like
  1. accessibility is basically writing good code to where everyone, even visually impaired, can have a good experience on your web page.
  2. Visually impaired people use screen readers as their eyes.
  3. Good semantics equals good code. By writing the right HTML markup for their intended purpose, it makes is more accessible for everyone.
  4. A few things to avoid would be:
    1. Don’t use dashes
    2. Don’t use abbreviations, spell it out completely
    3. Don’t use acronyms
  5. Tab index is an attribute that allows tabbable elements to have a custom tab order, instead of being tabbed through in their default. Using this is not a good idea, avoid it if you can.
1 Like
  1. accessibility is the organization and structure for ease of operability of you website.
  2. screen readers following semantic HTML.
  3. orgainization and readability equals ease of use, also screen readers follow format.
  4. legacy practices and lazy markups.
  5. tab index is used mostly when HTML is not semantic but is used to restore default source order.
1 Like
  1. What is accessibility?
    Accessibility is the practice of making your websites usable by as many people as possible

  2. How do people interpret websites without vision?
    Some users will rely on screen readers, which is software that reads digital text aloud.

  3. How does semantic HTML help make websites accessible?
    It properly labels and tags the elements so the Reader is able to interpret them

  4. Name a few practices to avoid when writing HTML.
    The use of improper semantic HTML

  5. What is a tab index?
    The tabIndex property of the HTMLElement interface represents the tab order of the current element.

1 Like
  1. What is accessibility?
    Accessibility within HTML is making sure that your code can be accessible by anyone that comes across it. That includes browsers, screen readers, visually impaired people etc.

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

  3. How does semantic HTML help make websites accessible?
    Semantic HTML makes websites more accessible by offering the right code for the right purpose. Semantics are used to help the computers understand what your writing which in turn makes it more accessible to users.

  4. Name a few practices to avoid when writing HTML.
    Using abbreviations, dashes and slang.

  5. What is a tab index?
    The tab index is an attribute you use to if you want the users to navigate the website in a specific order. This is however most often a bad idea.

1 Like