Are you ready to master responsive web typography?

Building responsive websites with great typography is no simple feat. There’s so much going on. It’s easy to get confused and overwhelmed, and maybe even give up on it all!

These, in a nutshell, is what you need to know.

First, you need to know what typography practices apply to the web. The web is chocked full of opinions that every typography practice is important, but many people fail to explain why.

How can you be sure what’s really important? What typography principles can you ignore? How do you discern opinion from facts?

My friend, you need to know the why behind each typography practice. You need to know if they’re applicable (or if they’re viable to implement) on the web.

Second, if you implement everything, you’re sure to run into cases where practices conflict with each other (modular scale and vertical rhythm, I’m looking at you 😡).

How do you resolve these contradictions? Can you back up your claims if anyone challenges your theory?

Third, how do you translate these practices into sane, reusable code? Responsive design is pretty hard. Yeah?

So, unless you have serious design + frontend skills, you’ll probably find yourself confused, overwhelmed and helpless in the face of typography.

It’s hard. 😢

I was helpless and confused too…

Until I decided to drill into design to discover why typography practices work.

In my search, I found universal principles that apply not only to typography, but also to general design. After discovering these principles, I was able to apply them in both my design and code. As a result, both my design processes and code improved dramatically.

On the design side, I became more creative and confident. I knew my designs would be good enough since I have a firm grasp of the fundamentals. I can even walk into a meeting with designers and hold my ground when we talk about typography, something I didn’t think was possible before.

On the code side, my code became simpler and neater. I was able to cut through the bullshit and contradictory opinions since I found out how to translate essential principles from typography straight into code.

What if you’re equipped with the same principles I know now? How different would your approach to work be?

  • What if you could be more creative, speed up your design process and know how to tell if your design is good enough?
  • What if you can walk into a meeting room knowing you’ll be able to handle pixel pushing designers, and walk out without a ton of small adjustments?
  • What if you could finally teach your developers to care about typography?
  • What if you have a robust and flexible typography system that you can reuse over and over again for any project?

If any of these sound interesting, I’d like to introduce you to…

Mastering Responsive Typography

Hey there! I’m Zell. I made Mastering Responsive Typography (in case you didn’t already know 😝).

Mastering Responsive Typography is a course for frontend developers who seek to create excellent typography without resorting to hacky and unmaintainable CSS.

I wrote Mastering Responsive Typography because I saw many frontend developers struggle with web typography. Most were lost and confused as I was in the past.

I want to help. I don’t want you to waste two years to slowly grasp the crux of responsive typography (like I did). I want to speed you up, so you can spend the time to create awesome projects, learn another cool thing or focus on what’s important, like family and relationships.

Image of Zell
This is me, I’m Zell!

What’s in Mastering Responsive Typography?

Mastering Responsive Typography consists of 17 core lessons. These lessons are broken into three modules:

Module 1: Web typography practices

Module 1 shows you the fundamentals of web typography. You’ll learn to determine whether your typography is good enough and what practices to use, amongst other foundational topics.

There are five lessons in module 1. They are:

  1. The four essential properties of web typography
  2. How to typeset your body text
  3. How to determine your header sizes
  4. How to create an irresistible flow
  5. How to eliminate contradictions when using Modular Scale and Vertical Rhythm together

Module 2: Design principles in typography

Module 2 shows you what design principles apply to typography. You’ll learn how each principle affects human perception and how to use them in typography. Together, these principles will change the way you think about design.

There are five lessons in Module 2. They are:

  1. The principle of repetition
  2. The principle of contrast
  3. The principle of alignment
  4. The principle of proximity
  5. How to integrate all four design principles

Module 3: Responsive typography practices

Module 3 dives into the responsive web. You’ll learn what practices to apply, how they work, and how to convert every lesson you’ve learned into working code.

There are seven lessons in Module 3. They are:

  1. How to use different font-sizes for different Devices
  2. How to use relative units
  3. How to choose relative units
  4. How to crafting a responsive modular scale
  5. How to automating modular scale calculations
  6. How to deal with Vertical Rhythm in responsive design
  7. Putting everything you’ve learned together

That’s how Mastering Responsive Typography is structured, but that’s not everything you get.

There’s more.

Extra support, just for you

You’re bound to have questions as you progress through the course. It’s normal for everyone who’s learning something new. I’ve prepared three extras to support you on your typographic journey.

Extra 1: Bonus content!

I’ve included bonus lessons to answer questions you may have on real-world implementation of the lessons. Treat this section as an ever-expanding FAQ because I’ll add on to it as I get more questions about typography.

There are five lessons in there right now. They are:

  • How to talk to designers and developers
  • How to structure your typography
  • How to automate typography with Typi
  • How to choose between Rem and Em units
  • How to choose and pair typefaces

