구조적, 양식적, 서술적 마크업

HTML은 문서의 구조를 정의하기 위해 태어났지만, 이후 사용자와 브라우저 제작사의 요청에 의해 문서의 표현도 정의하게 되었다. 그 결과, HTML 태그들은 세종류로 나뉘어지게 되었다. 구조적 마크업(Structual Markup) : 문서의 구조를 규정한다. 문단 p 와 제목글h1 ~6 등이 여기에속한다. 양식적 마크업(Stylistic Markup) : 상당수의 HTML 태그들이 표현하는 스타일을 징정하기 위한 것들이다. 대표적인 것이 b (굵은 글씨체)이다. 이런 […]

브라우저 전쟁의 유산-1

우리가 지난 몇 년간 경험한 폭발적인 성장은 표준의 결정 과정을 어렵게 만들었을 뿐만 아니라, 또한 그 규칙들을 완전히 바꾸어 놓았다. 웹 소프트웨어를 개발하는 회사들은 개발과정에서 너무나 중요한 기술적 분석을 빼먹으면서까지, 아직 덜 익은 기술을 발표해야만 했다. 그러한 변화의 결과는 고통스럽도록 뚜렷하게 나타났다. 정의된 표준에 대한 ‘강화된 기능’들은 형편없이 계획되었으며, 쏟아져 나오는 수백만의 소프트웨어 카피에 이식되지 […]

CSS로 유연한 디자인 만들기

우리는 옛부터 전해지는 타이포그래피의 금언에서부터 시작해야 할 것이다. 단락에서 가장 읽기 좋은 라인의 길이는 ‘알파벳 한 세타 길이의 하나 반’이다. 이것은 최대의 가독성을 위해서 문단의 각 라인은 약 문자 40개 정도의 길이가 되어야 함을 의미한다. 이것이 어떻게 유동적 페이지라는 우리의 목표와 상응될 수 있을까? 만일 우리가 화면을 가득 채우도록 디자인된 페이지를 만든다면 라인 길이를 제어할 […]

한국에서도 2단계 도메인체계를..

정보통신부는 2008년까지 564억원의 예산을 지원하여 2단계 인터넷주소 `***.kr`을 도입하고, 도메인 등록수수료도 단계적으로 인하할 계획이라고 24일 밝혔다. (정보통신부 보도자료 원문) 2단계 인터넷주소라면, 미국(*.us) 독일(*.de) 일본(*.jp) 등 많은 국가에서 이미 사용하고 있는 주소체계인데, 2008년까지 도입한다니.. 너무 늦는 것 아닌가? 현재의 3단계 도메인체계와 별도로 2단계 도메인체계를 도입하는 방안을 추진한다고 하는데, *.go.kr의 도메인을 *.kr로 먼저 바꾼 다음에나 일반인에게 공개할 […]

유연해지기

당신은 인터넷 어디서든 이러한 제어권의 결핍으로 고생하고 있는 디자이너들을 볼 수 있다. 당신은 웹 서핑 도중 페이지는 나오지 않고 다음과 같은 지시문장만 표시되는 화면을 얼마나 자주 맞닥뜨렸는가? “이 사이트는 브라우저 X의 N버전, 1024×768 혹은 그 이상의 해상도에서 가장 잘 보입니다.” 이 “~에서 가장 잘 보입니다” 정신은 무척 느리게 진행되고 있기는 하지만 고맙게도 과거의 것이 되어가고 […]

규칙에 기반한 디자인

아무도 자신의 웹이 다른 사람의 화면에서 어떻게 보여질지 예측할 수 없다. 그렇다. 이 말은 진실이다. 여러분이 다른 메체의 디자인에서는 아무리 많은 제어권을 갖고 있었다 하더라도, 웹에서 성공하기를 바란다면 당신은 그 중 몇 가지를 포기해야만 한다. 출판물 디자인과 비교해보자. 전통적인 출판 디자이너들은 결과물의 모든 측면에 대해 완벽한 통제권을 가지고 있다. 그들은 잉크, 종이, 인쇄방법, 이미지의 해상도, […]

웹의 탄생

1989년으로 건너가보자. 당시 유럽 분자물리학 연구소에 근무하고 있던 팀 버너스 리(Tim Berners-Lee)는 단순한 하이퍼텍스트 시스템을 제안했다. 그는 여기저기 흩어져 있는 물리학자들의 자료를 연결하려는 생각에서 정보를 링크하는 기본 시스템을 개발했는데, 그것은 세 부분으로 이뤄져 있었다. 모든 요소에 고유한 주소를 할당할 수 있는 방법 (예 : URL) 링크된 정보들을 전송하는 규약 (예 : HTTP) 정보를 인코딩하는 언어 […]

전자텍스트의 역사

전통적으로 인쇄된 원고를 받아서 문법이나 문서포맷 등을 검토할 때 편집자는 ‘교정부호(markup)’을 사용하곤 했다. 예를 들어 20c 초의 신문사에서는 편집자가 특정한 기사 여백에 부호들을 기입해 넣어서 기사의 시각적 표현양식을 지시했다. 이 부호들은 조판책임자(윤전기에 들어가기 직전에 최종 원고를 활판인쇄로 짜는 사람)에게 구체적인 작업지시를 전달하는 암호였다. 이를테면 머릿기사 제목에는 속기부호로 특정한 서체를 지정하고는 했는데, 편집자가 페이지의 첫 줄에서 […]

휴가 때 읽을 책 – 웹디자인 마인드

고참 강사들 서열에 밀려 휴가일이 3일이나 앞당겨져서 잡혔다. 휴가기간이 중요하지, 휴가날짜가 중요하진 않았기 때문에 별로 게으치 않다. 오늘은 이번 휴가 때 읽을 책을 고르기 위해서 오랫만에 모교 도서관에 들렸다. 시내서점보다 최근 책들은 찾기 힘들지만, 필요한 책들은 대부분 있는 편이기 때문에 나는 대학 도서관을 자주 찾는 편이다. 특히 몇년전부터 학내에 무선랜이 설치되면서, 노트북을 자유롭게 이용할 수 […]

이런 황당한 시츄에이션이..

CSS 2.1는 Pseudo-Class Selectors(사이비 클래스 선택자)를 지원하고 있다. 대표적으로 링크에 자주 사용하는 :link, :hover, :visited 가 있으며, 인풋에 사용하는 :focus와 :active 가 있다. 이 녀석들을 잘 활용하면 다이내믹한 사이트를 쉽게 만들 수 있지만, 현재 IE(버전 6 이하)에서는 a(링크에 사용하는 놈)에서만 이녀석들을 지원하고 있기에 현실적으로 사용하기 어렵다. 이중에서 가장 많이 사용하는 사이비 클래스 선택자가 hover인데, 현재로써는 […]