<charset=utf-8>의 의미와 웹 문서의 구조
페이지 형선언문 정의와 형선언 DTD의 종류 참고
약간의 기획 물 형태로 시작된 코딩문자 배우기 포스터 작업은 시작 하면서 말씀 드린대로 저 스스로 공부하는의미로 시작한 일이며 저같이 아직 초보 블로거 분들과 함께 배우고 서로 교류하자는데 의의를 두고 시작한 것이 라는 점을 다시 한번 말씀 드립니다.
그리고 우리가 인터넷을 하면서 기초적인 것이지만 중요한 것으로 부터 시작해 점진적 단계를 올라 가면서 공부를 하고 이 시리즈가 끝날때 쯤에는 인터넷과 홈페이지를 자유 자재로 다룰수 있는 단계에 까지 이를수 있도록 하는 것이 목표 입니다.
그리고 최대한 정확한 정보와 서술을 위해 최선의 노력을 기울 이며 작업하고 있다는 점을 생각 해 주시면 감사 하겠습니다.
코딩 문자는 너무나도 광범위 하기 때문에 그중 웹문서의 기본이되는 <html/css> 로 꾸며진 제 블로그의 에디터로 공부 하면서 주요 내용들에 대해 기술 하고 있습니다.
코딩 문자 공부의 첫 걸음 형선언문<DTD> 를 알자
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1 .0">
<meta name="author" content="⌊##_blogger_##⌋">
<meta name="description" content="⌊##_desc_##⌋">
utf8 이란?
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
위의 제 skin에디트의 소스를 보니 위와 같은 코드가 있는데요 이 코드는 문서의 속성을 정의 하는 코드로 전체 문서 형태가 가진 속성을 정의 하고 있으며 스스로를 슬러쉬로 닫는 코드로 실제로 브라우져에 꾸며주는 속성이 없는 empty 요소적 코드라고 할수 있습니다.
지난 시간에 기술 한 대로 형선언(DTD)문이 없는 대신 위의 코드로 대체 하였다고 할수 있을것입니다.
위 코드는 외부 검색 봇의 크롤링시 주 타겟 대상이 되는 코드 이며 문서 판독기가 문서 형식을 판독 한후 해당 문서의 케릭터셋으로 코딩 해석을 하므로 DTD 형 선언이나 위코드 중 하나 라도 문서 내에 위치 시켜야 합니다.
만약 두가지가 다 빠지게 되면 크롤링 대상에서 제외 당할 확율이 매우 높을 뿐만 아니라 원하는 콘텐츠를 구현 하지 못 하게 되므로 문자가 깨져서 보일수 있기 때문에 둘중 하나 이상을 반드시 꼭 기입 하여 콘텐츠 정보를 바르게 구현 함과 동시에 블로그의 활성도를 높혀야 겠지요
<meta=http-equiv="Content-Type"> 이 코드가 가진 의미는 전체 문서내용의 타입이 무엇인지에 대해 다음에 나올 <content="text/html; charset=utf-8"/>이 코드 값에 대한 서술형 코드라고 할수가 있으며 <meta>안의 콘텐츠타입은... <content="text/html; charset=utf-8"/> 이런것이다. 라고 정의 하고 있습니다.
<meta>코드의 뜻은 집합체 즉 그룹을 의미 하며 여기서는 이 홈페이지의 전체 문서를 뜻하게 됩니다.
그리고 스킨 소스를 보면 위의 문서 코드 다음에 오는 코드를 보면 여기서도< meta http-equiv="X-UA-Compatible" content="IE=edge"> 이런 코드 속에 <http-equiv> 이런 코드를 볼수 있는데요<http-equiv> 이코드의 의미는 시각화 하는 기기 장치가 속한 주소를 의미 하게 되는데 여기서 는 마이크로 소프트 인터넷 익스플로러 웹브라우져를 뜻하게 됩니다.
< meta http-equiv="X-UA-Compatible" content="IE=edge"> 인터넷 익스 플로러의 가장 최신 버젼의 브라우져를 뜻합니다
그럼 <content="text/html; charset=utf-8"/> 이 코드가 가지고 있는 의미는 무엇 일까요?
Content는 더이상 설명할 필요가 없겠지요 정보자산 이라는 것은 다 알고 계시리라 봅니다.
Text는 인코딩 되는 코드의 형태로서 문서 형식을 말하는 것으로 다음에 오는 html(hyper text markup language)로 코딩 되는 문서 라는 것이죠
charset는 영어로 character code set 케릭터 코드 모음 이라는 것입니다.
UTF-8이 뜻하는 의미는 유니코드 가변 인코딩 방식 이라는 것인데요 기존 아스키코드로는 더이상의 문자를 나타낼수 없어 세계 표준코드 콘소시엄 이라는 기구에서 다른 문자들에게 부여 하는 코드의 인코딩 방식중의 하나를 뜻합니다.
지난 시간에도 잠깐 언급 한 바 있지만 지금 우리가 쓰고 있는 글 이나 영상 소리 같은 이 모든 정보가 디지털에서 디코딩 되는 메카니즘의 원리를 보면 지금 눈으로 보이는 문자 형태인 아나로그로는 바로 전달 할수가 없게 되어 있지요
그 이유는 컴퓨터 언어는 바이트로 전달 하는 이진수 디지털 전송 방식 이기 때문 입니다.
월드와이드웹(WWW)과 W3C 그리고 팀 버너스리
html 코드 문자를 만들고 정보의 소재지를 표준화 해 불필요한 소비를 배제 하고 어떤기기를 쓰든 동일한 정보의 위치를 지정해주는 url을 웹에 접목 함으로 웹세계를 통일한 월드와이드웹(www)의 창시자 팀 버너스리를 우리는 기억 하고 있을 겁니다.
1955년 영국에서 출생 하였고 스위스 입자물리 연구소(CERN) 연구원 으로 재직 시1989년 최초로 웹 문서 html을 개발 하여 웹문서의 근간을 만들고 1990년 최초로 문서편집기를 개발 하고 이어서 인터넷의 고유주소 URL을 개발 하여 인터넷에 접목 함으로서 웹 상호간의 원활한 교류로 인터넷의 무한 확장이 가능케 하였습니다.
특히 하이퍼 텍스트 프로토콜 http를 개발 하여 누구든 자유자재로 인터넷에 접근 할수가 있도록 하였습니다.
W3C세계 웹표준 콘소시엄 이라는 기구를 만들어 웹문서의 표준을 완성 하므로서 월드와이드웹(WWW)이라는 명실공히 전세계의 인터넷의 웹을 하나로 통합 하게 한 인터넷의 아버지라 불리는 사람입니다.
지금도 그는 W3C라는 세계 웹 표준 콘소시엄 이라는 협의 기구를 통해 어떤기기를 쓰든 상호 호환이 가능한 코딩문자의 웹 표준화를 통하여 모든기기에서 상호 호환을 가능하게 하므로서 불필요한 소비를 배제 하고 더욱 활발하고 익사이팅한 인터넷 세계를 만들고자 노력하고 있는데요
그에 의해서 표준화가 이루어 지지 않았다면 지금의 인터넷이란 공간은 아마도 뒤죽박죽 엉망이 되었을 것이고 전세계를 망라할수도 없었을 것이라 봅니다.
그렇기 때문에 코딩 문자에서도 표준화의 중요성이 강조 되고 있으며 위의 charset=utf-8 이란 이 코드가 탄생 한것이라고 보면 되겠 습니다.
charset=utf-8 이란?
전세계의 문자들을 통일 시키는 국제 표준 콘소시엄 기구 (Universal code Consortium)에 의해 등재된 유니코드 인코딩 방식 중의 하나 인데요
정보를 전달 하는 단위는 바이트 이며 최소단위인 1바이트는 8비트의 조각들이 모여 만들어 집니다.
이 조각들은 이진수 0과1에 대응 한 주파수로 정보를 전달 하게 됩니다.
0을 가지는 숫자에는 전자의 흐름이 단절되고 1을가진 값에서는 다시 흐름이 이루어 지는 원리를 이용한것인데요
초기의 모르스 부호가 업그레이드 되었다고 볼수 있을 것 입니다.
어떤 문자이든 기본의 음절을 갖고 있으며 기본이 되는 음절 하나하나가 조합되어 하나의 글자가 되는 것이죠
이진수를 십진수로 쉽게 변환 하기
이진수(binary)에 대해 조금 알아야 하기때문에 지금부터 이진수에 대해 공부를 좀 해 봅시다.
이진수는 0과1의 두가지 숫자로 나열 됩니다.
우리가 일상에서 사용하는 십진수(decimal)은 0부터9까지 10개의 정수를 가지고 있다는건 누구나 알고 있는 사실 이지요
십진수에 익숙해 있기 때문에 이진수의 숫자를 대하게 되면 상당히 난감해 지지만 사실 이진수로도 우리가 계산하고자 하는 숫자를 모두 표현할수 있다는것은 다알고 계시리라 봅니다.
예를들어 이진수 10010이 갯수를 나타 낸다고 할때 십진수로 계산 해보면 이 숫자의 갯수를 알수가 있지요
한자리 올라 갈때 마다 제곱으로 늘어 나기 때문에 제일 끝자리 수인 0은 십진수의 1의자리수 이며 0×1=0이 되지요
10010다음 10의 자리 수는 1이므로↑
16 8 4 2 1
↓
=0
1×2=2가 되고
10010그 다음 백의 자리 수는 0×4=0이 되고
↑
16 8 4 2 1
↓
=2
10010천의자리수는 0×8=0이 되고
↑
16 8 4 2 1
↓
=0
만의자리수는 1×16=16이 되겠죠10010
↑
16 8 4 2 1
↓
=0
10010그럼 위 결과 숫자들을 다 더하면 십진수 갯수가 됩니다.
↑
16 8 4 2 1
↓
=16
0+2+0+0+16=18 십진수로 18개가 된다는 걸 알수가 있습니다.
자 이렇게 보니 이진수는 0과1밖에 없다는 것을 알수 있으며 0은 값을 가지지 않는다는 것을 알수가 있기 때문에 계산 할때는 빼버리고 1이 나오는 숫자에 자리의 배수를 곱해서 나온 결과 값들을 더해 주 면 더 쉽겠네요
위의 방법이 좀 유치해 보이긴 하지만 종이에 그려놓고 해 보면 아주 간단 하게 계산을 할수가 있는 것입니다.
처음에 나온 1이 십의 자리 수니까 1×2=2 다음에 나온 1은 십진수 만의 자리 수 이며 배수는 16 이니까 1×16=16이 되겠죠
그럼 결과 값들을 더해 주면 2+16=18 이라는 값이 나오네요 간단 하지요
1,2,4,8,16,32,이런 식으로 자리를 올라 갈때 마다 제곱의 값이 된다는것 만 알면 쉽게 값을 구할수가 있겠네요
위의 이진수를 좀 어렵게 계산식 으로 나열 해 보면 0×1+0×12 +0×22+0×42+1×82=18이렇게 계산식으로 표시 할수가 있겠지요
십진수를 이진수로 쉽게 변환 하기
역으로 십진수를 이진수로 고치는 법도 알고 있어야 하는데요
위의 십진수 18을 이진수로 고쳐 볼까요 이번에는 반대로 계산 하면 되겠지요
자그럼 한번 고쳐 볼까요
우선 32,16,8,4,2,1 이렇게 배수를 반대로 적어 놓고 그 배수의 자리수에 해당 하는 이진수 1을 대응 시킨후 나머지 가 있으면 그 수가 가지는 수를 이진수 자리에 갖다 넣는 방식 입니다.
◇여기서 찾아야 할 자리수는 자리를 찾는 자신의 수 보다 같거나 한자리 아래인 수가 되어야 합니다.
18 이니까 32의 자리는 안됩니다.
8 은 두자리 아래 수니까 안되겠지요
십진수 18
32 16 8 4 2 18 자리는 한번더 자리를 찾아야 하기 때문에 안되겠죠↑
18
↓
=18-32 x 불가
32 16 8 4 2 1↑
18
↓
=18-8=10 x 불가
자 그럼 이런 법칙을 가지고 계산 해 보도록 합니다.
18이니까 32보다는 적고 16보다는 많지요 그럼 먼저 16의 자리수에 18을 대응 시켜 넣습니다.
32 16 8 4 2 1↑
18
↓
=18-16=2 정상
그렇게 되면 2가 남지요 2의 자리수는 십의 자리수에 있는 것을 알수가 있지요 그럼 그자리에 2를 대응 시킵니다.
32 16 8 4 2 1↑
2
↓
=2-2=0
그리고 나머지의 자리는 값이 없으므로 모두0을 대응 시키면 되겠지요 볼까요
32=0 ,16=1, 8=0 ,4=0,2=1,1=0 이것을 자리수 대로 나열 하면 여기서 32라는 자리수는 임의로 부여 한 자리니까 빼고 나열 해 보면 10010이런 이진수로 바꿀수가 있네요 .32 16 8 4 2 1
↑ ↑ ↑ ↑ ↑ ↑
0 18 0 0 2 0
↓
=2-2=0
32 16 8 4 2 1
↑ ↑ ↑ ↑ ↑ ↑
0 18 0 0 2 0
↓ ↓ ↓ ↓ ↓ ↓
x 1 0 0 1 0
↓
=10010
하나더 예를 들어 볼까요
십진수 55를 이진수로 고친다면 어떻게 될까요?
위의 방법 대로 하면 아주 간단히 고칠수가 있겠지요
1,2,4,8,16,32,64,이렇게 해놓고 나중에 거꾸로 나열 해도 되겠네요
55는64보다는 적고 32보다는 크니까 32자리에 1을 대응 시킵니다
그러면55-32=23이 남네요 23은 16보다 크지만 32보다는 작으니까16에 1을 대응 시킵니다.
23-16=7이 남지요 7은 4보다는 크고 8보다 적으니까 4의자리에1을 대응 시킵니다.
그런후에 남는3은 2의자리에 1을 대응 시키고 남는1은 1의 자리에 1을대응 시킨후 대응 하지 못하는 숫자들은 모두 0으로 대응 시키면 되겠지요
계산을 정석대로 한 도표를 만들어 보면 아래 그림처럼 되겠지요
64 32 16 8 4 2 1
↑ ↑ ↑ ↑ ↑ ↑ ↑
0 55 23 0 7 3 1
↓
55-32=23-16=7-4=3-2=1↓ ↓ ↓ ↓ ↓ ↓ ↓
x 1 1 0 1 1 1
↓
=110111
여기서 한가지 기억 해야 할것은 64라는 숫자에 대응 하는 숫자는 없지만 55라는 숫자의 자리를 찾으려 가상으로 부여한 자리이기 때문에 나중에 나열 할때는 빼야 한다는 것 입니다.
32=1, 16=1, 8=0, 4=1, 2=1, 1=1 나열하면 110111 이런 값을 가지게 되는 것입니다.
순수한 숫자로만 볼때는 첫자리 0을 빼는 것이 맞지만 아스키 유니코드 에서는 7자리 수를 다 표기 해야 하기에 첫자리0까지 표기 해야 합니다.
아스키에서는 0110111로 표기 해야 합니다.
자 그럼 왜 여기서 이런 계산을 해야 하냐고 물을수 있을 것 같은데요 앞서 여러번 이야기 드렸듯이 디지털 정보의 전송은 이진수로만 할수 있기 때문 입니다.
다음에 나오는 아스키 코드 도표에는 문자별 고유 숫자를 십진수로 표현 해주고 있는데요
이 십진수를 이진수로 대응 시켜야 인코딩이 완성 되기 때문에 기본 적으로 우리는 이것을 알고 넘어가야 한다는 것입니다.
<아스키 문자 코드 도표>
33-! 34-" 35-# 36-$ 37-% 38-& 39-' 40-( 41-) 42-× 43-+ 44-, 45-- 46-. 47-/ 48-0 49-1 50-2 51-3 52-4 53-5 54-6 55-7 56-8 57-9 58-: 59-; 60-< 61-= 62-> 63-? 64-@ 65-A..~..90-Z 91-[ 92\ 93-] 94-^ 95-- 96` 97-a..~..122-z 123-{ 124-| 125-} 126-~127-del
위의 도표를 보면 문자를 십진수 33~126에 각각 대응 시켜 놓았다 는걸 알수가 있습니다.
아스키(ASCII)는 미국의 정보교환 표준코드를 뜻 하는데요
앞서 우리는 정보 전송의 기본 단위는 8비트가 한묶음인 1바이트라고 배웠습니다.
이것을 이진수로 나타내면 최소 [00000000] 에서 최대 [11111111] 까지 나타 낼수가 있지요
위에서 십진수로 계산하는 방식으로 계산 해보면 [00000000]=0 [11111111]=255 라는 값이 나오게 되니까 256가지 글자까지 대응 할수가 있겠지요
그런데 아스키는 모두 다 대응 하는데 들어가는 가지수가 기본 제어 문자 32개 와 특수문자 ! 부터 del 까지 94개 더해서 127 가지 밖에 안되기 때문에 최대치의 값은 127이 되고 127을 이진으로 나타내 보면 127= [01111111] 이런 값이 나오게 되지요 여기다 blank 하나를 더해 128가지를 나타내고 있습니다.
그래서 아스키는 [00000000] 부터 [01111111] 까지의 이진수로 다 나타 낼수가 있게 되겠지요
그렇다 보니 이진수에서 첫자리에 오는 0 의값은 의미가 없으므로 없애 버리고 7비트 로 도 표시가 가능 하게 되지요
그래서 아스키는 7비트가 한묶음이 되는 1바이트 코드로 이루어지게 되었 답니다.
이것이 유니코드의 기본판이 되는데요 이코드로는 다른 언어 와 8비트를 다 사용 하는 이미지 파일이나 영상파일 소리 파일 같은 파일들은 전송이 안되기 때문에 8비트 바이트를 전송 하기 위해 편집을 해야 하는 경우가 생기는데 이것을 마임<MIME>인코딩 이라 하지요
그런데 아스키 코드를보면 0부터 32까지를 빼고 33부터 시작 하고 있는데요 0부터32는 시스템을 제어 하는코드에 할당을 해 주었기 때문 입니다.
전세계 문자의 가지수는 현재 유니코드 표준에 등재 된것만 100가지 나 된답니다.
유니코드에는 아스키를 가장 우선 배정한후 공용을 제외한 언어들에 순차적으로 배정을 해 주고 있답니다.
우리 한글의 경우 3바이트 구간 유니코드에 배정 되어 있지요
<meta=http-equiv="Content-Type" content="text/html; charset=utf-8"/>
이제 위에 나오는 utf-8 이 가지는 의미를 대충은 알게 되었습니다.
이번 시간은 여기까지 다룹니다.주요 한글 유니코드 도표 바로가기 다음엔 유니코드 도표를 이용해서 utf-8의 한글판의 유니코드 범위와 주요 글자들의 자리수를 알아보고 이진수로 나타내 보는 방법에 대해 알아 보도록 하겠습니다.