1

There are two kinds of people in this world, people who love to read and people who don’t. Regardless, in this day and age, content is still the king. However, the great content is meaningless if not presented well. Today so much of web designs compromises of text and hitting the right mark for your typography and fonts is a key factor in the overall success of your site.

Digital is a very dynamic platform and we have to accept that the content keeps changing. Unlike print, web design doesn’t have the freedom to define the space between the letters.

Fonts have a deep psychological impact on your users and here is a list of 6 examples of great typography which are being used to create web designs around the world and are perfect examples that texts can never be boring!

1. Poppins

One of the Geometric sans serif typefaces and have been a popular design tool for building websites. Each letterform is nearly monolinear, with optical corrections applied to stroke joints where necessary to maintain an even typographic colour.

Lollypop - Web fonts

Recommended For: Modular and minimal websites
Use Case Examples:   www.zipl.pro   |   www.nerval.ch   |   www.theisbothmann.com   |   www.kikk.be
Source: Google Fonts
Font Link:  Download


2. Open Sans

Open sans would be a very good pair for many fonts like Raleway, Brandon Grotesk, Montserrat, Lato etc. It renders beautifully on the browser, with good readability.

Lollypop - Web fonts

Recommended For: Standard look & feeling, Corporate and Product websites
Use Case Examples:   
www.gravity-theme.site
Source: Google Fonts
Font Link: Download


3. Montserrat

This typeface comes in three variants and evokes the modernist style of the early 20th century, however, it feels less formal than, say, Futura. Montserrat really shines for short pieces of all caps and the geometric simplicity of the letters. In lowercase, Montserrat is still a pretty nice font with a nice large x-height and a lot more character than Arial or Helvetica.

Lollypop - Web fonts

Recommended For: Fun looking websites, it creates a majestic yet fun look.
Use Case Examples:
www.dangblast.com   |   hansonwu.com
Source:
Google Fonts
Font Link: Download


4. Playfair Display

It is a serif font with beautiful curves and well-rounded corners, which is suitable for both traditional, as well as modern websites. The design is influenced by typefaces from the mid to late eighteenth century, such as Baskerville. It makes an excellent font for titles and headlines (especially the beautiful italic), however, for long stretches of body copy, the delicate, high-contrast strokes might hinder readability, especially when used at smaller sizes.

Lollypop - Web fonts

Recommended For: It is basically the one that suits all and creates a feeling of trust. It can be used for modular as well as traditional sites.
Use Case Examples:  
wwww.adrien-heury.net   |   www.mondaymusic.es   |   www.craftedbygc.com   |    www.hoodzpahdesign.com
Source: Google Fonts
Font Link: Download


5. Avenir

The name Avenir means “Future” in French, and it is a minimal and modular sans-serif font used in many sites, which gives a futuristic look to the design. Use the bold and extra bold weights of Avenir for emphasis with the light, book, and medium weights.

Lollypop - Web fonts

Recommended For: Most suited for futuristic feeling. It resembles minimal, futuristic content, and creates clean looking product websites.
Use Case Examples:
  www.playcharms.com
Source: Web
Font Link: Download


6. Bebas Neue

It is a beautiful condensed looking font which looks very standard as well as stylish.

Lollypop - Web fonts

Recommended For: For standard yet solid and stylish layout feeling. It is a beautiful condensed looking font which looks very standard as well as stylish.
Use Case Examples:  
www.craftedbygc.com   |   www.theqcamera.com   |   www.ekpesbookclub.com
Source:
Web
Font Link: Download

Although typography isn’t as flashy as Animation or HD images, they are nonetheless, an integral and powerful part of every design. They can be bold, to draw attention to the messaging, or, subtle, to draw attention to other elements on the screen. In either case, one thing we all can agree on is that typography enhances the design as a whole, one way or another.

– article by Dhilip Kumar G., Lollypop Studio

If it was only about words, we’d only need a word document. Typography is all about solving a problem by also communicating an ambience and character. “It’s about communicating a message and letterforms are our tools”, says typographer Shiva Nellaperumal. Below he explains his rules to the game from A to Z.

words
Alterneutral Manifesto/ poster.

