From the folks at CodyHouse comes a nifty animated hover underline effect.
Tyler Sticka performs a stress test for common SVG icon implementations.
Or skip the SVGs and reach for Anthony Fu‘s Pure CSS Icons.
Neale Van Fleet offers a sweet little animation library for animating in/out page elements. The transitions look great, but I could see that being annoying every time I returned to the homepage, for example…
Scott Vandehey provides the tidy Modern CSS in a Nutshell. Certainly covers the required basics!
A couple of “have fun with code” projects:
- Jhey Tompkins offers up 3D CSS Flippy Snaps. Gotta love that name!
- Geoff Graham recreates the Apple Music Hits Playlist Animation in CSS
A short delve into the land of performance…
- While “page speed is important” is not exactly ground-breaking news, Tammy Everts walks us through the connection between SEO and page performance.
- Chris Coyier begins a discussion about CORS. I don’t think he really answered any questions here, but did point to a few resources, which might be useful.
- Another conversation-starter from Chris, this time about CSS’s
will-changeand a couple other performance-booster (?) properties.
Lorem Faces is freaky: a collection of computer-generated faces… So… none of these people actually exist? Freaky. But a useful tool for your next mockup/prototype!
And speaking of “lorem”, how about lorem.space, another placeholder image API, but this one has categories!
Digging all the DevTools coolness coming from Edge! Like linting your page’s HTML and checking for accessibility issues!
Neema Muganga offers a guide to Understanding Static Functions and Static Classes in PHP. (Does anyone else still use PHP?)
Kevin Powell walks-through some really nice
grid layout stuff, including column- and row-spanning,
@media queries for different screen sizes, and even dabbles into
grid-template-areas, which I just love!
A couple of months ago I wrote a short bit about replacing jQuery with Vanilla JS. Well, Sachin Neravath just took things up a notch with Replace jQuery, a utility that will “[a]utomatically find jQuery methods from existing projects and generate vanilla js alternatives”… :-O Note the warning that “the utility functions generated by
replace-jquery are not completely equivalent to jQuery methods in all scenarios”, but this is certainly worth playing with!
And finally, if you don’t already know her (as I did not, until just moments ago), please take the time to meet Seyi Akiwowo. In 2014, at the age of 23, Seyi was elected as the youngest, black female Councillor in East London. In 2016, she gave an impromptu speech at the European Parliament that went viral. While being delivered, that speech was met with both cheers and boos, but later Seyi was attacked online and even received death threats… Because she had an opinion, spoke her mind, and was black and female… So, being a strong, community-minded, enthusiastic person that saw a problem, she decided to try to fix it, and created Glitch, a charity trying to end online abuse toward women, people of color and non-binary people. I was drawn in with this great Mozilla Hacks interview. I hope it affects you the same way.