10 Ways To Optimize Images For Web

With so many web fonts to choose from, it can feel a bit overwhelming to pick the best fonts for a website. Fonts are important because they tell a story through the visuals they provide. Fonts are used to create a sense of comfort, engagement, and trust. By using fonts correctly, you can give your website a specific type of feel to reach your target audience. This article will explain the basic typeface characteristics and when to use them, and how to use fonts to make your site more readable. 

Typefaces

To start, let’s demystify the different categories of typefaces and their characteristics. There are five classifications of typefaces: serif, sans-serif, script, monospace, and display. Each typeface is used for different article features and evokes a different response from the audience. Understanding the different typefaces is important when choosing the best fonts for a website.

Serif

• What it is: A serif is a stroke added to the beginning or end of a letter 

• Communicates: Traditional and sophisticated 

• Used for: headings, titles, logos, and body text

• Examples: Georgia, Times New Roman

Sans-Serif

• What it is: “Sans” is French for “without.” Therefore, Sans-serif fonts are typefaces without strokes added to the beginning or end of the letter. 

• Communicates: Clean, minimal look

• Used for: headings, titles, logos, and body text

• Examples: Arial, Helvetica, Product-Sans, Poppins

Script

• What it is: Imitates the natural strokes of handwriting. It can range from casual to formal

• Communicates: decorative effects

• Used for: headings 

• Examples: Papyrus

• Use sparingly

Monospaced

• What it is: Every letter occupies the same width on the screen. Monospaced typefaces include both serif and sans-serif fonts 

• Communicates: Originally used on typewriters. Therefore, it evokes a vintage feel.

• Used for: Today, it’s mostly used to display code. 

• Examples: Lucida Typewriter, Courier

Display

• What it is: Decorative, novelty fonts. Font appearance varies widely 

• Communicates: Unique feel

• Used for: titles

• Examples: Nexa-Rust, Monoton

Font Size

Font size is very important when creating web content. In addition to making content legible to the reader, font size is also used as a way of communicating with the reader. For example, the following are situations when you may consider increasing the font size:

• Create a sense of importance and draw the reader’s attention
• Know your audience: will they need a larger font to read the material?

When choosing the best fonts for a website, make sure to view the font in different sizes. Not all typefaces are suitable for body and headings. Some fonts are only legible at a larger size and should be reserved for headings. 

The following are tried and tested font size guidelines that Choquer Creative uses for our content:

• Title size: 34 pt. This should be the biggest size on the page
• Body text: 17 pt (default)
• Links: 17 pt
• Secondary text: 15 pt (2 pt smaller than the default size)
• Captions: 13 pt

Text Hierarchy: Putting It All Together 

‍

Now that we have the basics down to choose the best fonts for a website, let’s dive into the text hierarchy. To improve navigation and make your content more digestible, the text should be broken up into sections with headings. Text hierarchy allows readers to easily distinguish between headings and content. The reader should be able to scan the body of text and know which section to read by using the heading. 

Text hierarchy is implied with font sizes and font styles. However, to create a visually appealing and cohesive web page, limit the number of typefaces. We recommend using no more than two typefaces. For example, you can create a text hierarchy with only one font and increasing sizes. 

Generally, the following format should be used for a text hierarchy: The title should be the biggest size on the page. Following the title, there should be headings of increasing specificity and decreasing size (Heading 1, Heading 2… etc).  

Article Take-Aways

At this point, you should know the different typefaces and when to use them, font sizes, and when to use different sizes and implement the text hierarchy. The biggest takeaway from this article is that there’s more to choosing the best fonts for a website than deciding on a serif or sans-serif typeface. You also need to consider when it’s best to use these fonts on your webpage, and what the right style and size are for your website. Choosing the best fonts for a website is important to create a professional and engaging virtual presence for your audience.

At Choquer Creative, we use research-backed by Google and Apple to help businesses optimize their typography. Contact us today to optimize your website!

Make Your Site Navigation Search Engine Friendly

The idea is to be as clear-cut and structured as needed for search engines to index and rank your website. It’s also important that visitors can easily browse through your website. The homepage must show a visitor the big picture with its significant details broken down into sub-pages. 

