diff --git a/lighthouse-core/gather/gatherers/seo/font-size.js b/lighthouse-core/gather/gatherers/seo/font-size.js
index 67b88be347e6..d84cdfa730fd 100644
--- a/lighthouse-core/gather/gatherers/seo/font-size.js
+++ b/lighthouse-core/gather/gatherers/seo/font-size.js
@@ -162,7 +162,7 @@ function findInheritedCSSRule(inheritedEntries = []) {
  * @param {LH.Crdp.CSS.GetMatchedStylesForNodeResponse} matched CSS rules
  * @returns {NodeFontData['cssRule']|undefined}
  */
-function getEffectiveFontRule({inlineStyle, matchedCSSRules, inherited}) {
+function getEffectiveFontRule({attributesStyle, inlineStyle, matchedCSSRules, inherited}) {
   // Inline styles have highest priority
   if (hasFontSizeDeclaration(inlineStyle)) return {type: 'Inline', ...inlineStyle};
 
@@ -170,6 +170,9 @@ function getEffectiveFontRule({inlineStyle, matchedCSSRules, inherited}) {
   const matchedRule = findMostSpecificMatchedCSSRule(matchedCSSRules);
   if (matchedRule) return matchedRule;
 
+  // Then comes attributes styles (<font size="1">)
+  if (hasFontSizeDeclaration(attributesStyle)) return {type: 'Attributes', ...attributesStyle};
+
   // Finally, find an inherited property if there is one
   const inheritedRule = findInheritedCSSRule(inherited);
   if (inheritedRule) return inheritedRule;
diff --git a/lighthouse-core/test/gather/gatherers/seo/font-size-test.js b/lighthouse-core/test/gather/gatherers/seo/font-size-test.js
index 4ba3520f3bc3..3b023ebc32c2 100644
--- a/lighthouse-core/test/gather/gatherers/seo/font-size-test.js
+++ b/lighthouse-core/test/gather/gatherers/seo/font-size-test.js
@@ -151,6 +151,7 @@ describe('Font size gatherer', () => {
 
     let inlineStyle;
     let matchedCSSRules;
+    let attributesStyle;
     let inherited;
 
     beforeEach(() => {
@@ -167,6 +168,7 @@ describe('Font size gatherer', () => {
 
       inlineStyle = createStyle({id: 1, properties: {'font-size': '1em'}});
       matchedCSSRules = [{matchingSelectors: [1], rule: fontRule}];
+      attributesStyle = {cssProperties: createProps({'font-size': '10px'})};
       inherited = [{matchedCSSRules: [{matchingSelectors: [0], rule: userAgentRule}]}];
     });
 
@@ -184,6 +186,19 @@ describe('Font size gatherer', () => {
       });
     });
 
+    it('should identify attributes styles', () => {
+      const result = FontSizeGather.getEffectiveFontRule({attributesStyle});
+      expect(result).toEqual({
+        cssProperties: [
+          {
+            name: 'font-size',
+            value: '10px',
+          },
+        ],
+        type: 'Attributes',
+      });
+    });
+
     it('should identify direct CSS rules', () => {
       const result = FontSizeGather.getEffectiveFontRule({matchedCSSRules});
       expect(result).toEqual({
@@ -232,12 +247,19 @@ describe('Font size gatherer', () => {
     });
 
     it('should respect precendence', () => {
-      let result = FontSizeGather.getEffectiveFontRule({inlineStyle, matchedCSSRules, inherited});
+      let result = FontSizeGather.getEffectiveFontRule(
+        {attributesStyle, inlineStyle, matchedCSSRules, inherited});
       expect(result).toMatchObject({type: 'Inline'});
-      result = FontSizeGather.getEffectiveFontRule({matchedCSSRules, inherited});
+
+      result = FontSizeGather.getEffectiveFontRule({attributesStyle, inherited});
+      expect(result).toMatchObject({type: 'Attributes'});
+
+      result = FontSizeGather.getEffectiveFontRule({attributesStyle, matchedCSSRules, inherited});
       expect(result.parentRule).toMatchObject({origin: 'regular'});
+
       result = FontSizeGather.getEffectiveFontRule({inherited});
       expect(result.parentRule).toMatchObject({origin: 'user-agent'});
+
       result = FontSizeGather.getEffectiveFontRule({});
       expect(result).toBe(undefined);
     });