Ian Devlin documents the various implementation quirks and issues of the ‘date’ input type on mobile and desktop browsers.
HTML5 Doctor
A great grab-bag of things you can do with CSS along with brief code snippets. Things like gradient borders, counters, and z-index transitions.
Ilya Pestov
Tidy is not a new tool but it had fallen into a non-maintained state. A group has now reinvigorated the project and is making it ideal for working with the latest HTML.
HTACG
Imgix is a real-time image processing service and CDN. Our new libraries enable you to implement lightboxes and zoom viewers without having to create multiple copies of the image, while also delivering it at high quality and speed, to every device or browser.
Imgix
Sponsor
A designer at Shopify looks at how the flexible box model (Flexbox) can be used to create flexible layouts that work across devices. All major browsers now support it.
Levin Mejia
A W3C First Public Working Draft of a spec covering a mechanism through which sites can ask to be notified when other sites link to them. webmention.io is a service aiming to help make it easier to implement.
W3C
If you’ve cobbled together your knowledge of CSS piecemeal over the years, as I have, this could be a handy refresher of the main concepts.
Vasa
Client Hints is an initiative spearheaded by Google already available in Chrome and Opera that lets you reduce both image sizes and the verbosity of responsive image markup.
Smashing Magazine
Built vertical timelines and mix content into the line or to the left or right of it. There are static and dynamic demos to get the idea.
Andrius
Patrick Catanzariti notes that ‘vendor prefixes are fading away as browser teams look for better solutions.’ The Chrome team intend to keep features behind their ‘experimental web platform features’ flag until they’re ready for primetime.
SitePoint
Christian Heilmann implores us to write defensive code and check for capabilities in browsers rather than break at the first sign of an unfamiliar environment.
Christian Heilmann
Jobs
-
Get 10 offers from top tech companies in one week.Indeed Prime is an elite new program from Indeed.com that presents in-demand tech talent like you to top employers. Indeed Prime opens the door to exciting career opportunities with one simple application. Join today. Indeed
Can't find the right job? Want companies to apply to you? Try Hired.com.
In Brief
10 Years of Web Inspector news
A great timeline covering a decade of WebKit’s main developer tool.
WebKit
Microsoft Edge Web Summit - San Francisco, April 4th news
Free registration opens soon.
Microsoft
An HTML5 Player for VR 360° Video - The Next Big Thing? news tools bitdash
We'll take you from beginner to employed engineer, guaranteed course Sign up to start learning everything from HTML to Angular. We guarantee you a job after graduation or your money back. Thinkful Sponsor
How Not To Misuse ARIA States, Properties and Roles tutorial
“ARIA should not be added to HTML content that already has the desired implied semantics.”
Jonathan Avila
How I Shrank My CSS by 84kb by Refactoring with ITCSS tutorial Jordan Koschei
Creating a WebGL Game with Unity 5 and 'JavaScript' tutorial
Well, UnityScript really, but it’s very similar.
Michaela Lehr
Optimizing SVGs for Web Use tutorial Andreas Larsen
The Benefits of Inheritance via @Extend in Sass tutorial David Nguyen
The Axis of Flexbox video
Learn about the axes of Flexbox, which are different than the traditional top to bottom, left to right axes.
Guy Routledge
Influencing Web Layouts with Print Layouts opinion Chris Coyier
The Current State of Web Security, An Interview with Anselm Hannemann opinion Robin Rendle
Why I Left Gulp and Grunt for npm Scripts opinion Cory House
CSS Gradient Animator tools
This simple online tools produces an interesting background effect.
Ian Forrest
Flag-Colors: A 600 Color Collection tools
Select colors on the page or in Sass, Less, or Stylus. Brand-Colors is similar but using popular brands’ logos.
Piérre
vivus.js: Animate SVGs as If They're Being Drawn code maxwellito
Animate Plus: CSS and SVG Animation Library code Benjamin De Cock
voxel.css: 3D Pixel Rendering with CSS code
Makes it easy to render Minecraft-esque pixellated block layouts in the browser using 3D CSS.
Hunter John Larco
tweezer.js: Small, Dependency-free, ES6 Library for Smooth Animations code Jackson Geller
Pure CSS Apple Keyboard code demo ByPeople
Alex The CSS Husky code demo
A clever bit of CSS and SVG-only animation here.
CodePen
Give back to the developer community - apply to teach today. rawurl Actively seeking web developers to join our tight knit family of passionate teachers and earn royalties. Pluralsight Sponsor
|