인터넷과 HTML

‹ 두 가지 코딩 ›

코딩에는 두 가지 종류의 코딩이 있다. 하나는 일반적으로 ‘프로그래밍’이라 불리는 컴퓨터에게 조건, 반복을 통해 일을 시키는 코딩이다. 게임, 앱, 소프트웨어 등 모든 행동을 수반하는 프로그램들이 이에 해당하며, 디자이너 보다는 컴퓨터공학과, 전산학과, 수학과 학생들에게 적합하다. C, C++, Objective-C, 파이썬, 자바, 자바스크립트, 프로세싱, 포트란 등 대부분의 프로그래밍 언어들이 이에 속한다.

본 수업에서 다루는 코딩은 웹이라는 매체를 통해 하이퍼텍스트 정보들을 시각화하고 스타일링하는 HTML/CSS라는 언어다. 정보 그래픽 디자이너가 하는 직무를 그대로 종이에서 가상의 디지털 스크린으로 옮겨 놓은 것과 같다. 따라서, 글자를 다루는 섬세함이 필요하며, 타이포그래피에서 사용하는 대부분의 용어를 사용하고 있기 때문에 디자이너에게 절대적으로 유리하다.

디지털 퍼블리싱 수업을 통해서 우리는 콘텐츠를 웹을 통해 공개하고 공유하며 그를 통해서 결과적으로 나 자신을 알리는 과정을 실습할 것이다. 이러한 기술은 본인의 회사를 창업할 경우, 프리랜서로 활동할 경우, 스타트업의 디자이너일 경우, 일반 회사의 인하우스 디자이너일 경우 즉 ‘스타일링’에 목숨거는 곳이 아니라면 대부분의 경우에 실용적이다. 어떠한 곳에서건 아주 간단한 홍보성 페이지를 개발자에게 맡기지 않고 자체적으로 만들어보자는 기획은 비일비재하다.

‹ 인터넷이 작동하는 원리 ›

사람들이 웹브라우저의 링크를 클릭하는 순간, 브라우저는 해당 링크에 적힌 주소를 찾아간다. 그 주소는 ‘http://www.naver.com’과 같은 형식이다. 여기서 ‘naver.com‘를 ‘도메인 네임(domain name)’이라고 부른다. 머리가 아플 수도 있지만, 뉴스 기사에 종종 등장하는 ip 주소에 대해서도 이야기하고 넘어가자. 원래, 컴퓨터의 주소는 ‘169.254.0.1’와 같이 12자리 숫자로 되어 있고 이것을 ‘ip 주소’라고 한다. 그래서 사실 브라우저의 주소창에 숫자를 입력해도 우리는 같은 페이지로 이동할 수 있다. 그런데, 사람들이 간판은 알지언정 주소까지 외우는 일은 드물기 때문에, 간판 격에 해당하는 ‘도메인 네임’을 사용하게 된 것이다.

그렇다면 그 도메인 네임을 따라간 주소의 끝에는 무엇이 있을까? 거기엔 컴퓨터—서버라 부르는—가 있고, 웹사이트를 위해 누구나 둘러볼 수 있는 폴더가 있다. 그 폴더의 이름은 공히 ‘public_html’이다. 이 폴더안에 웹사이트를 구성하는 다양한 파일들이 들어있어서 브라우저는 이 파일들을 읽고 형형색색의 웹사이트를 그려내는 것이다. 특정 파일을 지정하지 않고 사이트에 들리면 브라우저는 자동적으로 ‘public_html’폴더의 ‘index.html’파일을 우선적으로 읽는다(책을 펼치면 목차가 먼저 나오듯이). 따라서 웹사이트를 위해 가장 먼저 해야 할 일은‘index.html’파일을 작성하는 것이다.

‹ 웹 호스팅 ›

앞서 내용을 바탕으로 인터넷에 콘텐츠를 올리고 퍼블리싱하려면 인터넷에 연결된 폴더가 필요하다는 것을 알았다. 월세방을 구하는 것과 마찬가지로 사람들은 일반적으로 매월 일정 비용을 지불하고 특정 업체의 자투리 공간을 빌리는데, 이 ‘인터넷 공간 임대’를 웹 호스팅(web hosting)이라고 한다. 간판은 둘째 문제다. 우선 방을 구하는 것이 먼저다. 먼저 방을 구하고 장사가 된다 싶으면 그때 가서 간판을 달기를 권한다.

‹ HTML ›

Hyper Text Markup Language다. ‘하이퍼텍스트(hyper-text)’란 문자를 넘어 소리, 영상, 이미지 등 모든 유형의 디지털 데이터를 의미한다. 즉 HTML은 ‘하이퍼텍스트를 “마크-업”하는 언어’라고 할 수 있겠다. 엥 마크-업(markup)이 뭐냐고? 책 읽다가 중요한 내용엔 밑줄을 긋지 않나요? 자, 그 행위랑 본질적으로 똑같다. 내용이 어떠한 종류의 정보에 해당하는지 ‘표시’하는 것이 HTML의 가장 중요한 두 가지 임무 중 하나다. 다른 하나는 마크-업을 통해서 요소들의 포함 관계를 나타내는 것이다. 우리는 이미 초등학교 국어시간과 수학시간에 이 두 가지를 모두 배웠다. 쌍따옴표를 사용해 대화를 표시하는 것은 국어시간에 배운 내용이고, 괄호를 사용해 수식의 포함 관계를 파악하는 것은 수학시간에 배운 내용이다.