Extra 2: A slack group (worth $120/year)

What’s more important than a community of like-minded individuals who care about excellent typography?

You’ll have unlimited access to this group of awesome people. Feel free to form genuine connections, create lasting friendships and discover you’re not alone in this world!

Of course, this is the place to ask questions if you’re ever confused about typography. I’ll be there as much as possible to help answer your questions (and I’m sure others will, too! 🤗)

Image of Chris Baughman
Chris Baughman Fullstack engineer

I love Mastering Responsive Typography and it’s bonuses so much that I’ve been constantly going back over much of it. I’ve mainly been a back-end developer for over 15 years, and transitioned to front-end about 4 years ago. I’ve had a great deal of questions that designers at my workplace could never answer for me. These questions were answered, in the exact way I needed them to be answered, in Mastering Responsive Typography.

Enroll in Mastering Responsive Typography for $195

I’m excited to share Mastering Responsive Typography with you! By the end of the course, you’ll have the confidence (and skill) to create good-looking websites with great typography.

Image of John Lekas
John Leskas Frontend developer & wordpress expert

Mastering Responsive Typography is a true masterpiece that went above my expectations. You can learn web typography through the easy way and become a Responsive Ninja in a very small amount of time. The money I paid for the course has already earned itself back multiple times.

Also, Zell is an awesome writer. He knows how to separate topics into small digestive chunks so readers can read and learn easily. He also made responsive typography funny and exciting for me. Now, I’m in love with responsive typography even more!

Feel free to try Mastering Responsive Typography for 60 days.

You’ll get access to everything, including all three bonuses within the first 60 days. If you don’t love Mastering Responsive Typography for any reason, just let me know in these 60 days and I’ll return you all your money. I don’t intend to take a single cent if you’re unhappy.

Here’s why I let you try, risk-free, for 60 days.

If there’s one thing I hate, it’s courses that don’t do what they promised to. I’ve done everything I can to ensure that doesn’t happen with Mastering Responsive Typography.

I’ve tested the contents of Mastering Responsive Typography by writing articles and giving talks about it. I also made sure to write in a beginner friendly way so you won’t feel overwhelmed or confused while going through the course.

So, if you pick up Mastering Responsive Typography and you don’t love it, just email me within 60 days. Tell me why you didn’t love it and I’ll send your money back. You have my word.

Image of Eric Pan
Eric Pan Product designer

Mastering Responsive Typography was fun, informative and immediately useful. It showed me how to work with type systems in a digital context, using a repeatable process based on thoughtful principles. Now, creating (and testing!) responsive typography systems in code makes so much more sense than in a static design program! My only regret is I didn’t start my work with this approach.

Also, I loved the deliberate pacing. Zell moves forward through the content and circles back on common edge cases that will come up, which, for me, made the difference between knowing about something in theory and applying it in reality.

You got questions?
I have some answers!

Is Mastering Responsive Typography for me?

Do you care about typography, want a website that looks good, and refuse to give in to messy, hacky CSS? If you are, MRT is perfect for you.

What if I can’t follow along?

I know how it feels to read tutorials where everything just goes over your head. It sucks. I hate it too.

That’s why I take special care to explain everything in Mastering Responsive Typography. I guarantee you’ll be able to follow along just fine. If you can’t, feel free to drop me an email / ask in the slack group and I’ll be there to answer your questions as quickly as I can.

What if I’m too busy?

I broke the course into bite-sized, easy to consume pieces to fit your busy schedule. You shouldn’t need more than 15mins a day to go through them.

You also have lifetime access to the course so don’t worry about trying to finish it within a month. You can come back to it anytime.

Do you offer student discounts?

Yep! Just send me an email with a valid student ID and I’ll send you a discount code.

I can’t pay with Stripe. Can I pay with X instead?

Sure you can. Send me an email and I’ll walk you through it.

I have another question

Just send an email to [email protected] and I’ll be right back with ya!

Still on the fence?

(It’s cool to be on the fence. 😎 I wonder how you remain in balance though. It’s so dang hard! Can you teach me? 😊)

Jokes aside, I highly recommend you get the course, even if you’re still on the fence. Learning about typography has helped me improve both my design and frontend skills. I became more creative, I write neater code and I have more confidence, whether I making my own design decisions or deliberating over it with my co-workers.

I’ll like you to get confidence in yourself just like I did. I’ll hate it if you missed out on this opportunity, and I’ll like to see you on the other side of the fence, if possible.

Ready to enroll in Mastering Responsive Typography?

I can’t wait to teach you everything I know! If you’re interested in making websites with awesome typography, I highly recommend you check out Mastering Responsive Typography!

(You can always ask for a refund if you don’t love it. 😉)