"The Web Is Dead." This month's Wired magazine proclaims "Long Live The Internet." So what does that mean for Web designers? We must evolve to Internet Design! From apps to content everything has changed. The rise of NUI [touch screen or natural user interface] and mobile based hardware is driving lighter, simpler services and apps. This evolution has tremendous impact for designers. Yesterday I covered Layout.
Part Two: Typography
From best practices to HTML5 trends for apps and internet services Typography is a key component in developing the experience for the user and connection to the brand. Just like layout, typography plays an important role in how a user digests the content. I have seen typography transform ideas. Choosing the correct typography for your app or internet service is a very important part of the design process. Apps are a communication tools – very powerful ones – you can use the typography to help you on exposing your ideas! I am a big fan of using HUGE typography! If the words are direct and beautiful them flaunt it - make it the core of the design.
2.1 Your Typography Skills: Having a strong foundation of typographic knowledge is crucial. Here are some of my favorite sites that will help improve your type skills through learning about typography.
2.2 Bigger is Better: Big type is important. The user knows this. Big type will call attention to headlines. I also think that if done correctly Large type can serve as information graphics. All caps and a large font size for the titles and subtitles can establish a clear hierarchy that distinguishes the headings as having more importance than the paragraph below. Check out these sites and apps for uses of big impactful type.
- rareview.com
- Hull Digital Live
- Cupcake Creative Studio
- Notorious Design
- Visual Box
- WordIt
- GiantCreative
- Glitch
2.3 Make it Legible: I know this sounds like something that should be easy, but often Designers do not let the "cookies cool" and step back for a day from their type to see if it is still fresh or legible. By using high contrast between the text and the background, Dan Cederholm made the text on Simple Bits very easy to read. Also notice the amount of line spacing used in the paragraphs.
Always make sure to use enough to make a body of text easy to read. This normally requires some experimentation, but a good rule of thumb is to set the line height to 1.5em, which is 1.5 times greater than the font size. [example via WDL]
2.4 HTML5, CSS and TypeKits: You’ve probably been hearing a lot lately about how Flash is a dying technology and how it’ll soon be replaced by HTML5. While I am not convinced that Flash sites will die, I am seeing brands replace Flash for specific things like video and basic animation. HTML5 is doing wonders for expanding the capabilities of Typography in mobile and internet apps! Using HTML 5 and CSS type sites like TypeKit, Veer and MovableType have pushed the CSS @font-face technology required for advanced web typography. This technology is now supported by Internet Explorer, Firefox, and Safari.
2.5 Typography Tools for Internet Designers: There are tons of type tools for internet designers to use. Here are a few of my favorites.
Related Articles:
on: improving web typography
Research: WDL, Minimalist Magazine and Brand with Type.
Next Up: Part Three: Color Outside The Lines
Lawrence Spring
toronto web design and development
