What Text Size should I use?

All my website pages use this text……..Georgia ……..size 12.

Google Search Console has identified that your site is affected by 1 Mobile Usability issues:

'Text too small to read'


What text and size should I use?

Thank you.

 

What is the unit of size 12?
12px?

 

Use 15px or 0.93em and the font family should most likely be Arial,sans-serif.

 

I always think that font-family needs to be set (as Arial / sans-serif / something else), but not font-size.
Especially if it is in px, my suggestion is don't.
If set, then users with bad eye sight will not be able to zoom your text.

 

px doesn't prevent zooming as long as you have "user-scalable=yes" in the viewport. But I agree, em is the way to go.

 

Correct, but it also doesn't support default scaling -- which is separate from zoom. Why make the user have to dive for the zoom when you can just base off THEIR preference with EM or REM? It's a comic tragedy how often people confuse user preference scaling with zoom; they are NOT the same thing and EM is meant for the former, not the latter.

As I often say, they're called EM, use 'EM!

But yeah as to the OP's question, as others have said here, 12 WHAT? Pixels? Points? Widgets? Gizmo's? Quijada's?

Honestly though given they're using the serif font "Georgia" on a website, it makes me think they're also using some rubbish Microsoft Tool to build their pages. Serif fonts are bad for screen legibility at anything below 20px.

 

Sorry, I should have said 12pt is the size of my text on a WordPress website I have.

 

PT -- point -- is 1/72th of an inch. Since the browser has no actual information on what the PPI of a screen is, points are utter garbage for web development.

That said, assuming the defaults 12pt would be outputting roughly 16px, so I don't know why anything would be bitching about font-size apart from perhaps the use of a serif font.

