The long-overdue death of a long-dead product…
Yahoo Directory, once the center of a web empire, will shut down at year’s end
The craziest bunch of hack-filled polyfills you’ve ever seen to make fonts responsive to window size. But, hey, it works…
Keeping it hacky (but in a totally modern, futuristic way), learn how to combine a JPG, a PNG, and an SVG to get a small(-ish) transparent image. (The article describes the process better than I do… :-)
One of the best things about SVGs is that they are comprised of actual DOM nodes, that you can twist, turn, tweak and torture with CSS and JS, right there in the browser. But creating SVGs, and then coding their animations, can be a bit intimidating (read: frustrating!). Until SVG Circus, that is…
But, if you just love coding your own shit, here’s a nice little walk-through on SVG light source filters.
Another great use for SVG is making text that expands and contracts to fit the screen on which it is being read. And here’s a nice little bit o’ JS to convert HTML text into SVG text.
Dedicated, protected bike lanes speed traffic, reduce accidents, and add a few trees along the way. Can every city just start dong this already???
PDFy is a cool service, giving you somewhere to upload, and share, PDFs Internet Archive! I’m sure some people need this, so cool! Would have been nice if you could upload other file types to be converted to PDFs in the process, but okay.
I know everyone is still aquiver from the explosion of flexbox onto the web (not), and now we have grid slowly coming of age too!
And as long as we’re looking into the future, let’s play with CSS Shapes a little!
This article is titled Challenge: Re-Imagining the Hamburger Icon, but it’s really more of a History of the Hamburger Icon. You may be surprised to learn it is more than 30 years old…
And as long as we’re looking into the past, let’s meet Ray Ozzie, ä man that worked on VisiCalc, then invented Lotus Notes (which he sold to IBM), then founded a collaboration app (which he sold to Microsoft). But why stop there??
vertical-align: middle. Huh, it didn’t work… Get to know all there is to know about vertical-align, that f-ing bastard…
The Boring Designer. Would work with one, any time! (And someone that is better at writing than I should write the counterpart The Boring Developer article, which is just as badly needed…)
In the mean time, to help yourself get on better with your designer(s), from Chris Coyier comes a few tools to help you help your designers help you…
Why fight the trend? Fix content position after scrolling…
Some pretty impressive CSS from Campaign Monitor:
How we designed and coded an animated banner ad with no images
There seems to be a little bit of a history theme going this issue, so quiz time: What do the University of Illinois in Champaign, IL and CERN in Meyrin, Switzerland have in common? They are probably the two most influential places on the face of the Earth when it comes to the Internet.
Explanations of some common JS code you see now-days, such as !! and var x = obj.x || 'foo'.
And a couple “fun” JS collections linked from the bottom of that article:
Ok, just one more, this time from Kyle Simpson, via David Walsh‘s site, on JS text replacement options.
From Brad Frost, 7 Habits of Highly Effective Media Queries. Yes! Especially #1! I hate when I see sites/frameworks using 320, 480, 768, etc. as @media query breakpoints, you know, “because those are the common screen widths”… This is no different, to me, than fixed-width sites using width: 800px;, or width: 1024px;, or width: 994px; for that matter! Look at your pages, let the content tell you when shit should change!
A few JS performance pieces for you!
- From Addy Osmani, timing.js: A small set of helpers for working with the Navigation Timing API to identify where your application is spending its time
- From Addy again, the slides from his CSS Performance Tooling presentation at the September, 2014 CSSConf.eu
- And from Paul Irish, the video of his Advanced Debugging Techniques with Chrome presentation at @Scale 2014
And from Jake Archibald, another quick JS-from-the-future demo on Service Workers!
Awesome Shell: A curated list of awesome command-line frameworks, toolkits, guides and gizmos.
When it comes to supporting old browsers, how low do you go? If it’s as low as IE8, then How to Build a Responsive Website That Supports Older Browsers might be of interest to you. Granted, it’s pretty much all JS add-ons, would have been nice to see a little more “content-first” / “small-screen-first” stuff in there, but if you need to support legacy browsers, this should be a big help.
Ever needed (or just wanted) a Can I Use for fonts? I have, and couldn’t find one. Neither could Zach Leatherman, so he build one…
And finally, one last history-themed item, check-out all these first-generation websites for some really famous companies… Lest we forget just how far we have come, we have come pretty far…
Happy reading,
Atg