Menu Search
Jump to the content X X
Smashing Conf San Francisco

We use ad-blockers as well, you know. We gotta keep those servers running though. Did you know that we publish useful books and run friendly conferences — crafted for pros like yourself? E.g. upcoming SmashingConf San Francisco, dedicated to smart front-end techniques and design patterns.

Web Development Reading List #129: CSRF, Modern Tooling And The UX Of Web Fonts

Every week I learn so many new things about front-end development. By building various kinds of projects, by talking to other developers, by reading new articles. Of course, it can be overwhelming, but to me this is the best part of the job. By sharing and talking to other people, my job gets more interesting.

For example, this week I learned how to build malicious links with target="_blank", I learned how CSRF works, and how important it is that an icon clearly indicates what it is thought for — the latter after I implemented the icons and only found some of them helpful as I saw the fallback/title text for them. Always stay curious.

News Link

  • What’s new in Chromium 49 and Opera 361? They support ES6 default function parameter values, ES6 destructuring assignment, ES6 Proxy and Reflect, CSS custom properties, "a rel=noopener" (see article in the security section), and many things more.

General Link

Tools Link

Security Link

  • If you run git on a server, if you use git, please update your software clients immediately. An exploit has been published4 that allows remote code execution in all versions up to 2.7.4 (the version containing the fix).
  • How target="_blank" can be abused to serve malicious links5 is shown in this demo by Mathias Bynens.
  • Mozilla implemented a new block-all-mixed-content CSP directive6 that lets websites opt in to hard-fail on mixed content (it won’t be shown and no warning will be triggered).
  • Do you know how a cross-site request forgery (CSRF) works? There is now an infographic that visually explains how CSRF works.
Infographic explaining CSRF
Cross-site request forgery (CSRF) visually explained. (Image credit: Barricade)

Privacy Link

  • What happens when a surveillance state becomes an affordable gadget? Maybe it doesn’t faze you that your local police has a $400,000 device that listens in on cell phones. But how do you feel when your neighbor has a $1,500 version7? In most countries it’s illegal to buy such devices, however, a recent study revealed that anyone can buy one very easily nonetheless.


  • If you use React, it’s relatively easy to implement an SVG icon system with the <use> element. But Sarah Drasner found an even better way8 that uses React’s core principles of a virtual DOM.

Accessibility Link

  • Rodney Rehm published the first big update to his amazing accessibility library ally.js9. Version 1.1 has completely rewritten tests, supports way more browsers, and is even more reliable to handle focus states on your web application. And finally, you can also learn a lot about how to maintain an open-source project — just look at the incredibly detailed release notes or at the test suite that’s behind it.

JavaScript Link

CSS/Sass Link

  • Toggling passwords is considered a great UX pattern for users. On the other hand, there are some risks and challenges that you should know of. Avoid caching of the passwords and disabling autofill managers12 by following this short article.
  • Adam Morse shares his experience with user testing web projects and sums up what he thinks about using web fonts13 in the context of providing a good user experience. I have to admit that while it can be cool and necessary to use a web font, it often doesn’t have to be. A lot of projects don’t care about using a proper fallback font that matches the web font — and these days, with content and privacy blockers available for every device, there are a lot of people not seeing any web fonts at all.

Work & Life Link

  • Casey Gerald gave a great talk at this year’s SXSW14 questioning the traditional approach of doing work and also asking the question “With all the power we hold in our hands, why are people still suffering?”
  • One year after being fired, Zach Holman wrote up his knowledge on firing people15. A great read for both employees and employers.
  • “Most offices are the average of what works for everyone,” says Mike Del Ponte who believes that companies should offer employees the best of both worlds16 — working remote and on-site — and give them the choice of both. We’ve already seen a lot of such articles but what I found particularly interesting here is that the article is talking about benefits of on-site work as well as remote work and puts both into perspective.

And with that, I’ll close for this week. If you like what I write each week, please support me with a donation17 or share this resource with other people. You can learn more about the costs of the project here18. It’s available via email, RSS and online.

Thanks and all the best,

Footnotes Link

  1. 1
  2. 2
  3. 3
  4. 4
  5. 5
  6. 6
  7. 7
  8. 8
  9. 9
  10. 10
  11. 11
  12. 12
  13. 13
  14. 14
  15. 15
  16. 16
  17. 17
  18. 18

↑ Back to top Tweet itShare on Facebook

Anselm Hannemann is a freelance front-end developer and architect and cares about sustainable front-end experiences and ethical choices in life. He curates the WDRL, a weekly handcrafted web development newsletter that thousands of developers love and subscribe to.

  1. 1

    Dear Anselm,

    This write-up is very interesting. I have only a week gotten myself into setting up what is necessary to learn UX, hacking (whitehat) and wifi security. It is good to keep myself aware of these things even at an older age of 25. It is never too late to learn! Now to learn what your <code etc means…

    Gruss aus Kuala Lumpur,

  2. 2

    This post is packed full information abut web development. What is SVG. How it is helpful in website development.


↑ Back to top