I'd suggest switching from 12pt to 1rem. It's the same size for "normal" users at 16px, though users like myself who use a non-standard metric get anywhere from 20 to 32px. (that's the whole point of EM/REM).

Though being turdpress who knows what tugging on values might do. Once they sucker people in ignorance into garbage incompetent code like this:

<p><span style="font-family: arial, helvetica, sans-serif; font-size: 12pt;">

Code (markup):

To properly fix much of anything you have to scrap it and start over from scratch. Worse when you get into outright idiocy like this:

<header
		class="site-header header-main-layout-1 ast-primary-menu-enabled ast-logo-title-inline ast-hide-custom-menu-mobile ast-builder-menu-toggle-icon ast-mobile-header-inline" id="masthead" itemtype="https://schema.org/WPHeader" itemscope="itemscope" itemid="#masthead"		>
			<div id="ast-desktop-header" data-toggle-type="dropdown">
		<div class="ast-main-header-wrap main-header-bar-wrap ">
		<div class="ast-primary-header-bar ast-primary-header main-header-bar site-header-focus-item" data-section="section-primary-header-builder">
						<div class="site-primary-header-wrap ast-builder-grid-row-container site-header-focus-item ast-container" data-section="section-primary-header-builder">
				<div class="ast-builder-grid-row ast-builder-grid-row-has-sides ast-builder-grid-row-no-center">
											<div class="site-header-primary-section-left site-header-section ast-flex site-header-section-left">
									<div class="ast-builder-layout-element ast-flex site-header-focus-item" data-section="title_tagline">
											<div
				class="site-branding ast-site-identity" itemtype="https://schema.org/Organization" itemscope="itemscope"				>
					<span class="site-logo-img"><a href="https://www.railwayphotos.co.uk/" class="custom-logo-link" rel="home" aria-current="page"><img width="274" height="72"   alt="" data-srcset="https://www.railwayphotos.co.uk/wp-content/uploads/2021/04/cropped-logo-scaled-1-274x72.jpg 274w, https://www.railwayphotos.co.uk/wp-content/uploads/2021/04/cropped-logo-scaled-1-300x79.jpg 300w, https://www.railwayphotos.co.uk/wp-content/uploads/2021/04/cropped-logo-scaled-1-1024x271.jpg 1024w, https://www.railwayphotos.co.uk/wp-content/uploads/2021/04/cropped-logo-scaled-1-768x203.jpg 768w, https://www.railwayphotos.co.uk/wp-content/uploads/2021/04/cropped-logo-scaled-1-1536x406.jpg 1536w, https://www.railwayphotos.co.uk/wp-content/uploads/2021/04/cropped-logo-scaled-1-2048x542.jpg 2048w"  data-src="https://www.railwayphotos.co.uk/wp-content/uploads/2021/04/cropped-logo-scaled-1-274x72.jpg" data-sizes="(max-width: 274px) 100vw, 274px" class="custom-logo lazyload" src="data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" /><noscript><img width="274" height="72"   alt="" data-srcset="https://www.railwayphotos.co.uk/wp-content/uploads/2021/04/cropped-logo-scaled-1-274x72.jpg 274w, https://www.railwayphotos.co.uk/wp-content/uploads/2021/04/cropped-logo-scaled-1-300x79.jpg 300w, https://www.railwayphotos.co.uk/wp-content/uploads/2021/04/cropped-logo-scaled-1-1024x271.jpg 1024w, https://www.railwayphotos.co.uk/wp-content/uploads/2021/04/cropped-logo-scaled-1-768x203.jpg 768w, https://www.railwayphotos.co.uk/wp-content/uploads/2021/04/cropped-logo-scaled-1-1536x406.jpg 1536w, https://www.railwayphotos.co.uk/wp-content/uploads/2021/04/cropped-logo-scaled-1-2048x542.jpg 2048w"  data-src="https://www.railwayphotos.co.uk/wp-content/uploads/2021/04/cropped-logo-scaled-1-274x72.jpg" data-sizes="(max-width: 274px) 100vw, 274px" class="custom-logo lazyload" src="data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" /><noscript><img width="274" height="72" src="https://www.railwayphotos.co.uk/wp-content/uploads/2021/04/cropped-logo-scaled-1-274x72.jpg" class="custom-logo" alt="" srcset="https://www.railwayphotos.co.uk/wp-content/uploads/2021/04/cropped-logo-scaled-1-274x72.jpg 274w, https://www.railwayphotos.co.uk/wp-content/uploads/2021/04/cropped-logo-scaled-1-300x79.jpg 300w, https://www.railwayphotos.co.uk/wp-content/uploads/2021/04/cropped-logo-scaled-1-1024x271.jpg 1024w, https://www.railwayphotos.co.uk/wp-content/uploads/2021/04/cropped-logo-scaled-1-768x203.jpg 768w, https://www.railwayphotos.co.uk/wp-content/uploads/2021/04/cropped-logo-scaled-1-1536x406.jpg 1536w, https://www.railwayphotos.co.uk/wp-content/uploads/2021/04/cropped-logo-scaled-1-2048x542.jpg 2048w" sizes="(max-width: 274px) 100vw, 274px" /></noscript></noscript></a></span><div class="ast-site-title-wrap">
						<h1 class="site-title" itemprop="name">
				<a href="https://www.railwayphotos.co.uk/" rel="home" itemprop="url" >
					
				</a>
			</h1>
						
				</div>				</div>
			<!-- .site-branding -->
					</div>
								</div>
																									<div class="site-header-primary-section-right site-header-section ast-flex ast-grid-right-section">
										<div class="ast-builder-menu-1 ast-builder-menu ast-flex ast-builder-menu-1-focus-item ast-builder-layout-element site-header-focus-item" data-section="section-hb-menu-1">
			<div class="ast-main-header-bar-alignment"><div class="main-header-bar-navigation"><nav class="ast-flex-grow-1 navigation-accessibility site-header-focus-item" id="site-navigation" aria-label="Site Navigation" itemtype="https://schema.org/SiteNavigationElement" itemscope="itemscope"><div class="main-navigation ast-inline-flex"><ul id="ast-hf-menu-1" class="main-header-menu ast-nav-menu ast-flex  submenu-with-border stack-on-mobile"><li id="menu-item-35" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-home current-menu-item page_item page-item-6 current_page_item menu-item-35"><a href="https://www.railwayphotos.co.uk/" aria-current="page" class="menu-link">Home</a></li>
<li id="menu-item-34" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-has-children menu-item-34"><a href="https://www.railwayphotos.co.uk/about-me/" class="menu-link">About Me</a><button class="ast-menu-toggle" aria-expanded="false"><span class="screen-reader-text">Menu Toggle</span><span class="ast-icon icon-arrow"></span></button>
<ul class="sub-menu">
	<li id="menu-item-28" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-28"><a href="https://www.railwayphotos.co.uk/railway-links/" class="menu-link">Railway Links</a></li>
	<li id="menu-item-29" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-29"><a href="https://www.railwayphotos.co.uk/site-map/" class="menu-link">Site Map</a></li>
</ul>
</li>
<li id="menu-item-33" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-33"><a href="https://www.railwayphotos.co.uk/contact-me/" class="menu-link">Contact Me</a></li>
<li id="menu-item-38" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-38"><a href="https://www.railwayphotos.co.uk/gallery/" class="menu-link">Train Photos</a></li>
<li id="menu-item-3810" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-3810"><a href="https://www.railwayphotos.co.uk/railway-blog/" class="menu-link">Railway Blog</a></li>
</ul></div></nav></div></div>		</div>
									</div>
												</div>
					</div>
								</div>
			</div>
		<div class="ast-desktop-header-content content-align-flex-start ">
			</div>
</div> <!-- Main Header Bar Wrap -->
<div id="ast-mobile-header" class="ast-mobile-header-wrap " data-type="dropdown">
		<div class="ast-main-header-wrap main-header-bar-wrap" >
		<div class="ast-primary-header-bar ast-primary-header main-header-bar site-primary-header-wrap site-header-focus-item ast-builder-grid-row-layout-default ast-builder-grid-row-tablet-layout-default ast-builder-grid-row-mobile-layout-default" data-section="section-primary-header-builder">
									<div class="ast-builder-grid-row ast-builder-grid-row-has-sides ast-builder-grid-row-no-center">
													<div class="site-header-primary-section-left site-header-section ast-flex site-header-section-left">
										<div class="ast-builder-layout-element ast-flex site-header-focus-item" data-section="title_tagline">
											<div
				class="site-branding ast-site-identity" itemtype="https://schema.org/Organization" itemscope="itemscope"				>
					<span class="site-logo-img"><a href="https://www.railwayphotos.co.uk/" class="custom-logo-link" rel="home" aria-current="page"><img width="274" height="72"   alt="" data-srcset="https://www.railwayphotos.co.uk/wp-content/uploads/2021/04/cropped-logo-scaled-1-274x72.jpg 274w, https://www.railwayphotos.co.uk/wp-content/uploads/2021/04/cropped-logo-scaled-1-300x79.jpg 300w, https://www.railwayphotos.co.uk/wp-content/uploads/2021/04/cropped-logo-scaled-1-1024x271.jpg 1024w, https://www.railwayphotos.co.uk/wp-content/uploads/2021/04/cropped-logo-scaled-1-768x203.jpg 768w, https://www.railwayphotos.co.uk/wp-content/uploads/2021/04/cropped-logo-scaled-1-1536x406.jpg 1536w, https://www.railwayphotos.co.uk/wp-content/uploads/2021/04/cropped-logo-scaled-1-2048x542.jpg 2048w"  data-src="https://www.railwayphotos.co.uk/wp-content/uploads/2021/04/cropped-logo-scaled-1-274x72.jpg" data-sizes="(max-width: 274px) 100vw, 274px" class="custom-logo lazyload" src="data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" /><noscript><img width="274" height="72"   alt="" data-srcset="https://www.railwayphotos.co.uk/wp-content/uploads/2021/04/cropped-logo-scaled-1-274x72.jpg 274w, https://www.railwayphotos.co.uk/wp-content/uploads/2021/04/cropped-logo-scaled-1-300x79.jpg 300w, https://www.railwayphotos.co.uk/wp-content/uploads/2021/04/cropped-logo-scaled-1-1024x271.jpg 1024w, https://www.railwayphotos.co.uk/wp-content/uploads/2021/04/cropped-logo-scaled-1-768x203.jpg 768w, https://www.railwayphotos.co.uk/wp-content/uploads/2021/04/cropped-logo-scaled-1-1536x406.jpg 1536w, https://www.railwayphotos.co.uk/wp-content/uploads/2021/04/cropped-logo-scaled-1-2048x542.jpg 2048w"  data-src="https://www.railwayphotos.co.uk/wp-content/uploads/2021/04/cropped-logo-scaled-1-274x72.jpg" data-sizes="(max-width: 274px) 100vw, 274px" class="custom-logo lazyload" src="data:image/gif;base64,R0lGODlhAQABAAAAACH5BAEKAAEALAAAAAABAAEAAAICTAEAOw==" /><noscript><img width="274" height="72" src="https://www.railwayphotos.co.uk/wp-content/uploads/2021/04/cropped-logo-scaled-1-274x72.jpg" class="custom-logo" alt="" srcset="https://www.railwayphotos.co.uk/wp-content/uploads/2021/04/cropped-logo-scaled-1-274x72.jpg 274w, https://www.railwayphotos.co.uk/wp-content/uploads/2021/04/cropped-logo-scaled-1-300x79.jpg 300w, https://www.railwayphotos.co.uk/wp-content/uploads/2021/04/cropped-logo-scaled-1-1024x271.jpg 1024w, https://www.railwayphotos.co.uk/wp-content/uploads/2021/04/cropped-logo-scaled-1-768x203.jpg 768w, https://www.railwayphotos.co.uk/wp-content/uploads/2021/04/cropped-logo-scaled-1-1536x406.jpg 1536w, https://www.railwayphotos.co.uk/wp-content/uploads/2021/04/cropped-logo-scaled-1-2048x542.jpg 2048w" sizes="(max-width: 274px) 100vw, 274px" /></noscript></noscript></a></span><div class="ast-site-title-wrap">
						<h1 class="site-title" itemprop="name">
				<a href="https://www.railwayphotos.co.uk/" rel="home" itemprop="url" >
					
				</a>
			</h1>
						
				</div>				</div>
			<!-- .site-branding -->
					</div>
									</div>
																									<div class="site-header-primary-section-right site-header-section ast-flex ast-grid-right-section">
										<div class="ast-builder-layout-element ast-flex site-header-focus-item" data-section="section-header-mobile-trigger">
						<div class="ast-button-wrap">
				<button type="button" class="menu-toggle main-header-menu-toggle ast-mobile-menu-trigger-minimal"   aria-expanded="false">
					<span class="screen-reader-text">Main Menu</span>
					<span class="mobile-menu-toggle-icon">
						<span class="ahfb-svg-iconset ast-inline-flex svg-baseline"><svg role='img' class='ast-mobile-svg ast-menu-svg' fill='currentColor' version='1.1' xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'><path d='M3 13h18c0.552 0 1-0.448 1-1s-0.448-1-1-1h-18c-0.552 0-1 0.448-1 1s0.448 1 1 1zM3 7h18c0.552 0 1-0.448 1-1s-0.448-1-1-1h-18c-0.552 0-1 0.448-1 1s0.448 1 1 1zM3 19h18c0.552 0 1-0.448 1-1s-0.448-1-1-1h-18c-0.552 0-1 0.448-1 1s0.448 1 1 1z'></path></svg></span><span class="ahfb-svg-iconset ast-inline-flex svg-baseline"><svg class='ast-mobile-svg ast-close-svg' fill='currentColor' version='1.1' xmlns='http://www.w3.org/2000/svg' width='24' height='24' viewBox='0 0 24 24'><path d='M5.293 6.707l5.293 5.293-5.293 5.293c-0.391 0.391-0.391 1.024 0 1.414s1.024 0.391 1.414 0l5.293-5.293 5.293 5.293c0.391 0.391 1.024 0.391 1.414 0s0.391-1.024 0-1.414l-5.293-5.293 5.293-5.293c0.391-0.391 0.391-1.024 0-1.414s-1.024-0.391-1.414 0l-5.293 5.293-5.293-5.293c-0.391-0.391-1.024-0.391-1.414 0s-0.391 1.024 0 1.414z'></path></svg></span>					</span>
									</button>
			</div>
					</div>
									</div>
											</div>
						</div>
	</div>
		<div class="ast-mobile-header-content content-align-flex-start ">
				<div class="ast-builder-menu-mobile ast-builder-menu ast-builder-menu-mobile-focus-item ast-builder-layout-element site-header-focus-item" data-section="section-header-mobile-menu">
			<div class="ast-main-header-bar-alignment"><div class="main-header-bar-navigation"><nav class="site-navigation" id="site-navigation" itemtype="https://schema.org/SiteNavigationElement" itemscope="itemscope" class="ast-flex-grow-1 navigation-accessibility" aria-label="Site Navigation"><div id="ast-hf-mobile-menu" class="main-navigation"><ul class="main-header-menu ast-nav-menu ast-flex  submenu-with-border astra-menu-animation-fade  stack-on-mobile"><li class="page_item page-item-8 menu-item"><a href="https://www.railwayphotos.co.uk/about-me/" class="menu-link">About Me</a></li><li class="page_item page-item-10 menu-item"><a href="https://www.railwayphotos.co.uk/contact-me/" class="menu-link">Contact Me</a></li><li class="page_item page-item-3438 menu-item"><a href="https://www.railwayphotos.co.uk/cookie-policy/" class="menu-link">Cookie Policy</a></li><li class="page_item page-item-24 menu-item"><a href="https://www.railwayphotos.co.uk/dartmouth-steam-railway/" class="menu-link">Dartmouth Steam Railway</a></li><li class="page_item page-item-14 menu-item"><a href="https://www.railwayphotos.co.uk/diesel-train-photos/" class="menu-link">Diesel Train Photos</a></li><li class="page_item page-item-3805 menu-item"><a href="https://www.railwayphotos.co.uk/railway-blog/" class="menu-link">Railway Blog</a></li><li class="page_item page-item-20 menu-item"><a href="https://www.railwayphotos.co.uk/railway-links/" class="menu-link">Railway Links</a></li><li class="page_item page-item-6 current-menu-item menu-item current-menu-item"><a href="https://www.railwayphotos.co.uk/" class="menu-link">Railway Photography</a></li><li class="page_item page-item-18 menu-item"><a href="https://www.railwayphotos.co.uk/site-map/" class="menu-link">Site Map</a></li><li class="page_item page-item-22 menu-item"><a href="https://www.railwayphotos.co.uk/south-devon-railway/" class="menu-link">South Devon Railway</a></li><li class="page_item page-item-16 menu-item"><a href="https://www.railwayphotos.co.uk/steam-train-photos/" class="menu-link">Steam Train Photos</a></li><li class="page_item page-item-36 menu-item"><a href="https://www.railwayphotos.co.uk/gallery/" class="menu-link">Train Photos</a></li></ul></div></nav></div></div>		</div>
			</div>
</div>
		</header>

Code (markup):

Doing the job of:

<header>
	<h1><a href="/">Railway Photography</a></h1>
	<a href="#mainMenu" class="mainMenuOpen" hidden></a>
	<div id="mainMenu">
		<a href="#" class="mainMenuClose" hidden></a>
		<div><nav>
			<a href="#" class="mainMenuClose" hidden></a>
			<ul>
				<li><a href="/">Home</a></li>
				<li>
					<a href="/about-me/">About Me</a>
					<ul>
						<li><a href="/railway-links/">Railway Links</a></li>
						<li><a href="/site-map/">Site Map</a></li>
					</ul>
				</li>
				<li><a href="/contact-me/">Contact Me</a></li>
				<li><a href="/gallery/">Train Photos</a></li>
				<li><a href="/railway-blog/">Railway Blog</a></li>
			</ul>
		</nav></div>
	<!-- #mainMenu --></div>
</header>

Code (markup):

Quite literally 22 times the code needed to do the job. THAT is how inept the majority of turdpress templates are.

 

If the font size on your website seems to be too tiny, consider 14PX; however, according on my experience, you may need to experiment with more or less depending on the user interface.

 

I am using Georgia with 20px size