CODEWITHSUNDEEP
htmlutf-8google-font-api
zvaenr
zvaenr

Reputation: 59

HTML UTF-8 encoding doesn't work on google fonts

I've tried to implement a google font while using UTF-8 enconding, but every non-standart letters like german Ä, Ö or Ü are displayed as � Questionmark.

What am I doing wrong?

<html>
	<head>
		<meta http-equiv="content-type" content="text/html; charset=utf-8">
		<style>
			@import url(http://fonts.googleapis.com/css?family=Ubuntu);  		
		</style>
	</head>
	<body>
		<span style="font-family: Ubuntu;">
		Umlaute: AE = Ä, OE = Ö, UE = Ü
		</span>
	</body>
</html>

Upvotes: 0

Views: 2410

Answers (1)

Adrian Ghinea
Adrian Ghinea

Reputation: 355

Looking at your code, there is nothing wrong in it. The utf-8 encoding can render any Unicode character, even the Umlaut german characters. Taking a look at your code and running it in my browser locally, firstly it didn't render me that chars. The problem is not when you declare the meta charset="utf-8", but when you save the file. If you are using a text editor as Atom, you will not have problems cause the editor is set by default to encode the files in UTF-8. But if you write that code into notepad (of windows) and you save it, it will not render cause notepad is set by default to encode in ANSI. Also if you run your code into JSFiddle you'll se the letters rendered cause jsfiddle is already set to utf-8 encoding.

Just make sure you set the encoding of your files when you are saving it as UTF-8, and the issue is solved.

Upvotes: 1

Related Questions