typekit optimization

[gvmm]

I'm trying to get my head around web font control in Muse and have a couple of questions.

1) Is there a way of efficiently collecting font data in a Muse-designed page? Specifically, I want to optimize Typekit so I load only the weights and styles actually employed. I'd like to think there is a more efficient way than manually poking around to see which paragraph styles are used on the page and manually tallying their attributes. ??

2) How automated is Muse's handling of Typekit calls? I opened the HTML header of a page I designed to look into this and found the following:

  <script src="https://use.typekit.net/ik/ThFLWa0NKj4DoqrOtfVvg2c3HoyHrKd0HpAEZwvKsaSfeC9ffHWEmsJGwQb352JowuvojDwhw..." type="text/javascript"></script>

  <!-- Other scripts -->

  <script type="text/javascript">

   try {Typekit.load();} catch(e) {}

</script>

Umh...not the most user-friendly code I've ever seen. Do I still have to cut and paste the font-family CSS ( e.g., h1 {font-family: "myriad-pro";} )or does the gobleygook above do what needs to be done?

TIA

Richard Hurley

[benw52584159]

Hi Richard, That code does look a little unwieldy but in Muse, that's all you need in your HTML/CSS to get the fonts from Typekit to work. That code snippet adds the fonts, HTML, and CSS you need. Also, it should only add the weights and styles of the fonts you've used on the site, not the entire font families. This happens automatically. I hope this helps clear things up.

Let me know if you have any further questions.

Cheers, Benjamin

[gvmm]

Thanks, Benjamin. Much appreciated.

I just popped open a Muse-generated page of CSS in DreamWeaver, and it was super-compressed. Well-nigh unreadable. Is there a setting in Muse to kick out commented CSS in a more readable layout? I'm trying to learn how Muse works, and it would help a lot to be able to read the code.

[benw52584159 · Accepted solution]

Hi Richard,

Sure thing. This video takes you through Muse and it's export features: https://www.youtube.com/watch?v=9g1hNuuOFbk

In this video, the code isn't compressed. It doesn't look like that's an option in Muse.

Now, Typekit serves a few assets to a site:

- Font files

- CSS

- JavsScript

These are compressed but you can't edit them anyway. They're generated automatically based on your font selections in the site. I hop that helps. Let me know if you have any further questions.

Cheers,

Benjamin

[gvmm]

Thanks, Ben. The video cleared something up nicely.

I had randomly popped open one of my Muse-generated site's HTML files in DreamWeaver and it looked like unreadable gibberish. I should have done some more sampling. The video showed perfectly readable, commented code, so I went back into my site and opened another HTML file. Voilà. Readable stuff.

This is good. I'll be able to see what Muse is doing and answer some of my own questions.