Category Archives: Web design

14 Best Online Typography Tools for Web Designers

Style, convert units, search, identify, preview, etc. Lots of resources for working with type on the web:

Since typography is one of the most challenging and important aspects of web design, it\'s important to have useful tools that can make things easier. Here\'s a list of tools that will be a big help in making your typography beautiful, and you won\'t even have to leave your browser.

Baseline — a designer framework by ProjetUrbain.com

082009_baseline
Typographic and design standards on the web

When I first started to design Baseline, I wanted to base the grid on the work of Josef Müller-Brockmann, unfortunately some missing CSS attribute — like type leading — kept me from implementing a true grid based approach. I then decided to look back at the basic grid that is used in print: the baseline grid.

ISO50 Blog » Color Management: A Field Guide

ISO50 lays down the knowledge on color management:

Whether you are designing for print or for the web, making the leap from what you see on your computer screen to the outside world can be a tricky process, fraught with unpredictable changes and unexpected results. The web is full of information regarding color management and sifting through it can be very overwhelming. Contradictory opinions abound and it can be difficult to find reliable sources of information.

Over the last few months, Scott and I have been researching this topic extensively [and] we have implemented a color management system that works for us. Below we have tried to aggregate this knowledge into a simple and useful guide, designed to help you ensure your studio is set up correctly. It is not intended to be the end-all article on color management by any means — but it\'s a good place to start if color management isn\'t something you have previously implemented or considered.

(Thanks Quipsologies!)

25+ Useful Infographics for Web Designers

As someone notes in the comments: “As they say, a picture is worth a thousand words. Somehow seeing things with a picture adds a whole new dimension.”

Infographics can be a great way to quickly reference information.

Instead of pouring over figures and long reports to decipher data, an infographic can immediately make apparent exactly what a dataset actually means…

Some are incredibly practical, some provide information that might be of interest to designers and some just present data that might be interesting to those who design websites all day.

Introducing Typekit

True font control on the Web? It’s getting closer:

When we started Small Batch Inc. last year, our goal was to explore what\'s now possible on the web. That exploration has taken many shapes: bringing together a community at The Start Conference, working with our friends at Twitter for a few months, and digging deep into data with Wikirank. Now we\'re focusing on an entirely new idea, and we\'d like to share that with you. It\'s called Typekit.

We\'ve been following developments in web browsers very closely, looking for new and smarter ways to build stuff. Last fall, we started seeing renewed interest in linking to fonts via Cascading Stylesheets. While the W3C working draft has been around for years, a new wave of browser support will finally offer designers more control over fonts on the web. A particularly cogent article from John Allsopp, followed by frequent conversations with him, helped us understand that there was a significant opportunity here.

Jeffrey Zeldman’s Web Standards Advisor

“…Jeffrey Zeldman\'s Web Standards Advisor is a $49.99 extension for Adobe Dreamweaver. It includes two major interface

  1. The Web Validator validates your HTML and CSS and verifies the proper use of microformats, including hCard and hCalendar, for single pages or entire websites.
  2. The Web Standards Advisor checks for subtleties of standards compliance in nine different areas—everything from structural use of headings to proper ID, class, and
    element use. Nonstandard practices are flagged and reported in the Dreamweaver Results panel for quick code correction. A full report with more details and suggested fixes is also generated.”

The Grid System

“Made popular by the International Typographic Style movement and pioneered by legends like Josef Müller-Brockmann and Wim Crouwel, the grid is the foundation of any solid design. The Grid System is an ever-growing resource where graphic designers can learn about grid systems, the golden ratio and baseline grids.”

The Designer’s Review of Books

“Although there are several good design websites that occasionally have book reviews, there didn\'t seem to be a single place online where you could get constant updates and reviews of new (and sometimes old) design books.

Design books are often expensive and contrary – sometimes the book is worth having for the physical production values alone, sometimes for the images, sometimes for the words and, occasionally, for all three. We wanted to cover those elements in our reviews so that you know whether it\'s worth owning.”

The Design State

“Design State is a weblog about government web design and its attendant subtopics: accessibility, usability, and web standards. In addition to these nuts and bolts, Design State will also focus on higher level issues and project challenges that affect government and public-sector web design.”