Reading Assignment: Accessibility and HTML

  1. Accessibility is making sure your website can be used by as many people as possible, despite certain conditions which might make it impossible otherwise like being vision impaired.

2)Screen readers, voice assistants and screen magnifiers help people who are visually handicapped or impaired use websites.

  1. Semantic HTML is better for SEO, it helps the screen reader navigate the website.

  2. Avoid using dashes ,

    for every section, abbreviations for example.
  3. It specifies the tab order of elements in html.

2 Likes
  1. Its in the name: Making your website easy to use for the largest percentage of users possible.

  2. Through screen readers.

  3. Screen readers will have an easier time interpreting text if its properly written, by separating headers, paragraphs, footers and etc.

  4. Using abbreviations, dashes instead of ā€œtoā€ (such as 5-7 instead of 5 to 7), not writing with clear semantics (using divs when could do the job better).

  5. It’s using the tab key to navigate buttons on a set order on a webpage, as well as make ā€œuntabbableā€ elements tabbable.

2 Likes
  1. What is accessibility?

  2. How do people interpret websites without vision?
    They can use a screen reader.

  3. How does semantic HTML help make websites accessible?
    A screen reader can read the text clerer and deliver it in a more useful manner with stopping after each Tag.

  4. Name a few practices to avoid when writing HTML.
    Not using semantic HTML, Not using clear language, using abbreviations and acronyms. Ignoring keyboard accessability.

  5. What is a tab index?
    Normally you can use the TAb button on your keyboard to tab through the buttons on your website but only if you use the correct tag. With the div elements you loose this function. But you can add it in by using the tabindex attribute.

2 Likes
  1. To allow as many users as possible to interact with your website
  2. By using Screen Reader, screen magnifiers and voice assistants
  3. By using the correct HTML elements for their intended purpose as much as possible, which allows for an attractive layout and the content making logical sense in the correct order for the user
  4. Avoid using abbreviations, acronyms, spaces in file names and HTML tables to create layouts
  5. Allows the user to navigate through the website in the correct order by using the tab key
2 Likes
  1. Accessibility is the practice of making your websites usable by as many people as possible.

  2. They use screen readers, which is software that reads digital text aloud.

  3. you can use a combination of CSS and JavaScript to make just about any HTML element behave in whatever way you want.

  4. Empty alt attributes.

  5. indicates that its element can be focused, and where it participates in sequential keyboard navigation (usually with the Tab key, hence the name).

3 Likes
  1. Accessibility is a practice that allows equal opportunity for everyone
  2. People without vision use screen readers which read the webpage out loud
  3. Semantic HTML allows screen readers to go through the document by element
  4. Using improper tags, line breaks and unclear language
  5. Tab index is an attribute that allows you to go through a webpage using the tab key
2 Likes
  1. Accessibility is making sure that the website can be used by as many users as possible, including those with impairments.
  2. Voice assistants, screen modifiers, screen readers
  3. Semantic HTML provides a clear and easy path for the user. It’s also good for SEO as the search engine gives more importance to headings, strong text etc.
  4. Avoid dashes/abbreviations/slang, expand acronyms at least once or twice.
  5. Tabindex specifies the tab order of an element. It helps users that are navigating the website using the tab button.
2 Likes
  1. What is accessibility?
  • accessibility allows your website is easily understood by any kind of readers esp readers with visual/ hearing impair.
  1. How do people interpret websites without vision?
  • by using screereader
  1. How does semantic HTML help make websites accessible?
  • by ā€˜labeling’ them for their intended purpose so instead users/ screen readers can approach it in logical manner. It gives meaning & structure to the content.
  1. Name a few practices to avoid when writing HTML.
  • not using semantics, not using clear language, using acronyms without explanation
  1. What is a tab index?
  • tabindex specifies the order of an element when tab button is used for navigating. if we only use div element, then we can’t use tab to navigate.
2 Likes
  1. What is accessibility?

Accessibility is making sure that your site is available to anyone, regardless of certain disabilities and if they have a mobile phone or slow network speeds.

  1. How do people interpret websites without vision?

Those who are Visually impaired often use magnifier applications or screen readers to read the text aloud.

  1. How does semantic HTML help make websites accessible?

They are easier to process for CPUs, so that people with slower network speeds do not have to spend as much CPU power to operate your site. It also improves SEO (Search Engine Optimization) so that your website is easier to find.

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

