UTF-8 Characters Appear Garbled in Prod


#1

Hi,

I’m using hugo server locally and AWS Amplify in prod. I’ve noticed that UTF-8 characters in .md files render fine on my dev box, but when I push to prod the UTF-8 characters turn into things like “. Does anyone have any hints on how to debug this? I verified GitHub renders the characters correctly (Amplify gets the data from GitHub).

Is there any setting the changes the encoding Hugo reads the .md files with?

Thanks in advance for any help,
-Andrew


#2

Solved it. Never forget <meta charset="UTF-8"/> in your <head>. I’m somewhat surprised that my browser treated files served from localhost as UTF-8, but those on the web as ASCII.


#3

Your browser did the right thing.

He treated the files the way he received his orders from the server. Your local webserver probably is set up to serve as UTF-8 and your live server isn’t. Happens a lot, because on your local system you set a system language, on a server it’s in most cases set to en_US.

On Apache servers I have a pre-prepared .htaccess file that defines UTF8 as default character encoding in case you forgot the meta tag anywhere.

On Netlify you can add a _headers file in your static folder with info. Depending on what happens with your content off-site you could then leave the meta tag out.

If your site get’s scrapped by any service you should keep it in, because some services (yahoo pipes did back in the day) ignore the headers.


#4

Thanks for the explanation!