환영합니다!
웹 에디터, 어떻게 만들어야 할까 III
이 글은 웹 에디터의 이상적인 방향을 고민하는 글입니다이었습니다. 우둔함에 스스로도 한번에 풀어내지 못하는 내용이라 아래 글을 이해하는게 어렵다면 첫번째, 두번째 글을 참고해주십시오. 오래 묵혀둔 글이라 두서없이 마무리 하게 됐습니다. 부디 용서를….
웹 에디터, 어떻게 만들어야 할까 II
이 글은 웹 에디터의 이상적인 방향을 고민하는 글입니다. 우둔한 머리 때문에 한번에 풀어내지 못하는 내용이라 아래 글을 이해하는게 어렵다면 이전 글을 참고해주십시오. 글이 갈수록 꼬이는데다 주기가 거의 월간이 되는군요. 완결은 제대로 할 수 있을지 걱정입니다.;;
불가능한 작전(mission impossible)?
어떤 콘텐츠를 입력할 수 있게 만들 것인지를 정하는 것부터, 어떤 표현을 할 수 있게 만들어야 하는지까지 웹 에디터 제작의 방향성은 일견 분명해보인다.
필자는 웹 표준을 지지하고, 웹 표준을 지키려 노력하고 그에 맞춰 브라우저나 인터넷 사용 환경이 개선되기를 희망하는 사람이다. 또한 웹 접근성을 높이려는 노력이 보다 많은 사람들에게 정보 사회의 혜택을 줄 수 있는 좋은 방법이라고 믿는 사람이다. 그래서 웹이라는 공간에 올려지는 페이지들은 가능한한 누구나 볼 수 있는 형태로 제작되어야 한다고 생각한다.
웹 에디터가 웹 문서를 어디까지 편집할 수 있게 해줄 것인가 하는 점에서, 웹 표준이나 웹 접근성의 문제는 굉장히 많은 질문을 우리에게 던져준다.
웹 에디터
우리가 예전에 사용했던 워드프로세서들처럼 웹에서 사용할 수 있는 문서 편집기 역시 이미 많이 나와있다. 우리가 에디터라 부르는 이 도구들의 목적은 어떻게 보면 아주 단순하다. 그것은 바로 사용자들이 원하는 웹 콘텐츠를 보다 쉽게 편집할 수 있도록 도와주는 것이다. 웹 에디터는 사용자가 입력 양식을 통해 웹에서 정보를 보다 쉽게 나열할 수 있도록 만들어주는 도구인 것이다.
현재 필자가 사용하고 있는 워드프레스에 탑재된 Rich text editor의 인터페이스. 링크/이미지 삽입처럼 흔히 쓰이는 기능이 있는가하면 글자 크기나 글꼴 변경의 기능이 없고, 문맥상의 강조/삭제를 할 수 있게 하고 있다. 또, 목록이나 인용 등 콘텐츠의 종류를 선택할 수 있도록하고 있는 점이 눈에 띈다.
현재의 웹 에디터들이 가지고 있는 기본적인 기능들은 링크 추가, 글꼴 크기 변경, 전경색/배경색 변경, 텍스트 정렬방식 변경, 이미지와 멀티미디어 삽입 정도라 하겠다. 대부분의 웹 에디터는 일반 사용자라는 불특정 다수가 사용할 수 있도록 제작되고 있으며, 이는 사용자가 웹 페이지를 구성하는 원리가 무엇인지 몰라도 콘텐츠를 웹 상에 표시할 수 있게 만들어주고 있다. 하지만, 그 사용자 중에도 이런 기능으로 충분한 사람이 있는가 하면 아닌 사람도 있을 것이다.
현재까지 여러 사이트에서 제공하고 있는 에디터들은 사이트 자체에 영향을 주지 않으면서, 콘텐츠 영역에 들어갈 내용만을 편집할 수 있게 만들어져 있다. 기능을 풀어놓고 보니 꽤나 난해한 문제다. 특히 문서의 용도나, 목적을 고려했을 때, 발생할 수 있는 경우의 수가 굉장히 다양할 수 있기 때문이다.
웹과 인쇄물이 다른 점
웹은 인쇄물과 다르게 Limitless Canvas 속성이 있다.
웹의 표현부를 다루는 CSS의 특성을 살피다보면 Screen과 Limitless Canvas라는 개념이 등장한다. 웹 페이지는 한 화면상에서만 인지할 수 있는 영역인 Screen과 스크롤바를 움직여서 볼 수 있는 웹 페이지의 나머지 부분을 포함한 전체로써 Canvas라는 영역이 존재한다. 스크롤바는 끝없이 늘어날 수 있으므로 Limitless Canvas라고 하는 것이다. (사람들이 가로 스크롤을 움직이는 것보다 세로 스크롤을 움직이는 쪽을 선호하는 이유는 기존에 인쇄물에서 많은 텍스트를 읽을 경우 세로 방향으로 읽어 내려가는 습관이 있었기 때문이 아닐까 한다.) 확실히 종이와 스크린은 서로 차이가 있다. 단순히, 영역적 한계가 있느냐 없느냐의 문제만이 아니라 다른 페이지로 이동하는 방법의 문제나 삽입 가능한 외부 객체의 차이도 있겠다.
이전 글에서 설명했던 워드프로세서의 궁극적인 목적은 콘텐츠를 인쇄물로 손쉽게 만들어 문서의 형태로 정보를 보존할 수 있게 만드는데 있다. 그러나, 웹이라는 것은 콘텐츠를 보존하고자하는 목적은 비슷하지만, 인쇄물을 제작하는 것보다는 정보 자체의 공유를 원활히 하는데 더 중점을 두고 만들어졌다. 이렇듯 추구하는 방향이 서로 다른 두가지 도구가 할 수 있는 일도 다를 수밖에 없는 것이다.
문서 편집과 웹
어쨌거나 편집이라고 하는 과정은 기본적으로 문서가 가지고 있는 전체적인 내용과 틀을 두고, 더 보기 좋게, 더 가독성 높게 만들어내는 일이다. 그래서 지금까지 컴퓨터에서 사용 가능한 편집 도구들은 일반적으로 보다 자유로운 디자인을 적용할 수 있게 만드는 것을 목표로 삼아왔던 것 같다. 물론, 기본적으로 작업의 효율화, 문서 전체에 일률적으로 적용 가능한 패턴 디자인 등의 기능은 당연히 포함되어 있는 것이고.
여전히 이런 워드프로세서 소프트웨어는 널리 사용되고 있으며 10년 전에 비해서 그 기능도 훨씬 다양해지고 막강해졌다 할 수 있다. 컴퓨팅 환경에서 웹이라는 혁명적인 공간이 등장했음에도 불구하고 말이다.
어쩌면 지난 논쟁의 중심에 놓인 스마트에디터의 표현 방식은 HTML의 태생적 한계를 넘어서 워드프로세서에 가까워지려는 노력의 산물이라고 할 수 있을지도 모르겠다. 쟁점 중 하나였던 글자 크기의 문제는 접근성의 측면이나 코드 표준에는 위배될지라도 사용자가 더 많은 종류의 글자 크기를 입력할 수는 있으니 말이다.
* 다음 편에 계속…
웹 에디터, 어떻게 만들어야 할까 I
몇 주 전부터 쓰기 시작했습니다만, 완전히 정리된 생각이 아니다보니 글을 쓰는데 좀 더딘감이 있습니다. 풀다보니 길어질 듯하여 몇 차례 나누어 정리해보려 합니다. 어떤 에디터가 좋다 나쁘다의 이야기 보다는, 웹 에디터의 이상적인 방향을 고민해보는 글이 될 것입니다.
스마트에디터 논쟁
최근 네이버에서 공개한 스마트에디터. 그에 관한 논쟁이 잠깐이나마 불붙었던 적이 있다. 더 많은 글이 있겠지만 간략하게 정리해보았다.
- 행복한 고니님의 글 :
- MP4/13님 : 네이버 스마트에디터에 대한 딴지
- 와이낫님 :
- 기다림hiphapis님 : 웹에서 Font Size 문제..
- 겐도님 : 글자 크기
- freeism님 : 유니버설 디자인에 대한 단상: 글자 크기
- 소닉님 : 스마트에디터 - NAVER에서 글을 쓴다는 것.
- 제이슨님 : 그 이름은 ‘스마트 에디터™’ 입니다.
- mazefind님 : 인용구…는 세계최초가 아닌 것 같은데;;;
행복한고니님이 하나의 프로젝트를 완수하고 자랑스럽게 포스팅했던 기분에 비하면, 이 글에 달린 일부 댓글이나 관련 포스트들은 몇가지 문제점 때문에 그 노력을 마치 인정하지 못하겠다는 듯 으르렁거리는 느낌이 좀 든다. 쟁점은 여러 가지가 있겠지만, 그 중 대표적인 것이 크로스 브라우징, 크로스 플랫폼의 문제, 사용자가 조절할 수 있는 글자 크기 설정의 문제 정도가 아닐까 한다.
그리 오래된 일이 아니긴 하지만, 지금에 와서 그 에디터에 대해서 왈가왈부하고 싶은 생각은 없다. 필자는 스마트에디터를 아직 써보지도 않았다. 논쟁에 뛰어들기 전에 고민해야할 문제는 스마트에디터가 아니라 웹 에디터라는 도구 자체를 어떻게 만들어야하는가에 대해서 한번 따져보는 일이 아닐까 싶었기 때문이다.
워드패드와 메모장
과거에 타자기를 디지털화한 기계가 등장한 적이 있다. 이 사진은 80년대 말에서 90년대 초반까지 대우에서 생산 판매하던 르모라는 워드프로세서 기기다. 3.5인치 플로피 디스크를 이용하여 문서를 저장하고 로드하는 것이 가능했고, 도트 매트릭스 프린터를 내장하여 타자기처럼 사용할 수도 있었다.
인터넷이 지금처럼 활성화되기 전에도 워드프로세서라는 기계나 프로그램들은 사람들이 문서를 보다 쉽고 편리하게 만들 수 있도록 제공되고 있었다. 물론 여전히 많은 사람들이 사용하고 있는 도구지만, 이런 것들은 기본적으로 웹에서 제공할 수 있는 것과는 근본적으로 다르다고 할 수 있다.
그것은 통칭 워드프로세서라고 불리는 어플리케이션으로 작성하는 문서와 웹 페이지가 기본적으로 다른 종류이기 때문이다. 아마 rtf나 txt라는 확장자를 본 분들이 많을 것이다. 전자가 Rich Text Format(서식있는 텍스트, 이하 RTF) 문서라면, 후자는 Plain text(평범한 텍스트)라고 할 수 있다. 이것이 어떤 차이를 가지는가 하면, RTF 쪽은 문서의 내용과 함께 파일에 문서의 서식 관련 정보를 함께 저장한다. 그러나 후자는 문서의 구조와 내용만을 저장하며, 서식과 관련된 내용은 아예 포함하지 않는 방식으로 작성된다.
워드패드와 메모장의 서식 메뉴
쉬운 예로, Windows의 기본 어플리케이션인 Word Pad는 RTF를, Note Pad(메모장)는 Plain text만을 만들 수 있다. 메모장을 이용해서 오른쪽 정렬을 한다고하면, 내용이 짧은 줄 앞에 미친 듯이 스페이스를 입력해야할 것이다. 그러나 워드패드는 글꼴이나 정렬 방식, 간단한 부호에 대한 스타일을 정의할 수 있도록 만들어져있다. 참고로, 웹 페이지를 작성할 때 사용하는 HTML은 Plain text 쪽이기 때문에 서식 표현을 위해서 CSS라는 별도의 언어를 사용하고, 그 양식 제어를 위해서 Javascript를 이용하도록 만들어져 있다.
10년 전 이야기
필자가 사용했던 한글 3.0의 도스버전 설치 화면
이미 10년쯤 전의 이야기지만 필자의 경우에는 과거에 한글3.0을 이용해서 다양한 인쇄물을 제작했던 경험이 있는데, 명함부터 논문, 자료집, 포스터 등 꽤 많은 것들을 하나의 프로그램으로 만들 수 있었다. 물론, 그 프로그램을 사용하면서 원하는 모양을 만드려할 때 느꼈던 한계도 많았지만, 필자에게 한글3.0은 단순한 형태의 문서를 기록하기 위해 사용하던 프로그램이 아니라 아주 다양한 인쇄물 편집을 할 수 있게 해주는 유용한 도구였다.그러나 필자에게 유용했던 한글3.0을 당시 대부분의 사람들은 그다지 신통찮은 툴 정도로 여겼던 것 같다. Mac을 이용한 만큼의 디자인은 할 수 없는 - 여전히 이런 류의 편견은 있다 - 툴이었으며, 글꼴을 바꾸고 정렬을 좀 쉽게 하며, 쪽번호를 넣어서 페이지를 알 수 있게 해주는 정도의 문서 편집기였다. 그러나, 한글3.0을 잘 사용하는 사람들이라면, 제목에 보이지 않는 표식을 달아 자동으로 목차를 생성한다거나, 짝-홀수 페이지에 따라 다른 머릿말을 넣어 양면 인쇄용 편집을 한다거나, 나름 쓸만한 기능이 많은 도구였다.
당시에는 필자 역시 미처 생각해보지 못했지만, 지금 생각해보면 이런 인식의 차이에는 분명히 태도의 차이가 있었다고 본다. 워드프로세스 프로그램을 정보 보존을 위한 도구로 생각하는지, 편집을 위한 도구로 생각하는지의 문제 말이다. 물론, 프로그램 자체는 두가지의 목적을 이 다 달성시켜줄 수 있다. 하지만, 사용자는 스스로가 할 수 있는 것만 사용하는 법이더라.
* 다음 편에 계속 -
RSS
