background preloader

Five simple steps to better typography

Five simple steps to better typography
– April 13th, 2005 – Typography, I find, is still a bit of mystery to a lot of designers. The kind of typography I’m talking about is not your typical “What font should I use” typography but rather your “knowing your hanging punctuation from your em-dash” typography. So, in an attempt to spread the word here’s the first of five simple steps to better typography. Measure the Measure. The Measure is the name given to the width of a body of type. One point = 1/72 of an inchOne pica = 12 pointsOne em = The distance horizontally equal to the type size, in points, you are using. But, with the advent of DTP packages and the website design the following are also now used: MillimetresPixels There is an optimum width for a Measure and that is defined by the amount of characters are in the line. CSS and fluid? What is interesting here is fluid designs on the web. The Measure and leading. A simple rule is your leading should be wider than your word spacing. Reversing out? Tracking Your responsibility Related:  TYPEFACE & TYPOGRAPHY

Download the 75 best free fonts | Typography In this freshly updated free fonts for designers post, we bring you the world's best free fonts. We've filtered out the diamonds from the thousands of less perfectly designed free fonts available online, for you to use in your designs and illustrations. Get Adobe Creative Cloud now This list represents the 55 best free fonts we've found in eight categories. Don't forget, we have many other articles covering specialist font types including handwriting fonts, kids' fonts, cursive fonts, beautiful fonts, web fonts, professional fonts and more. Most of the typeface collections listed here can be used in your projects for free, but please be sure to check the terms. Serif fonts 01. This free serif display font takes inspiration from the late 18th century European Enlightenment and the work type designer John Baskerville. The typeface design is a project led designed by Dutch designer Claus Eggers Sørensen. 02. Lora is a free font that has its roots in calligraphy. 03. Image 1 of 2Image 2 of 2

A history and some revival fonts < The Fell Types The Fell Types took their name from John Fell, a Bishop of Oxford in the seventeenth-century. Not only he created an unique collection of printing types but he started one of the most important adventures in the history of typography. You will find here a non-exhaustive history and a modern digitization of some of them. 8 Simple Ways to Improve Typography In Your Designs - Smashing Magazine Advertisement Many people, designers included, think that typography consists of only selecting a typeface, choosing a font size and whether it should be regular or bold. For most people it ends there. These details give the designer total control, allowing them to create beautiful and consistent typography in their designs. 1. The measure is the length of a line of type. A simple way to calculate the measure is to use Robert Bringhurst’s method which multiples the type size by 30. I’m using px because it makes the math easier but this also works with em’s. 2. Leading is the space between the lines of type in a body of copy that plays a big role in readability. Many factors affect leading: typeface, type size, weight, case, measure, wordspacing, etc. This takes some finessing to get the right spacing but here is an example of what the code would look like: 3. Hang quotes in the margin of the body of text. This is achieved very easily with CSS using the blockquote element: 4. 5. 6. 7. 8.

- 1229x994 [1215x835] Sometimes the toughest step in building a new website or redesign can be the conceptual ones. Selecting a color palette is one of them that can be tough if you don’t have the right tools. So where do you start? It all comes down to basic color theory and the color wheel. Basic Color Theory Scientifically speaking, color is the visual presence of light in different wavelengths and relates to how these wavelengths are absorbed or reflected. The most common way we, as designers identify color is by name. The color wheel is a circle dating to the days of Sir Isaac Newton in the late 1600s. The expanded color wheel, which is the basis for most RGB color pickers in design software, is an extension of the basic wheel. Primary Colors Red, yellow and blue are primary colors. Primary colors are the basis for the entire color spectrum. Secondary Colors Green, orange and violet (purple) are secondary colors. Secondary colors are formed when two primary colors are mixed in even amounts. Tertiary Colors