Let’s say you’re building a website for your jewelry store, your home page can lead to separate category pages for earrings, rings, necklaces, etc. Each of those category pages can have more subpages of its own. However, don’t go overboard or Google might have trouble crawling all of them. If visitors can’t find a page by following links, chances are search engines won’t either. 

PRO TIP: Design Crawlable URL’s

At Choquer Creative, we know URLs play a big role in SEO, so make sure all your pages have short, structured ones. They must highlight the content of the webpage as clearly as possible. If its on the longer side, break it up with hyphens and try to use a keyword or two. 

Bad: https://example.com/golflessons4beginnersandboredpresidents

Good: https://example.com/beginner-golf-lessons

A bit of hyperbole, but you get it.

Use Structured Content

Okay, you’re probably seeing a pattern here too. Like #1, this is structuring the contents within each webpage. Titles, headers, and metadata are important aspects of SEO you just cannot miss. Every webpage must have a unique <title> tag, so make sure you don’t duplicate your title tags. Similarly, include <h1> tags on your webpages to structure its content. For title and h1 tags, include a keyword or two that’s relevant to the page’s contents. Avoid keyword stuffing. Meta descriptions are a great tool to get more eyes on your content. If you’re unsure, meta descriptions are the blurbs under the links on a search engine result page (SERP). So make sure it’s clear, concise & thoughtful.

PRO TIP: Understand A Searcher’s Intent

Excellent web design addresses multiple stages of user intent, from landing to checkout. Keywords are obviously, key. They represent ideas, subject matter and people, around which content is created. Remember that if someone is searching for something, the question is usually conversational when they’re looking for tips, suggestions, or a specific item. They tend to be less conversational and clear-cut when the searcher tries to look for specific information like an address for a store or store timings. Google Search Console is a fantastic tool to use when trying to find the keywords that can drive traffic to your website. Keep your friends close but your users closer.

Google Primarily Indexes A Website’s Mobile Version

As of March 2018, Google rolled out mobile-first indexing in response to the growing online traffic from mobile devices. To meet the rising needs of these mobile users, Google now prioritizes your mobile site. From an SEO stance, your site speed on mobile can impact your google ranking. That’s where responsive web design comes in. It creates a fluid, hassle-free experience that adapts to various screens and devices, ticking the right boxes on google’s ranking factors. You can also check how friendly your current site is with this free tool by google. ‍‍‍

PRO TIP: Google Analytics Can Come In Handy‍

Google Analytics is a fantastic free tool that gives you handy insights into your audience’s behavior and preferences. It also tells you which devices they use, along with the kind of content they interact with the most.

Watch Out For Image Optimization

While Google has found ways to effectively read and rank text, it’s not quite there yet with images. That’s why it is imperative you pay attention to alt texts and the nomenclature of your images. 

Alt text makes your images are accessible not only to more viewers but also lets a search engine know what the contents of your image are. This recognition can help you rank higher in google images too! 

PRO TIP: Watch Our For File Sizes

Bigger files like png’s can cause your sit to slow down. So stick to .jpg and .svg formats for better load times.

Block Unusable Pages From Being Indexed 

This is more important than you think. We talked about structure being one of the most important things for Google to distinguish your content from others. That being said, unusable pages that aren’t properly linked to the rest should be blocked from being indexed. Before we tell you how, let’s get the basics out of the way.‍

Crawling: the process of following a page’s hyperlinks to discover new content/pages‍

Web Spider: does the crawling‍

Googlebot: Google’s web spider‍

Indexing: the process of a search engine organizing and storing every webpage in a massive database

Crawl Budget: the number of pages Google will crawl on your site on any given day‍

Google says that having many low-value URLs can negatively affect a site's crawling and indexing.

“Wasting server resources on pages like these will drain crawl activity from pages that do actually have value, which may cause a significant delay in discovering great content on a site.”

While google mentions that if your site has less than 1000 URLs, they will be indexed efficiently, it wouldn’t hurt to ensure your site’s usability.