Vídeo tutorial

Caso goste de assistir vídeos tutorias, clique aqui para assistir um vídeo sobre o UTF-8.

UTF-8

Na imagem acima, há algumas áreas demarcadas com retângulos vermelhos enumerados, que serão explicados logo abaixo:

1-Mensagem: Caso esteja no modo encriptação, digite uma mensagem qualquer nessa região para criar um texto binário codificado em UTF-8. Caso esteja no modo tradução, digite um código binário UTF-8 nessa área para decodificar esse código para um texto comum.

2-Output: Ao clicar em "encriptar" ou "traduzir", a mensagem codificada ou decodificada aparecerá nessa região.

Funcionamento

Para codificar um texto em base64, primeiro, é preciso coletar os valores binários equivalente a cada caractere da mensagem(valor UNICODE transformado em binário). Depois que transformar em binário, dependendo do tamanho desse código, ele terá algumas transformações diferentes:

Códigos até 7 bits: 0 XXXXXXX

Códigos até 11 bits: 110 XXXXX 10 XXXXXX

Códigos até 16 bits: 1110 XXXX 10 XXXXXX 10 XXXXXX

Códigos até 21 bits: 11110 XXX 10 XXXXXX 10 XXXXXX 10 XXXXXX

Logo acima, está mostrado como funciona a representação binária do UTF-8. X representa um bit qualquer do código binário, e os outros digitos marcados são fixos. Para explicar melhor, abaixo estão alguns exemplos:

Exemplo 1: convertendo o texto "abc" para binário, temos: 1100001 1100010 1100011. Cada letra possui 7 bits, portanto eles entrarão no primeiro caso. Passando pelo codificação UTF-8, temos: 0 1100001 0 1100010 0 1100011.

Exemplo 2: convertendo o texto "Éa" para binário, temos: 11001001 1100001. O primeiro caractere possui 8 bits portanto ele entra no segundo caso, e o 2° caractere possui 7 bits. Para completar os 11 bits do 2° caso, teremos que completar com 0's a esquerda: 11001001 -> 00011001001. Finalizando, passando pela codificação UTF-8, temos: 110 00011 10 001001 0 1100001.

Recomendações

Para melhores explicações sobre o assunto, recomendo o seguinte vídeo

Caso tenha interesse em ver como foi implementado o código UTF-8 nesse programa, clique aqui