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
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
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.
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
The Web Speech API is a browser-based audio interface for processing audio inputs and outputs. We’d like to introduce the feature called Page To Speech for reading content out loud.
Page To Speech allows you to process page content and read it out loud for the user.
Continue reading “Introducing Page To Speech feature using Web Speech API”Browser keyboard navigation in macOS
Keyboard navigation through all focusable interactive elements isn’t enabled by default on macOS for Safari and Firefox browsers, but there is a way to solve that issue.
Continue reading “Browser keyboard navigation in macOS”Best practices for writing good alt text
The alt
attribute provides an alternative description for a non-text element1 and normally is not presented to the user but will be available under certain circumstances. The following is the most general guideline to follow while creating an alternate text:
Simple image gallery – accessible, responsive and with preloading
Creating an image gallery that is accessible, responsive and with automatic preload has always been a challenge.
Continue reading “Simple image gallery – accessible, responsive and with preloading”Determining viewport size – small, medium and large – using CSS
The browser viewport is the screen that actually shows the webpage. Determining its size might be handy when we want to provide some specific features for the viewport size. Here we want to utilize CSS media query and a little JavaScript to get the viewport size.
Continue reading “Determining viewport size – small, medium and large – using CSS”What is a Single Page Application?
A single-page application (known as SPA) is a web app implementation that loads only a single page, and then updates the content of that single document dynamically using JavaScript.
Continue reading “What is a Single Page Application?”Create custom and accessible tooltip
A tooltip – widely used feature across the web. Hundred of different approaches and implementations. The ARIA Authoring Practices Guide (APG) defines the tooltip in following way:
Continue reading “Create custom and accessible tooltip”