Fixit – Character encoding

The character encoding of a document specifies how the characters of the document should be interpreted. It is important to specify the correct character encoding for your document so that it will be rendered correctly by the browser. This test determines if you have used the correct character encoding.

Recommended character encoding

The recommended character encoding is UTF-8 for maximum compatibility. So, for your XHTML documents, the Content-Type header should look like this:

Content-Type: application/xhtml+xml; charset=UTF-8

This can be achieved in a number of different ways: modify the server directly to send the correct header; specify the character encoding in the XML declaration of your document; or specify in the meta element. You should use whichever approach is most appropriate to your specific circumstance. Note that the ready.mobi report will check each of the possible places, so they should not contradict each other.

Set up your server to send correct Character encoding

Using .htaccess to set the HTTP Content-Type header

If you are using Apache, you can use a .htaccess file to associate file extensions with character encodings types. Simply add this line to a file called .htaccess in the folder of the files you wish to send with the correct character encodings. This will cover all files in this folder and sub-folders. If there already exists a file named .htaccess, be careful not to change any instructions already in this file as would modify the behaviour of your server. In this case just add the line below to the file:

AddCharset UTF-8 .xhtml

XML declaration

To specify character encoding in the XML decalaration of your document include the line below at the top of your document.

<?xml encoding="UTF-8"?>

Meta http-equiv tags

The meta http-equiv tag enables you to inform the HTTP server about the kinds of headers it mayfile provide. If you do not have access to the server directly, but if you are able to modify your html pages then you can use a http-equiv meta tag directly in your content. Include the following line at the top of your page:

<meta http-equiv="Content-Type" value="application/xhtml+xml;charset=utf-8" />

Note, it is the charset=utf-8 that acheives our goal here. Note also, if the server sends a HTTP Content-type header, then any meta http-equiv="Content-type" tag may be ignored by the browser.

Using server side code

If you are using server side code to genereate your content then there is usually a method to set the server headers directly from within your server source code. Some examples are:

• Java Servlets: Use the setContentType method:

response.setContentType("application/xhtml+xml;charset=UTF-8");

before any content is sent

OR

use the setCharacterEncoding method:

response.setCharacterEncoding("UTF-8");

• JSP: include the JSP directive

<%@ page language="java" contentType="application/xhtml+xml;charset="UTF-8" %>

at the top of the page, before any content

OR

Use the Java servlet methods as above, but wrapped in scriptlet tags (i.e. <%….%>) , and before any other output

• PHP: include the line

header("Content-Type: application/xhtml+xml; charset=UTF-8");

before any other output line

• ASP: include the line
  

  response.ContentType = "application/xhtml+xml; charset=UTF-8"

  before any content is sent

   

• Perl: include the line
  

  print "Content-Type: application/xhtml+xml; charset=UTF-8nn";

  before any output is sent to the client. Note the double linebreak (nn) at the end

• Python: As for Perl, but no semicolon required at the end
  

   

Reference

This test is based on a W3C mobileOK best practice test. See http://www.w3.org/TR/mobileOK-basic10-tests/#test_character_encoding_support for more details