Heya!
After last weeks' massive issue I now have the pleasure to provide you with another not-very-short reading list. At that point, I think it's a good time to show you how far web technologies have come: Here's a basic version of Excel in 30 lines of JavaScript. It's just amazing how the web evolved in the past years!
I guess you signed up for this list to gain news, new tools and stay up to date in the webdev field. And actually that is why I created this list. To sum up the week for you (and me).
But if there is a question to you, asking about a technology or tool you don't know of, what would you answer? Most of us probably will give a vague answer pretending they know the tool while they don't. Lyza Danger Gardner on A List Apart writes about that problem and how you should answer to such questions.
General
- Did you know Responsive Design doesn't solve your Content problem?. Well, you should.
- But always be aware that a Browser is not a Phoney Phone and it's a difference to test on a real device. You know that, right? Let's go to the interesting stuff – the news.
News
- INIT 1.0 has been finally released. It's a extended HTML5Boilerplate automating all your dev-tasks.
- Ish 2.0, the breakpoint tester by Brad Frost is out. It's also inegrated into PatternLab.
- Foundation 5 has been released. It's even faster for users, faster to code and – faster!
- GruntJS 0.4.2 is out, making Grunt a whole lot better if you work with it on a Windows machine.
- Google PageSpeed now includes automated "UX Tests". It's a machine but it's still pretty cool and helps you find common problems on sites.
Tools
- Your dream for a presentation came true: With Vimdeck you write markdown and present your slides in VIM!
- For GruntJS there now is a task that generates all you need for Responsive Videos. It takes care of mp4 files, webm, poster images etc.
- And while speaking of Grunt tools: This task removes unused CSS from your builds.
- Tools! Here's another: Hardy equips you with automated CSS testing. Try it!
- Need some browser ponies by now? Here they are (or browser logos of like any browser in the world).
- You know the general inbox zero problem? MirBir is an Open Source E-Mail Helpdesk system helping you to solve that.
- And finally, the Google Chrome team offers you a tool called MiniMobileDeviceLab. It helps you to set up infrastructure for your own small device lab at home.
Web Performance
- The first 15 seconds count. Prepare your website for it!
- Chris Zacharias published an article where he tells about the YouTube feather project. He writes about forgotten majorities (and minorities) around the world when it goes to web performance. The summary of it: Please Care about web page size
HTML
- The Paciello Group shares how to properly use the HTML5
<section>
element so you finally know it not just replaces a div element. - The most important topic right now in webstandards: Where we stand on Responsive Images, a gist by Mr. Wilto. And Chris Coyier sums up why Responsive Images is so hard.
- That situation makes Tim Kadlec ask who's responsible for webstandards.
- But fortunately there also are good news: Mark Dalgleish explains what Web Components are, how they work and how you can use them.
CSS
- Zach Leatherman tells you about the underrated
:target
selector in CSS. - But there are also many things you can do to make Typography responsive. They're nearly all explained in this article on Tympanus.
- Now, let's think about the future: With Media-Queries Level 4 we will be able to react to luminosity. This is a cool demo how this could work.
- And the Cat and Hat selectors will give you ability to style in the ShadowDOM.
- But future isn't there yet, so here's the next bummer: The filament group researched how many devices aren't capable of @font-face support and therefore won't display your icon-font. Very scary numbers show up in this presentation (sneak peek: ~370million).
JavaScript
- Negative Array by Sindre Sorhus. JavaScript doesn't natively support being able to use a negative index to get items backwards from the end, but with ES6 Proxy it's possible. This is the tool to use it.
- Not everything is cool in JS. For example,
screen.width
is useless. - Alejandro Hernandez wrote an interesting Introduction to Full-Stack JavaScript.
- Scroll Position Index is a cool CodePen showing a UX concept for reading long texts or books.
Be inspired by…
- …Zach Holman who talks about the growth of GitHub, the task to remain a start-up with over 200 employees. It's a great slidedeck and I can't wait for the video of the talk.
- …Wilson Miner who reminds us how cool the web is by being open source so one can learn from the source code of a website. It's much harder in other fields.
- …Mike Tylr who started a project offering screenshot or debugging on his phones through GitHub issues.
- …the world's busiest airport Atlanta. See how a day looks like there (btw, scroll performance is not very good but the story is).
If you like this issue and can support me, you know there's gratipay, right?
Cheers!
Anselm