Margin: auto Challenges

The Zombie: Margin: auto without setting a width or display: block Always a Zombie? Yes Severity: medium-low Why is it a zombie: It won’t work, but it won’t break your site either. Cure the Zombie by: Ensure the element you’re centering with margin: auto; is set to display: block; and that a width has been set. If neither of those things... Read More

Empty headings

The Zombie: Empty headings i.e. headings (<h1> through <h6>) with no content or no useful content. Always a Zombie? Yes Severity: serious for screen readers; less serious for others Why it’s a Zombie: Just like sighted users screen reader users often scan through headings. If a heading is empty the screen reader will say there’s... Read More

Leaving off units

The Zombie: Leaving off unitsAlways a Zombie? No (some things shouldn’t have units)Severity: medium-high Why is it a zombie: It can prevent the property from workingCure the Zombie by: Add units to all dimensions unless they are 0 or you are using line-height. Line-height is at its most robust and flexible when used as a multiplier. A unit-less number is ideal for line-height.... Read More

Background-repeat: none

The Zombie: Background-repeat: none Always a Zombie? Yes Severity: medium-low (it doesn’t work, but a repeating background is unlikely to make or break your site Why is it a zombie: Does nothing. The background image continues to repeat Cure the Zombie by: Use background-repeat: no-repeat. I’m not sure the exact origin of why this goes against the typical CSS... Read More

Using the background-color property for a background gradient

The Zombie: Using the background-color property for a background gradientAlways a Zombie? YesSeverity: medium – (It doesn’t work, but its unlikely to break the site)Why is it a zombie: The gradient won’t show up at all.Cure the Zombie by: Despite gradients being literally colors, they are treated as images. Move the gradient to the background-image property and everything works.... Read More

No alt text attribute on images

The Zombie: No alt text attribute on images Always a Zombie? Yes Severity: medium – has accessibility and SEO implications Why is it a zombie: Search Engines and Screen Reader Users won’t be able to access/understand the content. Cure the Zombie by: Adding a blank alt attribute to decorative images and a short, clear description to all other images. No need... Read More