Reading Assignment: Accessibility and HTML

Javascript Course 2021
#383
  • What is accessibility?
    Making the website as readable for those with disabilities and viewable by all browsers.
  • How do people interpret websites without vision?
    With a screen reader or voice assistants to read the page.
  • How does semantic HTML help make websites accessible?
    Using the right elements helps screen readers navigate through the site content easier.
  • Name a few practices to avoid when writing HTML.
    Using tables to create page layouts like divs.
    Using generic tags without semantic information.
  • What is a tab index?
    Allows the browser to tab through the page content.
2 Likes
#384
  1. It is is a way to position the website when someone search for it, for example through headings elements.
  2. Often use screen readers to read out the alt text to them.
  3. It make it easier to develop, better on mobile, good for SEO, the document is easier to find for customers.
  4. Avoid using over complex languaje. Using different table cells for header, footer, sidebar.
    5.It is an 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
#385
  1. The fact of making a website accessible to anybody, considering dissabilities, language, speed connection, referencing and so on. Accessibility at large.
  2. They use a screen reader, that’s where good sematics comes in play. Bad semantic could easily confuse the screen reader and resulting in a poor user experience.
  3. From one side it makes it easier for the screen reader on the other side, a clear semantic helps engine search such as google to repertoriate better the website.
  4. Avoid the
    structure a document. Avoid poor description of button. Avoid poor descriptions of pics.
  5. That’s an atrribute that allow tabbable element to have a custom tab order.
2 Likes
#386

1/ semantic HTML plain and simple, labels for images. screen readers can read out for the visually impared.
2/ Google webcrawlers can notice sections of website using semantic html. Screen readers read them out.
3/ using out of date general nom-semantic elements in content sectioning or text content such as ‘div’ instead more specific terms such as ‘header’, ‘footer’, ‘article’, ‘aside’, ‘ol’ ‘menu’, and so on. For inline text using for example and older the element ‘bold’ instead of ‘strong’, where strong has semantic meaning eventho it looks the same as bold visually.
4/

  • Not using semantic tags, making disordered page thats hard to navigate the code.
  • Not providing any alternative text for images
  • Using abbreviations, acronyms, vague language or slang.
    *using ‘div’ instead of ‘button’ to create buttons as they they dont tab with native keyboard accessability automatically

5/ For custom tabbing when it needs to be ordered differently to how it is set out in the code, or you used ‘div’ instead of 'button to vreate your code.

1 Like
#387
  1. What is accessibility? HTML and accessibility
    This means using the correct HTML elements for their intended purpose as much as possible . You might wonder why this is so important. After all, you can use a combination of CSS and JavaScript to make just about any HTML element behave in whatever way you want.
  2. How do people interpret websites without vision? through screen readers they can do so
  3. How does semantic HTML help make websites accessible? When we write semantically correct HTML, we’re letting the browser know what type of content it’s dealing with and how that content relates to other content . By doing this, assistive technology is more easily able to do its job because it has a structure that it can work with.
  4. Name a few practices to avoid when writing HTML .code without checking the console simultaneously ,disordered code, When writing accessible HTML we avoid using HTML tables
  5. What is a tab index? The HTML tabindex attribute is used to manage keyboard focus . Used wisely, it can effectively handle focus within web widgets. Used unwisely however, the tabindex attribute can destroy the usability of web content for keyboard users
#388
  • What is accessibility?Accessibility is the practice of making your websites usable by as many people as possible, accessible sites is part of the law in some countries.
  • How do people interpret websites without vision? With screen magnifiers and screen readers.
  • How does semantic HTML help make websites accessible? When is well structured and organized is better and more accessible to handicaped people.
  • Name a few practices to avoid when writing HTML.
    disordered code, lack of fundamental structure, code without checking the console simultaneously, code with abbreviations and more
  • What is a tab index? The tabindex attribute specifies the tab order of an element (when the “tab” button is used for navigating).
