The retina logo in the Feast Plugin let’s you specify a retina-quality logo, without impacting pagespeed.
Simply upload an image twice the size of your current logo in Media > Library > Add New, and copy+paste the URL into the “Retina Logo” field in the Feast Plugin.
This is a feature of the Feast Plugin
This feature was released in version 2.1.1 of the Feast Plugin. See how to update the plugin in the Feast Plugin FAQ.
Q: What size does the image have to be?
Double the size of your original logo. We’ve been recommending people use smaller logos for a while now.
Sites should be designed for mobile-first, and most mobile screens have around a 360 px width. We recommend the original logo be 360px width maximum, and thin, so that as much above-the-fold content is displayed as possible.
Note: simply scaling up your existing image won’t make it higher quality. You’ll need to use the original file, and scale that down to double your current size.
eg. if the original image is 1000×500 and your current logo is 200×100, you’ll want to:
- create another copy of the 1000×400 image, and scale it down to 400×200 to act as the “retina logo”
- then upload the “retina logo” image to your site’s Media > Library
- then copy that image URL into the Feast Plugin’s Retina Logo field
Q: Does the retina image load on mobile?
Yes, it will load on mobile devices that support retina images.
Q: Why is my logo broken?
If the image URL you paste into the field isn’t valid, the browser will try to display an image that doesn’t exist. Double check your image URL.
Q: How do I remove the retina logo?
Empty the field so that it’s blank (no spaces) and save.
We updated the header logo to transition away from using background-image and SEO-unfriendly hidden text last year, in rethinking the header logo.
One comment that came up time and again was that people missed their retina-quality logo, which wasn’t able to be implemented without hard-coding the image width, which was a huge problem people had with the old format.
Not only that, retina-quality logos went against pagespeed tool recommendations by having an oversized image load.
We’ve spent time looking into ways to get retina-quality logos added in a way that doesn’t require editing code, and doesn’t impact pagespeed, and believe we’ve come up with a good solution.
This is new functionality, and like all new functionality, will live in the Feast Plugin going forward, so that we can update and fine-tune it over time as WordPress and Genesis continue to evolve.