안경원 웹 사이트 메인 화면의 정보구조 분석에 관한 연구

서 론

웹 사이트(website)는 단순히 정보의 저장 공간이 아니라 기업의 홍보 매체, 온라인 판매 공간으로 정보 전달과 소통의 대표적인 매체가 되었다. 웹 사이트에서 표현되고 있는 수많은 정보와 시각적 구성요인들은 방문객들로 하여금 소비자의 웹사이트 접근성을 높이고 있다.^[1] 기업과 브랜드의 이미지를 형성하는 주요 매체가 된 웹 사이트는 이용자와의 정보소통이나 상호작용을 위한 동적인 정보접근 수단으로도 중요성이 높아지고 있다. 정보기술의 발전에 따른 정보환경의 급격한 변화와 역할의 다양화 속에서, 증가하는 웹 사이트에서의 정보를 어떻게 체계적으로 조직하고 구성하여 이용자로 하여금 수록된 정보를 효과적으로 이용하게 할 것인지가 중요한 웹 사이트의 정보구조가 되고 있다.

체계적으로 구축되지 못한 웹 사이트의 정보구조는 이용자로 하여금 혼동을 줄 수 있고, 웹 사이트 전체의 효율성을 저하시키게 된다. 정보의 내용을 모호하게 표현함으로써 이용자에게 세부정보에 대한 접근성을 떨어지게 할 수 있다. 때문에 웹 사이트의 정보구조는 웹 사이트 전체의 구성과 내용을 이용자가 쉽게 이해할 수 있도록 구축되어야 하며, 수록된 세부 정보에 대한 명확한 경로를 제공해야 한다. 또한 정보구조를 구성하는 각각의 카테고리들을 해당 카테고리에 담겨있는 정보의 내용을 명확하게 나타낼 수 있는 용어로 표현되어야 한다.^[2] 용어의 표현은 일반적으로 메뉴라는 영역으로 만들어지는데 메뉴에 따라 다음 단계의 정보를 유추할 수 있는 주요 단서가 된다. 따라서 웹 사이트에서 메뉴는 신속하게 필요한 정보를 제공하는 것으로, 이용자의 정보 탐색은 웹이 가지고 있는 정보구조와 링크를 제공하여 내비게이션 방식을 구성하고 있는 메뉴디자인의 상호작용에 의해서 영향을 받을 수 있다.^[3] 그러므로 웹 사이트 메뉴디자인은 기업이 전달하고자 하는 정보, 이용자가 원하는 정보를 어떻게 표현하고 전달할 것인지 계획하고, 정보디자인과 기술적 디자인 요소를 복합적으로 조합하고 구성하여야 한다.^[1]

특히 메인 화면의 메뉴와 콘텐츠를 구성하는 것은 정보 탐색에서 중요한 웹 디자인 요소이다. 웹 사이트의 메인 화면은 이용자가 만나는 첫 만남으로 이용자의 정보 탐색 과정에 많은 영향을 미치게 한다. 이용자가 만나는 웹 사이트 메인 화면의 첫 인상은 이미지에 대한 지각, 믿음과 신뢰, 다양한 쾌락적 속성을 만들어 내는 등 넓은 범위에서 강한 영향력을 미친다. 웹 사이트를 보자마자 이용자는 첫 인상을 형성하여 즉각적으로 판단을 내리는데, 이것을 유도하는 웹 사이트와 같은 시지각물의 특징을 시각적 호소력(visual appeal)이라고 한다.^[4] 이러한 시각적 호소력에 메뉴와 콘텐츠의 정보구조가 체계적이지 못하고 뒷받침이 되지 않으면 소용이 없다. 동일한 메뉴라 할지라도 어떻게 메뉴를 구성하고 디자인 하는가에 따라 정보 탐색에 효과는 다르게 나타날 수 있다. 따라서 이미지에 대한 지각, 정보의 믿음과 신뢰, 다양한 쾌락적 속성 등을 만들어내는 넓은 범위에서 강한 영향력을 가지는 메인 화면의 메뉴와 카테고리는 이용자의 원할한 소통을 지원할 수 있고, 원하는 세부정보에 대한 명확한 안내의 기능을 수행한다.