1 Like
#389
  1. This is a component to web development which allows handy capped readers to understand your webpage despite their impediments. It can also improve the hit rate with search engines.
  2. With screen readers
  3. It creates structure to a website which a screen reader can read.
  4. Avoid using abbreviations, acronyms, dashes and tables to create structure to a webpage.
  5. It specifies the tab order and can be used for navigation.
1 Like
#390
  1. Making sure the user has full use of your content.
  2. Screen magnifiers.
  3. Making your website more findable and creating more order for the user.
  4. HTML tables and marked up buttons using div.
  5. The tab order.
1 Like
#391

1.ensure correct markups for keyboard accessibility
2.using the keyboard inputs and sound
3. screen readers, easier for a user to navigate
4. tables, bk, and using div for everything
5. intended to allow tabbable elements to have a custom tab order, instead of just being tabbed through in their default source order.

1 Like
#392

  1. How to make a website useable and navigable by anyone, including the blind/deaf/physically-disabled. It also gives SEO to the website.

  2. Using a “screen reader” software that speaks the contents of the webpages.

  3. Semantics gives structure and “order” to blob of words on a website.

  4. As summarized in https://www.w3schools.com/html/html_accessibility.asp,
    a) Clear and easy to understand language while avoiding characters that a screen reader couldn’t parse properly. E.g. abbreviations, acronyms, HTML tables to create page layouts
    b) Good link text

  5. A semantic element to make keyboard navigation easier by pressing “Tab” key to sequentially select elements in the website.

2 Likes
#393

1.) people with certain disabilites can easily access information on a website
2.) ???
3.) makes it easier to navigate between different aspects of a website using tab button
4.) by using abbreviatures, dashes, acronymse, etc.
5.) helps to set up prioritize tabbed buttons

2 Likes
#394

1. What is accessibility?
Accesibility is the practice of making the website usable by as many people as possible, like a visual impairments person.

2. How do people interpret websites without vision?
Throught a screen reader.

3. How does semantic HTML help make websites accessible?
Semantic helps making accessible websites by creting a clear path for the screen reader to follow the content of the website.

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

  • Use <button> instead of <div>s

  • Avoiding abbreviations, acronims…

  • etc

5. What is a tab index?
A tab index specifies the tab order of an element, and can be used to make a costum order in the tab navigation.

1 Like
#395

1 it is the practice of mang a website as readable and easy to use as possible for people the disabilities, using mobile or having a poor network connection

2 each part or element of a web page will be named by its type, then its description or content is read

3 by making it understandable in its organization and content

4 complex visual peces that don’t have an easy to understand 2nd option to be read
bad or inexistent mage description
complex website organsaton

5 a way to organize the order in which an element or the whole page is read using the tab button

2 Likes
#396

What is accessibility?

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

How do people interpret websites without vision?

  • Screen readers, which is software that reads digital text aloud.

How does semantic HTML help make websites accessible?

  • Semantic HTML is the practice of using the correct element to create a functional HTML website. By using the correct element, this makes accessibility to all user possible. When you supplement one element with the proper element to your HTML document, this can cause problems when the document needs to be accessible to other disabled or foreign users.

Name a few practices to avoid when writing HTML.

  • Using unclear language
  • Not using the appropriate elements
  • Not using meaningful text labels

What is a tab index?

The tab index allows a user to tab the an HTML website.

2 Likes
#397
  1. What is accessibility?

When someone describes a site as “accessible”, they mean that any user can use all its features and content, regardless of how the user accesses the web — even and especially users with physical or mental impairments.

  • Sites should be accessible to keyboard, mouse, and touch screen users, and any other way users access the web, including screen readers and voice assistants like Alexa and Google Home.
  • Applications should be understandable and usable by people regardless of auditory, visual, physical, or cognitive abilities.
  • Sites should also not cause harm: web features like motion can cause migraines or epileptic seizures.

By default, HTML is accessible, if used correctly. Web accessibility involves ensuring that content remains accessible, regardless of who and how the web is accessed.

  1. How do people interpret websites without vision?

They use screen-readers

Screen readers are text to speech softwares in computers that read out the content of web pages to visually impaired users. As you can imagine, blind users do not see the contents of a webpage like sighted users do. Instead they rely on screen readers to read out the content and generally rely on them to navigate the web.

