Web Typography for Designers & Developers

Web Typography for Designers & Developers

Salepage : Web Typography for Designers & Developers

Arichive : Web Typography for Designers & Developers

mp4 (1280×720, 30 fps(r)) | Audio: aac, 44100 Hz, 2ch | Size: 2.75 GB

Genre: eLearning Video | Duration: 67 lectures (6 hour, 17 mins) | Language: English

Master the most essential building block of any applications design and development

History of Typography

Anatomy of Typography

How to Select a Typeface

How to Pair Complimentary Typefaces

Optimising for readability

Designing a Typographic System

Styling and Formating

Conditionally importing font files without blocking

Setting up fallback fonts

Make typography respond to different screen sizes

How to work with variable fonts

Requirements

Basic understanding of HTML, CSS and some javascript would be beneficial

Some experience with design would be beneficial too

Description

Typography is the most important, foundational building block of all websites making up 95% of everything we see online. Despite been so crucial to getting an application right very few designers and developers learn to master web typography.

If you’re working on a web application, you’re making decisions about typography that will effect the branding, style, usability and user experience of you application. You’re already making these decisions but are you aware of their impact. Typography can have enough personality that we don’t need any other visuals. Typography can give life to a dull block of text and it can make it easier or harder for our user to read. If we get the typography right it can make or break the application.

The size and line height of our typography dictate the size of the vertical grid for our whole application. We need to make good typographic choices before we can finalise any other part of the design. These sizes will affect the size of everything else. We also may need the grids to adjust as the typography sizes adjust on different devices. If we want our design to have real polish we’ll need slightly adjust our grid as the type changes and we’ll need to slightly adjust our type as the device changes.

As we master our web typography every other part of our design falls effortlessly into place.

What do I get in this course?

This course covers both: the design and development of a typographic system. As a designer you need to understand the technology to make detailed choices regarding any design. As a front-end developer you’ll always need to ad changes that aren’t in the design and you’ll need to understand why the typography styles are so specific. For these reasons we run through both designs and development of web typography in this course. We’ll cover:

Introduction: history and background of different type classifications

Selecting and Pairing: How to choose a typeface and how select complimentary typefaces that work together

Readability: How do we read and how can we make it easier for people to read with our typographic choices

Styling & Formatting: what extra style can we add to our typography and how can we use this to improve our visual hierarchy

Importing: How do we import font files without blocking or seeing multiple text styles swap out

Responsive: Whats the best way to make our type respond across devices and screen sizes

Is this course for me?

You should have some experience either, designing web applications or front-end development in HTML, CSS and javascript. Although this is not essential, you’ll get the most out of it if you have some experience with one or both of these.

If you want to increase your understanding and use of typography across web applications this is for you. You’ll be better placed to make your applications functional and beautiful once you follow the modules in this course. The sections on selecting and styling would both benefit someone who has time to practice and experiment. Whatever application you’re working on you can’t avoid working with typography. Mastering type will help any designer or developer at any stage in their career.

Who this course is for:

Any designer of digital products with 1-3 years experience

A front-end developer with 1-3 years experience