안경원 웹 사이트 또한 안경 제품에 대한 소개와 가격 위주에서 시력검사, 선글라스 코디, 콘택트렌즈 코디 등 콘텐츠 구성이 발전하고 있으며 트렌드에 발맞춰 재미있게 소비자들에게 접근하고 있다.^[1] 단순히 안경원을 소개하거나, 제품과 가맹점 문의 등에 대한 기본적인 정보 제공에서 탈피해, 안경원의 변화된 홍보 매체가 되어 가고있다. 패션 트렌드에 맞춘 안경 상품의 소개와 코디네이트, 안 건강 지식이나 상식 제공, 해당 브랜드의 차별화된 내용까지 안경원 브랜드 웹 사이트의 정보구조와 메뉴는 점점 다양화되고 많아지는 실정이다. 그러므로 복잡해지고 다양하게 많은 정보를 이용자에게 쉽게 찾고 전달하게 하려면 안경원 웹 사이트의 메인 화면 디자인은 정보의 정확한 카테고리 설정, 내비게이션을 보다 명확하게 분석하는 메뉴 디자인과 정보구조를 함께 고려하여야 한다.

본 연구에서는 웹 사이트에서 정보구조의 개념과 시스템을 살펴보고, 국내 프랜차이즈 안경원 웹 사이트의 메인 화면을 메인 메뉴와 서브 메뉴의 용어와 수, 메뉴의 영역과 메뉴 언어, 사용된 아이콘 아이템, 검색 시스템 등 정보 구조 측면에서 특성을 분석하였다. 본 연구에서는 이상의 분석을 통해 웹 사이트 디자인을 개선하거나 새롭게 웹 사이트를 개설하고자 하는 안경원에 웹 사이트 디자인 정보 구성에 필요한 자료를 제공하고자 하였다.

대상 및 방법

1. 대상

본 연구에서는 국내 안경원 웹 사이트가 개설되어 인터넷 상에서 검색할 수 있는 프랜차이즈 안경원 브랜드의 웹 사이트를 중심으로 2022년 2월에 노출된 웹 사이트 메인 화면을 대상으로 분석하였다(Table 1).

Table 1.

Optical shop brands franchise websites

결과 및 고찰

1. 정보구조의 개념과 시스템

웹 사이트에서 메뉴 디자인은 웹을 구성하고 있는 정보를 링크로 연결시켜주고, 이용자에게 웹 사이트의 구조를 이해하는데 필요한 정보를 제공하는 두 가지의 역할을 한다.^[3] 정보탐색을 위한 두 가지의 기본 역할은 충분한 정보 제공과 함께, 이용자가 어느 공간, 즉 어느 화면에 있고 어디로 가야할지를 알게 한다. 특히 개방적인 구조를 가지고 있는 웹 사이트는 많은 정보가 엮어져 있는 복잡한 구조를 가지고 있기 때문에 방향감 상실이나 인지 과부하를 초래하지 않으려면 메뉴의 디자인이 중요하다.

따라서 이러한 메뉴 디자인의 출발은 정보를 구조화 하는 것이다. 여러 가지 정보가 링크에 의해서 연결되는 구조로 되어 있는 웹 사이트는 정보를 어떻게 조직하는가에 따라 내비게이션의 원할성이 좌우된다. 물론 정보 구조는 이용자가 직접 볼 수는 없지만 이용자들은 메뉴를 통해서 정보 구조에 대한 정보를 얻을 수 있다, 그렇게 때문에 정보 구조가 어떻게 구성되며, 메뉴를 어떻게 표현하느냐에 따라 이용자의 정보탐색 과정에 영향을 미치게 된다.^[3]

일반적으로 정보구조의 구성요소는 조직화 시스템, 레이블링 시스템, 검색 시스템, 내비게이션 시스템 네 가지로 구분된다^[5](Table 2).

Table 2.

Components of information structure