Navigation is done using the keyboard

Unlike sighted people who mainly navigate the contents of a website with mouses and trackpads, visually impaired people rely on keyboards to navigate contents of a web page. How easy the navigation of a site is depends on how well structured the content is.

They ‘Scan’ Web Contents

Just like sighted users who don’t read every content of their webpage, but rather scan till they find something they are looking for, visually impaired users follow this pattern of web behavior. The only difference being that, they do it with screen readers. They tell the screen readers to read out the major components of the page for them. The success of the ‘scanning’ endeavor of course depends on how accessible the page is. Otherwise they’d be stuck with reading every content of the page — an act that can prove dreary.

They can read super fast!

A screen reader can read out the content of a webpage at a speed that’s impossible for sighted people to follow. This seems to be the default mode most visually impaired users use for easy/light reading. For complex subjects that require deep thoughts however, they may lower the speed of the screen reader. The ability to listen to stuff at a very fast speed is an art users of screen readers have mastered.

They memorize sites they visit often

Just like how sighted users know their way around websites they visit often, same applies to blind users. The only difference being they memorize how the content is organized. So imagine if an update that dramatically changes the structure of a site occurs, this could cause confusion to a visually impaired user.

They can reorder links alphabetically

There are websites that have loads of links. An e-commerce site for example. How does a blind user navigate these links to pick the very one they are interested in? They use their keyboard. There’s a key designed to help them reorder links alphabetically. Say they want a link that starts with A, that can type in the letter A after reordering — an action that opens the link right away.

Image description can be a pain

Screen readers can’t describe an image — at least not yet. What they do is read out the content of the alt tag. So how well a blind user understands an image depends on how well a developer or uploader of the images describe it or if they even describe it. And since a lot of website experiences today are accompanied with the use of photos, you can imagine how painful it is when the alt tag/feature isn’t used or photo properly described.

Too many Ads can ruin the experience

Ads can be a pain for anyone. But sighted users have the advantage of ignoring ads once they recognize them. Screen readers can’t make this distinction. Instead it treats every content of a webpage as vital which visually impaired users have to acknowledge.

Conclusion

This is not an exhaustive list of how visually impaired people use the web. But by understanding these behaviors, we can design and develop better accessible products. Here are links to other resources that can be helpful and give better knowledge of how visually impaired people use the web:

  1. How does semantic HTML help make websites accessible? Structural, semantic HTML is the key starting point toward good accessibility practices. When a screen reader, or any sort of assistive device scans a web page, it gets information about the Document Object Model (DOM), or the HTML structure of the page . No styles or JavaScript will be read by a screen reader.
  2. Name a few practices to avoid when writing HTML.

10 Common HTML Mistakes to Avoid

  1. Don’t place Block elements within Inline elements. …

  2. Always have the alt attribute for image tags. …

  3. Don’t use line breaks to show a list. …

  4. Don’t use and for bolding and italicizing. …

  5. Don’t use multiple line breaks. …

  6. Avoid Inline Styles. …

  7. Don’t add(or remove) the border attribute in HTML.

  8. What is a tab index?

    9.

The tabindex attribute specifies the tab order of an element (when the “tab” button is used for navigating). The tab index attribute can be used on any HTML element (it will validate on any HTML element. However, it is not necessarily useful).

2 Likes
#398

What is accessibility?

Accessibility is when any user can use all features and content on a website regardless of how they access the web.

How do people interpret websites without vision?

People without vision interpret websites by using tools called screen readers to read out the alt text to them.

How does semantic HTML help make websites accessible?

Semantic HTML helps make websites accessible through the use of alt (alternative) attributes used within the HTML. Here you specify descriptive text for users who cannot see an image.

Name a few practices to avoid when writing HTML.

Use the correct HTML elements for their intended purpose as much as possible.

Avoid using non-semantic markup.

What is a tab index?

The tab index is an attribute that allows elements to have a custom tab order instead of just being tabbed through in their default source order.

1 Like
#399
  1. What is accessibility?

