<!DOCTYPE html> <html lang="en"> <head> <title>Spot the bug</title> <meta name="description" content="Gotta spot the bug" /> <meta charset="ISO-8859-1" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> </head> <body> <img src="https://bytes.dev/images/bytes-banner-rounded.png" width="300" height="150" /> <p> Bottom Line: With a release like this, the Astro hype train rocket probably won't be slowing down anytime soon. So we have to cherish moments like this while we have them, because your kids always grow up way too fast 🥹. </p> </body> </html>
Specifying a charset of <meta charset="ISO-8859-1" /> will cause special characters and emojis to not render properly.
In order to properly render emojis, the document needs to use Unicode Transformation Format (UTF), UTF-8 being the most commonly used encoding for web development. Most browsers default the encoding to UTF-8 (or try and detect it automatically), but for older rendering engines (cough email) you will need to explicitly set your charset, or like us, you could be spending hours trying to figure out why your emojis won’t render ðŸ˜.
<!DOCTYPE html> <html lang="en"> <head> <title>Spot the bug</title> <meta name="description" content="Gotta spot the bug" /> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> </head> <body> <img src="https://bytes.dev/images/bytes-banner-rounded.png" width="300" height="150" /> <p> Bottom Line: With a release like this, the Astro hype train rocket probably won't be slowing down anytime soon. So we have to cherish moments like this while we have them, because your kids always grow up way too fast 🥹. </p> </body> </html>