첫 번째는 조직화 시스템으로 이해하기 쉽도록 콘텐츠를 분류하는 것이다. 복잡해지고 다양하게 많은 정보를 생산하는 정보화 시대의 제일 매체인 웹 사이트에서 콘텐츠의 체계와 구조는 중요해지고 있다. 콘텐츠가 이용자를 고려하지 않고 개발자 중심으로만 분류된다면, 이용자는 고유의 경험, 학습정도, 정보체계 등의 요인에 의해서 관련 콘텐츠를 이해하는데 어려움을 느낄 수 있다.^[6] 그러므로 조직화 체계와 조직화 구조로 구분되는 조직화 시스템에서 조직화 체계는 공통적인 특성을 정의하고 콘텐츠 항목들의 논리적인 그룹화에 영향을 미치는 정보를 구분하여 나누는 것이 중요하다. 콘텐츠의 분류를 효과적으로 돕는 다양한 조직화 체계는 명확한 체계와 모호한 체계로 분류할 수 있다. 명확한 체계는 정보를 일정하게 나누는 것으로 알파벳순이나 가나다, 연대나 시간대별 등으로 구성하는 것이다. 일반적으로 많이 사용되는 방법으로 이용자가 이해하는데 어렵지 않다. 콘텐츠를 명확하게 한 가지로 정의하기 어려운 경우에 주로 사용되는 모호한 체계는 주제별, 태스크 기반, 이용자별, 메타포(metaphor), 혼합형 등으로 나눌 수 있다.^[6] 계층구조, 데이터베이스 기반 모델, 하이퍼텍스트로 구분되는 조직화 구조는 정보의 접근방법으로, 체계를 바탕으로 웹 사이트 디자인에서는 조직화 구조의 적용이라고 한다.

두 번째 구성요소는 레이블링 시스템으로 조직화된 콘텐츠와 내비게이션 시스템을 보여주는 가장 명확한 방법이다. 웹 사이트에 존재하는 많은 콘텐츠를 표현하기 위해 조직된 정보자료들의 이름을 구성하고, 메뉴와 해당 범주에 명칭을 부여하는 작업이다. 레이블은 항목이 포함하는 내용을 예측할 수 있도록 명칭을 부여해야 하며, 이용자가 처음으로 관찰할 수 있는 안내요소이기 때문에 해당 정보자원에 대한 대표성이 요구된다. 일반적으로 레이블링은 텍스트 형식의 레이블과 아이콘 형식의 레이블 등으로 나뉘어져 사용된다. 텍스트 형식은 직접적인 내용을 표현할 수 있으나 이용자가 보기에 복잡해 보일 수 있고, 아이콘 형태는 정보의 내용을 함축적으로 표현하고 있어 그 의미를 놓칠 수도 있지만 특유의 깔끔함과 상징성을 이유로 자주 사용된다.^[6] 레이블의 의미가 명확하지 않는다면 이용자는 자신이 원하는 정보가 어디에 있는지 탐색이 어려워지고 정보 경로에 혼란을 준다. 가능한 범위를 좁게 설정하여 이용자가 이해할 수 있는 언어로 표현되어야 한다.

세 번째는 검색 시스템이다. 이용자가 원하는 콘텐츠를 찾아볼 수 있도록 웹 사이트 내에서 검색 기능을 제공하는 것이다. 웹 사이트에서는 검색이 필요할 정도의 충분한 콘텐츠가 등록되어 있는지, 검색 엔진을 효과적으로 구현할 수 있는지에 대해서 항상 고려해야 한다. 일반적으로 검색 유형에는 이용자의 요구에 대한 명확한 이해의 ‘알려진 아이템’, 이용자가 요구는 있으나 명확한 표현이 어렵고 광범위한 상태의 ‘탐험’, 구체적인 요구 없이 존재하는지도 모를 정보를 필요로 하는 것의 ‘무엇을 알고자 하는지 모름’, 이용자가 상황에 따라 이미 봤던 정보를 다른 검색 유형으로 선택하는 ‘재검색’ 의 4가지 유형이 있다.^[5]

마지막 네 번째 구성요소는 내비게이션 시스템으로 이용자의 콘텐츠간의 이동을 돕는 것이다. 앞에서 살펴본 조직화 시스템, 레이블링 시스템, 검색 시스템의 세 가지는 모두 효과적인 내비게이션 시스템을 만드는데 기여하며, 이용자에게 맥락 정보를 제공하고 사이트 내에서의 이동에 유연성을 확보할 수 있도록 해 준다. 내비게이션 시스템은 웹 사이트 내에 항상 존재하고 있기 때문에 일정한 곳에 일정한 형태로 위치되어 있는 경우가 대부분이다.^[6] 이용자들이 현재 위치, 화면과 공간에서 이동할 위치를 파악하는데 도움을 주는 내비게이션 시스템은 글로벌 내비게이션, 로컬 내비게이션, 컨텍스추얼 내비게이션으로 구분되며, 내비게이션은 웹 사이트 내에서 서로 통합되어 존재한다.^[5] 각 내비게이션들의 설계 특성을 살리면서 부족한 부분들의 상호 보완적인 효과적인 통합이 매우 중요하다.

