HTML & CSS

<meta charset="UTF-8" />

presentKey 2024. 3. 27. 22:58

๐Ÿ“ ํƒœ๊ทธ์˜ ์˜๋ฏธ

๋ธŒ๋ผ์šฐ์ €๋Š” ์„œ๋ฒ„๊ฐ€ ์‘๋‹ตํ•œ HTML ํŒŒ์ผ์„ ๋ฐ”์ดํŠธ(2์ง„์ˆ˜) ํ˜•ํƒœ๋กœ ์‘๋‹ต๋ฐ›๋Š”๋ฐ, ๋ธŒ๋ผ์šฐ์ €์—๊ฒŒ ์–ด๋–ค ์ธ์ฝ”๋”ฉ ๋ฐฉ์‹์„ ์‚ฌ์šฉํ•  ์ง€ ์•Œ๋ ค์ฃผ๋Š” ํƒœ๊ทธ์ด๋‹ค.

html ๋ฌธ์„œ๋ฅผ ์ง€์ •๋œ ์ธ์ฝ”๋”ฉ ๋ฐฉ์‹(UTF-8)์„ ๊ธฐ์ค€์œผ๋กœ ๋ฌธ์ž์—ด ๋ณ€ํ™˜

UTF-8 ์ธ์ฝ”๋”ฉ ๋ฐฉ์‹์€ ๋Œ€๋ถ€๋ถ„์˜ ๋ฌธ์ž๋ฅผ ํ‘œํ˜„ํ•˜๊ธฐ์— ์ ํ•ฉํ•˜์—ฌ ๋งŽ์ด ์‚ฌ์šฉ๋˜๊ณ , ๋‹ค๋ฅธ ์ธ์ฝ”๋”ฉ ๋ฐฉ์‹(euc-kr ๋“ฑ)์„ ์‚ฌ์šฉํ•˜๋ฉด ์ผ๋ถ€ ๋ฌธ์ž๊ฐ€ ๊นจ์ ธ๋ณด์ผ ์ˆ˜ ์žˆ๋‹ค. 

 

๐Ÿ“ ์ธ์ฝ”๋”ฉ ์ด๋ž€?

๋ฌธ์ž๋‚˜ ๊ธฐํ˜ธ๋“ค์„ ์ปดํ“จํ„ฐ๊ฐ€ ์ด์šฉํ•  ์ˆ˜ ์žˆ๋Š” ์‹ ํ˜ธ๋กœ ๋งŒ๋“œ๋Š” ๊ฒƒ์ด๋‹ค.

 

ASCII ์ฝ”๋“œ ์˜ˆ๋ฅผ ๋“ค๋ฉด

๋ฌธ์ž ์‹ญ์ง„๋ฒ• ์ด์ง„๋ฒ•
A 65 1000001
Z 92 1011010
a 97 1100001
z 122 1111010

 

๋ฌธ์ž์—ด ์„ธํŠธ(ํ‘œ)์— ๋”ฐ๋ผ  'A' ๋ฌธ์ž๋ฅผ ์ปดํ“จํ„ฐ๊ฐ€ ์ดํ•ดํ•  ์ˆ˜ ์žˆ๋Š” '1000001' ๋ณ€ํ™˜ํ•˜๊ณ , ๋‹ค์‹œ ์‚ฌ์šฉ์ž์—๊ฒŒ ๋ณด์—ฌ์ค„ ๋•Œ๋Š” 'A'๋กœ ๋ณ€ํ™˜๋œ๋‹ค.

๋ฌธ์ž์—ด ์„ธํŠธ: ๊ฐ ๋ฌธ์ž๋งˆ๋‹ค ์ˆซ์ž๋ฅผ ์ •ํ•ด๋†“์€ ํ‘œ
๋ฌธ์ž ์ธ์ฝ”๋”ฉ: ๋ฌธ์ž๋ฅผ ์ปดํ“จํ„ฐ๊ฐ€ ์ด์šฉํ•  ์ˆ˜ ์žˆ๋„๋ก ๋ฐ”์ด๋„ˆ๋ฆฌ(0๊ณผ 1) ์‹ ํ˜ธ๋กœ ๋ฐ”๊ฟ”์ค€๋‹ค.
๋””์ฝ”๋”ฉ: ์ธ์ฝ”๋”ฉ๋œ ๋ฐ์ดํ„ฐ๋ฅผ ์›๋ž˜๋Œ€๋กœ ๋˜๋Œ๋ฆฌ๋Š” ๊ณผ์ •

 

๐Ÿ“ Unicode

ASCII ์ฝ”๋“œ๋Š” ๋‹ค๋ฅธ ๋‚˜๋ผ ๋ฌธ์ž๋“ค์„ ํ‘œํ˜„ํ•  ์ˆ˜ ์—†์–ด์„œ, ๋‚˜๋ผ๋“ค๋งˆ๋‹ค ๊ฐ๊ธฐ ๋‹ค๋ฅธ ๋ฌธ์ž์—ด ์„ธํŠธ๋ฅผ ์‚ฌ์šฉํ–ˆ๋‹ค. ์ด ๋ฌธ์ž์—ด ์„ธํŠธ๋ฅผ ํ‘œ์ค€ํ™”ํ•˜๊ธฐ ์œ„ํ•ด ๋ชจ๋“  ๋ฌธ์ž๋“ค์„ ํ•˜๋‚˜์˜ ํ‘œ์— ํฌํ•จ์‹œํ‚จ unicode ๋ฌธ์ž์—ด ์„ธํŠธ๋ฅผ ๋งŒ๋“ค๊ฒŒ ๋˜์—ˆ๋‹ค.

 

