HTML의 Table 작업에 사용하기 편한 무료 에디터
table of contents
개요
보통 프로젝트에서 개발자에게 작업된 HTML을 넘기기 위해서 마크업 엔지니어가 만드는 리스트가 있습니다.
일반적으로 기획서를 기준으로 페이지를 만들며 필요에 따라서는 공통으로 사용 가능한 부분도 있기 때문에 페이지가 줄기도 하고 기획서에 빠져 있는 부분도 있어서 페이지가 늘어나기도 합니다만 이 페이지를 통해 마크업의 진척도를 일정 부분 파악할 수 있고 나중에 유지보수를 하는 다른 작업자에게도 도움을 주고자 만드는 페이지입니다. 또한 이 페이지에는 개발자들이 마크업 엔지니어에게 요청하지 않고도 간단한 페이지는 만들 수 있도록 컴포넌트를 정리해 두는 기능도 겸하고 있습니다.
그런데 이런 페이지, 아무래도 항목 수가 꽤 되는 관계로 정리를 하다 보면 테이블이 상당히 복잡해지는 경향이 있습니다. 항목별로 그룹을 나누고 붙이고 하는 작업이 빈번하게 발생하기 때문에 그때마다 테이블 소스를 보면서 수정하는 건 솔직히 피곤한 작업입니다.
보통 이런 작업 때문에 Dreamweaver를 버리지 못하고 있는 편입니다만 무료 프로그램에서도 이런 편한 기능을 가진 것이 있을 것이란 생각에 찾아보고 사용하기에 편한 프로그램을 발견할 수 있었습니다.
HTML5 Editor
먼저 온라인 툴을 찾아봤습니다. 다행히도 테이블 작성에 유용해 보이는 서비스가 있었습니다. 간단한 작업이라면 이쪽이 더 적합할 수도 있습니다. 이 서비스에서 개인적으로 부족함을 느꼈던 것은 폭을 정하는 옵션이었습니다. 개인적으로 table의 경우 기본적으로는 % 대응이 적합하다고 여기는 편이라서 아쉬움이 남는 서비스였습니다.
BlueGriffon
Blue Griffon은 기본적으로 무료 소프트웨어이며 EPUB 대응, Mobile Viewer 등의 상위 기능의 경우는 라이센스의 취득이 필요합니다. 언어 설정을 하게 되면 한글도 사용할 수 있기 때문에 처음 사용자에게도 부담이 적을 것으로 보입니다.
테이블을 Merge 시키기 위해서는 테이블의 cell을 선택한 후 ‘Join Cells’명령어를 선택하면 rowspan, colspan 모두 적용 가능합니다.
제약사항인지 성능 문제인지는 모르겠지만 테이블을 Merge 시킬 때 에러가 나오기도 합니다.
SeaMonkey
http://www.seamonkey-project.org/
Sea Monkey는 브라우저를 기반으로 움직입니다. 처음 프로그램을 열 때 기본 브라우저를 Sea Monkey로 할지에 대한 설정이 나오더군요.
Sea Monkey에서 Editor모드를 선택하면 페이지를 수정할 수 있는 창이 활성화됩니다. 테이블을 Merge 시키기 위해서는 해당하는 cell들을 선택한 후 ‘Join Selected Cells’를 선택합니다.
Blue Griffon과 동일한 영역을 Merge 시키는 작업에서 에러는 나오지 않지만 역시나 Merge가 되지 않았습니다.
장점
장점은 역시 손쉽게 구할 수 있으며 무료로 사용 가능하다는 점을 들 수 있겠습니다. 인터넷만 된다면 필요할 때 구할 수 있고 Windows와 Mac 두 가지를 지원하기 때문에 상당한 장점이라고 할 수 있습니다.
단점
아직 프로그램에 적용 가능한 옵션을 찾지 못했기에 실제로는 가능한 기능일 수도 있습니다만… 아무래도 선두주자였던 Dreamweaver를 따라가기는 힘들 수도 있을 것 같습니다. 그리고 어디까지나 추측이긴 하지만 Dreamweaver에서 가능한 것을 다른 프로그램에서 구현하지 못하는 경우가 없을 것이라는 전제하에 생각해 보면 일종의 특허 문제도 있진 않을까 생각됩니다.
단점 1
단적으로 사용해 본 기능 중에서 table의 각 cell을 merge 시키는 과정에서 Dreamweaver는 를 사용하고 있습니다만 BlueGriffon과 SeyMonkey는 <br> tag가 사용되고 있습니다. 이것까지는 크게 상관없는데 실제 소스를 확인해 보면 약간 차이가 생깁니다.
Dreamweaver는 merge 작업 이후에 줄 바꿈이 생기지 않지만 BlueGriffon과 SeyMonkey는 두 프로그램 모두 줄 바꿈을 강제하고 있었습니다. 사람마다 호불호가 갈릴만한 부분이라 여겨집니다.
단점 2
테이블을 편집하는 과정에서 Dreamweaver와는 달리 table이 복잡해지면 계산이 복잡해지면서 그런 것인지 프로그램이 뻗어 버리는 경향이 BlueGriffon과 SeyMonkey 양측에서 모두 발생했습니다. 실제로는 뻗어 버린다기보다는 에러를 발생시키면서 수정작업을 진행하지 못했습니다. 이런 경우는 직접 소스를 수정하면 되지만, 이지윅 에디터인데 결국은 소스를 수정해야 하는 상황이라 개선되면 좋을 것 같습니다.
마무리
table 작업이 필요한 경우에 쓸만한, 가끔이지만 테이블 작업이 필요할 때 어떤 cell들을 건드리고 있는지 코드로만 봐서는 이해하기 힘든 경우 사용하면 좋을 것 같은 온라인 서비스와 오프라인 프로그램을 알아봤습니다.
두 가지 프로그램을 실제로 사용하면서 페이지를 작업한다면 좋은 기능도 많겠지만 테이블 작업에 초점을 맞추어 본 이번 포스팅에서는 어찌 보면 BlueGriffon과 SeyMonkey의 장점보다 단점이 부각될 수도 있을 것 같습니다. 하지만 무료로 사용 가능한 범위에서 일정량을 넘기지 않는 상태라면, 그리고 평상시에 간단한 표를 만들어 사용하는 정도의 작업이라면 굳이 유료인 Dreamweaver를 사용할 필요는 없을 것 같습니다.