Skip to main content
CSS-Tricks
  • Articles
  • Notes
  • Links
  • Guides
  • Almanac
  • Picks
  • Shuffle
Search

Articles Tagged
semantics

40 Articles
{
,

}
Image
Direct link to the article The Web’s Worst Default
semantics

The Web’s Worst Default

There are a lot of great defaults when it comes to browsers and the web. Think about all the accessibility features that are baked into HTML so that you don’t have to do weird stuff, like this example from Manuel…

Image
Robin Rendle on Jul 7, 2021
Image
Direct link to the article HTML Inputs and Labels: A Love Story
accessibility forms inputs labels semantics

HTML Inputs and Labels: A Love Story

Most inputs have something in common — they are happiest with a companion label! And the happiness doesn’t stop there. Forms with proper inputs and labels are much easier for people to use and that makes people happy too.…

Image
Amber Wilson on Mar 30, 2021 Updated on Apr 2, 2021
Image
Direct link to the article Copyediting with Semantic HTML
copywriting semantics

Copyediting with Semantic HTML

Tracking changes is a quintessential copyediting feature for comparing versions of content. While we’re used to tracking changes in a word processing document, we actually have HTML elements capable of that. There are a lot of elements that we can …

Image
John Rhea on Nov 17, 2020 Updated on Nov 18, 2020
Image
Direct link to the article Why Do Some HTML Elements Become Deprecated?
html elements semantics

Why Do Some HTML Elements Become Deprecated?

The internet has been around for a long while, and over time we’ve changed the way we think about web design. Many old techniques and ways of doing things have gotten phased out as newer and better alternatives have been …

Image
Ryan Grist on Apr 2, 2020
Image
Direct link to the article Quoting in HTML: Quotations, Citations, and Blockquotes
blockquote cite quotes semantics

Quoting in HTML: Quotations, Citations, and Blockquotes

It’s all too common to see the incorrect HTML used for quotes in markup. In this article, let’s dig into all this, looking at different situations and different HTML tags to handle those situations.

There are three major HTML elements …

Image
John Rhea on Dec 10, 2019
Image
Direct link to the article Breakout Buttons
buttons links semantics

Breakout Buttons

Andy covers a technique where a semantic <button></button> is used within a card component, but really, the whole card is clickable. The trick is to put a pseudo-element that goes beyond the button, covering the entire card. The tradeoff is …

Image
Chris Coyier on Oct 4, 2019
Image
Direct link to the article How to Section Your HTML
accessibility document outline screen readers semantics

How to Section Your HTML

The sectioning elements in HTML5 are <nav>, <aside>, <article>, and <section>. <body> is also kind of a sectioning element since all content lying inside of it is part of the default document section.

Here is …

Image
Daniel Tonon on Jun 18, 2019 Updated on Jul 17, 2020
Image
Direct link to the article Why, How, and When to Use Semantic HTML and ARIA
accessibility aria beginning web development HTML semantics

Why, How, and When to Use Semantic HTML and ARIA

Semantic HTML and Accessible Rich Internet Applications (ARIA) help create interfaces that work for everyone in the most performant, robust, and simple way possible. They add essential meaning to your content, which lets web browsers, search engines, screen readers, RSS …

Image
Adam Silver on May 7, 2019
Image
Direct link to the article That Time I Tried Browsing the Web Without CSS
accessibility audit CSS semantics

That Time I Tried Browsing the Web Without CSS

CSS is what gives every website its design. Websites sure aren’t very fun and friendly without it! I’ve read about somebody going a week without JavaScript and how the experience resulted in websites that were faster, though certain aspects of …

Image
Jon Kantner on Apr 24, 2019 Updated on Apr 25, 2019
  • Image Newer
  • 1
  • ...
  • 2
  • 3
  • 4
  • ...
  • 5
  • Older Image

CSS-Tricks is powered by DigitalOcean.

Keep up to date on web dev

with our hand-crafted newsletter

DigitalOcean
  • About DO
  • Cloudways
  • Legal stuff
  • Get free credit!
CSS-Tricks
  • Contact
  • Write for CSS-Tricks!
  • Advertise with us
Social
  • RSS Feeds
  • CodePen
  • Mastodon
  • Bluesky
Back to Top
Advertisement