background preloader

Using @Font-face and Unicode for icons

Facebook Twitter

Quick Tip: Ever Thought About Using @Font-face for Icons? The evolution of Internet technologies never ceases to amaze.

Quick Tip: Ever Thought About Using @Font-face for Icons?

Seemingly daily, new concepts and techniques are being thought up by creative and talented people. With modern browsers being adopted at a greater rate, systems like CSS3 are becoming more and more viable for use on projects of all sizes. Clearly, this can be seen by looking at new services sprouting on-line like TypeKit. Conceptually, if we deconstruct a font down to it's basic elements, we can make use of this technology for things other than type, icons. The Need for Speed For a short period of time, developers began producing websites with little regard for bandwidth consumption.

With smart phones accessing the Internet more frequently, bandwidth and page load speeds have suddenly returned to the forefront. “A single-user client SHOULD NOT maintain more than 2 connections with any server or proxy. One technique that has become increasingly popular is the use of CSS sprites. Deconstructing the Font Icon Pack Usage. Web Fonts, Dingbats, Icons, and Unicode. Yesterday, Cameron Koczon shared a link to the dingbat font, Pictos, by the talented, Drew Wilson.

Web Fonts, Dingbats, Icons, and Unicode

Cameron predicted that dingbats will soon be everywhere. Symboles divers - Table des caractères Unicode/U2600. Signes techniques divers - Table des caractères Unicode/U2300. Un article de Wikipédia, l'encyclopédie libre.

Signes techniques divers - Table des caractères Unicode/U2300

Cette page contient des caractères spéciaux. Si certains caractères de cet article s’affichent mal (carrés vides, points d’interrogation, etc.), consultez la page d’aide Unicode. Caractères U+2300 à U+23FF. Signes techniques divers[modifier | modifier le code] Table des caractères[modifier | modifier le code] Compléments Unicode 5.0[modifier | modifier le code] Voir aussi[modifier | modifier le code] Articles connexes[modifier | modifier le code] Filets - Table des caractères Unicode/U2500. Un article de Wikipédia, l'encyclopédie libre.

Filets - Table des caractères Unicode/U2500

Cette page contient des caractères spéciaux. Si certains caractères de cet article s’affichent mal (carrés vides, points d’interrogation, etc.), consultez la page d’aide Unicode. Casseau - Table des caractères Unicode/U2700. Formes géométriques - Table des caractères Unicode/U25A0. Un article de Wikipédia, l'encyclopédie libre.

Formes géométriques - Table des caractères Unicode/U25A0

Pavés - Table des caractères Unicode/U2580. Flèches - Table des caractères Unicode/U2190. Symboles et flèches divers - Table des caractères Unicode/U2B00. Supplément de flèches - B - Table des caractères Unicode/U2900. Un article de Wikipédia, l'encyclopédie libre.

Supplément de flèches - B - Table des caractères Unicode/U2900

Cette page contient des caractères spéciaux. Si certains caractères de cet article s’affichent mal (carrés vides, points d’interrogation, etc.), consultez la page d’aide Unicode. Supplément de flèches - A - Table des caractères Unicode/U27F0. Un article de Wikipédia, l'encyclopédie libre.

Supplément de flèches - A - Table des caractères Unicode/U27F0

Cette page contient des caractères spéciaux. Si certains caractères de cet article s’affichent mal (carrés vides, points d’interrogation, etc.), consultez la page d’aide Unicode. Caractères U+27F0 à U+27FF. Supplément de flèches - A[modifier | modifier le code] Quadruples flèches (haut et bas), flèches tournant sur un cercle (en sens anti-horaire ou horaire), traversant un signe plus cerclé, flèches longues (gauche, droite, ou bidirectionnel, simples ou doubles), longues flèches avec taquet (gauche ou droite, simple ou double), longue flèche oscillante.

Formes numérales - Table des caractères Unicode/U2150. Alphanumériques entourés - Table des caractères Unicode/U2460. Ponctuation générale - Table des caractères Unicode/U2000. Un article de Wikipédia, l'encyclopédie libre.

Ponctuation générale - Table des caractères Unicode/U2000

Cette page contient des caractères spéciaux. Si certains caractères de cet article s’affichent mal (carrés vides, points d’interrogation, etc.), consultez la page d’aide Unicode. Caractères U+2000 à U+206F. Ponctuation générale[modifier | modifier le code] Les caractères U+2000 à U+200A et U+205F sont des espaces de chasse fixe et tous sécables ; le caractère U+200B est une espace normalement invisible car sans chasse, mais il reste justifiable (donc parfois visible) et sécable. Le caractère U+202F est une espace de chasse fixe (et fine), similaire au caractère U+2009 mais insécable ; il correspond à l’espace fine insécable utilisée en typographie française traditionnelle autour de certaines ponctuations, et est normalement préférable à l’espace insécable U+00A0 qui est similaire, mais est souvent trop large.

Le caractère U+2011 est un trait d’union d’aspect normalement semblable au caractère U+2010 mais insécable.