Want to level up your design and coding skills?
I’m a big believer in forever learning. There’s always a new skill to master (or at least get better at). It keeps your web design business fresh and current, and your clients will thank you for it.
But what are the best resources out there for daily learning? Here’s what I use!
Design
I love exploring and collecting design inspiration. There are so many amazing designers out there, and I feel lucky to be able to learn from there techniques.
Here are a few of my favorite design resources for any skill level between beginner and pro.
Mason Gentry created Design by Numbers to help explain the design process to non-designers. Unlike other books that focus on design history or theory, Gentry prefers to jump straight into practical advice. If you're new to creating websites or interested in understanding the process, check out his book.
I love Dribbble. I could spend hours (days even) looking through the designs posted there. But while that would be a beautiful way to spend my time, I can't justify the hit to my productivity.
Instead, I turn to Dribbble while I'm researching an industry or looking for specific design solutions to problems I'm having. This gives me a lot of inspiration, lets me see a variety of solutions, and leads me to create a custom design of my own.
Design for Hackers is another website full of great beginner web design tips. David Kadavy takes a historical approach to design, giving you the foundation you need to create amazing designs.
Like Dribbble, Codepen is a platform for designers and developers to show off their designs. The difference is that Codepen is a place for actually implementing those designs with code.
If I get stuck thinking through a design problem, I can turn to Codepen to get a variety of ideas that will help me come up with a perfect solution.
HTML & CSS
HTML is the coding language that gives us building blocks for the web. And CSS lets us make our websites beautiful.
While Squarespace designers are less likely to spend much time mucking about in the code, understanding HTML and CSS helps you to make your Squarespace websites more accessible and SEO-friendly.
Here are a few resources I use regularly to make sure I’m on top of the changing standards.
I can't recommend HTML5Doctor enough. This website serves as an excellent breakdown of HTML5 and how to use it. Turn to it when you want to learn HTML more in-depth and/or keep up with changes and recommendations.
Curious about when to use a blockquote or a particular heading? HTML5 Doctor can explain it to you in plain language.
Excited to use THE NEWEST THING in web technologies? You'll need to check to see which browsers support it and how well they support it first.
Can I Use gives you up-to-date information that breaks down browser support desktop and mobile browsers. A must-have, especially if you're design websites that need to support older browsers.
I love well-written documentation. Much like I turn to HTML5Doctor for HTML, I turn to Codrops for an easy-to-use CSS Reference. This reference includes demos, tips and tricks, and links back to the main documentation for more in-depth reading.
JavaScript
Picture this. You’ve just about finished up that Squarespace design but there’s just a small bit of functionality missing from your chosen template.
Maybe you want to add a back to top button and your template doesn’t have it built in by default.
Understanding a little bit of JavaScript will help you understand those code snippets you find all over the web. Or maybe you’ll learn enough JavaScript to write your own snippets!
Here are some incredibly useful resources when learning JavaScript.
The MDN JavaScript Reference is THE reference on JavaScript. You'll often turn to this resource to understand how different things in code works.
I turn to it several times a day when I need to remember how to do something or find more information on a specific topic.
A lot of the code snippets you find in the Squarespace community involve adding the jQuery library to your website.
But adding an entire library for a tiny code snippet just adds a lot of bloat to your website without a good reason.
You Might Not Need jQuery explains how to rewrite jQuery code into plain JavaScript so you can increase your website’s performance.