Avoid using dashes, make sure to expand any abbreviations, always right out the full acronyms at least once or twice. Also avoid using <div>

  1. What is a tab index?

A tabindex makes content accessible from using keyboard navigation. The tabindex also allows you to place in what order you want the tabs to be in, only when accessing them through a keyboard navigation.

2 Likes
  1. Making a website aviable for many people as we can.
  2. With a screenreader
  3. Because it has clear instructions. Good for Search engines like Google or any Reader of the code. So for the Codereader it is way easier and understandable. And better on mobile + easier to develop with.
  4. dashes, abbreviations, acronyms
  5. With the tab button you can navigate through the context/ website
2 Likes
  1. Accessibility is how effecient disabled people can interact with your site. It describes how semantic your code has been written. The more accessible it is, the better. .

  2. On mac they use VoiceOver, which reads out part of the source code. Thats why attributes are important e.g when images are used. If the image is not only for decoration but also vital to the pages context you need to describe the image in an attribute. They also use screen reader

  3. The code is easier to review. Better on mobile and more responsive. And better connects information for the google search engine.

  4. Not writing semanticly corret is a disadvantage, especially when the code needs to be maintained (fixed, reviewed etc). Dont use div for everything. Use clear language (proper elements)

  5. Tabindex attribute allows non tabbable elements to be tabbable, and it can make non tabbable elements recieve programmatic focus.

2 Likes
  1. accessibility means making things usable for as many people as possible.
  2. people without vision can access the website trough screen readers.
  3. proper semantic html gives better look and undestanding of the page,also makes it more responsive…
  4. using unclear language ,using acronyms,dashes and slangs…
  5. tabindex is used to set up or prioritize tabbed buttons in an element…
2 Likes
  1. What is accessibility?
    Navigation assistance for people with visual and physical impairments.
  2. How do people interpret websites without vision?
    By using screen readers.
  3. How does semantic HTML help make websites accessible?
    By giving screen readers information about what each section is, which helps navigate the content by skipping unimportant parts and getting to the content.
  4. Name a few practices to avoid when writing HTML.
    Not using semantic HTML from the beginning, using dashes when we can avoid it (i.e. 5-7 should be written as 5 to 7), not expanding abbreviations, and not expanding acronyms at least once or twice–also, making things unnecessarily complicated and messy.
  5. What is a tab index?
    The tabindex attribute overwrites the default order of tabbable elements with a custom order. Should be avoided in general, but its most valuable use case is for elements that are not normally tabbable, or for when the tabbable elements’ default order is weird or doesn’t make sense.
1 Like
  1. Accessibility, in terms of programming, is the practice of making your websites useable to as many people as possible.

  2. People who are visually impaired use screen magnifiers or screen readers to aid them in interpreting websites.

  3. Semantic HTML makes websites easier to develop with, makes mobile experiences more enjoyable, helps with search engine inquiries, and allows screen readers to function a lot better for the user.

  4. Don’t use presentational HTML or breaks in place of the appropriate elements, so screen readers can function properly. Avoid using dashes, abbreviations, and acronyms.

  5. A tab index attribute is a global attribute that allows elements to have a custom tab order.

2 Likes
  1. What is accessibility?
    Accessibility is making sure your website is usable by anyone no matter their disabilities, the platform they are using, etc.
  2. How do people interpret websites without vision?
    They use screen readers to listen to the text out loud.
  3. How does semantic HTML help make websites accessible?
    It gives the screen reader clearer instructions by being more ordered when going navigating the website.
  4. Name a few practices to avoid when writing HTML.
    Avoid using line breaks, abbreviations, dashes, acronyms, HTML tables, etc.
  5. What is a tab index?
    It is used to allow tabbable elements to have a very specific tab order instead of just having a default tab order.
2 Likes
  1. Accessibility is the practice of making websites usable by as many people as possible, including people with impairments or disabilities.
  2. People without vision can interpret websites with screen readers
  3. Semantic HTML help make websites accessible thanks to the structure it provides, so that users will find it clearer and easier to navigate.
  4. Typical practices to avoid when writing HTML are : use of abbreviations, dashes or acronyms; over-use of
    and instead of proper semantics.
  5. 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, and therefore to receive focus.