Accessibility is making websites as user-friendly as possible to as many people as possible. This includes people with disabilities, people using mobile devices, and people with weak internet connections. Accessibility increases website traffic, which is good for business. In some countries, accessibility is required by law.

  1. How do people interpret websites without vision?

People in this situation use screen magnifiers or screen readers that read text aloud.

  1. How does semantic HTML help make websites accessible?

Semantic HTML makes sites accessible by using the right/correct semantic element for the right/correct job. To someone using a screen reader, semantic HTML on a website presents an easy to navigate webpage(s) with a superb content structure having headings, paragraphs, lists and other elements.

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

• Jargon and slang need to be avoided when writing HTML.
• It’s better to avoid using dashes when writing HTML For example, replace 2-6 with 2 to 6.
• Abbreviations must be avoided. For example, it’s better to replace Sun with Sunday.
• Acronyms should be expanded, and the tag can then be used to describe them.
• Use of tables should be avoided because they result in confusing readouts with screen readers.

  1. What is a tab index?
    A tab index is an attribute that indicates the tab order of an element during tab button use for navigating and can be used on any HTML element…
1 Like
#400

  • What is accessibility?
    Accessibility is how about making (the content of) your website accessible/readable by as many people as possible

  • How do people interpret websites without vision?
    with screen magnifiers, screen readers and with voice assistants

  • How does semantic HTML help make websites accessible?
    it helps by making it easy and clear for the reader to read and interpret.
    also helps with findability ( SEO)

  • Name a few practices to avoid when writing HTML.
    expand acronyms
    avoid dashes ( use: a to m instead of a-m)
    do not use abbreviations (use : August instead of aug)

  • What is a tab index?
    the tab index allows tabbable elements to have a custom tab order
    [/quote]

1 Like
#401

1.) Accessibility describes the properties of a website, that make it readable and usable by everyone, especially including people with physical or mental impairments.
2.) By using a screen reader.
3.) A screen reader will interpret a website in a certain way, with a more narrow outcome, than by seeing the website on the screen. That is why “dirty HTML” may work for most users, but usually makes a site unaccessible with a screen reader. That is why the outcome using a screen reader should play a major role in the strategy of a site administrator or website programmer.
4.) Practices to avoid:

  • Using dashes
  • Using abbreviations
  • Overall, using bad semantics
  • Using too simple table layouts, that can lead to bad interpretations by screen readers

5.) The tab index specifies the order of elements, when navigating a site with the tab key.

1 Like
#402
  1. What is accessibility?

Accessibility is “ensuring that a technology or content-type is usable and consumable by all audiences” according to Virtualvisiontech.com(http://www.virtualvisiontech.com/define-access/#:~:text=Specifically%2C%20accessibility%2C%20means%20ensuring%20that,degree%20that%20it%20is%20possible.), Elaborating on this definition, seems accessibility is ensuring that most users can effectively use and navigate the website regardless if a user has a disability or not.

  1. How do people interpret websites without vision?

    Via screen readers

  2. How does semantic HTML help make websites accessible?

According to HTML: “A good basis for accessibility” article Semantic elements have “built-in styling and built-in functionality, arguably file size is smaller, and search engines give more importance to keywords inside some semantic elements.” To elaborate on some of this, some elements come with built-in styling and functionality so a coder doesn’t have to add Javascript or CSS which likely makes file size bigger, so that may help a website be more responsive according to the homework article. Also, if Search engine is giving more importance to keywords in your site then users may be able to find your site easier making it more likely to have better accessibility.

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

1.Avoid using div and span elements if a semantic element is available to use instead.
2.ONLY use aria-label attribute on links if no other options you are aware of is available for the label. For e.g. if have a logo or burger-bar picture as a link and don’t want text to display, so instead of putting text in middle of tags, because don’t want text to display, may use aria-label attribute.

  1. What is a tab index

A tabindex is an attribute for elements that are tabbable and non-tabbable. Tabindex is an attribute where can specify what order want specific tabbable elements to be tabbed to in. tabindex=”0” makes a non-tabbable element tabbable.

1 Like