위와 같은 정보구조의 시스템 내용들을 종합해 볼 때 정보구조란 인터넷의 다양한 콘텐츠들을 이용자가 브라우징 또는 검색으로 이용하기 쉽게 조직하고 체계화 하며, 콘텐츠 본연의 의미가 정확하게 전달되도록 레이블링하고, 이용자가 콘텐츠의 위치를 파악할 수 있도록 돕는 것이다.^[6] 웹 사이트 내에서 이용자의 원할한 상호작용을 위해 시각적으로 표현되거나, 인지적인 상호작용 성격이 강한 정보구조 시스템은 사용성의 정보적인 측면에서 표현기법의 시각적인 측면과 함께 인터넷 이용자가 쉽고 편하게 웹 사이트를 이용할 수 있도록 하는 사용성을 높이는데 필요한 ‘정보를 디자인’ 하는 것이라 할 수 있다.^[7] 높은 사용성이란 사용자가 보편적인 훈련 없이 정보 시스템이나 웹 사이트와 얼마나 쉽게 상호작용할 수 있는지를 말하는데 이용자가 웹 사이트를 더 쉽게 탐색할 수 있게 하고 더 빨리 정확한 장소나 정보로 안내할 수 있게 하는 요인이다.^[8] 사용성이 높은 정보디자인은 이용자가 그 제품 · 서비스에서 얻을 수 있는 체험, 즉 알아보기 쉽고, 주문하기 쉽고, 웹 사이트내에서 이동하기 쉽다는 체험을 말하는 UX(user experience) 디자인까지 연결이 된다.^[9] 그러므로 이용자가 정보를 탐색하는 과정에서 불편함을 최소화하고 컴퓨터 간의 대화를 쾌적하고 즐거운 관계를 형성하게 하는 메뉴의 구조, 메뉴 디자인, 콘텐츠 구성 등이 나타나는 메인 화면의 정보구조는 매우 중요하다.

2. 안경원 웹 사이트의 메인 화면 현황

2.1. 메인 메뉴의 현황

안경원 웹 사이트의 메뉴 구조에서 상위 메뉴라고도 하는 메인 메뉴를 분석한 결과는 다음과 같다(Table 3). 메인 메뉴의 순서는 안경원 웹 사이트에서 구성된 순서대로 나열하였는데 메인 메뉴 수는 4~7개로 나타났다. 가장 많은 메인 메뉴를 제공하는 안경원 브랜드는 9개의 글라스바바였고, 가장 적은 메뉴를 제공하는 브랜드는 4개의 글라스타였다. 글라스박스와 다비치는 7개를 제공하고 있었고, 5개를 제공하는 안경원은 7개, 6개를 제공하는 안경원도 7개로 동일하게 나타났다. 대부분의 안경원 웹 사이트에서 메인 메뉴는 5~6개를 제공되고 있다.

Table 3.

Main menu of the optical shop websites

2.2. 메인 메뉴의 영역과 사용된 용어

안경원 웹 사이트에서 사용되는 메인 메뉴들에 대한 용어를 빈도수가 높은 대로 나열, 분석하면 다음과 같다(Table 4). 메인 메뉴의 콘텐츠 영역 항목은 웹 사이트에서 사용 중인 용어를 그대로 사용하여 나누었다. 콘텐츠 내용을 기준으로 메인 메뉴를 콘텐츠 영역별로, 그리고 많이 사용된 용어를 분석하였다. 한글과 영어가 일치되는 용어는 하나로 묶어 분류하였고 영어는 대문자 소문자 구별을 하지 않았다. ‘가맹안내’ 콘텐츠 영역에 해당되는 메인 메뉴가 32개로 가장 많았다. 사용된 용어 또한 ‘가맹안내’가 제일 많았고 ‘매장 찾기’ 라는 메뉴가 뒤를 이었다. 다음으로는 ‘회사소개’ 콘텐츠 영역에 포함되는 메인 메뉴가 22개로 많았는데 사용된 메뉴는 ‘회사소개’ 가 압도적으로 많았다. 회사소개를 글라스미나 다비치, INOTI처럼 자사의 브랜드를 그대로 사용하는 경우도 있었다. ‘뉴스&이벤트’ 영역이 18개, ‘제품 · 브랜드’ 영역이 17개로 나타났다. ‘고객센터’ ‘회원가입 · 로그인’ 의 영역은 상대적으로 매우 적었다. 프랜차이즈 안경원 브랜드 웹 사이트의 특성을 감안하면 가맹점과 관련한 콘텐츠가 많은 비중을 차지하고 있는 것은 당연하다고 볼 수 있다.