You must know the past in order to design for future.

Design history is full of inspiration. When you’re not working, read a book or watch a movie; imbibe the visual culture through cinema, comics, music, books etc. Focus on how design has evolved, and what you can possibly bring to it next. There is a lot of value in a design that represents an era. Study the eras. A designer responds to stimuli provided by his/her environment and by analysing the past, one gets to know how other designers responded to the stimuli in their time. It’s very important for a designer to be firmly rooted in his/her time and design things that are relevant.

words
Adian Grid Specimen Poster.

Your process must be contextual to the nature of the project.

Each letter has its own semantic meaning that cannot be changed. We all know the letter ‘a’ of any typeface has a characteristic set of curves and lines. But what sets it apart is the way it is drawn. When working on letterforms, keep in mind the feel that the piece must convey. This could be very obvious or very subjective. For example, in the typographic posters for Doolally, the letters were designed to look like beer, in order to evoke the feeling of beer. But for the Public Enemy album art, a more subjective method was employed. Because their music is very harsh and represents the streets and calls for a militant action against racism, the feeling was conveyed through the use of stencil typeface that was specifically designed. The colours and composition also evoke the 80s feel which is when the album was made.

words
Struktur Construction.

A design based purely on aesthetic work is an end in itself.

Your work should serve a problem. Every design decision should be informed by whether that choice would bring you closer to communicating the message to the viewer. Of course, aesthetics are important, but not at the cost of the purpose of the design. Remember, you’re not painting scenery here but providing a creative solution. It’s not about what’s said, but how it’s said.

words
DJAD Posters

Typography’s sole purpose is to act as a vehicle for the content to be read comfortably.

But with expressive type, one has the freedom to express more meaning than just act as a carrier. It’s about communicating an ambience. It’s interesting to know that design is capable of working in subliminal ways. For example, certain typefaces when used in a certain way evoke a sense of the 70s. Design that can work in unsaid ways holds a lot of value. Try incorporating that in your design by focusing on the details rather than the bigger picture. That’s where the magic happens because the viewer understands what’s being communicated but doesn’t realise why or how!

words
Adian Grid Construction.

Design decisions are informed by the materials that can be used.

In typography, the challenge would be to pick the right typeface for a design problem, one that evokes the appropriate feeling in the user. For example, a medical journal must use a typeface that is commanding and neutral but a film poster could use a very expressive one. The basic principles of design like contrast, rhythm and balance need to be adjusted and worked on to achieve the needed feel. Type design is a craft. It is highly dependent on its production, where the technicalities must be impeccable for it to work properly. Typefaces are tools for designers. If graphic designers are architects, type designers are the ones who make the materials to be used.

words
It takes a nation of millions to hold us back by public enemy.

The greatest challenge is to push the design with technology and create work that challenges its own production.

Technology is integral to design. The aesthetics, production values and scale of a project are often heavily influenced by the technology available at the time. This sets eras apart. For example, during the letterpress era, the design was constrained by what the letterpress could do, but some of these constraints were reduced during the Photolettering era. And a whole different set of constraints were introduced when the computer became integral to design. There have always been designers who broke boundaries with the technology available like how Wolfgang Weingart did with his letterpress works or how Emigre did when computers first came out. Constraints excite the designer. A good example for this is the typeface, FF Beowulf by the guys at Letterror. It is a digital typeface that was part code and part drawing and its forms changed every time it was printed. Now with the recent advancements in type technology with open type and web fonts, it is an exciting time to be a type designer.

words
Murder Ballads by Nick Cave & the BadbSeeds.

Published in Issue 19

A typography special, made up of not only Indian type designers or designers whose first love is type, but also few very talented international designers who open a totally new playground with sharing their insights and inspirations. This issue has exclusive interviews with Lucky Dubz Trifonas from Netherlands, Indian UI & type designer Sabareesh Ravi and Shiva Nallaperumal, who believes, type designers are the material providers to all the creative professionals. Also, includes a special making of Nirlep rebranding done by Elephant Design and an interaction with the ace product designer Aman Sadana.

 

Order Your Copy!

Pin It on Pinterest