Strange Characters on Website? Encoding Fixes

Strange Characters on Website? Encoding Fixes


Have you ever visited a website and encountered strange characters like question marks in black diamonds () or other odd symbols instead of normal text? This issue often arises from character encoding problems, where the website's character set doesn't match the browser's or database's character set. This guide provides detailed steps to troubleshoot and fix these encoding issues, with a focus on UTF-8 and database collation.

Understanding Character Encoding

Character encoding is a system that translates characters (letters, numbers, symbols) into a format that computers can understand and display. UTF-8 is the most widely used character encoding standard on the web because it can represent characters from almost all writing systems. When different encoding systems are used, or when there are inconsistencies, characters are misinterpreted, leading to the display of strange symbols.

1. Check Website's Character Encoding (HTML)

The first step is to ensure that your website's HTML specifies the correct character encoding, which should ideally be UTF-8.

How to Check and Set HTML Encoding:

  • View Page Source: Right-click on the web page in your browser and select "View Page Source" (or similar, depending on your browser).

  • Search for Character Set: Look for the `` tag within the `` section of the HTML code that defines the character set. It should look like this: ``

  • Set or Modify Character Set: If the charset is missing, add the `` tag within the `` section. If it's set to a different encoding, change it to UTF-8.

  • Save Changes: Save the changes to your HTML file and upload it to your server.

2. Check and Set Database Encoding and Collation

If your website uses a database (like most WordPress sites do), the database itself, the tables within it, and the columns in those tables must also be set to use UTF-8. Collation is a set of rules that define how characters are compared and sorted. For UTF-8, a common collation is `utf8mb4_unicode_ci` or `utf8mb4_general_ci`.

How to Check and Set Database Encoding and Collation (using phpMyAdmin):

  • Access phpMyAdmin: Log in to your hosting control panel and open phpMyAdmin.

  • Select Your Database: Choose the database used by your website.

  • Check Database Collation:

    • On the "Operations" tab, check the "Collation" for the database. If it's not a UTF-8 collation, change it to `utf8mb4_unicode_ci` or `utf8mb4_general_ci`.

  • Check Table Collation:

    • Select a table.

    • Go to the "Operations" tab.

    • Check the "Collation" for the table. Change it to `utf8mb4_unicode_ci` or `utf8mb4_general_ci` if necessary.

  • Check Column Collation:

    • Select a table.

    • Go to the "Structure" tab.

    • For each text-based column (e.g., VARCHAR, TEXT), click "Change".

    • Check and change the "Collation" to `utf8mb4_unicode_ci` or `utf8mb4_general_ci` if needed.

  • Database Connection Collation:

    • Sometimes, the database connection also has a collation setting. You might need to add a line to your `wp-config.php` file (for WordPress) to ensure UTF-8 is used:

      `define('DB_CHARSET', 'utf8mb4');`

      `define('DB_COLLATE', 'utf8mb4_unicode_ci');`

  • How to Identify and Fix Database Connection Errors on Your Website/

3. Check File Encoding

Ensure that the files themselves (e.g., PHP files, CSS files) are saved with UTF-8 encoding. Text editors like Notepad++, Sublime Text, VS Code, and others allow you to specify the encoding when saving a file.

How to Check and Set File Encoding (using Notepad++):

  • Open the File: Open the file in Notepad++.

  • Check Encoding: Go to the "Encoding" menu to see the current encoding. It should be "UTF-8".

  • Convert to UTF-8: If it's not UTF-8, select "Convert to UTF-8" (or "Encode in UTF-8").

  • Save the File: Save the file.

4. Character Encoding in PHP

If you're using PHP to generate content, ensure that PHP is also handling character encoding correctly.

How to Handle Character Encoding in PHP:

  • PHP Header: You can send a header to the browser specifying UTF-8: `header('Content-Type: text/html; charset=utf-8');` This should be placed before any output is sent.

  • `mb_internal_encoding()`: PHP's Multi-Byte String functions are useful for handling UTF-8. Set the internal encoding: `mb_internal_encoding('UTF-8');`

5. Browser Issues

In rare cases, the browser might be misinterpreting the encoding. Try these steps:

  • Reload the Page: Sometimes a simple refresh (Ctrl+F5 or Cmd+Shift+R) will fix it.

  • Try a Different Browser: See if the issue persists in Chrome, Firefox, Safari, etc.

  • Browser Encoding Settings: Most browsers have settings to select the character encoding, but usually, they auto-detect it. It's best to rely on correct encoding from the server.

Troubleshooting Tips

  • Be Consistent: The most important thing is to be consistent with your encoding throughout your website (HTML, database, files).

  • Test Thoroughly: After making changes, test your website thoroughly, especially pages with user-generated content or content in multiple languages.

  • Backup Your Database: Before making any changes to your database, always create a backup. Why Website Backups Matter: How to Create and Test Them/

By systematically checking and correcting the character encoding at each level of your website, you can eliminate those pesky strange characters and ensure that your content is displayed correctly to all visitors. If you need further assistance, contact WebCareSG for professional website support.


Related WebCare Solutions

The Cost of Ignoring Website Issues: Why Quick Fixes Matter

Understand how unresolved website problems can negatively impact businesses and learn why it’s important to address them promptly.

How to Backup and Restore Your Wordpress Website

Learn how to backup and restore your website. Follow these detailed steps to protect your data and quickly recover from any issues.

How to Remove Spam Comments from Your WordPress

Learn how to effectively remove spam comments from your WordPress site to maintain a clean and professional appearance."

Ready to get started?

Focus on your business while we fix your website. Contact WebCareSG today for fast, reliable solutions!

Whatsapp us on

+65 9070 0715