Menu Search
Jump to the content X X
Smashing Conf New York

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 Barcelona, dedicated to smart front-end techniques and design patterns.

Optimizing Your Design For Rapid Prototype Testing

Product teams in startups and mid-sized and large companies are all implementing usability testing and prototyping as a way to de-risk product development. As the focus shifts from engineering to prototyping, it is becoming increasingly important for anyone who creates prototypes to understand the differences between a prototype and a product build.

Optimizing Your Design For Rapid Prototype Testing

By optimizing the prototyping process, you can produce mockups that deliver the most actionable user insights, while being as efficient as possible with design time. Regardless of which prototype tools you use or whether you test wireframes, clickable mockups or coded prototypes, what’s most important to focus on is what you want to test and what you want to learn from it.

Read more...

Reimagining Single-Page Applications With Progressive Enhancement

What is the difference between a web page and a web application? Though we tend to identify documents with reading and applications with interaction, most web-based applications are of the blended variety: Users can consume information and perform tasks in the same place. Regardless, the way we approach building web applications usually dispenses with some of the simple virtues of the readable web.

Reimagining Single-Page Applications

Single-page applications tend to take the form of runtimes, JavaScript executables deployed like popup shops into vacant <body> elements. They’re temporary, makeshift and not cURL-able: Their content is not really there without a script being executed. They’re also brittle and underperforming because, in service of architectural uniformity and convenience, they make all of their navigation, data handling and even the basic display of content the responsibility of one thing: client-side JavaScript.

Read more...

Advertise with us!

Freebie: Christmas Icons Set (110 Icons, AI, PSD, EPS)

It's Christmas time, and we're happy to release a brand-new freebie today, just for you! A set of 110 Christmas icons and illustrations that you can you use for sending your Christmas greetings and for any commercial projects.

The complete Christmas icons set

The set has been designed by Anastasia Kolisnichenko, from Minsk, Belarus, and released for free for Smashing Magazine's readers. Feel free to use all these elements and others for your projects. Grab what you need for a poster or website. You can customize everything you want: stroke width, size, color, shape — everything.

Read more...

Web Development Reading List #117: Storytelling, Security in Devtools and 350ms Tap Delay

What’s going on in the industry? What new techniques have emerged recently? What insights, tools, tips and tricks is the web design community talking about? Anselm Hannemann is collecting everything that popped up over the last week in his web development reading list so that you don’t miss out on anything. The result is a carefully curated list of articles and resources that are worth taking a closer look at. — Ed.

Web Development Reading List #117

The end of the year is near and some people are enjoying their well-deserved holidays already. For others, the pressure increases when managers or clients want to finish a project before Christmas. And then, the Christmas and New Year celebrations — so many things to prepare, to buy, to think of. I hope you either belong to the ones who can enjoy their vacation already or that you can stay calm while having a stressful time. Try to take your time with friends and beloved ones and enjoy some moments of silence.

Read more...

Animating Clipped Elements In SVG

Scalable Vector Graphics (or SVG) lend developers an incredible ability to display crisp, beautiful graphics at any size or resolution. SVG can also be animated using various techniques. In combination with clipping paths, interesting effects can be achieved.

Animating Clipped Elements In SVG

This article explains the difference between an SVG clipPath and a CSS clip-path, including examples to guide and inform you through this journey. Finally, I’ll share a few demos both personal and in the wild to help you better understand clipPath animation and inspire your visions.

Read more...

Why Passphrases Are More User-Friendly Than Passwords

A user’s account on a website is like a house. The password is the key, and logging in is like walking through the front door. When a user can’t remember their password, it’s like losing their keys. When a user’s account is hacked, it’s like their house is getting broken into.

Why Passphrases Are More User-Friendly Than Passwords

Nearly half of Americans (47%) have had their account hacked in the last year alone. Are web designers and developers taking enough measures to prevent these problems? Or do we need to rethink passwords?

Read more...

Website Layout Tools Compared: Flexbox Vs. Susy

Flexbox has become one of the most popular tools for creating website layouts. Susy is another layout tool that has gained popularity with the Sass community over the last few years.

Website Layout Tools Compared: Flexbox Vs. Susy

Many developers I’ve spoken with are unsure which tool is best for creating layouts for their websites. Some feel that flexbox is powerful enough to handle all of their layout problems. However, they are unsure whether to learn it because of its confusing syntax. Others feel that Susy is much simpler and prefer its simplicity to flexbox.

Read more...

Making Accessibility Simpler, With Ally.js

I’ve been a web developer for 15 years, but I’d never looked into accessibility. I didn’t know enough people with (serious) disabilities to properly understand the need for accessible applications and no customer has ever required me to know what ARIA is. But I got involved with accessibility anyway – and that’s the story I’d like to share with you today.

Making Accessibility Simpler

At the Fronteers Conference in October 2014 I saw Heydon Pickering give a talk called “Getting nowhere with CSS best practices”. Among other things, he made a case for using WAI-ARIA attributes like aria-disabled="true" instead of classes like .is-disabled to express application state. It struck me then and there that I was missing out on a few well-prepared standards, simply because ARIA belongs to that accessibility space that I had no idea of.

Read more...

Web Development Reading List #116

What’s going on in the industry? What new techniques have emerged recently? What insights, tools, tips and tricks is the web design community talking about? Anselm Hannemann is collecting everything that popped up over the last week in his web development reading list so that you don’t miss out on anything. The result is a carefully curated list of articles and resources that are worth taking a closer look at. — Ed.

Web Development Reading List #116: Chakra, Credential Leaks and What Makes a Function Asynchronous

You probably haven't bought your Christmas presents yet. Usually we feel the need to buy a gift for friends and family. It often lets us buy random stuff that is often of no real value. Turning this around, I started to enjoy the evening with a hand-made dinner, small hand-made gifts and enough time for the loved ones. So far, this worked way better than any gift I've ever bought in a store. So don’t stress yourself if you haven’t found anything yet — time, attention and doing things together can also be a great gift. Have a nice weekend!

Read more...

↑ Back to top