Tengo algunos proyectos web que enlazan con varias fuentes de íconos (comoFuenteImpresionanteyGlifos). Son fuentes geniales, pero incluyen muchos glifos que nunca uso. ~65 KB es una descarga relativamente grande para algo de lo que solo usas el 4%.
Es posible crear subconjuntos de fuentes, es decir, incluir solo los caracteres que utiliza. Puedes hacer esto a travésFuente Ardilla(y probablemente otros) mientras convierte un .OTF en sus fuentes web (un paquete de EOT, WOFF2, WOFF, TTF y SVG para diferentes navegadores). Esto funciona muy bien.
Normalmente hago eso justo al final de un proyecto...Una vez... Pero si tu gama de personajes cambia, tendrás que volver a realizar todo el proceso. Y es completamente manual. Y tedioso.
Puedo generar una lista de caracteres que necesito, así que todo lo que necesito es algo que pueda subcomponer la fuente (y luego, para obtener puntos extra,genera el paquete de fuentes web). Sospecho que todo es posible a través de Fontforge (tiene API de secuencias de comandos), pero no tengo experiencia con eso.
Respuesta1
Esto es más grande de lo que pensé originalmente. Para hacer todo, necesitamos algunas herramientas adicionales y algunas no están bien empaquetadas para Ubuntu. Estoy realizando instalaciones personalizadas ~/src/, que probablemente necesitarás crear, en lugar de instalarlas en el sistema, aunque sólo sea porque es Good Enough™ para hacer el trabajo.
sudo apt-get install fontforge python-scour woff-tools build-essential
git clone http://github.com/behdad/fonttools ~/src/fonttools
ln -s ~/src/fonttools/Tools/pyftsubset ~/bin/subset # vanity symlink
git clone https://github.com/metaflop/ttf2eot.git ~/src/ttf2eot
cd ~/src/ttf2eot
make
cd -
git clone --recursive https://github.com/google/woff2.git ~/src/woff2
cd ~/src/woff2
make clean all
cd -
El siguiente paso es determinar qué caracteres Unicode necesitamos. Vamos a crear una lista de caracteres en formato hexadecimal 0x####. Identificarlos es solo un caso de seleccionar en mi .lessarchivo la función que uso para Font Awesome, pero podrías hacer algo similar buscando content: "..."grupos sin formato:
perl -n -e '/\.font-awesome..(\w+)/ && print "0xf$1\n"' less/*.less | tail -n+2 | sort -u
Ahora que tenemos la lista, podemos decirle a FontForge que cree un subconjunto FontAwesome.otf:
~/src/fonttools/Tools/pyftsubset fonts/FontAwesome.otf \
--unicodes-file=<(perl -n -e '/\.font-awesome..(\w+)/ && print "0xf$1\n"' less/sbnew-*.less\
| tail -n+2 | sort -u) --output-file=fonts/fa-subset.otf --no-recommended-glyphs --no-hinting
Esto crea una nueva .otffuente. Luego podemos reacondicionarlo en un conjunto de fuentes web:
# generate TTF and SVG
fontforge -lang=pe -script <(echo -e 'Open($1)\nGenerate($1:r + ".ttf")\nGenerate($1:r + "big.svg")') fonts/fa-subset.otf
# Clean up SVG
scour -i fonts/fa-subset.big.svg -o fonts/fa-subset.svg --enable-id-stripping --enable-comment-stripping --shorten-ids
# Create WOFF
sfnt2woff fonts/fa-subset.otf
# Create WOFF2 for most modern browsers
~/src/woff2/woff2_compress fonts/fa-subset.ttf
# Create EOT (eotfast might be better)
~/src/ttf2eot/ttf2eot fonts/fa-subset.ttf > fonts/fa-subset.eot
El resultado es un conjunto de fuentes mucho más pequeño. Aquí está la comparación lado a lado:
-rw-r--r-- 1 oli oli 62K Dec 11 2013 FontAwesome.otf
-rw-rw-r-- 1 oli oli 2.0K Aug 27 15:16 fa-subset.otf
-rwxr-xr-x 1 oli oli 38K Dec 11 2013 fontawesome-webfont.eot
-rw-rw-r-- 1 oli oli 3.1K Aug 27 15:31 fa-subset.eot
-rwxr-xr-x 1 oli oli 198K Dec 11 2013 fontawesome-webfont.svg
-rw-rw-r-- 1 oli oli 4.4K Aug 27 15:37 fa-subset.svg
-rwxr-xr-x 1 oli oli 79K Dec 11 2013 fontawesome-webfont.ttf
-rw-rw-r-- 1 oli oli 2.9K Aug 27 15:22 fa-subset.ttf
-rwxr-xr-x 1 oli oli 44K Dec 11 2013 fontawesome-webfont.woff
-rw-rw-r-- 1 oli oli 1.9K Aug 27 15:25 fa-subset.woff
-rw-rw-r-- 1 oli oli 1.4K Aug 27 16:01 fa-subset.woff2