다음을 통해 공유

Internet Explorer 8 탭그룹핑

  • 아티클

 

 

안녕하세요, 저는 Internet Explorer 팀에서 탭을 포함한 사용자 인터페이스를 담당하고 있는 프로그램 매니저인 Helen Drislane 입니다. 저는 새로운 탭 그룹화 기능 (탭 컬러!)에 대해 이야기하고자 합니다. 이 기능의 구현은 정말 기대되는 것으로 , 어떤 프로세스를 거쳐 설계되었는지 간단하게 설명하고, 이 기능으로 할 수 있는 것들에 대해 소개하려고 합니다.

디자인과 알고리즘 진화

Internet Explorer 7이 공개된 후, Internet Explorer 팀은 많은 데이터를 사용자 평가와 MS Connect 으로 보내진 Internet Explorer 에 대한 피드백, 그외 Microsoft 제품 팀에서 수집했습니다. 그리고 상위를 차지하는 사용자들의 요구사항, 예를 들면 닫은 탭을 다시 열기 기능, 자동 크래쉬 회복 기능, 문제가 발생한 탭이 다른 탭과 함께 닫히지 않도록 하는 기능 , 탭을 복제하는 새로운 기능 등이 있었습니다. 이 목록에는 다음과 같은 지적도 있었습니다. 현재, 다른 탭에서 열린 탭은 항상 마지막에 배치되는데, 그것이 최초의 탭에 관련된 것이라면 맨 끝부분에서 새 탭을 찾아야 한다는 것이 이상하다는 것입니다.

이 의견을 기초로 하여, 탭을 닫는 알고리즘을 다시 짜기로 결정하고, 탭을 닫았을 때 항상 탭 섹션의 우측으로 이동하는 것이 아니라, 닫혀진 탭에 관련한 탭으로 이동하도록 다음과 같이 동작을 변경했습니다：

image3

덧붙여 다른 피드백 경로에 주의를 기울여서, 사용성 조사를 담당하고 있는 Microsoft 연구자들과 함께, 사용자가 어떻게 웹을 브라우징하는지, 왜 그리고 어떻게 브라우징 과업들을 수행하는지에 대해 연구했습니다.

조작성에 관한 조사 결과, 몇 가지 흥미로운 경향을 발견했습니다：

  • 사용자는 여러 개 탭을 쌓아 놓는다. 바꾸어 말하면, 사용자는 무언가를 조사하여, 나중에 읽기 위해서 검색 결과의 일부를 열어 둔다. 이것은 온라인 뉴스 사이트에서도 발생하는데, 나중에 읽기 위한 기사들을 쌓아 두는 것이다.
  • 사용자는 여러 작업을 처리하기 위해서 하나의 창을 이용한다(바꾸어 말하면, 일과 관련된 4가지 탭, 다음에 읽고 싶은 뉴스 문서 3가지 탭,  가고 싶은 레스토랑에 관한 3가지 탭을 열어 둔다)
  • 다른 응용 프로그램에서 전환한 후, 사용자는 특정 탭을 찾기 위해서 많은 시간을 소비하는 경우가 많다.

위의 경향에서, 관련 탭 (검색 결과나, 같은 웹 사이트에서 열린 뉴스 문서)은 근처에 모아두는 것 뿐만 아니라, 그룹임을 보여주는 시각적인 구별에 따라서 다른 작업 내용의 탭과 간단하게 식별할 수 있는 것이 바람직할 것입니다. 그래서 분류를 실시하게 되었습니다.

탭을 그룹화하는 아이디어의 배경은 같은 곳에서 열린 탭은 하나의 그룹에 모으려는 것입니다. 아래 그림은 두 개의 문서와 그것을 여는 데 기본이 된 MSNBC 페이지가 녹색 탭에서 열리고 있는 것으로 Windows Live Search 에서 시애틀에 있는 레스토랑에 대해 검색한 페이지와 거기에서 열린 두 개의 검색 결과를 파란색으로 표시하고 있습니다.

image4

이 시각적인 표시로, 각각 다른 작업 내용에 관련하는 탭 그룹을 신속하게 알 수 있습니다. 따라서 다른 응용 프로그램을 사용한 후에 Internet Explorer 로 돌아와도 파란색 탭이 멋진 레스토랑 관련 정보라는 것을 신속하게 알 수 있습니다.

이 기능을 설계할 때의 또 다른 중요한 관점은 그룹에 대한 시각적인 식별 방법을 결정하는 것이었습니다. 자주하는 질문 중에 「색맹이 있는 사용자는 어떻게 탭 그룹을  이용할 수 있는지?」였습니다 . 이번 설계에 이런 사용자에 대한 배려도 고려하였습니다. 아래의 그림과 같이 많은 색맹 사용자가 다른 그룹을 구별할 수 있는데 충분한 색상 차이가 있습니다：

image5

그리고, 스크린 리더를 실행하고 있는 사용자를 위해 각각의 탭 제목 뒤에  탭 그룹의 이름을 포함하도록 했습니다(예를 들면, Tab Group1 나 Tab Group 2) .아래 그림은 두 개의 탭 그룹과 4번째 탭의 Tooltip 에 포함된 탭 그룹의 정보를 보여줍니다. 

screen reader2

지금까지의 설명으로, 탭그룹 설계에 대해 이해하셨을 것이라 생각하고,  지금부터는 어떻게 탭그룹이 생성되고 이것에 의해 어떤 일이 발생하는지 설명하겠습니다.

탭그룹 생성 방법