Table 4.

Main menu content categories and keywords of the optical shop websites

2.3. 서브 메뉴의 현황

안경원 웹 사이트의 서브 메뉴 구조에서 제공하는 콘텐츠 현황을 파악하기 위하여 서브 메뉴를 분석한 결과는 다음과 같다(Table 5). 메인 화면에서 서브 메뉴를 구성하고 있는 안경원 웹 사이트는 전체 18개 안경원 브랜드 중에서 절반인 9개였다. 각 브랜드별 서브 메뉴의 순서는 안경원 웹 사이트에서 구성된 순서대로 나열하였는데 안경원 웹 사이트에서 제공하는 서브 메뉴의 수는 2~6개로 나타났다. 가장 많은 메뉴 수를 가진 안경원 웹 사이트는 6개를 구성한 케이비젼안경이었고 안경매니저나 이노티처럼 2개를 구성한 브랜드도 있었다.

Table 5.

Sub-menus of the optical shop websites

2.4. 서브 메뉴의 영역과 사용된 용어

안경원 웹 사이트에서 사용되는 서브 메뉴들에 대한 용어를 빈도수가 높은 대로 나열, 분석하면 다음과 같다(Table 6). 서브 메뉴의 콘텐츠 영역 항목은 웹 사이트에서 사용 중인 용어를 그대로 사용하거나 유사한 카테고리로 묶어 나누었다. 콘텐츠 내용을 기준으로 서브 메뉴를 콘텐츠 영역별로, 그리고 많이 사용된 용어를 분석하였다. ‘로그인 · 회원가입’ 영역의 서브 메뉴가 10개로 가장 많았고 다음으로는 ‘카트 · 판매’ 영역이 7개로 많았다. 메인 메뉴에서 많이 나타났던 ‘회사소개’와 ‘제품 · 브랜드’의 콘텐츠 영역은 적었다. 서브 메뉴의 용어는 전반적인 콘텐츠 영역에서 빈도 수가 높은 특정 용어는 사용되지 않고 있었다.

Table 6.

Sub-menu content categories and keywords of the optical shop websites

2.5. 메뉴의 언어

메뉴에 사용된 언어를 살펴보면 10개의 안경원 웹 사이트에서 한글과 영어를 혼용해서 사용하는 것으로 나타났고, 한글과 영어를 각각 5개와 3개의 웹 사이트에서 사용하고 있었다(Table 7).

Table 7.

Menu languages of the optical shop websites

2.6. 아이콘 아이템

안경원 웹 사이트의 메인 화면에서 아이콘 형식의 아이템을 구성하고 있는 웹 사이트는 9개로 나타났다(Table 8). 이노티이노티는 INOTI 통합포인트 조회, 로그인, 이노티 블로그 아이템으로, 아이젠트리는 사이트맵, 인스타그램, 공식블로그, 페이스북, 네이버경영카페, 로그인 아이템으로 동일하게 6개로 가장 많았다. 전체적으로는 1~6개까지 다양하게 제공하고 있는데 밝은눈안경, 다비치나 안경매니저, 이노티 등의 브랜드는 아이콘과 텍스트를 병행하여 탐색 정보와 내용의 명확성을 제공하고 있었다. 아이콘의 아이템으로는 페이스북이나 인스타그램, 블로그 같은 소셜블로그 영역이 가장 많았고, 검색과 마켓 아이템이 5개로 동일하게 나타났다(Table 9).

Table 8.

Icon items and design of the optical shop websites

Table 9.

Icon items of the optical shop websites

3. 안경원 웹 사이트의 정보구조 분석

