Quellensammlung: Fonts und Typographie

Falls noch jemand einen Link braucht… Diesmal geht es um Schriften, Schriftgröße, Fonts und Typogaphie. Kurzum: schönere Buchstaben und Texte im Web. Inklusive der passenden Magazine, Blogs und Galerien.

Lesenswertes

• Fontpage – History der Typografie
  Wie die Technik in der Geschichte die Schrift und Typografie beinflusste. Links zu kostenlosen Schriften, Schriftenhersteller, Beschreibungen von Bleisatz, Maschinensatz, Fotosatz, KAthodenstrahlbelichtung, Vektorfonts
• HTML-Schriften unter der Lupe
  HTML-Gestalter haben es nicht leicht: Das Angebot an verwendbaren Schriften ist klein, und man weiß eigentlich nie, was am Ende beim User ankommt. Dieser Essay wird diese Probleme zwar nicht lösen; Er zeigt aber, worauf man bei der Auswahl einer Schrift für das nächste Web-Projekt achten kann.
• Typographie für Webautoren
  Die wichtigsten klassischen Typographieregeln speziell für den Webautor / Webdesigner zusammengetragen und aufbereitet.
• Typographie im Web
  Ausführlicher Artikel von Nadja Müller über die Typographie im Web
• Accessible web text – sizing up the issues.
  In part 2 of my introduction to accessible web text, I explore the issues surrounding text size; explain what all the fuss is about; and suggest some useful approaches you can adopt to ensure the text on your web pages will be readable to your visitors.
• Accessible Web Typography
  an introduction for web designers
• All about fonts for captions and subtitles
  Screenfont.CA is part of an upcoming project to research and develop a set of standards for captioning, audio description, subtitling, and dubbing.
• Cameron Moll
  The non-typographer’s guide to practical typeface selection
• Dynamic Text Replacement
  Using PHP JavaScript, and CSS for text image replacement
• Effective Style with em
  The most important thing being delivered from any Web site is the content. Therefore, time and effort should be spent on making that content the most accessible aspect of any project. The method in which you style the content intensive elements of your document has a very strong effect on accessibility…
• Fine Typography for the Web
  Sehens- und lesenswerte Slideshow von Dave Shea – Mezzoblue
• Five simple steps to better typography by Mark Boulton
  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. Call me a little bit purist but this bothers me.
• Know Your Type
  Starting points for typographic inspiration
• Readabilty
  Readabilty – making pages easy to read by design
• Semantic Typography: Bridging the XHTML gap
  In the Web Standards community we hear the words ‘Semantic Markup’ thrown around a lot as a concept—the right thing to do— but I know a lot of designers who are trying to learn this stuff are being confused by the whole ‘semantic thing’…
• serif vs. sans-serif
  Article By Faruk Ates,
• The Anatomy of Web Fonts [Design Principles]
  Typography involves degrees of science and art. In this step-by-step guide, Andy Hume illuminates the science of practical typographic theory and explains how it applies to the selection of attractive, usable Web fonts. He shows how to assess the merits of various fonts, identify those that suit your purpose, and put them together to create a communicative whole.
• The Trouble With EM ’n EN (and Other Shady Characters) by Peter K Sheerin
  Beating typographic correctness out of (X)HTML: more than you ever wanted to know about dashes, spaces, curly quotes, and other vagaries of online typography.
• The World of Fonts
  An overview of the history of type for a designer, showing the historical principles behind practical use of fonts.
• thinking with type
  Theory + practice, how + why: a new approach to typhographic education
• Typography and the Aging Eye
  Typeface Legibility for Older Viewers with Vision Problems
• Typography and the User Interface
  There is a quiet issue that nags at the computer industry. While processing speed and computational flexibility have grown at incredible rates, our displays, the most human-facing elements of our digital lives, lag behind…by Daniel Kuo
• Typography – Anti-Aliasing
  Aliasing is a term used to describe the undesirable effects produced when visual information is presented at a lower than optimal resolution
• Typography on the Web – Beauty is Not Letterform Deep
  For the last few years, design on the web has strongly shifted towards a more usable and standards driven approach. It is now commonly accepted that HTML text is far more usable than images containing text. However, many web designers still use images for type due to the typographic control they obtain.

CSS, Schriftgröße, Sonderzeichen