예를 들면, 신문 웹 사이트를 보고 있을 때, 여러 문서를 읽기 위해 탭을 추가하는 경우, 몇 가지 방법을 사용하여  문서(문서에의 링크)를 새로운 탭으로 열어서, 그룹으로 만들 수  있습니다.

  • 링크를 오른쪽 클릭하여, [ 새로운 탭으로 열기] 을 선택한다
  • Ctrl 키를 누르면서, 링크를 클릭한다
  • 링크를  가운데 클릭한다 (가운데 클릭은 스크롤 휠을 누르거나 가운데 단추/스크롤 휠이 없는 경우는 오른쪽 클릭과 왼쪽 클릭을 동시에 클릭하면 됩니다.)

덧붙여, 특정 탭을 오른쪽 클릭하여, [ 새로운 탭을 열기] 을 선택하면, 새로운 탭이 열려, 원래 탭과 그룹화 됩니다.

Internet Explorer 8에서는 위의 어떠한 조작을 실시해도 원래 탭과 거기에서 열린 모든 탭은 그룹화 됩니다.

탭의 그룹화로 할 수 있는 것

만약 잘못하여 그룹 내의 탭을 닫아 버렸을 경우, 새롭게 메뉴에 추가된 [닫은 탭 다시 열기] 의 선택사항을 이용하면, 닫혀버린 탭을 복원하는 것뿐만 아니라 적절한 그룹에 복원할 수도 있습니다.

작업이 완료되면, 탭의 context menu에서 [탭 그룹 닫기] 를 한 번만 클릭하면 관련된 모든 탭 그룹을 닫을 수 있습니다.

만약 탭을 이 그룹의 다른 탭과 관련 짓고 싶지 않은 경우, 간단하게 [ 탭 그룹 해제] 할 수 있습니다.

이것들 모든 선택사항은 탭을 오른쪽 클릭하면 표시되는 context menu에서 이용 가능합니다：

image6

오른쪽 클릭했을 때 나오는 context menu 외에도, 탭을 드래그앤드롭 할 수 있습니다. 탭 그룹 기능의 주요 매력은 이 기능이 백그라운드에서 중단 없이 동작하는 것 (강화된 탭 기능을 이용하기 위해서 사용자 측에서 할 것은 아무것도 없습니다)이지만, 보다 꼼꼼하게 정리하는 것을 좋아하는 사람도 있을 것입니다. 정리를 좋아하는 사람을 위한 기능하지만, 탭을 기존 그룹 안에서 드래그 하면, 그 그룹에 들어갈 수 있을 수 있습니다. 또한 같은 그룹이 아닌 두 개의 탭의 사이에 드래그 하는 것으로, 그 탭을 그룹에서 제외할 수도 있습니다.

자주 하는 질문

다른 페이지로 이동했는데, 탭이 그룹화 된 채로인 것은 왜일까요?

페이지를 이동할 때에 특정 탭을 이용했을 경우, 이 알고리즘에서는 새로운 페이지는 현재 그룹에 어떠한 관련성이 있다고 보여집니다. 만약 새로운 탐색을 그룹의 일부로 하고 싶지 않은 경우는 그룹을 해제하는지, 탐색을 위해서 새로운 탭을 열 수 있습니다.

탭을 복제했을 경우, 두 개가 같은 그룹이 안 되는 이유는 ?

탭을 복제하는 새로운 기능 (탭을 오른쪽 클릭 했을 때의 context menu에 있습니다)은 완전하게 다른 경로를 가진 같은 탭을 얻는 것을 가능하게 합니다. 이러한 탭은 동일한 것이지만, 사용자가 서로 다른 목적을 갖고 이동하려고 한다고 생각할 수 있기 때문입니다.

시작 페이지로 설정된 페이지는 왜 그룹화 되지 않습니까?

탭 복제와 같은 이유에서 입니다. 시작 페이지는 일반적으로, 메일 클라이언트나 온라인 신문 등이 정의됩니다. 이것들은 일반적으로 관련성을 가지지 않습니다(웹 브라우저 실행 때에 모두 여는 경우는 예외이지만) .

탭 그룹 기능은 어떻게 끌 수 있나요?

명령 모음의 [도구] 단추에서 [ 인터넷 옵션] 을 선택합니다. [탭] 항목에 있는 [설정] 단추를 클릭합니다. [탭 그룹 유효하게 하기] 체크를 제외합니다.

이상의 내용으로, 이 기능의 발전 배경과 탭 그룹 기능에서 실행할 수 있는 것에 대해 설명 드렸습니다. 

Internet Explorer 8 Beta 2 를 시험해 주셔 감사합니다, 여러분의 의견을 기다리겠습니다. 

Helen Drislane
프로그램 매니저

 

* 이 글은 Internet Explorer 개발 팀 블로그 (영어)의 번역 문서입니다. 이 글에 포함된 정보는 Internet Explorer 개발 팀 블로그 (영어)가 생성된 시점의 내용으로, 제품의 사양이나 기능이 보장되는 것은 아닙니다. 이 글에 포함된 정보의 이용은 사용 조건을 참조해 주세요. 또, 이 글 게재 시점에서 Internet Explorer 개발 팀 블로그 (영어)의 내용이 변경 될 수 도 있습니다. 최신 정보는 Internet Explorer 개발 팀 블로그 (영어)를 참조하십시오. 

영문 원본 :IE8 Tab Grouping

업데이트 일자 : 2008 년 9 월 30 일

 

* 역자주 : 현재, IE 8 Beta 2에 이어서 정식 출시 후보 버전인 IE8 RC 가 출시되었고 곧 정식 버전이 출시 예정입니다.