As the volume of data on the web has increased, web scraping has become increasingly widespread, and a number of powerful services have emerged to simplify it. You can use Node.js to create a powerful web scraper that is both extremely versatile and completely free. A basic understanding of Node.js is recommended for this article; so, if you haven’t already, check it out before continuing. Also, web scraping may violate the terms of service for some websites, so just make sure you’re in the clear there before doing any heavy scraping.
Read more…
Bugs erode trust, which in turn loses customers. So when Ben Gremillion began updating Foundation, a responsive CSS framework, he wanted to ensure everything worked. In this article Ben will teach you his methodology for testing responsively, not just on a case by case, page-from-PSD comp. He developed a certain system to make sure that nothing’s broken at launch on different devices. It’s not enough to look for blatant bugs. You have to be thorough: in execution, in accountability, and in direction.
Read more…
You have likely experienced the 300-millisecond delay in mobile browsers or wrestled with touchmove versus scrolling. Certain events that used to be very clear are now filled with ambiguity. The click event used to mean one thing and one thing only, but touchscreens have complicated it by needing to discern whether the action is a double-click, scroll, event or some other OS-level gesture. In this article Dustan Kasten will introduce the event cascade and use this knowledge to implement a demo of a tap event that supports the many input methods while not breaking in proxy browsers such as Opera Mini.
Read more…
Using SVGs can reduce the number of HTTP requests for image replacement. it’s also easy to make an SVG scalable to its container for responsive development. In this article Sarah Drasner will cover a few ways of using SVG sprites to describe motion on the web. She’ll show some techniques for using SVG sprites in complex animation that takes advantage of these factors. All examples shown will assume the use of an auto-prefixer and some basic knowledge of CSS animations.
Read more…
Successful web accessibility is about anticipating the different needs of all sorts of people, understanding your fellow web users and the different ways they consume information. Armed with this understanding, accessibility becomes a cold, hard technical challenge. How do assistive technologies present a web application to make it accessible for their users? Where do they get the information they need? One of the keys is a technology known as the accessibility API.
Read more…
From simple charts to fancy infographics to complex timeline animations, data visualizations are popping up all over the Internet. However, as in any other area, once everyone gets on the train, distinguishing yourself from the pack becomes hard. There is virtually no limit to what you can do with the physics of data visualizations. Create column charts and make them fall like dominos, or make pie charts roll, bounce and more. You can make objects in charts and maps roll, spin, bounce, change shape and morph in ways that will capture the viewer’s attention much more quickly than regular static or even interactive versions!
Read more…
In this article, Varya Stepanova & Juuso Backman will talk about style guides that are generated directly from the style definition sources — i.e. CSS and its modern variants. Style guides are useful in many aspects of development and maintenance, so it’s little wonder that developing them has become a highly popular practice. But even with the clear benefits, taking the necessary steps to start using them is easier said than done, as quite often the challenge is cultural, requiring changes in people’s mindsets. We encourage everyone to try it!
Read more…
Flex items are truly accommodating and a pleasure to work with. Most web apps consist of a series of modular, reusable components. You can use flexbox for those bits of layout that induce headaches and that depend on brittle CSS hacks to work. It takes a while to have your “Aha!” moment with flexbox, because it involves unlearning what you already know about CSS layouting. But once you speak the flexbox language fluently, your process of designing responsive apps will become effortless and your style sheets will get leaner!
Read more…
Product Hunt is a community where people post, vote on and comment on new products they’ve discovered or launched. Whether you’re looking for the next big thing to invest in or just want to find a better weather app, Product Hunt has got you covered. As Product Hunt’s success has shown, there’s a big demand for websites that help us deal with information overload by streamlining and centralizing content. Telescope is a fast, modern platform on which to build your own community, social news app or link-sharing website. In this article, Sacha Greif will show you how easy is to extend it. He encourages you to give it a try!
Read more…
It’s very easy to get bogged down by accessible output and to forget that, ultimately, accessibility is about people. Whether you are working in product, UX, development or quality assurance, remember to always give users control, over the page integrate accessibility into annotated UX and style guides and design with choice in mind. In this article, Henny Swan will explain these, and more key principles which will ensure that products are inclusive and usable for disabled people. Listening to users and actively including their feedback, along with adhering to organizational standards and guidelines, are essential.
Read more…