Sex Drugs & Helvetica 10 alternatives to Helvetica AisleOne - Graphic Design, Typography and Grid Systems The Future Of CSS Typography Advertisement There has been an increasing and sincere interest in typography on the web over the last few years. Most websites rely on text to convey their messages, so it’s not a surprise that text is treated with utmost care. In this article, we’ll look at some useful techniques and clever effects that use the power of style sheets and some features of the upcoming CSS Text Level 3 specification, which should give Web designers finer control over text. Keep in mind that these new properties and techniques are either new or still in the works, and some of the most popular browsers do not yet support them. But we feel it’s important that you, as an informed and curious Web designer, know what’s around the corner and be able to experiment in your projects. A Glance At The Basics One of the most common CSS-related mistakes made by budding Web designers is creating inflexible style sheets that have too many classes and IDs and that are difficult to maintain. The Font Property White Space (al)

The Walden Font Co. - Purveyors of old and historic fonts and clip-art Welcome! We resurrect old typefaces of historical importance and make them available to you. Each font package includes typefaces unique to their period, plus printer's ornaments, borders, and symbols. It's everything you need to create period pieces for advertising, business use, book design, educational, and recreational purposes. You've seen our fonts featured in National Geographic Books, ESPN Magazine, book covers, in-store ads, concert posters and many other places. Browse our selection below and see for yourself why for over 10 years Walden Font Co. is the premier source for historical fonts! 32 authentic 1940s fonts as seen in period posters, including Dickie WF, plus a handy bullet font. 30 more 1940s American poster fonts. Buy both and save! 47 bold and grungy Wild West advertising fonts with 300+ clip-art images, border and bullet fonts, including the whimsical "Cattle Brands" 14 authentic Civil War Era fonts from recruitment posters and other printed material of the time.

Born Typeface | Born is a mediterranean typeface open to new times | Carlos de Toro | Diseño gráfico y tipografía | Barcelona & Logroño Su historia Born es mucho más que una tipografía, es también una historia; La de mi año 2013. La historia de una mudanza a la gran ciudad, el resultado de conocer grandes personas de todas partes del mundo y también sus culturas, de conversaciones en clases, bares, trenes… de compartir momentos, experiencias, conocimientos… Born es el resultado de todas estas vivencias y personas: y ahora yo comparto contigo este pedacito de historia. Born, nacida en la ciudad de Barcelona a primeros del 2013, lleva también el nombre de unos de los barrios más pintorescos de la Barcelona actual, donde a orillas del mar mediterráneo lo antiguo y de toda la vida, las nuevas tendencias y la multiculturalidad se unen y fusionan entre sus estrechas y serpenteantes calles, creando una simbiosis entre tradición y modernidad. Se trata de una tipografía mediterránea, abierta a los nuevos tiempos.

Periodic Table of Typefaces on the Behance Network Large original English version HERESpanish version HEREPortuguese version HERE PRINTS, SOURCE FILES, and other Periodic Table of Typeface related goodies are available HERE The Periodic Table of Typefaces is obviously in the style of all the thousands of over-sized Periodic Table of Elements posters hanging in schools and homes around the world. This particular table lists 100 of the most popular, influential and notorious typefaces today. As with traditional periodic tables, this table presents the subject matter grouped categorically. The Table of Typefaces groups by families and classes of typefaces: sans-serif, serif, script, blackletter, glyphic, display, grotesque, realist, didone, garalde, geometric, humanist, slab-serif and mixed. Each cell of the table lists the typeface and a one or two character "symbol" (made up by me simply based on logic), the designer, year designed and a ranking of 1 through 100. The sites used to determine the rankings are as follows :

Free fonts! Font squirrel is a site dedicated to finding only the best commercial-use free fonts... "Free fonts have met their match. We know how hard it is to find quality freeware that is licensed for commercial work. We've done the hard work, hand-selecting these typefaces and presenting them in an easy-to-use format." Pictured are a couple of my favourites League Gothic and Lobster there are some great looking retro fonts, scripts and many more and best of all you can use them for commercial work. Worthe Numerals Worthe Numerals come out of a time-tested development cycle where House Industries employees ask “What if this could be just a little more...”. After pushing traditional didot forms to the limit, these digits were originally applied to a set of wood blocks. But, who says replenishable Michigan-grown basswood should have all the fun? So we added everything one needs to stylishly set their current currency and credit default swap hedges, while also being able to set the appropriate fractional take from their blog’s micropayment structure. Accountant saying the numbers don’t add up?

Related: