Hello there!
Welcome to another week of responsive goodness and do I have some great stuff for you this week.
First off, it was my birthday on Monday where I turned over to the grand old age of 38. Technically I was just another day older than the previous day, but I figured I should celebrate a little so I'm giving you all a 38% discount on any Back Pocket Notebooks, check the end of the email for details.
The other thing that I started seeing a lot of this week was email subscriptions getting in touch to reconfirm an opt-in to communications to cover off GDPR requirements.
Now, when you sign up to this newsletter you go through a double opt-in anyway so I'm not sure if I actually need to do this, but I think it's a good time to make sure and it gives everyone an opportunity to opt out if you've been too lazy to unsubscribe in the past. You will be getting an email next week, prior to the next newsletter and after the next one as a reminder to those that don't opt-in.
Phew, let's get into the links! | | Headline I'm sure that Stephen Hay touched on something very similar to this when he was writing responsive wireframes in the browser. This technique, however, doesn't require any knowledge of HTML or CSS but creates that same key focus of content first and a sensible heirarchy.
| | | What would be the best way to learn and improve your skills? By looking over a designer or developer's shoulder! At SmashingConf Toronto taking place on June 26–27, they will let us do exactly that. All talks will be about running live coding and design sessions on stage, showing how speakers such as Dan Mall and Lea Verou, Rachel Andrew, and Sarah Soueidan design and build stuff — including pattern libraries setup, design workflows and shortcuts, debugging, naming conventions, and everything in between. | | Articles Have you ever wondered about the science behind colour? I recently did a lot of research on this very topic when creating the CMYK Colour Edition notebook set. I still remember using the Primary Colours in school, Red/Blue/Yellow which allowed you to create any other colour.
Rachel has been keen to see this come to the specification ever since it was removed from the Grid Level 1. This fixes the issues where a nested grid will currently not line its tracks up with the parents, there's no connection between the two. With SubGrid it will follow the existing parent tracks, very cool.
I'm not a visual designer, but I can design the crap about of information and data! It's one of my favourite parts of the job, working out the information that needs to appear on the page, and how that content can link with other information on the site in intelligent ways that create a great user experience.
Today, custom domains on GitHub Pages are gaining support for HTTPS.
I properly geek out on maps and data visualisations. This article in the FT is a great example of design data maps, and if you're looking for a brilliant example then check out the shipmap.org.
Tutorials Ever since CSS Grid hit browsers I've left Flexbox out of the newsletter... it seems a shame that after so long with floats that we've almost already discarded the first amazing fix that came along. There are some great and powerful things that you can do with Flexbox though, and these have benefits over using Grid on some occasions. In this tutorial, learn how flex grow can help your layouts.
Using minmax() in CSS Grid to create perfect margins on a grid site.
Zach is great with web typography. A long time ago he created a sweet little script called BigText similar to Dave's FitText.js. As the web has grown and we can do more with CSS he is now rolling Viewport units to make those big large feature headlines
Tools & Resources This is just what Foundation and Bootstap did with their 12 column designs with offsets and all the bells and whistles. I would encourage you to build the grids out yourself, this stuff is a bit of an overkill. It is GREAT for understanding how grid can be used though.
This is a great tool to showcase just how little CSS you need to build out amazing grids.
Take a look at these amazing variable types. Remember though, some browsers (including my version of firefox) doesn't support variable fonts just yet, Chrome is all good.
I've already mentioned that you absolutely go out and buy Offline, the new A Book Apart book from Jeremy Keith. Well, Jeremy kindly has shared a tonne of really helpful links that will help you learn more about the topic... but seriously the book does the best job.
The new release brings updates to jQuery 3.3.1, Modernizr and Normalize, .htaccess and migration to eslint.
MDN Web Docs are the unofficial manual to building websites. Now, and just in time for service workers being supported on every current web browser, they have all the details you need to get going with your progressive web app.
Jobs
The Natural History Museum is looking for a Junior Web Developer to join the Digital Media and Marketing Department, working on the Museum's public-facing digital experience. The role is based at the Museum itself in South Kensington, London.Salary £31k, closing date 14th May 9 am.
//Sponsor Creating beautiful, user-friendly websites is now easier than ever. Using Base UI for the Sketch App, you can quickly and easily build gorgeous designs. With 180 Web-based screens and ten quick-start templates, you can just dive right in with your own content. A real user-friendly interface even lets you customize everything from font sizes to colors.
| | Finally A one-day conference of practical and inspiring talks, featuring eight world-class speakers, preceded by a choice of two full-day workshops, plus side events.
As I said at the top of the newsletter, if you would like to help celebrate my Birthday then you can use the code RWD-BIRTHDAY-38 and receive 38% your whole order on Back Pocket Notebooks. Our new set of CMYK and Night Sky notebooks are great if you love design or space.
Cheers,
Justin. | | | |
No comments:
Post a Comment