Utilizing Web Fonts on a Secure Server

Share on Facebook0Tweet about this on Twitter5Share on Google+0Share on LinkedIn4Pin on Pinterest0Share on Reddit0

As web designers and developers, we create sites for all sorts of purposes. Internal communication, external marketing efforts, and even the front-end design of internet applications.

Some projects need to support a secure connection (SSL) between the host and client. This can be problematic for some web font solutions.

To make it easy, WebINK provides both SSL and standard import codes for web fonts.

To implement web fonts on a secure server:

  1. Create a free WebINK account.
  2. Create a new project.
  3. Add fonts to your project.
  4. From the Type Drawer page, click on your project name.
  5. Click the Get CSS link.
  6. From this page, WebINK provides both the @import and <link> style of implementation code in both SSL and non-SSL variants. Copy the SSL code that best matches your usage.

    If you can access the <head> of your site, insert the <link> code into the header of your site. If you only have access to the CSS, insert the @import code at the top of your site’s CSS.
  7. Add the WebINK font family names from the pasted CSS code into your font stacks for text elements on your site. It is very easy to spot the WebINK font name in the code. It comes right after the “family=” part in the CSS.
  8. If you have added multiple fonts to your project, they will all be listed in the line of code. Pull them all out and plunk them into the appropriate font stacks and you’re good to go!

No related content found.

Leave a Reply