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
Tester and validators
Validate your Css file sheet with W3C validation Service. Check if the markup of your Cascading style Sheet document is W3C compliant.
Converters
Pixel - Rem - Point units converter. Convert Pixel to REM or Point unit in seconds and vice versa with this free converrter.
Builders and generators
Build your Service Workers and enrich user experience. Transform your website in a huge Progressive Web App and enrich users experience.
Compressor
CSS minifier tool. Optimize and compress your CSS code, make your website faster and reduce network payload sizes.
Find out which theme, version, author and license a WordPress site is using trought Wordpress Theme detector tool
Server and proxy
Retrieve your Public IP Address and geolocation. Get your IP address, ISP-Organization information and geolocation data for free.
Convert instantly color codes from HEX to RGB (red, green, blue) color schema and vice versa. Insert color and try it for free.
IP Address and Domain Name Geolocation Lookup Tool. IPv4, IPv6 and domain name Geolocation. Accurate IP and Domain name lookup database.