2 Likes
  1. What is accessibility? Accessibility means that anyone can use the features and content of the website with multiple senses and tools since the primary mode is visual.
  2. How do people interpret websites without vision? there are a variety of tools such as text readers, voice assistants that can provide an auditory descriptive experience.
  3. How does semantic HTML help make websites accessible? Semantic HTML ensures that the elements are serve their intended purpose and can be used by accessibility devices. There is more than one way to write some elements but there is often a best way where selecting a specific HTML element brings added functionality and clarity. It’s like speaking a language more fluently with a better vocabulary.
  4. Name a few practices to avoid when writing HTML. Use semantic HTML with good content structure so that accessibility tools like screen readers can read the content in a useful way. Use clear, simple language without characters that can’t be read by screen readers and also avoid abbreviations. Use modern HTML structure and useful text labels and buttons.
  5. What is a tab index? Directly from W3…The tabindex attribute specifies the tab order of an element (when the ā€œtabā€ button is used for navigating).

The tabindex attribute can be used on any HTML element (it will validate on any HTML element. However, it is not necessarily useful). I didn’t really understand it but it looks like it is used for keyboard navigation.

2 Likes
  1. What is accessibility?
    The way in which users or other programs navigate through the website with ease.

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

  3. How does semantic HTML help make websites accessible?
    It gives structure to a website and makes it easier for web crawlers to find relevant information

  4. Name a few practices to avoid when writing HTML.
    abbreviations, writing HTML and CSS simultaneously, don’t use div where correct semantics are available

  5. What is a tab index?
    A tab index is an attribute that allows tabable elements to have a specified tab order.

2 Likes
  1. What is accessibility? Accessibility is the practice of making yoour websites usable by as many people as possible. Accessibility means that any user can all of a websites or applications features and content, regardlesss of how the user accesses the web - even and especially users with physical or mental impairments. Applications and websites should be understandable and usable by people regardless of auditory, visual, physcial, or cognitive abilities. Websites should also not cause hard: web features such as motion can cause migraines or epileptic seizures.
  2. How do people interpret websites without vision? People without vision interpret websites via the use of screen readers and voice assistants like Alexa and Google Home which are forms of software which reads digital text aloud…
  3. How does semantic HTML help make websites accessible? Semantic HTML improves accessibility whilst concurrently improving SEO as assistive technologies mostly tend to make use of semantic HTML information. Semantic HTML information is structured in a tree of information called the accessibility tree. Semantic HTML aids a screen reader user as it provides robust content structure with headings, paragraphs, lists, et cetera.
  4. Name a few practices to avoid when writing HTML.
  • Not making use of the proper/correct semantic HTML elements
  • Writing headings, paragraphs, et cetera using presentational HTML and line breaks which makes using a screen reader very inefficient and difficult for the end user. Moreover, this bad markup practice makes it more difficult to style the content using CSS, or manipulate it with JavaScript, for example, because there are no elements to use as selectors.
  • Don’t use dashes if you can avoid it. Instead of 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.
  • Creating page layouts using HTML tables
  • Creating a layout using only nested
    elements
  1. What is a tab index? The tab index attribute is primarily intended to allow tabbable elements to havea custom tab order (specififed in positive numerical order), instead of just being tabbed through in their default source order.

An integer attribute indicating if the element can take input focus (is focusable ), if it should participate to sequential keyboard navigation, and if so, at what position. It can take several values:

  • a negative value means that the element should be focusable, but should not be reachable via sequential keyboard navigation;
  • 0 means that the element should be focusable and reachable via sequential keyboard navigation, but its relative order is defined by the platform convention;
  • a positive value means that the element should be focusable and reachable via sequential keyboard navigation; the order in which the elements are focused is the increasing value of the tabindex . If several elements share the same tabindex, their relative order follows their relative positions in the document.

here are two other options for tabindex :

  • tabindex="0" — 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.

Whilst the above addition allows us to tab to the buttons, it does not allow us to activate them via the Enter/Return key.

2 Likes
  1. What is accessibility?
    Accessibility is the practice of making your web site usable by as many people as possible.

  2. How do people interpret websites without vision?
    By the use of a screen reader.

  3. How does semantic HTML help make websites accessible?
    It allows people with visual and other impairments to access web sites as easy as others without impairments so they can used by all as they were intended to be used.

  4. Name a few practices to avoid when writing HTML.
    Using the incorrect elements, using subpar content structure, using unclear language in your text content such as slang terms and also characters that don’t get read out loud, using abbreviations in your text content, using acronyms in your text content, using tables, using old HTML, etc.

  5. What is a tab index?
    Tab index gives tabbable elements a custom tab order instead of the default tab order.

2 Likes