MD4.4.1 Sets the Stage for a New Addon + Shaves Loading Time From Custom Web Fonts

After a weekend devoted to building the upcoming MD Footnotes addon and researching how to improve the performance of custom web fonts, I’m happy to bundle up that work and release Marketers Delight 4.4.1.

You may be noticing a trend with the last few MD updates—reducing and optimizing are becoming a priority as Marketers Delight has become much more feature-rich over the past year.

I’m always looking for any kinds of improvements I can make to the overall performance of a website running MD because I know the ideal client (you) cares about page performance. I’ll always say there’s more to be done, but I’m happy to trickle these improvements your way with these updates.

Reducing Page Weight with Custom Web Fonts

MD4.4.1 reduces one of the largest resources loaded in Marketers Delight, custom web fonts, and now loads less font files. In order to make the default design of MD a little more unique, I opted to include the Magra and Droid Sans custom web fonts.

Loading web fonts on the web is an art in itself as the web has gone from only being accessible over strong Wifi networks to globally loaded over weaker cellular data. The weaker the connection, the longer it will take to download the web page and its resources.

As it goes, web fonts can be pretty expensive resources and can cause some unflattering behavior as the page renders.

You’ll know what I’m talking about if you’ve ever gone to load a page only to find the fonts have vanished in a flash 1 1. Also known as FOIT (Flash of Invisible Text) which replaced the more desirable FOUT (Flash of Unstyled text) × and return seconds later. That flash it the browser processing the custom web font and it can ruin your train of thought.

This is a pretty frustrating experience and one I’ve found on MD time and time again. While I won’t go as far to say this update perfects font loading (I’m still experimenting with solutions), I can say that browsers will now have far less font files to download.

MD4.4.1 now loads a single .woff file (the file type with the most browser compatibility) per font. This reduction shaves off around 400KB of data loaded per page, which is small in the grand scheme of things, but adds up quickly.

I will be further experimenting with Font Preloaders and see if I can come up with a foolproof solution for loading these web fonts in a less obstructive way. If for some reason the MD webfonts don’t load, you can count on a system font like Helvetica being loaded in its place.

MD Footnotes: Simple citations in WordPress

Coming Later This Week: MD Footnotes

Alongside the custom web fonts improvements, various changes and improvements have been made to the MDAPI to get your site ready for the new MD Footnotes addon set to release this week.

This addon has been in the works for a while and this weekend I found a sudden rush of inspiration to finally finish it off. I couldn’t be happier with the results.

MD Footnotes is a simple MD addon that makes adding citations throughout your post quick and easy using a basic interface and a simple shortcode to paste into your post.

MD Footnotes admin panel

Once you’ve installed the plugin you’ll find a new meta box in your post editor called “Footnotes”. From there, simply click the “New Footnote” button to add your first footnote, then repeat for as many citations as you need to make throughout the article.

Each footnote is assigned a number and can be displayed in your post by simply pasting the [fn] shortcode where you want the citation marker to appear.

Depending on whether your page has a sidebar or not, the footnotes will appear either inline or hidden and shown on click of the citation. This smart layout detection is why MD Footnotes was built exclusively for Marketers Delight, and more types of controls will come as the addon gets better.

(Yes, since this is a premium MD addon you will be subscribed for auto updates with your very own license key 2 2. The license key, like with other addons, is valid for as long as your main Marketers Delight subscription is active. × ).

Your footnotes will look and work great on mobile as well (try them out on this page) and you can also generate a list of footnotes to show at the end of each post by clicking a simple option.

I’m confident MD Footnotes will be the best of the kind you’ve ever used for WordPress and I’m excited to release it to you later this week. I’ll have more information for you shortly as I tie up some loose ends!

Update to Marketers Delight 4.4.1 Now

MD4.4.1 is waiting for you in your WordPress admin panel if you have an active license key enabled on your site(s). Visit the Appearance and Plugins menu to update the following:

  • Marketers Delight Theme (now 400KB+ smaller!)
  • Marketers Delight Plugin
  • MD Popups

As always, you can directly download any of your MD products from your new account area or contact me if you’re having any trouble with your new MDNET account.

That’s all for this issue of MD, I hope you enjoy the new update! See you soon for the launch of MD Footnotes.

5 comments add yours

  1. Custom web fonts is great but on the other hand will increase the time for loading web.

    Big sites like Amazon and Facebook prefer to use standard fonts like arial and heltevica.

    I usually using font-family: Georgia

    • I agree with you there, and this was a struggle I had when initially developing MD4. I wanted to use standard system fonts to avoid the extra page weight, but I also had an urge to make things a little different with these custom fonts.

      Overall I think I made the right design choice, especially as more techniques become available for optimizing web fonts (MD4.4.1 being a step in that direction).

      Plus it’s easy to prevent the custom web fonts from loading if you wanted to–I think I’ll write a tutorial showing you how to disable these custom fonts.

      • From your experience, what the best to display custom web font for fast load?

        1. Upload font in our hosting.
        2. Used Google Font ( Standard, @import, or Javascript).

        • I’ll be writing a more extensive tutorial about this later this week (shooting for around Thursday-Friday), but the short answer is I prefer to host the fonts on my own server (if the font can legally be embedded there).

          My rule of thumb is to load as few external scripts as possible to my site since I don’t want to be dependent on other servers in addition to my own.

          I notice on so many websites that even Google Analytics scripts can cause lagging, so the idea of adding 3 or 4 more scripts like it just doesn’t sit right with me.

          Stay tuned, I learned some pretty valuable information in my research from last week that I’m very excited to share here.

          • you can load analytics from your side. I do that at semsacional.es, having a nice site speed.

            I did some improvements without breaking your code 🙂

            Currently Im not worried about having a 100 score, its a nonsense. But I really appreciate that you keep the theme clean and fast. Super!

Leave a Comment