This week we will be sharing a lot work that we are so inspired by from different artists – Typography one of our favourite subjects and today we are sharing with you Tenski work he has shared some letters created for the latest 36 days of type challenge. As any graphic designer would tell you that typography is a big challenge.
And, it always amazes us to see the different interpretations and styles designers can use to recreate the basic letters of the alphabet. Here is some inspiration for all to see.
Link of Tenski work : https://www.behance.net/gallery/126245271/36-days-of-type-2021
Typography is one of the most important elements of any site, having a measurably large impact on brand and experience.
So fundamental is it that making wholesale changes to your typography — opting for a new font, changing the measure, increasing leading — is complex and fraught with potential time-sinks.
But there are some simple changes that you can make to your typography that won’t break your grid and can be achieved in 30 minutes or less. Here are eight of the easiest.
Increase Color Contrast
When laying out text, it’s common for designers to see text as a block within a visual design. A designer’s relationship to text is very different from a user’s; a designer positions text as a shape, a user reads it line by line. Consequently, designers tend to underestimate the amount of contrast text requires.
Light grey text is aesthetically beautiful but functionally useless. Text is meant to be read and needs to meet WCAG AA standards on desktop and WCAG AAA standards on mobile — or in any situation with many ambient light sources. The larger the text is, the more leeway you have.
Text should be thoroughly tested for contrast, but as a starting point, 18px text on a white background should never be lighter than #595959.
Tighten Heading Spacing
The vast majority of typefaces are designed for use as body text — large blocks of running text, multiple lines long. When the font was made, it was spaced for this use.
Unlike running text, headings tend to be short and are surrounded by more whitespace — especially above and below. Extra whitespace visually floods the negative space in the word shapes and forces letters apart.
To compensate, tighten the letter-spacing and word-spacing of headings by 1–5%.
Loosen Non-Word Spacing
When we read, our brain doesn’t spell out words letter by letter; it recognizes word shapes and even word groups’ shapes.
Most micro-typography is concerned with not disrupting those word shapes. However, there are times when you do want to prevent words from forming and allow individual characters.
Loosen the letter-spacing on any text intended to be read as a series of characters, such as serial numbers, tracking codes, and tabular data.
Use System Fonts for Inputs
Privacy is a big issue for users. Anything you can do as a designer to reassure users their data is safe will increase your site’s positive UX.
Style your HTML inputs to use system fonts — the default fonts set by the OS your user is accessing the site with. This creates a clear delineation between the brand data in the brand fonts and the user’s data in the user’s fonts.
Using system fonts in this way encourages the user to feel ownership of their data, builds trust, and increases conversions.
Mark Paragraphs Once
Paragraphs of text need a visual indication that they have begun. There are three ways in which this is normally conveyed: following a heading, with a vertical space before the paragraph, or indenting the first line.
Each paragraph should use one of these indicators and one only. Due to the nature of web content and the benefits headings have for quickly scan-reading content, for most sites, the best choice is a combination of following a heading and vertical spacing.
Use Genuine Styles
For various reasons ranging from the availability of fonts to aggressive optimization, it’s common for sites to fake alternative styles using CSS. Italics can be faked as obliques with a skew, bold weights can be faked by using the browser’s defaults, and small caps can be faked by setting text to uppercase and reducing the font-size.
These tricks do more harm than good, creating distorted word shapes that interrupt the natural flow of text.
If you cannot deploy genuine italic, bold, and small caps, then don’t fake them. Find alternative ways of creating emphasis, such as changing colors.
Use the Correct Quotes
Apostrophes, single, and double-quotes are specific characters. Most fonts provide a glyph for them that is distinct from the quick single or double-quote key on your keyboard.
These quote marks are most commonly referred to as “smart” quotes because word-processing apps usually have the option to be “smart” about which glyphs they use.
Using the correct quotes is one of the simplest ways to deliver a refined piece of text.
Hyphenate Text Properly
Hyphenation is the breaking of a word over two lines. It allows a less extreme ragged-right text, and it is vital on mobile devices where the available page width is relatively small compared with desktop.
The web has surprisingly poor support for correct hyphenation, but it is gradually improving, and it can be applied as a progressive enhancement.
CSS allows you to set hyphenation to none (no hyphens), auto (the browser inserts automatically), and manual (in which you specify where hyphens should appear using the soft hyphen character).
Typographically, a hyphen may be inserted in any word that is five characters or longer; there must be at least two characters preceding the hyphen and at least three following the hyphen.
If you’re looking for the right font for personal correspondence, business use, logos, signs, or branding – or any other reason – picking out just the right one can be daunting. There are so many popular fonts in different categories.
So how do you choose?
Narrow Down the Field
Take a look at different categories. There are several options, with some overlap,– but there’s a lot of variety in all of them! By deciding which category your ideal font lies in, you can immediately cut out a huge percentage of fonts that aren’t appropriate right now.
A Lighter Example
Let’s take the comic category as an example. The most famous font in this style, Comic Sans, is very popular for producing an informal, ‘fun’ style of notice at work or at home, but is one of the worst fonts ever invented. Never use this font! Please consider these instead.
Buttered Toast by Hanoded has a similar, quirky handwritten style but will stand out from all the others. Without leaving the category, though, you can find some very different styles which still carry that informal and fun tone – like Comicraft’s Bronto Burger, Scangraphic’s Flash SH, and the eye-catching HighJinkies, also by Comicraft.
If you want to maintain a unified appearance across different font styles, one of the best ways to do it is to look at the different font foundry’s which designed your first font.
While they’ll offer many that don’t present that unified aesthetic, you know that they’re interested in that look, and there’s a good chance they’ll have tried another spin on it in another style.
Designers, illustrators, and graphic designer have come together for project 36 Days of Type to show their restless creativity in a challenge to design a letter or number each day, please check the out below: