UTF-8

html을 하다보면

    <meta charset="UTF-8">

    <meta name="viewport" content="width=device-width, initial-scale=1.0">

가 있는데.. 찾아보니

 

Unicode Transformation Format - 8-bit의 약자로,  현재 웹에서 가장 널리 사용되는 표준 문자 인코딩 방식이다. 전 세계의 거의 모든 문자를 표현할 수 있도록 설계된 유니코드(Unicode)를 컴퓨터가 이해할 수 있는 이진 데이터(0과 1)로 변환하는 규칙이라고 한다.

 

UTF-8의 핵심 특징: 가변 길이 인코딩

UTF-8의 가장 큰 특징은 가변 길이 인코딩(Variable-width encoding) 방식을 사용한다. 이는 문자에 따라 사용하는 바이트(byte) 수가 달라진다는 의미이다.

• 1바이트: 영어 알파벳, 숫자, 기본 특수문자 등 ASCII 문자는 1바이트로 표현된다. 이는 기존의 ASCII 인코딩과 완벽하게 호환되어, 영문만 포함된 문서는 UTF-8로 인코딩해도 파일 크기가 변하지 않는 장점이 있다.
• 2바이트 이상: 한글, 한자, 일본어 등 다른 언어의 문자나 이모티콘(😂) 등은 2바이트에서 4바이트까지 사용하여 표현된다.

다음줄

1. <meta name="viewport">

• 이 부분은 브라우저에게 "지금부터 화면(viewport)에 대한 설정을 할 것이다"라고 알려주는 역할을 한다.
• **뷰포트(Viewport)**란 사용자에게 웹페이지가 실제로 보여지는 영역, 즉 화면의 '창'을 의미한다.

2. content="width=device-width, initial-scale=1.0"

이것이 실제 설정 내용이다. 두 가지 명령으로 구성되어 있다.

• width=device-width
  • 페이지의 너비(width)를 기기의 실제 화면 너비(device-width)에 맞추라는 뜻이다.
  • 예를 들어, 아이폰 14의 화면 너비가 390px이라면, 웹페이지의 뷰포트 너비도 390px로 설정된다.
• initial-scale=1.0
  • 페이지가 처음 로드될 때, 확대나 축소되지 않은 원래 크기(100% 배율)로 보여주라는 의미이다.
  • 만약 이 값을 2.0으로 설정하면, 페이지는 2배 확대된 상태로 시작된다. 1.0이 표준이다.