Accessibility
Assistive technologies, such as screen readers, are not able to give information about a button if it does not have an accessible name; therefore they simply name it “button”.
When a button has no text content or an aria-label property, SeoChecker will notify it.
Use a clear CTA when you add text content to the button:
<button> Shop now </button>
Use the aria-label attribute to describe the button when the label is not visible:
<!DOCTYPE html> <html lang="en"> <head> <title>Accessible icon button demo</title> <meta charset="utf-8"> <meta http-equiv="X-UA-Compatible" content="IE=edge"> <meta name="viewport" content="width=device-width, initial-scale=1"> <link rel="stylesheet" href="/style.css"> <link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet"> </head> <body> <h1>Accessible icon button demo</h1> <button class="btn" aria-label="Left Align"> <span class="material-icons" aria-hidden="true">format_align_left</span> </button> <button class="btn" aria-label="Center Align"> <span class="material-icons" aria-hidden="true">format_align_center</span> </button> <button class="btn" aria-label="Right Align"> <span class="material-icons" aria-hidden="true">format_align_right</span> </button> <button class="btn" aria-label="Justify"> <span class="material-icons" aria-hidden="true">format_align_justify</span> </button> </body> </html>
Learn more about Accessibility
On page SEO performance and page checkup.
Over 300 parameters for the deeper page analysis.
Share this Guide
Did you like it? Share it!
Web tools for modern developers. Try these one!
Over 50 generators, builders and validators to improve your SEO and web performances
Builders and generators
Generate required and most useful meta tags for your pages. Provide metadata about your website and help search engines to provide relevant content.
Social Tester and validators
Get Facebook data and engagement count by URL. Retrieve Open Graph data, "share" count, comment count and engagement from url.
Tester and validators
Test your Progressive Web App. Check the performance of your PWA, try to deliver high quality, engaging, fast and capable apps on every devices.
Test your Web Vitals metrics, score and diagnostic. Measures Google Core Web Vitals LCP, FID, CLS, TTFB, FCP, TTI, TBT and more.
Check SEO performance and page checkup. Over 250 parameters for the deeper page analysis. Find out more about the performance of your website.
Social Tracking script
Measure and track user interactions with your contents. Track all the events you want: downloads, clicks, video plays, checkout flow, engagement.
Check color contrast ratio WCAG 2 AA of your pages. Check if your color scheme meet the WCAG 2 AA contrast ratio thresholds.
Images
Quicly capture any web page screenshot and thumbnails. Get image rendering on desktop and mobile and thumbnails filmstrip with loading timing.