Accessibility and Performance article contains
  1. Known user impacts
  2. Technical aspects
  3. How performance impacts Accessibility
  4. Optimisations
  5. Conclusion
Two snails on a piece of woodAccessibility and Performance

Accessibility and Performance

Web performance is all about making websites fast: loading, rendering, and interacting. When pages load slowly or have a lot of content to load then the experience can be very clunky and unpleasant for all users. More resources to download mean also more data that needs to be transferred through the network and processed. Let’s explore user and business impact and how this could be improved.

Continue reading “Accessibility and Performance”
3 simple tips to make text over image more readable article contains
  1. Why making good contrast is important?
  2. Tips
    1. Text shadow
    2. Text stroke
    3. Text shadow vs text stroke comparison
    4. Black solid layer with opacity
  3. Summary
2 houses covered in snow3 simple tips to make text over image more readable

3 simple tips to make text over image more readable

If you add text over a background image, make sure there is enough contrast to make it readable. Subtle changes may be made to boost contrast without changing the overall aesthetic of the site.

The Web Content Accessibility Guidelines (WCAG) is an internationally recognized standard created by the World Wide Web Consortium (W3C), and WCAG calculates it as a ratio describing the relative luminance of the text and background.

Let’s then see 3 tips to make text over image more readable.

Continue reading “3 simple tips to make text over image more readable”
SEO and traps with creating meta description in WordPress article contains
  1. How actually meta description is created in WordPress
  2. Traps
  3. What, if meta descriptions differ from each other
  4. Are there other ways to generate meta description?
SEO letters in bricksSEO and traps with creating meta description in WordPress

SEO and traps with creating meta description in WordPress

An HTML element that offers a brief overview of a web page is known as a meta description (example <meta name="description" content="Describe your page content here"/>). The meta description tag of a website is displayed as part of the search snippet on a search engine results page (SERP) and is intended to provide the user with a summary of the content on the page and how it relates to their search query.

Search results snippet example from Google

The click-through rate (CTR) can be influenced by the meta description. That is, they can impact whether a person visits your page. As a result, it is the critical on-page SEO factor.

In this article, we’ll cover the traps that are hidden while using WordPress and plugins that automate that process.

Continue reading “SEO and traps with creating meta description in WordPress”
Introducing Page To Speech feature using Web Speech API article contains
  1. Major challenges
  2. Benefits
  3. What's Web Speech API?
  4. Limitations and drawbacks
  5. Browser compatibility
  6. Demo
  7. Feedback
Browser keyboard navigation in macOS article contains
  1. Why can't I use my keyboard to move between links on macOS?
  2. The solution for enabling navigation through all focusable interactive elements
  3. Safari browser settings
Best practices for writing good alt text article contains
  1. Supplemental information
  2. Usage scenarios
  3. Example code
  4. Best practices for writing good alt text
Determining viewport size - small, medium and large - using CSS article contains
  1. CSS code
  2. How do I get the value of the viewport size?
  3. The workable example
Create custom and accessible tooltip article contains
  1. How do you code tooltips?
  2. Notes
    1. Requirement - reduce motion using CSS prefers-reduced-motion
    2. Toolip without JavaScript
    3. Is our tooltip implementation ideal?
  3. Real code example
    1. How a screen reader works with our tooltip (video)
  4. Questions related to the tooltip
    1. Do screen readers read tooltips?
    2. How does a user access a tooltip?
    3. Why is it called a tooltip?
    4. Should you put links in tooltips?