RWD Weekly #336

Hello again and welcome to this week’s responsive design weekly newsletter.

On my goodness, if you take a look at this week’s feature site you can see how much time I’ve wasted on this while I should have been compiling this newsletter for you. 678 moves and 778 seconds later and I’m still not done. I love these little puzzles, and I love it even more that we can have these as Progressive Web Apps that stay with us even when we’re offline.

Let’s get linking!

Sponsor

SmashingConf San Francisco 2019 (Apr 16-17)

Hailed as friendly, inclusive events, SmashingConf has broadened the horizons of what a web design conference is. Instead of showing slides, presenters prefer showing attendees how they work in a practical sense, from live debugging to live redesign. 13 speakers including Miriam Suzanne, Chris Coyier and Sara Soueidan will be exploring practical front-end techniques and design strategies. Early Birds are now available!

SmashingConfs are friendly, inclusive events focused on real-world problems and solutions. You can also download the Convince Your Boss PDF (417 KB).

Register Now

Articles

The State of JavaScript 2018

This is a fantastic report put together from thousands of responses to a JavaScript survey. Not only are the results really interesting, but the way in which they’re presented is top notch.

Push and ye shall receive

With the push API we can start building some really clever PWA’s.

When to use CSS vs. JavaScript

This is a great counter balance for a tutorial below about creating interfaces without the use of JavaScript. Use CSS where it makes sense and has the best results, and use JS in the same places where IT makes the most sense and has the best results.

Happy First Anniversary, Smashing Members!

A big congratulations to Smashing after a year of their memberships offering. Over the years I’ve got the equivalent of tens of thousands of pounds worth of consulting for free by using the articles that they pay smart people like you to write on their site. I figure that a couple of dollars a week/month is a fair trade for that and I LOVE that they don’t discriminate anyone that can’t afford or don’t want to pay that money.

Why can’t we use functional and regular CSS at the same time?

I find myself having a regular conversation with the designer that sits behind me.
she has designed something g and we have applied CSS rules and a bit of math to the design, yet in certain circumstances the design looks off. this tends to be where some magic numbers come into play to make our brains think the design is consistent, when we know the CSS is now anything but consistent.

What are Progressive Web Apps (PWA)?

Tutorials

You Might Not Need JavaScript

I’m not saying that you shouldn’t use Javascript for all of these, nor do I think Una is saying that either. What this does is showcase that there are other ways to do things, and that the wonderful world of HTML and CSS is advancing as well.

Testing iOS on a Mac (for Free!)

You may or may not be aware that xCode comes prebuilt with some simulator software that allows you to test on different iOS devices, INCLUDING devices like the iWatch. I knew that I could do iPhone/pad testing but I didn’t know about the watch side of things.

Set an SVG color overlay filter on an img

Currently the CSS Filter property can do lots of things but the ability to put a color overlay isn’t part of that capability. I turned to SVG and the use of the FEColorMatrix.

Going Fullscreen On iPad Safari 🤩

There’s two amazing things about coming across this article. First, it’s great to see that iPad (iOS Safari) are now supporting full screen mode and; secondly, how cool is the Bubblin superbooks. There’s a tonne of free content with some great titles and all available in the browser

Toggling Animations On and Off

A look at why folks just might not want your snazzy animations and how to ensure you adhere to their preferences.

Tools & Resources

What’s New In CSS?

A new version of Rachel Andrew’s talk about what is new and interesting in CSS. Covering some of the things we can already use as well as things just recently discussed at the CSS Working Group.

bRuck

Bruck is a lo-fi prototyping system made with web components. Quickly create and comment on interface layouts. The output is screen reader accessible, and responsive without you having to author breakpoints.

Tools for Makers

A hand curated directory of tools for makers to work on their dream projects.

Jobs

I’m still looking for someone to join my team and work with me to define and build web solutions. I wanted to test something out and see if this job could be added as a repository on GitHub. You can learn about the job, submit a pull request if you find any mistakes, and submit questions through GitHub issues which I can then answer and tag appropriately. I’d love to get people merging their applications into the repository, but seeing as it’s a public thing it’s probably a pretty bad idea to put all your personal details up there.

Digital Consultant – TMP

Take a look and let me know if you have any questions!

Finally

That’s it for this week. In another week we’ll be in December and then…. wait…. where did 2018 go? I’m going to take some time off over xmas and work on some non digital things so we’ll have a few special editions to tide you over and give you reasons to do some research rather than talk to Uncle Brian and Aunt May.

Cheers,

Justin.

Subscribe to our Newsletter

Add your email address and receive an email every Friday covering off everything worth knowing about building your websites responsively.