recentpopularlog in

piperh : webfont   67

Make your Google Fonts render faster · PerfPerfPerf
a script for immediate display - in fallback font - when you use google fonts, instead of foit
webdesign  web  design  font  google  webfont  foit  display  fallback  performance 
april 2019 by piperh
Making Google Fonts Faster⚡ – Clio + Calliope – Medium
explains some steps worth considering for loading google fonts faster and/or with more control
webdesign  web  design  font  webfont  google  speed  load  loading  time  self-host  cdn  performance  webdev 
march 2019 by piperh
National Park Typeface
a webfont that imitates effect of using router on wood - ie, rounded ends. Free to download
webdesign  web  design  font  rounded  router  national  park  webfont  type  typography  graphic 
february 2019 by piperh
Should I Use JavaScript to Load My Web Fonts? | Filament Group, Inc., Boston, MA
dec 2018 article comparing current font loading with css-only and with js. Seems like css only is good but js can enhance it a bit.
webdesign  web  design  font  loading  js  javascript  script  css  foit  fout  webfont 
december 2018 by piperh
The Font Loading Checklist—zachleat.com
distilled view of loading strategies for web fonts, primarily for speed.
A 4-point checklist
webdesign  web  design  font  load  loading  speed  checklist  performance  webfont  foit  fout  @font-face 
september 2018 by piperh
Performance Calendar » 3 Tips for Faster Font Loading
article about self-hosting fonts and subsetting. Also it's poss to tell Google which characters you're using in the font link to dynamically subset the font!
webdesign  web  design  fonts  subset  formats  host  webfont 
january 2018 by piperh
Webfont support in email
blog post from Feb 2015, titled: Webfont support in email. Fairly detailed but probably not up to date, especially about gmail font support
webdesign  web  design  html  email  font  webfont  support 
september 2017 by piperh
Font style matcher
online tool to compare and adjust font widths - helps to minimise fout layout changes. Allows you to adjust size and spacing so that fonts occupy similar space and cause least layout change
webdesign  web  design  tool  font  webfont  @font-face  css  code  coding  compare  fout 
may 2017 by piperh
Combining fonts - JakeArchibald.com
shows how to combine webfonts - use only certain characters from one font inside another
webdesign  web  design  fonts  combine  combining  face  webfont  glyph  character  html  @font-face  code  coding 
may 2017 by piperh
Performance Calendar » Loading web fonts asynchronously
nerdy article showing how to provide system fonts fallback for webfonts. Avoids the Flash of Invisible Text on browsers that show nothing until webfont has loaded (Explorer and Edge automatically show a system font first)
webdesign  web  design  webfont  load  loading  asynchronous  foic  fouc  fallback  font  performance 
january 2017 by piperh
25 Essential Chrome Extensions for Web Designers - Envato
a '25 best' list of extensions for Chrome. Specially interesting maybe 'font ninja' which enables downloading of fonts
webdesign  web  design  development  chrome  google  browser  extensions  font  webfont  information  tools 
august 2016 by piperh
font-display for the Masses | CSS-Tricks
article about new css feature "font-display", conceived to deal with FOIC. But also has incidental handy explanation of js "Font Face Observer" and link to stuff about "Font Loading API"
webdesign  web  design  css  font  @font-face  font-display  code  coding  typography  webfont  performance  foic  fouc  load  loading  browser  face 
august 2016 by piperh
FOUT, FOIT, FOFT | CSS-Tricks
explanation and a few comments about fout, foit and foft, and font loading
webdesign  web  design  font  fout  foft  foit  performance  load  speed  @font-face  webfont  type  face  typeface 
july 2016 by piperh
A Comprehensive Guide to Font Loading Strategies—zachleat.com
thorough article describing different strategies for using web fonts, depending what you think the site situation is
webdesign  web  design  webfont  font  load  speed  performance  @font-face  typography  display  fout  foit 
july 2016 by piperh
Font Hacking | HeydonWorks
Modifying a font using a vector prog, and subsetting. If you use the technique be sure to look at comments, esp re kerning and hinting and default font fallback sizes on diff OSs
webdesign  web  design  webfont  type  typography  character  modify  hack  vector  svg  inkscape  subset  subsetting 
july 2016 by piperh
Typography Handbook
They say: "A concise, referential guide on best web typographic practices". Has diff subject heads with a paragraph or two for each. Lots of it is elementary but contains good resource links.
webdesign  web  design  typography  reference  resource  usage  webfont  @font-face  loading  fout 
june 2016 by piperh
google webfonts helper
online resource that makes a package and provides code you need to self-host google webfonts. Author also mentions that they're hosted on Heroku, so I'm not 100% clear what the arrangement is
webdesign  web  design  font  webfont  typeface  @fontface  google  hosting  self-host  host  typography 
may 2016 by piperh
FontCDN: A search tool for Google web fonts
quick showing of code to use google webfonts. Not sure what else this site os for
webdesign  web  design  font  webfont  typography  type  google  free  code  link 
november 2015 by piperh
IcoMoon App - Icon Font & SVG Generator
allows you to generate icon fonts with only your selected icons - ie, custom, small file, no unused guff. Also remember fontello.com
webdesign  web  design  font  webfont  icon  iconfont  typeface  generator  webdev  svg  typography  @font-face  vector 
september 2014 by piperh
Fontello - icon fonts generator
allows one to generate custom icon font. Great for making small file - no unused characters. Also remember icomoon.io which also allows you to upload your own svg's. Also similar is icomoon.io
webfont  font  web  design  webdesign  icon  iconfont  generator  webdev  svg  typography  typeface 
july 2014 by piperh

Copy this bookmark:





to read