안경원 웹 사이트의 메인 화면 정보구조 분석을 하면 다음과 같다(Table 10). 먼저 조직화 시스템을 살펴보면 정보구조 분석의 조직화 시스템에서 계층구조는 깊이와 폭으로 표현되는데 깊이는 계층의 단계 수이고, 폭은 각 단계에서 제공되는 카테고리 수를 의미한다.^[5] 계층의 깊이와 폭에 따라 이용자는 정보 탐색에서 부담감을 가지게 되는데 정보를 찾기 위해서 여러 번의 클릭을 해야 하는 구조는 좁고 깊은 계층이며, 한 번에 많은 옵션을 제공하게 되어 옵션을 제대로 인지하지 못하는 혼란을 초래 할 수 있는 구조는 넓고 얕은 계층구조이다. 따라서 웹 사이트의 계층 구조는 적절한 폭과 깊이를 유지하는 것이 중요한데 일반적인 계층 구조 지침은 인간의 단기기억 작업용량을 의미하는 7±2 법칙이 알려져 있다.^[5] 계층의 폭인 카테고리는 7개, 계층의 깊이인 단계는 2단계가 적절하다는 것이다. 본 연구에서는 안경원의 웹 사이트 메뉴 구조에서 계층의 폭 중심만 분석하였는데 계층의 폭인 카테고리 7개를 충족한 웹 사이트는 글라스박스와 다비치 브랜드뿐이었고 글라스바바는 9개 계층의 폭을 나타내었다. 5개의 폭과 6개의 폭을 가진 웹 사이트는 7개로 동일하였는데, 대부분의 안경원 웹 사이트 계층 구조의 폭은 5~6개로 나타나 일반적인 계층 구조의 지침과는 조금 차이가 있었다. 서브 메뉴를 메인 화면에 구성한 웹 사이트는 눈사랑안경을 비롯한 9개의 브랜드로 계층 구조의 폭은 2~6개까지 다양한 폭을 보이고 있었다.

Table 10.

Main screen information structure system of the optical shop websites

두 번째로 레이블링 시스템에서 살펴보면 레이블들은 웹 사이트 내에서 다양한 형태로 이용되고 있지만 앞에서 언급한 내용처럼 일반적으로 텍스트와 아이콘의 두 가지 형식으로 제공된다. 텍스트 형식에서는 문맥적 연결(contextual link)과 제목으로서의 레이블 형식이 있는데 문맥적 연결은 다른 페이지에 있는 정보 조각이나 동일 페이지의 다른 위치로 이동하도록 도와주며, 문맥상에서 나타나는 경우가 많아 단어나 문장의 형태로 제공 된다. 제목으로서의 레이블은 계층관계를 나타낼 때 유용하다. 이후에 제시될 정보에 대해 간략 하게 설명하고 이용자의 이해를 돕는다.^[6] 어떤 형식과 형태이든 레이블은 명확성과 일관성이 중요하다. 그래야 이용자가 정보 탐색을 할 때 정보 접근에 대한 이해를 돕고 정보에 대한 예측 가능성을 높일 수 있다. 안경원 웹 사이트 메인 화면에서의 메인 메뉴는 대부분 텍스트 형태로 명사형과 동사형을 채택하고 있었고, 아이콘 형식을 함께 채택하고 있는 웹 사이트도 9개나 있었다. 그중에서도 다비치나 이노티 안경매니저 웹 사이트는 아이콘 옆에 텍스트를 병기하여 텍스트와 아이콘을 함께 구성하고 있다.

마지막으로 검색 시스템 분석을 살펴보면 안경원 웹 사이트의 검색 시스템은 서브 메뉴에서의 search 클릭, 키워드 입력, 그리고 검색 아이콘을 클릭하여 검색이나 입력하는 검색 시스템을 제공하고 있다. 키워드 입력 검색이나 아이콘 형식의 클릭 검색 시스템을 병행하여 제공하고 있는 안경원 웹 사이트는 6개로, 18개의 웹 사이트 분석 대상을 감안하면 검색 기능을 제공하는 안경원 웹 사이트는 적다고 할 수 있다. 무극 안경은 서브 메뉴에서 search 용어를 클릭하면 다음 단계로 넘어가 키워드를 입력하여 검색하는 시스템을 제공하고 있다. 글라스바바는 키워드 입력 검색과 아이콘 클릭 검색 기능을 함께 제공하고 있는데 아이콘 검색은 상품 정보를 입력하여 상품 중심 검색만 하는 기능을 제공한다. 밝은눈안경 브랜드의 웹 사이트는 검색 아이콘과 키워드 창을 메인 화면에 노출시켰다. 룩옵티컬과 안경나라는 아이콘을 클릭하면 키워드를 작성하는 창이 나타나 정보를 입력하여 검색하는 시스템 기능을 제공한다. 안경나라 웹 사이트는 검색 아이콘을 클릭하면 키워드 창이 나타나 입력하고 우측에 있는 검색 아이콘을 재 클릭하여 정보를 찾는 시스템을 보여주고 있다.

