Hello and welcome to RWD Weekly edition #284. I'm happy to say that the RWD Tees are back up on Cotton Bureau again as part of their thousand Tee sale. If you want to pick up a pretty sweet gift for your team mates at Xmas now is the time to get one of these. I'd also like to say a huge congratulations to Jake and Web Design Weekly this week for hitting edition #300, an absolutely herculean effort! Snippet Show I've been quiet on this for a few weeks but earlier this week I came across a great tweet from Matt Smith with this little CSS nugget: /* you forgot the 'alt' attribute */ img[alt=""], img:not([alt]) { border: 5px dashed #c00 } This snippet looks for images where the alt tag attribute is blank or if it has been ommitted altogether, and if so wraps the image with a red line. Nice! Let's get to some links! | | Headline Rachel looks at the most asked question about CSS Grid Layout — how to you provide fallbacks. This article looks at how to determine your browser support list, looking how far back CSS Grid goes back and shows you how you can structure your CSS to be backwards compatible (and covers off some key gotchas that may trip you up) This is a great approach when working with clients on new projects and identifying the most important elements of the project and plotting that out. This approach is a great way to get the people involved in the project to agree upon what may trump an decision, is it usability, accessibility, performance, delight? | | It's time to fall into a fantastic font sale! This Autumn Font Sale is overloaded with more than 120 gorgeous typefaces, culled from 31 different font families. You'll be privy to a wide variety of styles ranging from vintage to cartoony, not to mention a slew of extras like alternates. No matter your latest project, you're bound to find the perfect font in this collection. See the fonts | | Articles One of the biggest releases occurred this week with Firefox releasing v57 better known as Firefox Quantum. It is twice as fast as it was 6 months ago and Mozilla believes it will be on target to be twice as fast again in 2018. So why such a big deal? Well for the first time since making a move across to Chrome back in 2008/9, I've reset my default browser to Firefox. This comes down to the leaps and bounds that Firefox developer tools have come along (although Chrome still has them beat there) as well as having the best CSS Grid inspector, but the switch is mainly down to the fact that it is fast for browsing. Eric Meyer recently published the fourth edition of "CSS - The Definitive Guide" and posted a picture of the new book along side the 2nd & 3rd editions. The latest iteration is as big as those two put together, yet in this article Eric explains why CSS is simpler, although there's more of it that we can use now. Brad covers off the entire process of writing and publishing his Atomic Design book. He even goes into the nitty gritty of which label printer to buy to make packaging and sending them easier. Some really useful tips on getting your websites loading faster if you're using WordPress and plenty of links to plugins that can help you with the heavy lifting. At the Adobe Max conference the unveiling of Adobe XD wasn't packed with as many features as you would have hoped for with a 1.0 release, but a month later they've dropped some great updates, not least of all the Design Specs feature. This allows developers to find flows, measurements and copy styles while developing the front end. Google will be enforcing a rule that requires AMP pages to be on content parity with the original pages, or they'll be removed from the top spot in Google mobile searches (the search carousel). A review of the couple of options when using SVG placeholders to improve the perceived performance of your site. Tutorials Chris is experimenting a lot with Grid this week... or at least he is publishing a few of his thoughts on the Grid this week. This tutorial details how elements might not fill up the entire grid area, and that they can be positioned to the left/right, top or bottom of the area. Chris Coyier looks at examples with CSS Gridlayout that will allow us to deal with multiple aspect ratio requirements within a single page layout. Performance is incredibly important when it comes to selling products online. Make sure you're not making any of these mistakes and throwing sales away. Tools If you're looking at exploring how to take the DayDream of Samsung GearVR controllers and add more interactive features for your AFrame worlds then this component looks at the tilt/gyroscope options in the controllers Finally That's it for this week. In the lead up to the Xmas break I'm going to be putting together a couple of best of editions to get us over the holidays so that you've still got something to distract you and keep you tinkering, and I can spend more time trying to cut down a tree and put together kids xmas presents ;) See you next week! Cheers, Justin. | | | |
No comments:
Post a Comment