FAQ: Upcoming changes to base font size and rem units in ArcGIS Hub sites

[SydneyBohn]

On October 12, 2021, ArcGIS Hub will release a manual update that increases font size of the base font text on all sites and pages from 14px (10pt) to 16px (12pt) and changes the root html font size from 10px (8pt) to 16px.

While most of you will notice only a subtle visual difference in font size, you can preview your sites ahead of publishing the update. If your sites are configured with custom HTML or CSS using ‘rem’ measurements, you may see a more pronounced difference in font size due to a change in the root html value and you should reconfigure your ‘rem’ sizes before proceeding with the update.

 

Frequently Asked Questions

Why is font size changing?

ArcGIS Hub recognizes the importance of making web content accessible to people with diverse abilities. While there isn’t an official WCAG standard for font size, 16px (12pt) font size is commonly used by most web browsers to improve the readability of web content.

Why is Hub changing font measurements?

rem stands for “root em” and is considered a relative size text format; it is calculated based on a value set on the root html element. The benefit of using relative text size measurements is that it improves the ability to scale a site or page layout proportionately based on the root value, which in this case will be 16px.

Where is base font text used?

Your base font is any text that has been added to a site or page layout using the preformatted paragraph font size included in the text card or through HTML/CSS in the text card editor. Headings and other preformatted font styles included in the text card will not be impacted.

 

How can you tell if a site uses rem values?

You can check your site’s HTML now by opening the any of the HTML/CSS editors (text card, header, footer) and looking for the presence of rem measurements. Starting September 21st, ArcGIS Hub will scan all sites with custom HTML or CSS in an attempt to detect usage of ‘rem.’ If the possibility of ‘rem’ is detected, a notification will appear in the site editor.

Note: Site templates that include a timeline component have already been updated to account for the change. You do not need to take any action on the timeline component.

How do you update a site?

The update will be released on Tuesday, October 12th, but will not be applied until you publish your site. On this day, you can open your site in edit mode to view a draft version of the update and look for visible changes. You can edit your site as needed. When you’re ready, you can publish the draft version to officially update your site to the new font size and font measurement.

How can you update your site’s rem values before the release?

Since Hub will not be releasing the rem update until October 12th, if your site uses rem, the only way to dismiss the notification ahead of time would be to convert to pixels. You may not wish to switch to pixels if your site already benefits from relative font sizing. We are not requiring you to change. We simply ask you to tolerate the rem notification alert for a bit while we try to communicate the change with our customers.

How can you update your site’s rem values the day of the release?

If you want to keep your rem measurements, you will need to wait to publish any changes in rem values until after we release the change to the rem root html on October 12th.

The easiest way to update your rem values to be calculated based on the new root html value is to establish the pixel size and then use a pixel-to-rem converter. To determine pixel font size, view your published site (not the draft) and with either browser dev tools or a plugin like Chrome’s WhatFont, identify the pixel font size for the text that looks incorrect in the draft version. Take the pixel value, open the converter, make sure base is set to 16, and generate your new rem value. Update your custom code with your new rem values, save the draft, and publish.

Will content shared on a layout or through a site’s search results be impacted?

This update primarily affects the base font text of sites and pages and not items embedded on a site or page layout. You may also notice the font size increase slightly in the search results, content views, and site editor.

Can I continue to use pixels in custom HTML/CSS?

Absolutely! If you are currently using pixels, the rem update will not replace your code and you do not need to make any changes. You can safely continue to use pixel-based font sizes in your work.