Fontdeck web fonts: Real fonts for your website Règles typographiques (résumé) Résumé de règles typographiques Les "règles typographiques" indiquées ici pour l'impression papier sont conformes à celles définies par l'Imprimerie nationale et détaillées dans : Lexique des règles typographiques en usage à l'Imprimerie nationale. 3e édition. Paris : Imprimerie nationale, 2002. Rappelons que ce n'est pas la norme obligatoire, mais simplement une norme parmi d'autres. Règles, codes, guides Index des points traités Pour plus de précisions sur chacun des points abordés, cliquer sur les liens indiqués. – virgule, point, points de suspension, parenthèse fermante), crochet droit fermant] : pas d'espace avant, espace après – (parenthèse ouvrante, [crochet droit ouvrant : espace avant, pas d'espace après – deux points, point-virgule, point d'interrogation, point d'exclamation : espace insécable avant – apostrophe : pas d'espace avant ni après – titres : pas de point à la fin N.B. Ponctuation Espaces Pour les guillemets, voici les usages pour l'allemand, l'anglais et le français :
Top 13 Webfonts for Headline Use Today, webfonts abound. You can find them in a number of places: Google Font Directory, Typekit, Fontspring.com, and myriad other sites and font delivery services. A number are even free. And yet, like most things, much of what is free is not useful, and much of what is useful is not free. This article, then, focuses on the top 13 most useful free webfonts for headline use. One of the most common suggestions for combining headlines and body text is to set the headlines in a serif typeface and body copy in a sans-serif typeface, or vice versa. Because you’re typically only setting fewer than 100 characters in a headline, it doesn’t necessarily have the same requirements for readability as your text font. Nice Web Type has an excellent tutorial on @font-face embedding here. Available through Fontsquirrel, and designed by Typodermic, this pseudo-grotesque offers a generous x-height. License: License:
BP Eminet, Développement et formation Drupal, formation SPIP, plate-forme collaborative Claroline, Drupal, ergonomie, accessibilité, multilinguisme Cet article est paru sur le site www.marketing-internet.com. Il a été complété par la suite. La réflexion concernant l’utilisation d’une typographie adaptée est une partie trop souvent oubliée dans une bonne démarche « ergonomique ». Cinq siècles de typographie et de texte imprimé ont modelé notre approche de la lecture. Trop souvent une direction de communication en entreprise pense qu’un écran web n’est que la translation de l’information papier (impression). Après tout que représentent 30 ans d’informatique éditoriale en comparaison avec 500 ans de tradition d’imprimerie ? L’objectif de cet article est de soumettre quelques bons principes pour savoir ce qui fonctionne ou pas, et surtout être capable de l’expliquer au client ou au donneur d’ordre. Des études de comportement ont montré que les techniques de lecture, de recherche et de navigation d’un internaute ne sont pas les mêmes sur un écran que sur le papier. Mais n’anticipons pas - qu’est ce que la typographie ? Gothiques Fantaisies
A Closer Look At Font Rendering Advertisement The Web font revolution that started around two years ago has brought up a topic that many of us had merrily ignored for many years: font rendering. The newfound freedom Web fonts are giving us brings along new challenges. Choosing and using a font is not merely a stylistic issue, and it’s worth having a look at how the technology comes into play. While we cannot change which browser and OS our website visitors use, understanding why fonts look the way they do helps us make websites that are successful and comfortable to read in every scenario. Until recently, there were only a small handful of “Web safe” fonts we could use. Now that we have a great choice of fonts that can be used on websites, it becomes clear that the translation of a design into pixels is not something that happens naturally or consistently. Rendering Strategies Ideal shape, black-and-white and grayscale rendering Rasterization In digital type, characters are designed as abstract drawings. Windows Mac OS X
Interactive Guide to Blog Typography The majority of websites are composed of a bright, usually white background and dark text. Then there's the small minority of the web: dark websites, colorful websites. Why is the bright background used by the majority of websites? Utilitarian Motivation The common use for small caps is for abbreviations longer than 2 letters, such as CSS , HTML and WYSIWYG excluding AM , PM , BC and similar. Research shows that consumers with a utilitarian motivation find a low-arousal environment more pleasurable than a high arousal one. Hedonistic Motivation Hedonism is defined as the pursue of pleasure, especially the pleasure of our senses. Example outside the web: nightclubs.
Bonnes pratiques pour les déclarations @font-face Petit rappel historique À l’origine, les déclarations CSS @font-face faisaient partie de la norme CSS 2.0 et étaient supportées aussi bien par Internet Explorer 6 que par Netscape 4. Nous étions alors à la fin des années 90 et la guerre entre ces deux navigateurs faisait rage. Malheureusement, les constructeurs ainsi que les fondeurs ne parvinrent pas à se mettre d’accord à l’époque sur un format de fonte et le haut débit n’étant pas encore généralisé, cette technologie ne fut que peu ou pas utilisée. En conséquence, lors de l’écriture de la norme CSS 2.1, cette fonctionnalité fut purement et simplement supprimée. Avec CSS 3, c’est le grand retour en force des fontes web à travers le module CSS Fonts qui redéfinit la méthode d’insertion des fontes personnalisées dans les navigateurs. Déclaration simplifiée Une déclaration simple ressemble à ça : La propriété font-family permet de définir le nom de la fonte tel qu’il sera utilisé par la suite dans les déclarations de style. Les alternatives