2007년 08월 22일
테이블 레이아웃을 쓰는 게 뭐가 문제야?
1.
디자이너에게서 이런 질문을 받았다.
여러 가지가 있겠다. 테이블 태그 자체가 레이아웃용이 아니고 속도도 느리다. 결정적으로는 생산성 자체가 몹시 떨어지는 구조를 낳고 마니 유지 보수 측면에서는 그야말로 최악이다. CSS로 짠 구조를 보면 데이터 영역과 디자인 영역이 어떻게 분리가 되는지 명확해진다. 지금 작업하는 녀석들도 소스를 보면 데이터 영역이 참으로 시원시원한 게 가슴이 싸-하다.
…라고 떠들어 봐야 소용 없는 것이, 결정적으로 아무리 이야기해봐야 납득을 못하시잖아요. (……) 소스를 볼 생각도 없으실 테니 결국 '똑같이 만들어야 한다'만이 관건이 되는 거고.
2.
디자인과 콘텐트는 상충하는 개념이 아니다. 다만 콘텐트에 어울리는 디자인이 뭔지를 모르면 담길 콘텐트가 확실하게 의미를 잃는다. 그리고 우리는 내용물로 외피를 두드러지게 하기보다 외피로 내용물을 감추는 데에 익숙하다.
한국의 인터넷이 외양 과잉인 까닭이 여기에 있는 걸 테지. 결과적으로 한국의 웹사이트 태반이 - 내가 저질렀던 과오까지 포함해서 - 엉망인 건 단순히 웹표준을 준수하지 않아서가 아니라 기본적으로 무엇이 중요하고 무엇을 어떻게 드러내야 하는지에 관한 고민과 철학이 이만큼도 들어있지 않기 때문이다. 그 앞에서 IE전용이냐 아니냐는 오히려 부차 문제에 가깝다. 그러니 숫자 놀음, 꽉 짜인 화면 구성에 천착할 수밖에 없는 거지. 대세를 따르라? 한국에선 다들 이리 한다? 모르는 사람은 모르던 대로 살라 할 수밖에 없겠으나 알면 참 부끄러울 수밖에 없는 문제다.
3.
사실 디자이너는 창작 계열, 그림 그리는 사람에 가깝지 기술자가 아니다. 하지만 만화 그리는 사람이 용지 규격이나 출력 등에 관해 모르면 톤 하나 쓰는 것에서도 실력차를 드러내고 말듯이 디자이너가 구현될 화폭을 모르면 시행착오는 쌓이고 쌓여 언젠가 대형 사고로 이어진다. 콘텐트를 모르는 개발자만큼이나 무서운 게 기술을 모르는 창작자 아닐까.
양쪽을 다 진행하는 나로서는 그저 그 사이에서 괴로울 따름이다. 목구멍 이만치까지 덩어리가 턱 막혀오는 느낌마저 든다. 생각이 많고 말이 많은 내 죄지. 누굴 탓하겠냐만.
4.
테이블 레이아웃과 CSS 레이아웃의 차이를 굳이 비유를 하자면 - 레고와 찰흙, 퍼즐 맞추기와 화폭에 그림 그리기. 이 차이를 납득할 수 없다면 설명 따위는 불필요하다.
................
여담이지만.
http://www.gucci.com/
플래쉬 안 쓰고 CSS레이아웃과 AJAX 만으로 이런 걸 만드는 회사도 있다. 무려 구찌. 물론 외주 줬겠지만 이런 걸 내놓는 회사에 맡길 줄 안다는 것만으로도 클라이언트는 칭찬 받을 만 하다. 효과에만 우와 소리 내지 말고 기왕이면 소스를 보고 구성을 보고 방식을 보고 모양을 보시라. 난 효과를 너무 내는 것도 안 좋아하지만 CSS기반 디자인이 무슨 마이너한 데에서나 쓰이는 것인 줄 아는 이들이 너무 많아서 그냥 던져둔다.
개인적으론 가로스크롤이 기분 안 나쁠 수도 있다는 사실 자체가 매우 놀라웠다. (…) 역시 발상의 전환이 필요해.
................
어쩌다보니 이게 성지순례용 글로 등극한 모양인데-
무슨 "네가 우릴 욕했냐?" 같은 반응들이니, 이 바닥 사람들도 어지간히 힘들긴 힘든갑다. 하긴, 나도 글 마감할 때와 담당 기자짓할 때 위치와 태도가 다르니까 이런 상황을 이해는 하지만.
그래도 말이지. 이게 무슨 니편 내편 편먹어 싸우자는 소리가 아니라 '애초에 짤 때 서로 좀 더 알고 하면 리스크가 좀 덜하지 않을까? 응?'으로는 안 읽히나? 정녕 안 읽히면 내 글의 퀄리티 문제겠지만 애초에 싸우자고 쓴 글도 아닌 걸 언제적 마오 할아버지를 생령으로 달고 달려온 사람이 있질 않나 글 주제와는 상관도 없는 인터넷 사회학 개론을 읊는 사람이 있질 않나. 그저 허리 잡고 웃을 뿐이다. 다이어트는 잘 되겠구만.
굳이 싸잡아 까야 한다고 하면 디자이너가 아니라 웹 환경 자체겠고, 그 오류와 조장하는 모든 사람과 모든 상황이겠지. IE 개발자는 잡아다가 목을 비틀고 싶긴 하다. 좀 정상적으로 해석하는 게 없으니 원. 여하간- 어떤 한 부류를 까자고 하는 건 아니다. 그러면 나는 내 발로 내 목을 걷어차야 하는데? 왜 우리는 뭔 말을 할 때 소속이나 바닥을 밝히고 들어가야 하는 건지 원. (…) 나는 그쪽이기도 하고 이쪽이기도 하며 저쪽이기도 하다. 그래서 더 아쉬운 거다.
여하간 성지고 뭐고, 무슨 디자이너만 죽자고 욕하자는 게 아니니까 그런 생각으로 달려왔다면 좀 식히고. 용개 같은 사람은 이제 다른 데에서 다른 사람 붙잡고 놀고. 연식 따질 사람 있다면 나도 제법 낡아빠졌으니까 그걸로 걸고 넘어지진 말자고 미리 말해둔다. 아예 8비트 컴퓨터니 모자이크니 언제부터 만졌다고부터 읊어야 하나. 안 그래도 징그러운데 더 징그럽다.
결국 하고픈 이야기는 이거다.
징그러워 죽겠다. 일하기 싫다. 젠장-.
이런 글에 열 올리는 사람들이 더 불쌍하지만. 나도 꽤 불쌍하구나.
정의의 사도들은 오늘도 눈에 불을 켜고, 3류 악당은 투덜대며 잡문을 남긴다.
뭐가 정의인지는 알 것도 없고.
디자이너에게서 이런 질문을 받았다.
여러 가지가 있겠다. 테이블 태그 자체가 레이아웃용이 아니고 속도도 느리다. 결정적으로는 생산성 자체가 몹시 떨어지는 구조를 낳고 마니 유지 보수 측면에서는 그야말로 최악이다. CSS로 짠 구조를 보면 데이터 영역과 디자인 영역이 어떻게 분리가 되는지 명확해진다. 지금 작업하는 녀석들도 소스를 보면 데이터 영역이 참으로 시원시원한 게 가슴이 싸-하다.
…라고 떠들어 봐야 소용 없는 것이, 결정적으로 아무리 이야기해봐야 납득을 못하시잖아요. (……) 소스를 볼 생각도 없으실 테니 결국 '똑같이 만들어야 한다'만이 관건이 되는 거고.
2.
디자인과 콘텐트는 상충하는 개념이 아니다. 다만 콘텐트에 어울리는 디자인이 뭔지를 모르면 담길 콘텐트가 확실하게 의미를 잃는다. 그리고 우리는 내용물로 외피를 두드러지게 하기보다 외피로 내용물을 감추는 데에 익숙하다.
한국의 인터넷이 외양 과잉인 까닭이 여기에 있는 걸 테지. 결과적으로 한국의 웹사이트 태반이 - 내가 저질렀던 과오까지 포함해서 - 엉망인 건 단순히 웹표준을 준수하지 않아서가 아니라 기본적으로 무엇이 중요하고 무엇을 어떻게 드러내야 하는지에 관한 고민과 철학이 이만큼도 들어있지 않기 때문이다. 그 앞에서 IE전용이냐 아니냐는 오히려 부차 문제에 가깝다. 그러니 숫자 놀음, 꽉 짜인 화면 구성에 천착할 수밖에 없는 거지. 대세를 따르라? 한국에선 다들 이리 한다? 모르는 사람은 모르던 대로 살라 할 수밖에 없겠으나 알면 참 부끄러울 수밖에 없는 문제다.
3.
사실 디자이너는 창작 계열, 그림 그리는 사람에 가깝지 기술자가 아니다. 하지만 만화 그리는 사람이 용지 규격이나 출력 등에 관해 모르면 톤 하나 쓰는 것에서도 실력차를 드러내고 말듯이 디자이너가 구현될 화폭을 모르면 시행착오는 쌓이고 쌓여 언젠가 대형 사고로 이어진다. 콘텐트를 모르는 개발자만큼이나 무서운 게 기술을 모르는 창작자 아닐까.
양쪽을 다 진행하는 나로서는 그저 그 사이에서 괴로울 따름이다. 목구멍 이만치까지 덩어리가 턱 막혀오는 느낌마저 든다. 생각이 많고 말이 많은 내 죄지. 누굴 탓하겠냐만.
4.
테이블 레이아웃과 CSS 레이아웃의 차이를 굳이 비유를 하자면 - 레고와 찰흙, 퍼즐 맞추기와 화폭에 그림 그리기. 이 차이를 납득할 수 없다면 설명 따위는 불필요하다.
................
여담이지만.
http://www.gucci.com/
플래쉬 안 쓰고 CSS레이아웃과 AJAX 만으로 이런 걸 만드는 회사도 있다. 무려 구찌. 물론 외주 줬겠지만 이런 걸 내놓는 회사에 맡길 줄 안다는 것만으로도 클라이언트는 칭찬 받을 만 하다. 효과에만 우와 소리 내지 말고 기왕이면 소스를 보고 구성을 보고 방식을 보고 모양을 보시라. 난 효과를 너무 내는 것도 안 좋아하지만 CSS기반 디자인이 무슨 마이너한 데에서나 쓰이는 것인 줄 아는 이들이 너무 많아서 그냥 던져둔다.
개인적으론 가로스크롤이 기분 안 나쁠 수도 있다는 사실 자체가 매우 놀라웠다. (…) 역시 발상의 전환이 필요해.
................
어쩌다보니 이게 성지순례용 글로 등극한 모양인데-
무슨 "네가 우릴 욕했냐?" 같은 반응들이니, 이 바닥 사람들도 어지간히 힘들긴 힘든갑다. 하긴, 나도 글 마감할 때와 담당 기자짓할 때 위치와 태도가 다르니까 이런 상황을 이해는 하지만.
그래도 말이지. 이게 무슨 니편 내편 편먹어 싸우자는 소리가 아니라 '애초에 짤 때 서로 좀 더 알고 하면 리스크가 좀 덜하지 않을까? 응?'으로는 안 읽히나? 정녕 안 읽히면 내 글의 퀄리티 문제겠지만 애초에 싸우자고 쓴 글도 아닌 걸 언제적 마오 할아버지를 생령으로 달고 달려온 사람이 있질 않나 글 주제와는 상관도 없는 인터넷 사회학 개론을 읊는 사람이 있질 않나. 그저 허리 잡고 웃을 뿐이다. 다이어트는 잘 되겠구만.
굳이 싸잡아 까야 한다고 하면 디자이너가 아니라 웹 환경 자체겠고, 그 오류와 조장하는 모든 사람과 모든 상황이겠지. IE 개발자는 잡아다가 목을 비틀고 싶긴 하다. 좀 정상적으로 해석하는 게 없으니 원. 여하간- 어떤 한 부류를 까자고 하는 건 아니다. 그러면 나는 내 발로 내 목을 걷어차야 하는데? 왜 우리는 뭔 말을 할 때 소속이나 바닥을 밝히고 들어가야 하는 건지 원. (…) 나는 그쪽이기도 하고 이쪽이기도 하며 저쪽이기도 하다. 그래서 더 아쉬운 거다.
여하간 성지고 뭐고, 무슨 디자이너만 죽자고 욕하자는 게 아니니까 그런 생각으로 달려왔다면 좀 식히고. 용개 같은 사람은 이제 다른 데에서 다른 사람 붙잡고 놀고. 연식 따질 사람 있다면 나도 제법 낡아빠졌으니까 그걸로 걸고 넘어지진 말자고 미리 말해둔다. 아예 8비트 컴퓨터니 모자이크니 언제부터 만졌다고부터 읊어야 하나. 안 그래도 징그러운데 더 징그럽다.
결국 하고픈 이야기는 이거다.
징그러워 죽겠다. 일하기 싫다. 젠장-.
이런 글에 열 올리는 사람들이 더 불쌍하지만. 나도 꽤 불쌍하구나.
정의의 사도들은 오늘도 눈에 불을 켜고, 3류 악당은 투덜대며 잡문을 남긴다.
뭐가 정의인지는 알 것도 없고.
# by | 2007/08/22 00:25 | 셈틀놀이 | 트랙백 | 덧글(17)
☞ 내 이글루에 이 글과 관련된 글 쓰기 (트랙백 보내기) [도움말]
발생시키는 문제중의 하나가 아닐까 생각합니다.
코더에 꽤 치우친 글을 쓰셨는데 글 쓴 분처럼 디자인, Flash, PHP, 표준에 맞춘 HTML 및 CSS코딩 모두에 발을 둔 입장으로, 저는 디자이너의 입장에서 이야기하고 싶습니다.
테이블 레이아웃의 단점으로 주로 드는 것이 느린 속도와 용량인데 벌써 인터넷이 활성화된지 10년 넘었습니다. 소싯적에는 물론 테이블 위주의 레이아웃을 사용해왔고 수십개의 겹 테이블이 들어가있는 사이트도 별 불편없이 읽어왔으며 Bandwidth의 측면에서도 56k모뎀으로 서핑이 가능했던 방식을 왜 이제와서 속도의 이유로 공격을 하는지 엷은 웃음이 지워집니다.
차라리 역시 케케묵은 논쟁이었지만 메모리관리가 어설퍼 연산을 많이 잡아먹는 Flash를 웹 사이트에 쓰지 말자고 주장하는 것이 곱절은 설득력 있어 보이네요:(
그럼 div나 ol ul li span 등을 이용한 레이아웃의 장점은 큰 틀의 배치와 유지, 보수, 재활용의 편리함인데 그거 누구 좋으라고 하는건가요?
유저? 디자이너?
아니죠. 바로 코더들이죠:) 깨끗하게 정렬된 코드를 바라보면서 뿌듯해하시는 분들 말이에요:)
그런데 유저들은 오른쪽 버튼 누르고 소스보기 하는거 아니라는거 잘 알잖아요? 구조 복잡하면 욕하나요? 객채화 안되어있으면 욕하나요?
그 사람들은 어떻게든 의도한 대로 돌아가기만 하면 장땡이라구요. 내부는 상관없다는걸 잊지 않았으면 좋겠어요.
설마 IE 이외의 브라우저에서 보이지 않을 거라고 생각하시나요? 다 잘 보여용. 불여우든 모질라든 오페라든. 테이블 태그가 문제는 아니거든요.
또 당신은 테이블 레이아웃을 쓰는 디자이너를 화폭의 규격도 모르는 화가에 비교했는데 글쎄요.
디자이너의 본 화폭은 포토샵 workspace와 캔버스이지 html코딩으로 나타나는 페이지가 아니거든요:(
오히려 html코딩으로 나타나는 페이지는 당신 화폭이예요. 거기다 디자이너의 화폭을 그대로 옮겨놓고 의도한대로 작동하게 하는게 제 1 목표죠.
그걸 못하겠다고 하는 건 디자이너 입장에서는 어떤 생각이 들겠어요? 당신의 능력부족이라고 생각하는게 어쩌면 당연하겠죠.
대체 어떤 대답을 기대했는지 궁금해집니다:(
그대로 구현을 하면서도 객채화를 하고, 유지 보수가 편한 코드를 짜고, 웹 표준을 지키도록 만드는 것이 다른 누구도 아닌 당신의 일인데 말이죠:(
시간 좀 들이면 디자이너들 던져주는 거 웹표준 안어기고 충분히 짤 수 있잖아요. 하하, 뭐 테이블 코드 한 줄 안쓰고 하려면 좀 힘들긴 하겠네요.
그런데 언제부터 테이블 태그가 표준이 아니었는지는 모르겠네요?_?
코딩은 논리적인 작업이고 디자인은 비논리적인 작업이에요. 코딩의 잣대에 맞추어 디자인을 하면 창의성도 없어요.
div는 찰흙이며 그림을 자유롭게 배치하는 것이라고 했는데 디자이너들은 이미 포토샵 캔버스에서 자유롭게 배치를 해서 디자인했다는 것을 아셔야됩니다.
그렇게 생각하는 것은 바로 코더입장이고, 거기서 트러블이 나오는 것은 디자이너로서는 할 말이 없는 것이겠죠.
만약 디자이너가 테이블 태그까지 자서 만들어주었고 마음에 안들면 div레이아웃으로 옮기면 됩니다. 그거 디자이너가 할 수 없는건 아시죠?
그거 할 수 있다고 말하시는 건 당신같은 분이 필요없다는 걸 의미하니까 설마 그렇게 말하시리라고 생각하진 않아요.
아, 이렇게 말하면 제가 테이블레이아웃으로 작업하는 것처럼 생각할지 모르지만 물론 저는 div로 갈아탄지 오래입니다.
그런데 위에 말했던 것 처럼 테이블 쓴다고 뭐라 할 이유 없다고 생각하거든요. Table 레이아웃이 나쁜게 아니라 div가 좋은 거라고 봐야 옳겠죠:)
짤막한 단막극 하나 남기고 갑니다.
김 코더가 답답한 듯 가슴을 두드렸다.
"아 짜증나네.. 뭘 모르니까 그런 소릴 하지.. 테이블 레이아웃 하면 느리고, 코드 용량 커지고, 나중에 고칠때 엿 같고, 객채화도 잘 안된다고요.."
박 디자이너는 여전히 팔짱을 긴 채 눈을 가늘게 뜬다.
"그럼 10년 전에 인터넷 하던 사람들은 테이블 땜에 느려서 다 수퍼컴퓨터라도 썼나보죠? 난 왜 잘 썼던 것 같지.."
"이 사람이 정말.. 아, 그거 고치는게 그렇게 힘들어요?"
김 디자이너가 역정을 내자, 박 디자이너가 다시 웃음지었다.
"이봐요. 김 코더님. 디자인은 코딩처럼 논리적인 작업이 아니거든요? 조금만 형태를 바꿔도 느낌이 확 변한단 말이에요."
".."
"사실 코드 고치기 쉽게 만드는거야 제 알바 아니죠. 당신 일이잖아요. 당신 능력에 달린 일이죠. 뭐, 사실 저는 테이블 태그 안쓰더라도 제 초안이랑 똑같이 만들어주기만 하면 상관없다구요."
".."
"테이블 태그가 표준에 어긋나는 태그도 아니고, 브라우저에서 깨지는 것도 아니고, 유저가 쓰는데에 불편함이 있는 것도 아니에요. 알겠어요? 당신 빼곤 누구도 속은 신경 쓰지 않아요."
"..쳇."
"흰 고양이든 검은 고양이든 쥐를 잘 잡는 고양이가 좋은 고양이죠."
게다가 IE의 고질적이고 악질적인 렌더링 버그가 단순히 CSS를 선택해서 생기는 문제도 아닐진대, 그걸로 골머리 썩다가 투덜대놨더니만 그걸 또 비웃어.
웃자고 좋은 말씀 써 놓으신 걸로 알겠습니다. 덕분에 좀 웃었습니다. 예의는 없지만 연식은 좀 돼 보이는 분.
근 데 두 가지만 물어봅시다. 블로그가 뭐의 약자인줄은 아시나요? 개인 홈페이지의 '개인'이 뭘 뜻하는 건지는 아시나요? 뭘 그리 어렵게 기준을 정하려고 합니까. 기본적으로 '개인 공간'이나 '개인 홈페이지'를 표방하는 공간이라면 거긴 개인 공간입니다. 무슨 허상이고 실상이고 얼어죽을. 게다가 그 공간은 나 떠들테니 들어라-가 맞아요. 그래서 그게 나쁩니까? 거기다 대고 인터넷이 개인 공간이 어딨냐 뭐냐 하는 게 더 웃깁니다. 제주도 예를 들자면, 거기선 대문도 없이 나무 세 개 걸어놓지만 그래도 그 돌담 안에 있는 건 '집'이랍니다. 열려 있어도 집이라고요. 아시겠어요?
그러니 떠들고 있는 데 말을 걸려면, 다짜고짜 멱살 잡는 짓은 하지 말아야지. 그러면 당장 쫓겨날 수밖에. 기분 나쁘면 반박을 하든가, 트랙백을 걸든가 그도저도 아니면 찌그러져 있으면 됩니다. 그러지도 못하는 사람이 무려 인터넷에 개인 공간이 있는가 없는가를 따지고 들면 제가 할 말이라곤 이거 뿐이죠. 그럼 없어? 있지 당연히.
쓸데없는 데에 개론적인 부분을 들고 발을 걸려 들지 말길 바랍니다. 재미 없습니다.
사람들이 각자의 이야기를 이런 공간에 할 수 있는 까닭은 서로가 소통 창구를 연 상태에서 양해를 하고 있기 때문 아닙니까. 그러니 초장부터 '당신' 운운하거나 반말 찍찍하고 있는 이런 '소통이 아니라 싸우자는' 경우를 보면 대화가 될 리가 없는 거고 말입니다. 이런 종류 이야기를 하면서 기초 중의 기초도 무시하고 있으니 정말 난감할 따름입니다. 세간은 이런 걸 두고 '악성덧글(악플)'이라고 하죠. 멱살잡기가 뭐 다른 건줄 아십니까.
생각이 다르면 다른 생각을 남의 집에 발 들이는 사람으로서 들어와서 말을 걸거나, 자기 공간에 반론을 적어 초대장을 날리거나 하는 게 예의이거늘. 이건 뭐 흙발로 와 침뱉고 도망가기 수준이니. 게다가 본문과도 전혀 상관도 없어. 이런 사람이 공간의 특성을 이야기하다니… 다른 건 몰라도 정말, "이건 아닙니다". 용개 님. 부디 가던 길 고이 가시길.
.....왠지 '응X'란 느낌이군요.
스마일스마일~
누구나가 우연찮게라도 볼 수 있으면 '모두의(우리나라의)' 블로그가 되는 것이지요.
저 같은 경우엔 제 '개인' 블로그에다가 '메이하쿠나 바키나 잇코쿠번이나
모두 내 X이나 썩킹하세요들.' 수준의 글을 올렸더니 경찰서에서
선거법위반의 건으로 출두명령서가 날아오는 지경이니까요.
....'모두(우리나라)'를 따르지 않으면 개인적으로 좀 우울해지게 만들어
주는 나라지요. 아 우울해라.
근데 위에위에위에 분은 말이 너무 심하시다...
첨보는 사람한테 '당신'어쩌구...언제 봤다고...