# Regional Indicator Symbols

_In this article, I'll dive into the technical aspects of RIS-encoding: a
popular category within the Emoji character set that allow country flags to
be displayed. **Please note that not every browser supports these symbols to
the same extent, which means that this article might not be properly readable
in some cases.**_

## Introduction

The RIS is a collection of characters encodings in the UTF-16 specification
that make it possible to display country flags in a body of text. Every flag
is a pairing of two symbols, each of which representing an alphabetic letter.
When such a symbol matches a country code from the ISO 3166-1
alpha-2[^iso-3166] specification, the flag of said country will be displayed.
The table in [Appendix A](#RIS codex) provides an overview of all possible
combinations -- and as such all possible country flags: the RIS Codex.

## RIS codes & ISO 3166

The compilation of the RIS Codex in [Apprendix A](#RIS codex) is automized;
all RIS-characters are paired, and, if applicable, the name of the country in
question is looked up (as displayed when hovering the RIS with the cursor).
This also shows that the ISO 3166 specification is not always implemented
correctly, and is subject to change: a subset of pairings has a known name,
but is not displayed as a country flag. This concerns:

 - "Pseudo-Accents" (XA);
 - "Pseudo-Bidi" (XB);
 - "Outlying Oceania" (QO);
 - "Eurozone" (EZ); and,
 - "Unknown Region" (ZZ).

## Encoding a Country Flag: An Example

In order to display the national flag of The Netherlands, the Dutch country
code needs to be looked up in the ISO 3166 definition. Using the search tool
provided by the ISO,[^iso-3166-obp] this code is found to be
`NL`.[^iso-3166-nl] In order to display the flag, this code is encoded to
RIS-characters; `N` becomes 🇳 and `L` becomes 🇱. Simply printing these
two characters in sequence will display the flag, as expected: 🇳🇱.

## Browser Support

Coding a country flag in HTML can be done in two ways. It’s possible to place
the UTF-16 symbols directly into the document, and it’s possible to encode the
characters using HTML-symbols, e.g. the Faroese flag can be compiled from the
RIS-encodings for `F` and `O`, i.e. 🇫 and 🇴, which are encoded as `🇫`
and `🇴` in HTML to get to the actual country flag 🇫🇴.

There are some interesting differences between the way RIS codes are handled
by different browsers. E.g., the two halves of a RIS code can be wrapped in
HTML elements: `<span>&#127477;</span><span>&#127481;</span>`. On
Firefox and most Chromium-based browsers, the country flag is displayed as it
usually would. However, Apple Safari browser will display both RIS codes
individually. When a margin is added between these elements using CSS, Firefox
will display the RIS codes separately, similar to Safari, while Chromium-based
browsers will simply add the margin to the country flag as a whole.

## RISify

In order to generate the RIS-codex, I have developed the Python package
"RISify", with which country codes can be converted to RIS-codes and vice
versa. [RISify is available on PyPI](https://pypi.org/project/RISify/) and
can be installed using pip:

```shell
pip install RISify
```

After installation, it can be used as follows:

```python
from ris import ris

# decode a country code to RIS
pt = ris("PT")

print(pt)  # 🇵🇹

# decode an HTML code to RIS
de = ris("&#127465;&#127466;")
de = de.encode("unicode")  # default

print(de)  # 🇩🇪

# encode a RIS code to uppercase ASCII
nl = ris("🇳🇱")
nl = nl.encode("ascii")
nl = nl.upper()  # default

print(nl)  # NL

# encode a RIS code to lowercase ASCII
eu = ris("🇪🇺")
eu = eu.encode("ascii")
eu = eu.lower()

print(eu)  # eu

# encode a RIS code to HTML
fo = ris("🇫🇴")
fo = fo.encode("html")

print(fo)  # &#127467;&#127476;

# concatenate RIS codes into a string
print("spam " + pt + " bacon " + de + " sausage " + nl + " eggs " + eu + " ham " + fo)
# spam 🇵🇹 bacon 🇩🇪 sausage NL eggs eu ham &#127467;&#127476;
```

## Conclusion

RIS codes combine many standards and conventions that are volatile to some
degree, especially when it comes to implementation. On top of that, browsers
are notorious for having ever so slightly different implementations of such
standards. Making use of RIS codes on the web has a high chance of resulting
in unintentionally providing a different experience to different users. Still,
RIS codes can be used as a fallback for icons (to cover for cases where a
stylesheet is not loaded) or in other parts of the GUI, such as titles and
tooltips.

*[RIS]: Regional Indicator Symbols
*[ISO]: International Organization for Standardization
*[HTML]: HyperText Markup Language
*[CSS]: Cascading Style Sheets
*[UTF]: Unicode Transformation Format
*[GUI]: Graphical User Interface

[^iso-3166]: _[ISO 3166: Country Codes](https://www.iso.org/iso-3166-country-codes.html)_. ISO.
[^iso-3166-obp]: _[Online Browsing Platform](https://www.iso.org/obp/ui/#search)_. ISO.
[^iso-3166-nl]: _[NL - Netherlands (the)](https://www.iso.org/obp/ui/#iso:code:3166:NL)_. ISO.