Earlier this month I mentioned Landon Schropp‘s Flexbox course. I also mentioned that I had already signed-up. So, quick update: Great course! I have created my six dice, worked out a totally light 12-column layout, then broke free from those confining columns, and found great new methods for dealing with an unknown number of wrapping elements. I have also discovered some great tools that I’ve learned of:
- We all know about preprocessors, right? Less and Sass are easily the most common, but there are plenty out there. Well Autoprefixer is a postprocessor, which means you get to write CSS from the future (you can still use Less and Sass, but you don’t need to use all the prefixes and old/wrong versions (like for gradients and Flexbox))! Autoprefixer uses Can I Use data (you can also customize your requirements) to analyze and alter your output CSS (thus the post in postprocessor) to provide all the necessary prefixes and alterations for you! It’s a sweet little deal, and one I cannot wait to play with!
- I have not yet had a chance to dig as deeply into Prepos yet, but it is an alternative to CodeKit (which smart people like Chris Coyier seem to really love!), that at first glance seems to offer (at least nearly) all of the same functionality, only also on PC and Linux (while CodeKit is Mac-only), and for a couple teeny little bucks less (currently $29 vs. $32). If you’re in the market (and if you’re not, take a closer look at what they both offer, maybe you should be!), check-out both!
- Lastly, somehow I had never tripped across the Can I Use browser usage table… Fun! :-)
Okay, had to get that out there, now back to our regularly-scheduled readings…
We all know images are the speed-killer on the web, right? Nearly every site has more images than HTML, CSS or JS, often times more than all three combined! But what strikes me, if I’m correctly reading the first chart in Guy Podjarny‘s High Performance Images: Beautiful Shouldn’t Mean Slow article, is that over the past 3+ years we have not increased the number of images on our sites, only the weight?? That’s crazy, considering how much more we now know about reducing image size, and how much easier it has gotten to do it…
I have never liked the concept of the e-bike (entirely because I am a grumpy old curmudgeon), but I do fancy getting one for my wife (and probably eventually for me, because, as I said, I am old), so I’ve been keeping my eye out for good options. And so the Maxwell E-PO has certainly caught my eye. Lightweight (even by normal bicycle standards), sleek design, a pretty impressive battery life, quick recharge, and planning to start at only $1,500! (As soon as the ubiquitous Kickstarter campaigns is announced, and eventually closes… :-/ )
And to try to make cycling safer in their fair city, Toronto(ans?) staged a die-in, in the most Canadian way possible: trying really, really hard not to disturb or bother anyone… :-)
Bruce Lawson does a great job of collecting several opinion pieces on the state of HTML, what is lacking and what is needed. I agree with much of the comments in Bruce’s article, but strongly disagree with the ideas of dropping some HTML5 elements (such as article
and footer
) or adding more vendor styling to HTML elements (such as adding a drop cap to article
or floating sidebar
(I’ll assume the author meant aside
, since there is no sidebar
element) to the right); I am so annoyed every time I have to override a vendor style! This is what I do for a living, if I wanted a margin on this stupid thing, I would have added it!!
Lea Verou really likes conical gradients. When I saw the first example in her article, I wondered if she also really likes LSD… :-) When I saw her second example, I suddenly got it. And when I saw her polyfill page, I totally got it… Note that each example is one HTML element…
While the first several groups in this Introduction to CSS Selectors article may be pretty basic, there are also less-common selectors (to me, anyhow). I guess I used to avoid things like p ~ a
and such back in the day because they were so new and not well enough supported, and I just never really got into them. But, according to Can I Use, support for CSS2.1 and CSS3 selectors are all quite good!
Some über-cool Sass animation mixins. If anyone wonders who wins the battle between Sass and Less: Less = easier to set-up and learn, Sass = way better in every other way… (IMO…)
And finally, with all the new acronyms that the kids are scattering across the Interwebs these days, it can be hard to keep up. So here’s a handy cheatsheet to get you started…
Happy reading,
Atg
Awesome article, thanks a lot.