• Ein (Sonder-)Zeichen setzen
  Eine tiefer Griff in die typografische Regelkiste fördert zutage, was im Web fast alle falsch machen: Die Sonderzeichen. Was es mit Anführungszeichen, Gedankenstrichen, Apostrophen und den dazugehörigen HTML-Codes auf sich hat, kann der geneigte Leser hier studieren und hoffentlich später auch anwenden.
• Die richtige Schriftgrösse
  Artikel von Björn Höhrmann zum Thema Schriftgröße
• Erste Schritte mit CSS
  Gleiches Schriftbild in (fast) allen Browsern
• Schriftgrößen, SCHRIFTGRÖSSEN, schriftgrößen
  Ein kleiner kompakter Schriftgrößenguide
• SCHRIFTGRÖSSEN – VERGLEICH
  Vergleiche, insbesondere zwischen den sogenannten Kleinen und Großen Schriftarten unter Windows im Bezug auf die Erstellung von Webseiten
• Wie groß ist 100%?
  Immer Ärger mit den Schriftgrößen
• WinMac Schriftgrößenvergleiche auf Windows, Mac und Linux
  WinMac beschäftigt sich mit der Darstellung von Schriftgrößen auf verschiedenen Systemen. Ich habe 3 HTML Seiten erstellt und diese mit CSS formatiert
• CSS Font Size Explained
  CSS font size explained, relative versus fixed sized fonts, em units versus pixels, point size and percentage.
• How to size text using ems
  Text for the screen is sized with CSS in terms of pixels, ems or keywords. As most of us know, sizing with pixels is easy: get your selector and give it a font-size – no more thought required….
• CSS Typography By Garrett Dimon
  This article can’t address how to design with type, but it can help you become more aware and explore the options available to you through CSS. With a little practice you can make your design easier to read and improve aesthetics.
• Power To The People: Relative Font Sizes
  Changing relative font size using css and javascript

Fonts

• Fonts for the Web
  Web designers must normally restrict themselves to fonts that are available on most users’ computer systems. This page displays fonts widely distributed with Windows, Macintosh and the Internet Explorer browser
• 25 Best Free Quality Fonts
  Sammlung freier Fonts von Vitaly Friedmann
• Freie Schriften im Portrait
  Gerrit van Aaken nimmt freie Schriften unter die Lupe. Herausgekommen sind interessante, informative Portraits. Macht Spaß sie zu lesen
• 1001 Fonts .com
  Download free fonts for Windows and free fonts for Apple Macintosh. All fonts on this site are either freeware or shareware and in the TrueType or PostScript format
• Abstract Fonts – 10,000 Free Fonts for download
  Free fonts are categorized by style, alphabetically, designer, stylistic similarity, number of downloads and user rating. Custom font previews, characters sets fast downloads, top 100, worst 20, forums and much more. Everyone will find something to like
• Acid Fonts
  Download a large selection of freeware ttf fonts and dingbats for windows and macintosh at Acid Fonts
• ActionFonts.com
  a large archive of freeware and shareware Fonts, in 23 Kategorien eingeteilt und auch alphabetisch sortiert
• CHANK
  Cool Fonts, Custom Fonts, Free Fonts
• dafont.com
  Download free and shareware fonts
• eXtremefonts
  Download a large selection of freeware and shareware ttf fonts and dingbats for windows and macintosh
• FontShop
  Alles für Typhographie und Gestalung
