---
title: "An 'H' element for HTML / Animating link underlines / CSS code smells"
publication: "Frontend Focus"
issue: 276
published_at: "2017-02-08"
canonical_url: "https://frontendfoc.us/issues/276"
---

An 'H' element for HTML / Animating link underlines / CSS code smells

The latest HTML, CSS and browser tech news for frontend developers — [Read this e-mail on the Web](http://frontendfoc.us/issues/276)

Frontend FocusIssue 276 — February 8, 2017[Should HTML Have An 'H' Element?](https://github.com/w3c/html/issues/774?utm_source=frontendfocus&utm_medium=email)We have h1, h2, and h3, but not li1, li2, and li3, so could or should headings also be denoted without including a level in the element name? Some interesting discussion on the W3C’s HTML spec repo. W3C 
[HTML APIs: What They Are And How To Design A Good One](https://www.smashingmagazine.com/2017/02/designing-html-apis/?utm_source=frontendfocus&utm_medium=email)_“In an HTML API, the definitions and protocols are in the HTML itself, and the tools look in HTML for the configuration.”_ Plenty of great insights from Lea here. Lea Verou 
[Code Smells in CSS Revisited](https://csswizardry.com/2017/02/code-smells-in-css-revisited/?utm_source=frontendfocus&utm_medium=email)Reflecting on a popular article from 2012, Harry Roberts has some new candidates to add to his list of CSS 'code smells'. Harry Roberts 
[![ForwardJS & Forward Swift\](https://copm.s3.amazonaws.com/edba5a82.png)](https://forwardjs.com/?utm_source=frontendfocus&utm_medium=email)[ForwardJS: Dozens of full-day JavaScript workshops in San Francisco](https://forwardjs.com/?utm_source=frontendfocus&utm_medium=email)Last chance for Advance tickets to nine days of Angular 2, Swift, React, Webpack, VR, Redux, Async, D3, WebPerf, Ionic and TypeScript presented by industry experts this March in San Francisco. ForwardJS & Forward SwiftSponsor
[How To Use SVG and CSS To Animate Link Underlines](https://www.news47ell.com/articles/use-svg-css-instead-text-decoration-underline/?utm_source=frontendfocus&utm_medium=email)How to make it so that link underlines wave around upon hover. A clever use of modern Web technologies for a striking effect. Ahmad Al Maaz 
[Flexbox Explained with Big, Colorful, Animated GIFs](https://medium.freecodecamp.com/an-animated-guide-to-flexbox-d280cf6afc35?utm_source=frontendfocus&utm_medium=email)Flexbox promises to save us from the evils of plain CSS (like vertical alignment). Scott Domes 
[Apple Proposes A New 3D Graphics API for the Web](https://webkit.org/blog/7380/next-generation-3d-graphics-on-the-web/?utm_source=frontendfocus&utm_medium=email)Apple’s WebKit team has proposed a new W3C Community Group to discuss the future of 3D graphics on the web, and to develop a standard API that exposes modern GPU features. Dean Jackson 
[Duoload: A Simple Side-by-Side Page Load Comparison Tool](http://lea.verou.me/2017/02/duoload-simplest-website-load-comparison-tool-ever/?utm_source=frontendfocus&utm_medium=email)A tool that lets you load two websites side by side and observe which loads faster/smoother. Lea Verou 
[The Web Share API Brings Native Sharing Capabilities to The Browser](https://blog.hospodarets.com/web-share-api?utm_source=frontendfocus&utm_medium=email)A modern browser API designed to extend users’ sharing experience in a cross-platform way. Serg Hospodarets 


Jobs [![Supported by Hired.com\](http://s3.cooperpress.com.s3.amazonaws.com/hired1.png)](https://hired.com/join/?utm_source=petercooperpress&utm_medium=sponsor&utm_campaign=%28b2c%29%28l-all%29%28r-swe%29%28q2-17-frontend-focus%29&utm_content=newsletter)

- [React Developer at X-Team (Remote)](https://x-team.com/frontend-developer/?utm_source=newsletter&utm_medium=email&utm_campaign=frontend-february-8-17)We're looking for a developer with an extensive knowledge of React and Javascript. We are 100% remote and we provide the funding needed to help you achieve your goals and grow. X-Team
- [Software Engineer, Web - Zürich, Switzerland](https://www.centralway.com/de/careers/open-positions/details#oii51fwq?utm_source=frontendfocus&utm_medium=email) Centralway Numbrs

Can't find the right job? Want companies to apply to _you?_ [Try Hired.com.](https://hired.com/?utm_source=newsletters&utm_medium=petercooperpress&utm_term=cat-tech-frontend&utm_campaign=q2-17-frontend)

In Brief

[What's New In Chrome 56](https://developers.google.com/web/updates/2017/01/nic56?utm_source=frontendfocus&utm_medium=email) news 
A brief look at new features including the Web Bluetooth API and `position: sticky`
Pete LePage

[It's Time to Vote On An Official WebAssembly Logo](https://github.com/WebAssembly/design/issues/980?utm_source=frontendfocus&utm_medium=email) news 
The logo with the most ‘thumbs up’ will then be deemed the official logo.
WebAssembly

[Server-Side Timings Now in the Chrome Devtools](https://ma.ttias.be/server-timings-chrome-devtools/?utm_source=frontendfocus&utm_medium=email) news
Mattias Geniar

[Chrome 57 Will Permanently Enable DRM](http://www.tomshardware.com/news/chrome-57-permanently-enabled-drm,33527.html?utm_source=frontendfocus&utm_medium=email) news 
You won’t be able to disable the Widevine plugin that works alongside [Encrypted Media Extensions.](https://en.wikipedia.org/wiki/Encrypted_Media_Extensions)
Tom's Hardware

[What Really Makes a Static Site Generator?](https://css-tricks.com/really-makes-static-site-generator/?utm_source=frontendfocus&utm_medium=email) tutorial 
What exactly is a static site generator and what goes on inside that black box?
CSS Tricks

[[99-Point Cheat Sheet\] The Ultimate Guide to Getting Started In Sketch](http://trydesignlab.com/blog/ultimate-guide-getting-started-sketch-cheat-sheet/?utm_source=frontendfocus&utm_campaign=sketchultimatefef&utm_medium=email) tutorial 
Whether you’re a total novice, a designer in training, or a seasoned pro switching from another product, this guide is for you.
DesignlabSponsor

[CSS Pseudo-Classes: Styling Form Fields Based on Their Input](https://www.sitepoint.com/css-pseudo-classes-styling-form-fields-based-on-their-input/?utm_source=frontendfocus&utm_medium=email) tutorial
Tiffany Brown

[5 Ways to Lazy Load Images For Faster Page Loads](http://blog.dynamicdrive.com/5-brilliant-ways-to-lazy-load-images-for-faster-page-loads/?utm_source=frontendfocus&utm_medium=email) tutorial
Dynamic Drive

[Polyfills: Everything You Ever Wanted to Know (Maybe)](https://hackernoon.com/polyfills-everything-you-ever-wanted-to-know-or-maybe-a-bit-less-7c8de164e423#.a13tnngrg?utm_source=frontendfocus&utm_medium=email) tutorial
David Gilbertson

[Cross-Browser Testing: Installing All The Things](https://hackernoon.com/a-guide-to-cross-browser-testing-installing-all-the-things-6e56c2bd8182?utm_source=frontendfocus&utm_medium=email) tutorial 
How to set up what’s needed to test in different browsers and devices.
David Gilbertson

[Gridtab: A jQuery Plugin to Build Grid Based Responsive Tabs](https://gopalraju.github.io/gridtab/?utm_source=frontendfocus&utm_medium=email) code

[console-extend: A Proxy for the 'console' Object So You Can Extend It](https://www.npmjs.com/package/console-extend?utm_source=frontendfocus&utm_medium=email) code
Jordan Piepkow

[JSMpeg: A Pure JavaScript MPEG 1 + MP2 Decoder](http://jsmpeg.com/?utm_source=frontendfocus&utm_medium=email) code
Dominic Szablewski

[Animatelo: 'Just-Add-Water' Web Animations for Your HTML Elements](https://github.com/gibbok/animatelo?utm_source=frontendfocus&utm_medium=email) code 
[Live demo here.](https://gibbok.github.io/animatelo/)
GibboK

[Between: Proxy-Based Animation Library with Cocoa Animation Block-esque API](https://github.com/paraboul/between/?utm_source=frontendfocus&utm_medium=email) code
Anthony Catel

[Gibon: Functional UI Router in ~600 Bytes, Built on HTML5 History API](https://github.com/tunnckoCore/gibon?utm_source=frontendfocus&utm_medium=email) code
Charlike Mike Reagent

[Luxbar: A Featherweight, Responsive, CSS Only Navigation bar](https://balzss.github.io/luxbar/?utm_source=frontendfocus&utm_medium=email) code
Balazs Saros

[How to find and fix the slowest code in your .NET application](http://www.red-gate.com/products/dotnet-development/ants-performance-profiler/?utm_source=frontendfocus&utm_medium=displayemail&utm_content=slowest_code&utm_campaign=antsperformanceprofiler&utm_term=email-25329) tools 
Find bottlenecks in your code or database & boost performance with new ANTS Performance Profiler 9. [Try free.](http://www.red-gate.com/products/dotnet-development/ants-performance-profiler/?utm_source=frontendfocus&utm_medium=displayemail&utm_content=slowest_code&utm_campaign=antsperformanceprofiler&utm_term=email-25329)
Red GateSponsor

Curated by [Peter Cooper](http://twitter.com/peterc) and [Chris Brandrick](http://twitter.com/chrisbrandrick) and published by [Cooperpress](https://cooperpress.com/).

[Stop getting FrontEnd Focus](*|UNSUB|*) : [Change email address](*|UPDATE_PROFILE|*) : [Read this issue on the Web](http://frontendfoc.us/issues/276)

Cooper Press Ltd. Office 30, Lincoln Way, Louth, LN11 0LS, UK
