[Note] jQuery UI vs Bootstrap?

요즘 시대에는 웹어플리케이션 개발을 하는데 있어 디자이너가 따로 필요가 없을 정도로 화려한 UI 프레임워크가 잘 만들어져 있습니다. 하지만 막상 이들을 이용해 개발을 시작하려 할때 고민을 하게 됩니다. 어떤게 더 좋을까? 어떤게 더 쉬울까? 웹개발자라는 언젠가 한번쯤 고민해봤을 겁니다. 한때였지만 아니 지금도 JSP, ASP, PHP 에 대해서 이런 류의 비교 논쟁이 끊임없는 것 처럼요.

다시 본론으로 돌아와 많은 UI 프레임워크 중 가장 뜨고 있는 이 둘에 대해 제 생각을 적어보고자 합니다.

1. jQuery UI와 Bootstrap은 방향성이 다르다.
제목처럼 이 둘의 방향성은 다릅니다. 레퍼런스를 쭉 보시면 아시겠지만 프레임워크에서 다루는 요소의 비중면에서 서로 차이가 있습니다. UI 프레임워크에는 크게 Element, Layout, Form Control, Type 으로 나눠볼 수 있습니다. 여기서 jQuery UI는 Form 요소에 대해서 강점을 가지고 있습니다. 다양한 컨트롤을 제공하지요. 반면 Bootstrap은 Layout에 중점을 두고 있습니다. 그렇다고해서 Form Control 부분이 약한 것은 아닙니다만 제공하는 Layout 레퍼런스를 보면 DIV 박스에 적당한 class만 부여하는 것으로 웹사이트 하나의 레이아웃 구현은 끝이 납니다. jQuery UI는 Controler, Bootstrap은 Layout에 중점을 두었다는 차이점이 있습니다.

2. jQuery UI를 써야할지 Bootstrap을 써야할지 모르겠어요.
이에 대한 제 생각은 단순합니다. 만약 이런 고민이 있다면 둘 다 사용하는 방법입니다. jQuery UI나 Bootstrap이나 jQuery에 기반한 UI 프레임워크입니다. 때문에 복잡하게 생각 할 것 없이 함께 사용해도 문제는 없습니다. 다만 Boostrap이 적용되어야 할 부분과 jQuery UI가 사용되어야 할 부분의 정의는 명확히 해주어야 나중에 혼란이 없을 겁니다.

3. UI 프레임워크를 사용하면 좋은 점
jQueryUI와 Bootstrap을 통틀어 “UI 프레임워크”라 부르겠습니다. 이 UI프레임워크의 장점은 처음 내용에 언급된 것과 같이 디자이너 없이도 개발자가 충분히 UI를 구현할 수 있다는 점입니다. 이전에는 버튼하나 페이지에 달아주는 것만해도 디자이너의 부탁이 필요했고 개발자 자신이 멋지게 만들어보겠다고 하지만 빨주노초바남보를 남발한 원색주의, 명도대비가 뚜렷한 자극적인 버튼이 탄생했었습니다. 일부 개발자들은 나도 포토샵 배우고 싶다라는 말을 하기도 합니다. 하지만 쉽지 않죠. UI 프레임워크 등장 이후로 HTML과 CSS만으로 버튼이며 레이아웃까지 개발자 손에서 마음껏 구현이 가능해졌습니다. 눈에 피로를 주는 버튼은 개발자의 손 맛이 담긴 버튼은 점차 사라지게 됩니다.

4. UI 프레임워크를 사용하면 좋지 않은 점
그렇다고 모든 것이 좋다라고 말할 수는 없습니다. 디자이너 없이 깔끔한 UI의 화면을 개발자가 만들어 낼 수 있다는 것은 사실이지만 딱 거기까지 입니다. 기본적으로 제공되는 테마를 벗어나지 못합니다. 그렇다면 어떤 일이 벌어질까요? UI는 깔끔하지만 주변에 모든 웹사이트가 같은 스타일이 되는 무시무시한 결과를 초래 할 수 있습니다. 웹사이트 개발이 아닌 양산이 될 수 있다는 점입니다. 물론 다양하게 테마를 바꿀 수 있습니다. CSS를 수정하면 말이죠. 하지만 손을 대지 않으려는게 현실입니다. 말인 즉, 많은 웹사이트들의 외형이 평준화 또는 단일화 되어 버린다는 말이기도 합니다. 개성을 잃어버린다는 것이죠.

5. UI 프레임워크를 사용하더라도 디자이너가 필요하다.
디자이너 없이 기본적인 틀로 보통의 외형을 갖출 수 있지만 그 이상의 퀄리티를 원한다면 디자이너의 존재는 불가피합니다. 아무리 HTML과 CSS를 주무르듯 잘 사용할 줄아는 개발자라 할지라도 디자인을 컨셉에 맞게 잡아내는 감성과 스킬까지 따라 올 수 없는건 어찌보면 당연한 일입니다. 반대로 생각해본다면 웹디자이너 역시 포토샵과 플래시만으로는 현재의 흐름을 쫓을 수 없는 시대가 되었습니다. 웹디자이너라도 기본 이상의 코딩능력이 필요한 시기가 된거죠. HTML, CSS에 대해 능숙치 못하다면 하루하루 트렌드에서 멀어져가는 자신을 경험하게 될겁니다. 설령 웹퍼블리셔가 있다하더라도 말이죠. 이제 앞으로 HTML과 CSS는 개발자, 퍼블리셔, 디자이너의 공통 언어인 셈입니다.

마치며…
스마트폰 이용률이 PC를 능가하면서 웹 시장에서도 모바일웹과 그에 상응하는 UI, 덩달아 PC 웹의 UI까지 발전하고 있는 시기입니다. 그렇기에 많은 업체들이 UI 프레임워크를 앞다투어 내놓고 있습니다. 새로운 시장을 선점하고 표준이 되기 위함입니다. 하지만 그로 인해 웹UI들이 천편일률적으로 단일화가 되고 있다는 점도 우려와 함께 무시할 수 없는 시점이 되었습니다. 이를 우려하는 칼럼이 심심치않게 올라오고 있기도 합니다. “어느 플랫폼을 이용하는게 더 좋다”라는 자신의 솔루션을 플랫폼에 맞추는 생각보다는 자신의 솔루션에 맞는 플랫폼을 찾아 “플랫폼에 녹아드는 것”이 아닌 “플랫폼을 녹아들게 하는것”이 정답이 아닐까 생각합니다.
기술은 발달하고 편리해졌지만 언제나 본질은 변하지 않습니다. 웹개발 환경이 발전한다고 한들 개발자+디자이너+퍼블리셔의 구도는 변하지 않을 것입니다. 다만 역할이 조정될 뿐이죠.

Published by HyungJin

이 곳에 작성된 모든 컨텐츠는 CCL 규약의 CC BY-NC-SA (저작자표시-비영리-동일조건변경허락) 조건을 따릅니다. 비상업적 용도로 출처를 밝혀주시면 얼마든지 공유 가능합니다.

%d 블로거가 이것을 좋아합니다: