How do you measure the success of the website project?Article contains
  1. Key points of measuring the success of the website project
  2. What metrics and analytics do you use to track and report the website's performance and impact?
  3. Can data-driven decisions really optimize my website's user experience, content, and marketing strategies?
Font Italics: Improving Accessibility with Best PracticesArticle contains
  1. Are italic fonts always inaccessible?
  2. The impact of italic fonts on web accessibility
  3. Comparing three font families for readability: OpenDyslexic 3, Arial, and Tahoma
  4. Best practices for using italic fonts in web accessibility
  5. A summary of italic fonts and web accessibility
Hiding a text but making it accessible to a screen readerArticle contains
  1. Making hidden text accessible to screen readers: a guide
    1. Notes
  2. Difference between CSS class .visually-hidden and .sr-only
  3. Accessibility and Hidden Text: Can Screen Readers Detect It?
  4. How visibility: hidden affects screen readers
  5. Is there a way to test whether the hidden text is actually being read by screen readers after applying the .visually-hidden class?
  6. Why hide text from sighted users?
Female eye-looking, peeking through a triangle blue background

Hiding a text but making it accessible to a screen reader

Accessible hiding allows an element to be visually hidden while remaining accessible to assistive technologies such as screen readers. The approach is to apply a CSS class to the element that should not be shown.

There are several solutions for this type of CSS class, but we recommend following styles that cover hiding elements and optionally giving the ability to show the element when the element receives the focus or contains an element that has received focus. Useful for Skip to the main content links. See Adding a link at the top of each page that goes directly to the main content area.

Continue reading “Hiding a text but making it accessible to a screen reader”
The key to agile accessibility: Effective measurement of what mattersArticle contains
  1. Why should you track the performance of your agile accessibility efforts?
  2. What should you track to see if your agile approach to accessibility is effective?
  3. What are some common myths about accessibility in agile development?
Software testing. Two persons with multiple devices.

The key to agile accessibility: Effective measurement of what matters

Agile accessibility is the incorporation of accessibility principles and practices into the agile software development methodology.

Ensuring accessibility is an a constant and iterative process throughout the development cycle meaning making sure that software and web applications are designed and developed with accessibility in mind from the very beginning.

Tracking accessibility KPIs is a critical step in ensuring that your digital products are accessible to all users.

Continue reading “The key to agile accessibility: Effective measurement of what matters”
Sass with RTL and LTR support: creating multilingual websitesArticle contains
  1. Understanding Sass with RTL and LTR Support
  2. Key definitions and explanations
  3. A screenshot of a page with right-to-left content
  4. How to implement RTL and LTR support in Sass
  5. Changing the locale in Chromium-based browsers
  6. Tips and tricks for managing bi-directional text
    1. Time
    2. Parentheses
  7. Additional resources for managing bi-directional text
Arabic text example

Sass with RTL and LTR support: creating multilingual websites

Sass with RTL and LTR support isn’t available out of the box, but it can be done through simple Sass @mixin and @include rules that can be used across all Sass files.

RTL stands for Right-to-Left. It is a writing direction used in languages such as Arabic, Hebrew, and Persian. Supporting both right-to-left (RTL), more often bi-directional (BiDi), and left-to-right (LTR) representations of Web pages can be a challenge.

Note that you can also achieve the same with Less (which stands for Leaner Style Sheets).

Continue reading “Sass with RTL and LTR support: creating multilingual websites”
WCAG 2.2: New Web Accessibility Guidelines for Improved User ExperienceArticle contains
  1. WCAG 2.2: what's new
  2. Summary
Smartphone and two monitors next to it

WCAG 2.2: New Web Accessibility Guidelines for Improved User Experience

Web Content Accessibility Guidelines (WCAG) 2.2 was published as a W3C Recommendation web standard on October 5, 2023.

According to the World Wide Web (W3) site:

WCAG 2.2 was initiated with the goal to continue the work of WCAG 2.1: Improving accessibility guidance for three major groups: users with cognitive or learning disabilities, users with low vision, and users with disabilities on mobile devices.

This is huge news for anyone who creates websites, digital services, or mobile applications, or if you simply care about making the internet more accessible in general.

Continue reading “WCAG 2.2: New Web Accessibility Guidelines for Improved User Experience”
European Accessibility Act in questions and answersArticle contains
  1. European Accessibility Act summary
  2. Introduction
  3. Why was the European Accessibility Act created?
  4. Benefits of the European Accessibility Act
  5. What is the standard EN 301 549?
  6. How does WCAG relate to the European Accessibility Act (EAA)?
  7. How does EN 301 549 differ from other accessibility standards like WCAG or Section 508?
  8. Scope and application
    1. Which countries are affected by the EAA?
    2. Focus on procurement
    3. How does the EAA apply to non-web content?
    4. Adoption and enforcement
    5. What products and services fall under the regulation of the Act?
    6. Who does it apply to?
  9. What steps must businesses take right now to implement the act?
  10. When will it be enforced?
  11. How European Accessibility Act will be enforced?
    1. Market surveillance
    2. Complaint mechanism
    3. Product withdrawals from the market
    4. Expected penalties for non-compliance
  12. Exceptions
  13. What are the standard demands made by the Act?
  14. When services or goods fail to adhere to the new regulations, what can users do?
  15. Key documents
  16. Additional resources
Hide content in CSS pseudo elements from screen readersArticle contains
  1. Hiding content in CSS pseudo elements from screen readers: use case and solution
  2. How to hide content from screen readers in CSS pseudo elements
    1. Solution: Hiding Content in Pseudo Elements
    2. Example code: hiding content from screen readers
  3. Results of testing the implementation
  4. Limitations and considerations for hiding content in pseudo elements
Create perfect H1 heading for SEO and AccessibilityArticle contains
  1. The anatomy of the H1 heading
  2. Organize heading levels hierarchically in the same way that a book's index is organized
  3. Keep correct headings hierarchy importance to clearly highlight a page's structure and organization
  4. Include important keywords in your H1 heading
  5. Keep H1 heading unique across all pages
  6. The H1 heading should not be wrapped around the logo
  7. What should the length of an H1 element be?
  8. The H1 heading and page title
  9. Get more inspiration for the H1 description and page content outline
Trophy for the first place in the search results

Create perfect H1 heading for SEO and Accessibility

Headings communicate the organization of the page’s content. The h1 heading, which is usually the largest heading on a page, describes the main topic of the page and typically corresponds to the title of the page. It gives users an indication of what the page is about.

The h1 heading influences visitors’ decisions about whether or not to continue reading a page. It communicates the page’s relevance to search engines.

According to the WCAG headings rules, levels should be used hierarchically, with the main heading being the highest level (h1) and subheadings being subsequent lower levels (h2, h3, h4, etc.). This structure makes it easier for people with visual impairments, cognitive disabilities, and learning difficulties to easily understand the content of a web page.

In this article, we’ll go over all you need to know about the h1 heading and how to make the most of it from the perspective of the user, SEO, and accessibility!

Continue reading “Create perfect H1 heading for SEO and Accessibility”
Accessibility and Auditing Websites in Real Time made with Google Slides PresentationArticle contains
  1. Agenda
  2. Presentation