Choose the best fonts for websites with professional style

Transcript: You want to know how to stop wasting hours trying to choose the right font this video is gonna help you do that hey everybody what's up and welcome to another segment of designer mind where I try to help you become a better designer and in this episode I got a question about how I choose fonts for my project and I do want to share some of my learnings or the process that I've developed because obviously when I was just starting out as a designer I used to trust my gut feeling just look at a lot of funds waste hours trying to look at you know fonts and try to make sure that is this the good fit for this project or not or just look up at what other people are doing or is it a trendy font and use that and obviously that wasn't very successful in terms of I couldn't make the right decision for each project and as I said I wasted so much time and so here's the framework of how I think about this today first of all let's try to understand what is what are we trying to do... See more →

Key quotes:

• "Editor’s Note: In this article, Kent provides an overview of some of the most influential typefaces that many designers use today, and objective reasons why you should consider other types instead."
• "What do these contexts, and histories mean for determining the legibility, appropriate character, and use of our typefaces? The rules still apply now as generally serifs are preferable for long bodies of text, but this isn’t necessarily an absolute rule, as each typeface has its own specific qualities and appropriate contexts."
• "Garamond was one of the first faces designed for the type set, which means that it was ideal for the long body texts of the new phenomena of the age: novels."
• "The story is that Carter designed Georgia while working on a new version of the 19th-century font Scotch Roman, thus, Georgia maintains many of its predecessor’s qualities."
• "Verdana is referred to as a humanist sans serif, which means that it maintains some of the qualities and design logic of serif typefaces."

Key quotes:

• "But if you’re starting out, resources like Google Fonts are an ideal way to establish your brand, deliver your copy and even speed up your website."
• "Remember: just because you, a knowledgeable and very attractive designer, prefer a font, doesn’t mean that it’s the right choice for your website."
• "Here are some cool advantages of using Google Fonts on your website: Lato Warsaw-based designer, Łukasz Dziedzic, created Lato to work transparently in body text and also to stand out individually when used in larger-sized titles."
• "Nunito Another Vernon Adams creation, Nunito is a sans-serif font designed as a display font."
• "With 8 different weights available, it’s a versatile, attractive font which we’d recommend using when you want a smart, stylish sans-serif heading."
• "Oswald A reworking of the classic early twentieth century ‘Alternate Gothic’ typeface family, Vernon Adams’s Oswald font is designed for digital use on computers and mobile devices."

Key quotes:

• "Of course, the most important rule when choosing a font for your website design is ensuring that the text is readable."
• "Keep in mind that “90 percent of design is typography and the other 90 percent is whitespace.” It is usually pretty easy to eyeball it when it comes to the aesthetics of your website’s design, but if you can’t tell what the website is trying to communicate with just a glance, it’s not readable."
• "A good starting point for choosing fonts that fit the context of your website is to match the qualities of your intended message with the perceived traits of a typeface."
• "Google Fonts has over 840 font families to choose from, while TypeKit’s marketplace has over 6,000 fonts Most people simply use a combination of the most popular fonts when designing a website, but it is important to take the time and consider other fonts for the purpose of uniqueness."
• "Now that you know the difference between serif and sans serif and have an idea of what not to do, it’s time to start choosing your fonts."

Transcript: Okay let's talk about something really useful Google Fonts now back in 2010 Google started to offer web fonts for free and it quickly became the biggest repository the fastest repository for free fonts to use on the web I can have fonts installed on my computer that's great that's wonderful and I can come in here and I can say that I want to set the font family to something that I have installed on my computer that's gonna work for me if I'm looking on my web pages on my browser on my computer but somebody else may not have that same font installed that's why we build font stacks with the fall backs google fonts or web fonts in general this is how we use some really nice fonts that are available for free I could in theory upload a font from my computer to a web server link to it from there and that anybody in the world can use it but if I don't have a license for it then I'm guilty of copyright infringement there are fonts that are designed to be used for print publishing there's fonts that are designed to be used... See more →

Key quotes:

• "Open Sans is one of the most popular web fonts on Google Fonts."
• "It can be used for both title and body text and very compatible with many sans serif and serif fonts."
• "Example: Roboto Slab is another very popular font choice for portfolios by many designers."
• "It’s geometric form and friendly curves make it works really well for both headers and body texts."
• "The black weight of Playfair Display font offers very strong impression in Gabe’s portfolio below."
• "As a great choice for title and headers, it pairs well with most of the popular sans serif fonts for body text."

Key quotes:

• "That’s why even a rudimentary understanding of typography means you can determine for yourself the best fonts for apps and websites."
• "It’s this feeling that can help determine which are the best fonts for apps and websites."
• "If you have a font which displays large on an ordinary computer screen but doesn’t scale down properly when viewed on a mobile, then your website or mobile app is going to look terrible and it won’t even matter if you’ve chosen the best font in the world."
• "Before we think about the best fonts for apps and websites, it’s important to make the distinction between two different styles."
• "But the truth is that many of the fonts you’ve already got pre-loaded onto your computer and even many of the available fonts out there on the internet don’t get used widely within web and mobile app design."
• "It’s likely that you can count on both hands the number of fonts that pop up on frequently in mobile and web design."