Can’t make the #ChromeDevSummit this year? Catch all the content (and more!) on the livestream, or join your peers for a CDS Extended event at a hosted location nearby. To learn more, check out the Chrome Dev Summit 2019 website.

Manifest's short_name Won't Be Truncated When Displayed on Homescreen

Overview

When a user adds your web app to the homescreen, the short_name property is displayed as the label next to your app's icon. If the short_name is longer than 12 characters, it'll be truncated on the homescreen.

Note that, if the short_name is not present, Chrome can fall back to the name property if it's short enough.

Recommendations

Make the short_name property in your Web App Manifest less than 12 characters.

{
  ...
  "short_name": "Air Horner",
  ...
}

Or, if you don't specify a short_name property in your manifest, make the name property less than 12 characters.

Check out Manifest Exists for a list of guides that teach you how to properly implement and test "Add to Homescreen" support in your app.

More information

Lighthouse fetches the manifest and verifies that the short_name property is less than 12 characters. Note that since the name property can be used as a fallback for short_name, Lighthouse also tests this property as a fallback. So, if you don't include a short_name in your manifest, but your name is less than 12 characters, then the audit passes. The manifest that Lighthouse fetches is separate from the one that Chrome is using on the page, which can possibly cause inaccurate results.

Feedback

Was this page helpful?
Yes
What was the best thing about this page?
It helped me complete my goal(s)
Thank you for the feedback. If you have specific ideas on how to improve this page, please create an issue.
It had the information I needed
Thank you for the feedback. If you have specific ideas on how to improve this page, please create an issue.
It had accurate information
Thank you for the feedback. If you have specific ideas on how to improve this page, please create an issue.
It was easy to read
Thank you for the feedback. If you have specific ideas on how to improve this page, please create an issue.
Something else
Thank you for the feedback. If you have specific ideas on how to improve this page, please create an issue.
No
What was the worst thing about this page?
It didn't help me complete my goal(s)
Thank you for the feedback. If you have specific ideas on how to improve this page, please create an issue.
It was missing information I needed
Thank you for the feedback. If you have specific ideas on how to improve this page, please create an issue.
It had inaccurate information
Thank you for the feedback. If you have specific ideas on how to improve this page, please create an issue.
It was hard to read
Thank you for the feedback. If you have specific ideas on how to improve this page, please create an issue.
Something else
Thank you for the feedback. If you have specific ideas on how to improve this page, please create an issue.