Search

Nalezeno "semantics": 17

Twitter’s div Soup and Uglyfied CSS, Explained


When I came up in web development (2005-2010 were formative years for me), one of the first lessons I learned was to have a clean foundation of HTML. “What Beautiful HTML Code Looks Like” is actually one of the most … The post Twitter’s div Soup and Uglyfied CSS, Explained...

On the `dl`


Blogging about HTML elements¹? *chefs kiss* Here’s Ben Myers on the (aptly described) “underrated” Definition List (<dl>) element in HTML: You might have also seen lists of name–value pairs to describe lodging amenities, or to list … The post On the `dl` appeared...

Web Features That May Not Work As You’d Expect


As the web gets more and more capable, developers are able to make richer online experiences. There are times, however, where some new web capabilities may not work as you would expect in the interest of usability, security and privacy.… The post Web Features That May Not Work As You’d...

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… The post The Web’s Worst Default appeared first on CSS-Tricks. You can support...

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. A… The post HTML Inputs and Labels: A Love Story appeared first...

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 use for this process. The main ones we’ll look...

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 created, and we say that they have been deprecated. Deprecated. It’s a word...

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 involved...

Breakout Buttons


Andy covers a technique where a semantic <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 that the pseudo-element sits on top of the text, so text...

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 a brief explanation of each sectioning element...

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 readers, and ultimately...

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 them would not function as expected. But CSS. Turning...

Could Grouping HTML Classes Make Them More Readable?


You can have multiple classes on an HTML element: <div class="module p-2"></div> Nothing incorrect or invalid there at all. It has two classes. In CSS, both of these will apply: .module { } .p-2 { } const div...

Using Artificial Intelligence to Generate Alt Text on Images


Web developers and content editors alike often forget or ignore one of the most important parts of making a website accessible and SEO performant: image alt​ text. You know, that seemingly small image attribute that describes an image: ​​​<img src="/cute/sloth/image.jpg" alt="A brown baby sloth...

The practical value of semantic HTML


I love how Bruce steps up to the plate here: If the importance of good HTML isn’t well-understood by the newer breed of JavaScript developers, then it’s my job as a DOWF (Dull Old Web Fart) to explain it. Then he points out some very practical situations in which good HTML brings meaningful...

Too Much Accessibility


I like to blog little veins of thought as I see them. We recently linked to an article by Facundo Corradini calling out a tweet of ours where we used an <em> where we probably should have used an <i>. Bruce Lawson checks if screen readers are the victims of these semantic...

World wide wrist


After all the hubbub with WWDC over the past couple of days, Ethan Marcotte is excited about the news that the Apple Watch will be able to view web content. He writes: If I had to guess, I’d imagine some sort of “reader mode” is coming to the Watch: in other words, when you open a link on your...

Nahoru
Tento web používá k poskytování služeb a analýze návštěvnosti soubory cookie. Používáním tohoto webu s tímto souhlasíte. Další informace