• Letterhead Fonts
  Rare and Unique Typefaces for Artists (freie & kostenpflichtige
• MyFonts
  Find, try, buy and download fonts online, download fonts for Mac and PC at MyFonts, the world’s largest collection of fonts online
• SimplytheBest Fonts archive
  SimplytheBest Free Fonts. A collection of the best fonts on the Web, in Kategorien eingeteilt und auch alphabetisch sortiert
• The Font Pool
  27 372 Fonts, eingeteilt in 18 Kategorien
• typOasis
  Diese Fonts sind nicht nur kostenlos, sondern auch sehr schick. Ansehen lohnt sich
• WebpagePublicity.com – Download Free Fonts
  Download Free True Type Fonts from our assortment of over 6000 free true type fonts.

PixelFonts

• 04 | extra | bitmap Font
  free Bitmap Fonts, Windows & Mac
• 15 Best License-Free Pixel Fonts
  Sammlung freier Pixelfonts von Vitaly Friedmann
• BitmapMania
  free Bitmap Fonts
• Flash Pixel Fonts
  Freeware and shareware Flash pixel fonts categorised by their height in pixels. These fonts are designed to provide crisp screen text at very small sizes. To prevent them from anti-aliasing (appearing blurry) its best to set their X and Y points to non-fraction values.
• pixel and led fonts for flash
  free downloadable pixelfonts
• { Pixilate } Fonts | Pixelfonts
  Pixel, or bitmap fonts are fonts designed to look clear and crisp at screen resolution (72 dpi). Pixilate fonts are designed to work on Macromedia Flash, or on any other graphics application. For help on using these pixel fonts, please read the usage guide.
• Super Pixel Fonts – Fonts For Flash
  Download bitmap and free pixel flash fonts

Foren

• TYPOFORUM
  Forum zu Typografie, Schrift, Fonts und Gestaltung
• typeFORUM
  TypeForum ist das deutschsprachige Portal für Schriftfreunde und Schriftgestalter. Im Mittelpunkt dieser Seiten steht der fachliche Austausch der eingetragenen Mitglieder.
• Typografie: Da werden Sie Augen machen!
  Der Verein will Schrift und Typografie als Teile der deutschen Kultur ins Bewusstsein einer breiten Öffentlichkeit bringen, die Bedeutung und den Nutzen der Typografie für die Kommunikation deutlich machen und deren Qualität fördern.
• AIGA – Typography
  This forum is for the passionate. It’s for those who are crazy in love with type, absolutely hate the problems fonts can cause, have an uncontrollable need to learn more about typography, or an irresistible desire to share typographic opinions and stories. This is not a place for the typographically indifferent.
• TextDrive Community Forum / sIFR
  sIFR Forum
• Forums | Typophile
  Plattform mit Forum, Wiki und News – Sprache: Englisch

Galleries

• abc typography – a virtual type museum
  The historical collection of the Virtual Museum of Typography
• flickr
  The Folk Typography Pool
• sIFR Beauty
  a gallery of sIFR examples
• Typography For Headlines – Showcase
  A selection of headlines that have interesting and creative typography. Get your dose of inspiration here!

Magazine & Portale

• Fontpage – History der Typografie
  Wie die Technik in der Geschichte die Schrift und Typografie beinflusste. Links zu kostenlosen Schriften, Schriftenhersteller, Beschreibungen von Bleisatz, Maschinensatz, Fotosatz, KAthodenstrahlbelichtung, Vektorfonts
• schriftgrad.de – Schrift und Typografie – Schriften, Schriftzeichen …
  Schrift & Typografie – Alphabete, Hieroglyphen, Runen, Fraktur und Schriftzeichen. Schriftklassifikation durch Typologie. Schriftkuenstler wie Gutenberg, Bodoni, Zapf – Schriftarten und Glossar
• Spatium
  Magazin für Typografie
• :typemotion :: Typographie |
  Typemotion ist eine ausbildungs- und unterrichtsbegleitende Site für gestaltungstechnische Assistenten mit Schwerpunkt Grafik- und Webdesign. Sie bietet Materialien zum Download, Workshops, thematische Beiträge und Literaturtipps rund um Gestaltung, Typographie, Webdesign und DTP.
• Typografie.info
  Portal für Typografie und Gestaltung
• TYPOlis
  rund um das Thema Typografie und Gestaltung.
• Baseline
  International typographics magazine
• The Terminal
  A JOURNAL OF TYPOGRAPHIE & LETTERING ARTS
• Typofile Magazine
  graphic design, typography, typefaces, fonts, web design, fiction, humor
• Typographica
  Typographica is a journal of typography featuring news, observations, and open commentary on fonts and typographic design.

sIFR

• 2005 noch nicht reif für sIFR?
  Groß war die Begeisterung über sIFR (sprich »Siffer«), als diese automatische HTML-Text-zu-Flash-Filmchen-Technik im Herbst letzten Jahres in der Version 2 debutierte. Vor allem ich war begeistert, öffnete sich doch hier eine ganz neue Welt der typografischen Gestaltung auf Websites. Folgerichtig wurde das Jahr 2005 schnell zum Year of sIFR ausgerufen…
• Eigene Typo im Web dank sIFR
  Timo Höner erklärt gut und ausführlich sIFR samt Vor- und Nachteilen, wie man sIFR in WordPress verwendet, klärt Fragen des Copyrights und gibt auch einige Linktipps.
• SIFR: Neue Schriftenvielfalt
  Das kleine FlashTool SIFR löst ein großes Problem der WebDesigner …. und schafft neue…
• sIFR – Revolution der Webtypografie?
  Wer schon immer wissen wollte was sIFR überhaupt ist, findet hier ein wie immer gut verständliches Essay von Gerrit van Aaken
• How and when to use sIFR
  sIFR has arrived: but is it here to stay? Andrew Hume looks at the finer points of the latest Flash replacement technique, and how to best implement it today.
• Introducing sIFR: The Healthy Alternative to Browser Text
  With CSS we can size, style, color, kern, show, and hide our text but we can’t deliver something classical typesetters have delivered since at least the 15th century: custom typography. Until now. In concert with Shaun Inman and Tomas Jogin, I am releasing into the public domain a scalable, multiline, Flash 6 compatible version of IFR to help you reduce the amount of browser text in your life and free the world from the scourge of Arial.
• Introduction to Scalable Inman Flash Replacement (sIFR)
  This presentation will introduce you to a technique, called Scalable Inman Flash Replacement (sIFR), which will allow you to use that hot new font on the pages you create, without being forced to use images, all in a easy to use, unobtrusive, backwards compatible, search-engine friendly manner by using a nifty combination of Flash and JavaScript.
• sIFR Flash Fonts Library
  289 free fonts
• sIFR Font Embedder
  Simple font embedder for sIFR SWF files
• sIFRFonts.com
  On this site you will find freely available sIFR fonts and links to other sIFR resources
• sIFR 2.0: Rich Accessible Typography for the Masses
  Over the last several months, a small group of web developers and designers have been hard at work perfecting a method to insert rich typography into web pages without sacrificing accessibility, search engine friendliness, or markup semantics…
• Two-color sIFR
  Today’s topic is how to implement two color sIFR, in a way that we did on our recent project….
• Wiki.Novemberborn – sIFR Documentation & FAQ
  sIFR lets you use your favorite font on your websites by cleverly working with Flash, JavaScript and CSS. Here you’ll find it’s documentation and the FAQ.

Identify a font

• Linotype Font Finder – FontIdentifier
  Answer a few simple questions and the artificial intelligence of the FontIdentifier will help you find your font
• TypeNavigator
  TypeNavigator: the world’s first interactive visual font search system. “Visual” means you needn’t know anything about what you’re looking for — all you need is that image in your head. This system is unique in that you can identify fonts by memory alone.
• Identifont – identify fonts and typefaces
  Identify a font with the Identifont online typeface identifier. Answer a few questions about the letters in your sample and see a list of typefaces that match!

Schriftverwaltung – Font Management

• AMP Font Viewer 3.70
  This program is an easy to use but powerful font manager, which allows getting a quick overview of both installed and non installed fonts. It can install and uninstall fonts, and organize them in categories.(Freeware)
• Typograf
  Typograf – Schriftenverwaltung, OpenType, TrueType, Type 1 und Drucker Schriften vorschauen, ansehen, installieren, ausdrucken, verwalten unter Windows 9x,ME,NT,2000,XP
• Linotype FontExplorer X
  Font Management – Simple, Smart, Free, FontExplorer X sets a new standard for font management software. Linotype is pleased to announce the missing link to your font collection. With the new FontExplorer™ X, font management, font sorting, font shopping and font discovery are simple and fun! Auch in Deutsch verfügbar

Tools

• ASCII Artist
  This little program converts your picture to ASCII text art
• ASCII Generator
  Generate a ASCII graphic from a word or text. Over 130 fonts.
• ASCII-O-Matic
  is a web application that can convert an image into ASCII Art dynamically
• Character Cleaner v2
  Character Cleaner is a little web-based utility which converts pasted-in text to clean markup, optionally encoding certain characters and creating line breaks and paragraphs automatically. It’s entirely contained in the one file, so you can easily save it for offline use.
• STC :: fontBROWSER
  FontBrowser is a FREE online flash application that allows you to preview the fonts active on your system
• FontEditor BitfontMaker
  Wer etwas Zeit mitbringt, kann sich mit dem Online-Tool BitFontMaker seinen eigenen Pixelfont designen. Auf einer Matrix werden pro Buchstabe und Zeichen die Pixel gesetzt, bis das Alphabet komplett ist. Anschließend bekommt der Font seinen Namen.
• Fontifier
  Fontifier lets you use your own handwriting for the text you write on your computer. It turns a scanned sample of your handwriting into a handwriting font that you can use in your word processor or graphics program, just like regular fonts such as Helvetica.
• malevole – Text Generator
  This text generator has been developed based on years of careful research and is guaranteed to improve even the most lacklustre of designs.
• Lorem Ipsum
  All the facts – Lipsum generator
• Typetester
• The Typetester is an online application for comparison of the fonts for the screen.

Tutorials, Workshops & Guides

• typo.goemo.de
  Alles rund um das Thema Typographie
• TippTipps
  Regeln für die Textverarbeitung von der Fachhochschule Bielefeld
• Typeworkshop.com – Typographie Grundkurs
  Manuel Bieh hat sich die Arbeit gemacht und den „Type-workshop“ der Underware-Studios übersetzt.
• Typografie
  screenario beweist durch sein Layout und mit eigenem Tutorial, dass gute Typografie auch im Web funktioniert.
• Der Typographie – Guide
  Typographie einfach erklärt: Grundlagen, Typographie Geschichte, Schriftzeichen, Schriftklassifikation, Typo – Grundlagen, Typograph. Maßsysteme und Werksatz
• Typograph
  Lehrgang zu Typographie/Layout/Schrift
• Typolexikon.de : Das Lexikon der westeuropäischen Typographie
  Grundlagen, Biographien, Geschichte und Forschung zur westeuropäischen Typographie [ Typografie ] von Wolfgang Beiner
• typokurz
  Einige wichtige typografische Regeln von Christoph Bier (PDF zum Download)
• Typolex / Die Schriftklassifikation und ihre Geschichte – von Denis Potschien
  Typolex befasst sich mit der Schriftenklassifikation nach der DIN 16518. Anhand von Beispielen werden die Merkmale der einzelnen Schriften und der historische Hintergrund erläutert. Dazu gibt es eine Kurzübersicht zur Entstehung unseren heutigen Antiqua-Schriften (Flash)
• Foundations of Design and Typography
  A course in basic graphic design principles and typography
• Typography for the Web
  Web typography and its significance for design
• Typography & Page Layout
  Learn Typography and Page Layout – Font and Design – free Tutorial
• Web Typography Tutorial
  Typographie Tutorial in 2 Lessons by Nadav Savio

Weblogs

• Fontblog
  Täglich News und Meinungen aus der Grafikszene
• Grafikfritze
  Schriftgestaltung & Illustration & schöne kostenlose Schriften zum Download
• Slanted TypoBlog
  Magazin für typographische Kultur
• spiekerblog | scroll down all the way!
  Blog von Erik Spiekermann,typografischer Gestalter und Schriftentwerfer, Autor mehrerer Fachbücher über Schrift und Typografie sowie zahlreicher Artikel und Essays zum Thema.
• TYPE AND THE CITY
  Davors typografisches Tagebuch

Weitere Beiträge:

• 5 Ideen wie Sie wiederkehrende Arbeitsschritte & Marketingprozesse gewinnbringend im Internet automatisieren! Ein Gastbeitrag von Robert Nabenhauer.
• Wachstum durch Facebook-Gewinnspiele: Wie Sie über Facebook virale Gewinnspiele & eine schnell wachsende Fangemeinde aufbauen
• Wie Sie aufmerksamkeitsstarke Prelaunch-, Launch- und Relaunch-Szenarien aufbauen und dabei Viralität, Spannung & Kaufkraft erzeugen
• Wie Sie waschechte Iphone-Apps mit PhoneGAP entwickeln, um am lukrativen App-Markt mitzumischen
• Wie Sie Ihr Shop-Sortiment so präsentieren, dass der Kunde in Zukunft mehr findet und eher kauft! Ein Gastbeitrag von Nicolas Schmidt-Voigt.
• 11 faszinierende BuddyPress-Plugins, um kostenlos aus WordPress ein soziales Netzwerk zu zaubern
• Die Vorboten einer neuen Internet-Industrie! Ein exklusiver Rückblick & Blick hinter die Kulissen der Clickbank-Exchange 2011 in New York.