๐Ÿ“ UTF-8

unicode ๋ฌธ์ž์—ด ์„ธํŠธ๋ฅผ ๋งคํ•‘ํ•˜๋Š” 2๊ฐ€์ง€ ๋ฐฉ์‹์ด ์žˆ๋‹ค.

  1. ์œ ๋‹ˆ์ฝ”๋“œ ๋ณ€ํ™˜ ํ˜•์‹(Unicode  Transformation Format, UTF) ์ธ์ฝ”๋”ฉ
  2. ๊ตญ์ œ ๋ฌธ์ž ์„ธํŠธ(Universal Coded Character Set, UCS) ์ธ์ฝ”๋”ฉ

UTF์™€ UCS๋Š” UCS-2, UCS-4, UTF-8, UTF-16, UTF-32 ๋“ฑ์œผ๋กœ ๊ตฌ์„ฑ๋˜์–ด ์žˆ๋Š”๋ฐ, UTF-8์€ ๊ทธ ์ค‘ ํ•˜๋‚˜์ด๋‹ค.

 

UTF-8 ์ธ์ฝ”๋”ฉ์€ ์œ ๋‹ˆ์ฝ”๋“œ ํ•œ ๋ฌธ์ž๋ฅผ ๋‚˜ํƒ€๋‚ด๊ธฐ ์œ„ํ•ด 1๋ฐ”์ดํŠธ์—์„œ 4๋ฐ”์ดํŠธ๊นŒ์ง€ ์‚ฌ์šฉํ•œ๋‹ค.

  • ASCII ๋ฌธ์ž๋“ค์€ 1๋ฐ”์ดํŠธ๋งŒ์œผ๋กœ ํ‘œ์‹œ
  • ํ•œ๊ธ€์€ 3๋ฐ”์ดํŠธ๋กœ ํ‘œ์‹œ

 

๐Ÿ“ URL Encoding ์ด๋ž€?

URL๋กœ ์ „์†กํ•  ์ˆ˜ ์žˆ๋Š” ๋ฌธ์ž๋Š” ASCII ์ฝ”๋“œ ๋ฌธ์ž๋งŒ ์‚ฌ์šฉํ•  ์ˆ˜ ์žˆ๊ธฐ ๋•Œ๋ฌธ์—, ASCII๊ฐ€ ์•„๋‹Œ ๋ฌธ์ž๋“ค์„ URL์— ์‚ฌ์šฉํ•  ์ˆ˜ ์žˆ๋„๋ก ๋ฐ”๊ฟ”์ฃผ๋Š” ์ž‘์—…์„ URL Encoding์ด๋ผ ํ•œ๋‹ค.

 

๊ทธ๋ž˜์„œ ASCII ์ฝ”๋“œ์— ํฌํ•จ๋˜์–ด ์žˆ์ง€ ์•Š๋Š” ํ•œ๊ธ€ ๋“ฑ์€ UTF-8 ์ธ์ฝ”๋”ฉ๋˜์–ด ํ‘œํ˜„๋˜๊ณ , ASCII ๋ฌธ์ž์— ํฌํ•จ๋˜๋”๋ผ๋„ ๋ฌธ์ž ๊ทธ ์ž์ฒด ์˜๋ฏธ๋กœ ์ „๋‹ฌํ•˜๊ณ  ์‹ถ๋‹ค๋ฉด ์ด์Šค์ผ€์ดํ”„ ์ฒ˜๋ฆฌ๋ฅผ ํ•ด์ค˜์•ผ ํ•œ๋‹ค. '/' ๋Š” %2F, '&'๋Š” %26์œผ๋กœ ์ธ์ฝ”๋”ฉ๋œ๋‹ค.

 

'https://ko.wikipedia.org/wiki/๋ฌธ์ž_์ธ์ฝ”๋”ฉ' ์ฃผ์†Œ๋Š” ๋‹ค์Œ๊ณผ ๊ฐ™์ด ๋ณ€ํ™˜๋˜๋Š” ๊ฒƒ์„ ๋ณผ ์ˆ˜ ์žˆ๋‹ค.

๋ฌธ = %EB%AC%B8, ์ž = %EC%9E%90,
์ธ = %EC%9D%B8, ์ฝ” = %EC%BD%94, ๋”ฉ = %EB%94%A9

 

 

๐Ÿงท ์ฐธ๊ณ 

- https://ko.wikipedia.org/wiki/%EB%AC%B8%EC%9E%90_%EC%9D%B8%EC%BD%94%EB%94%A9

- https://ko.wikipedia.org/wiki/ASCII

- https://ko.wikipedia.org/wiki/%EC%9C%A0%EB%8B%88%EC%BD%94%EB%93%9C

- https://ko.wikipedia.org/wiki/UTF-8

- https://www.youtube.com/watch?v=1jo6q4dihoU

- https://developers.google.com/maps/url-encoding?hl=ko