결 론

본 연구는 국내 프랜차이즈 안경원 웹 사이트의 메인 화면을 정보구조 측면에서 메인 메뉴와 서브 메뉴의 용어와 수, 메뉴의 언어, 아이콘 아이템, 검색 유무 등의 특성을 분석하였다.

분석에 따르면 안경원 웹 사이트의 메인 화면에서 메인 메뉴의 제공 수, 즉 조직화 시스템에서 계층 구조의 폭은 대부분이 5~6개로 나타났다. 메인 메뉴의 콘텐츠 영역에서는 ‘가맹안내’가 32개로 제일 많았고, 사용된 용어 역시 ‘가맹안내’가 제일 많았다. 메인 화면에서 서브 메뉴를 채택하고 있는 안경원 웹 사이트는 9개였고 메뉴의 제공 수, 즉 계층 구조의 폭은 2~6개로 다양하게 나타났다. 서브 메뉴의 콘텐츠 영역에서는 ‘로그인 · 회원가입’이 10개로 가장 많았다. 레이블링 시스템에서는 대부분의 웹 사이트는 텍스트 형식으로 제공하였다. 아이콘을 함께 채택하고 있는 안경원 웹 사이트는 9개였고, 아이콘 제공은 1~6개까지 다양하게 나타났다. 아이콘의 아이템으로는 페이스북, 인스타그램 등과 같은 소셜블로그가 가장 많았다. 검색 시스템을 제공하고 있는 안경원 웹 사이트는 6개로 나타났다.

위와 같은 메인 화면의 정보구조 분석을 바탕으로 안경원 웹 사이트 메인 화면의 바람직한 메뉴 정보 구성에 몇가지 제안을 하고자 한다. 첫째 메인 화면의 메인 메뉴는 명확한 계층구조와 적절한 폭으로 구성되어야 한다. 불명확한 계층 구조와 지나친 메뉴 수, 즉 계층 폭은 이용자의 불편함은 물론 정보 탐색 과정에서의 심리적 불쾌감을 초래할 수 있다. 둘째로 메인 메뉴의 레이블은 이용자가 직관적으로 이해 할 수 있는 명확성과 일관성이 있어야 한다. 명확하고 일관성 있는 레이블만이 콘텐츠에 대한 이용자의 이해와 내용의 예측 가능성을 높이며 정보 탐색에 편의성을 줄 수 있다. 셋째로 메인 화면에 서브 메뉴를 노출시킬 경우 메인 메뉴의 콘텐츠 영역과 확실하게 구분이 되어야 하고 정보의 상 · 하위나 우선순위를 매겨야 한다. 그런 구분과 순위 바탕에 메인 메뉴와 서브 메뉴의 계층 구조에 적합한 메뉴들로 구성되어야 서브 메뉴의 역할을 충실히 할 수 있다. 넷째로 메뉴의 국 · 영문 혼합은 원칙을 가지고 사용을 해야 한다. 메뉴의 명확성과 전달성을 고려할 때 영문은 한글보다 떨어질 수밖에 없다. 메뉴 해석의 불편함과 정보에 대한 오류, 탐색 시간의 낭비를 최소화하려면 한글 메뉴 제공이 적절해 보인다. 다섯째, 안경원의 업종 특성을 고려한 웹 사이트 메인 화면의 콘텐츠 영역을 정해야 한다. 안경원의 업종 특성 파악과 개별 안경원 브랜드의 웹 사이트 아이덴티티를 바탕으로 메인 화면의 콘텐츠 영역을 설정하고 서브 메뉴의 제공 여부 결정해야 한다.

안경원 웹 사이트는 단순히 회사를 소개하고 가맹문의나 제품을 소개하는 홍보나 정보 저장만의 공간이 아니다. 정보를 조직화, 체계화, 시스템화하여 이용자가 원하는 정보를 쉽고 편리하게 제공하며 기업과 고객이 소통하는 상호작용의 커뮤니티 공간이다. 특히 메인 화면의 정보구조는 커뮤니티의 출발선이 되는 중요한 메뉴 디자인이다. 안경원의 업종과 성격에 적합하고, 개별 안경원의 브랜드 정체성과 이미지를 각인 시킬 수 있는 체계적인 정보 구조가 메인 화면에서 구성될 때 안경원 웹 사이트의 사용성 향상을 기대할 수 있다.

Acknowledgments

본 연구는 2022년 경운대학교 교내학술지원비로 연구되었습니다.

References

• Hong SI. A study on the main screen layout features of optical shop websites: focusing on franchise optical shops. J Korean Ophthalmic Opt Soc. 2021;26(2):81-90. [https://doi.org/10.14479/jkoos.2021.26.2.81]
• Lee SM, Kim HK. A study on the analysis of informational structure of university websites. Journal of Korean Society for Information Management. 2004;21(2):127-152. [https://doi.org/10.3743/KOSIM.2004.21.2.127]
• Yu BM. Interaction between information structure and menu design on information searching and attitude in WWW. Journal of Korea Information Processing Society. 2005;12(4):473-478. [https://doi.org/10.3745/KIPSTB.2005.12B.4.473]
• Seong CK, Kim SH. A study on brand awareness and first impression of website design by brand reputation. Journal of Brand Design Association of Korea. 2011;9(2):206-214. [https://doi.org/10.18852/bdak.2011.9.2.205]
• Noh DJ, Lee GR. A study on the analysis of menu structure and contents in museum web sites. Journal of the Korean Biblia Society for Library and Information Science. 2019;30(4):5-27. [https://doi.org/10.14699/kbiblia.2019.30.4.005]
• Seo J, Kim H. An evaluation of website information architecture for old adults: focused on organization and labeling system. Journal of Korean Society for Information Management. 2016;33(1):181-196. [https://doi.org/10.3743/KOSIM.2016.33.1.181]
• Choi MH, Lee JA. A study on hotel brands to improve the usability of the website interface. Journal of Brand Design Association of Korea. 2009;7(2):115-124.
• Abedin B, Sohrabi B. Graph theory application and web page ranking for website link structure improvement. Behav Inf Technol. 2009;28(1):63-72. [https://doi.org/10.1080/01449290701840948]
• O Hayato. Design no kihon note, 2nd Ed. Paju: Jpub, 2021;164.
• Grandprix glass. PB introduction, 2013. http://www.gpeye.co.kr, (14 February 2022).
• Glassme glass. PB introduction, 2022. http://www.glassme.co.kr, (14 February 2022).
• Glassbaba glass. PB introduction, 2022. http://www.glassbaba.com, (14 February 2022).
• Glassbox glass. PB introduction, 2015. http://iglassbox.com, (14 February 2022).
• Glastar glass. PB introduction, 2022. http://www.glastar.co.kr, (14 February 2022).
• Nunsarangankyung glass. PB introduction, 2022. http://www.nunsarangoptic.com, (14 February 2022).
• Davich glass. PB introduction, 2018. https://www.davich.com/main/main.php(14 February 2022).
• Lookoptical glass. PB introduction, 2011. https://www.lookoptical.co.kr(14 February 2022).
• Mooguk glass. PB introduction, 2009. https://www.mooguk.com, (14 February 2022).
• Barlkeunnunankyung glass. PB introduction, 2015. http://www.rednblue.co.kr, (14 February 2022).
• Seechannel glass. PB introduction, 2017. https://www.seechannel.co.kr/main(14 February 2022).
• Eyegentry glass. PB introduction, 2014. http://www.eyegentry.com/main/main.php, (14 February 2022).
• Ankyungnara glass. PB introduction, 2017. http://aknara.co.kr, (14 February 2022).
• Opticalmanager glass. PB introduction, 2015. http://www.opticalmanager.co.kr/page/main.html, (14 February 2022).
• Inoti glass. PB introduction, 2022. http://www.inoti.co.kr/new/, (14 February 2022).
• Leeoptical glass. PB introduction, 2022. http://leeoptical.co.kr/default/, (14 February 2022).
• 1001optics glass. PB introduction, 2022. http://1001optics.co.kr, (14 February 2022).
• Kvisionoptical glass. PB introduction, 2022. http://www.kvisionoptical.com, (14 February 2022).