<div id="readability-page-1" class="page"><div><blockquote data-app="{&quot;type&quot;:&quot;quotation&quot;,&quot;kind&quot;:&quot;quote&quot;,&quot;data&quot;:[{&quot;type&quot;:&quot;text&quot;,&quot;text&quot;:&quot;브레드크럼 Breadcrumbs UX 원칙&quot;},{&quot;type&quot;:&quot;br&quot;},{&quot;type&quot;:&quot;text&quot;,&quot;text&quot;:&quot;(요약문)&quot;}]}">브레드크럼 Breadcrumbs UX 원칙<br>(요약문)</blockquote><p data-app="{&quot;type&quot;:&quot;text&quot;,&quot;data&quot;:[{&quot;type&quot;:&quot;text&quot;,&quot;text&quot;:&quot;브레드크럼(빵부스러기)은 핸젤과 그레텔에서 유래된 용어로, 웹사이트나 웹 앱에서 사용자의 위치를 나타내는 보조 내비게이션 시스템입니다. 브레드크럼 내비게이션은 사용자에게 \u0027맥락 정보\u0027를 제공하여 현재 위치, 가능한 경로, 콘텐츠의 가치를 명확히 전달하는 데 도움을 줍니다. 이 시스템은 사용자가 상위 페이지로 쉽게 이동할 수 있도록 하고, 최소한의 공간을 차지하며, 혼란을 초래하지 않아야 합니다.&quot;}]}">브레드크럼(빵부스러기)은 핸젤과 그레텔에서 유래된 용어로, 웹사이트나 웹 앱에서 사용자의 위치를 나타내는 보조 내비게이션 시스템입니다. 브레드크럼 내비게이션은 사용자에게 '맥락 정보'를 제공하여 현재 위치, 가능한 경로, 콘텐츠의 가치를 명확히 전달하는 데 도움을 줍니다. 이 시스템은 사용자가 상위 페이지로 쉽게 이동할 수 있도록 하고, 최소한의 공간을 차지하며, 혼란을 초래하지 않아야 합니다.</p><div data-app="{&quot;type&quot;:&quot;img&quot;,&quot;align&quot;:&quot;content-full&quot;,&quot;mobileAlign&quot;:&quot;full&quot;,&quot;url&quot;:&quot;http://t1.daumcdn.net/brunch/service/user/2fEJ/image/7hqazmpjAgnCnl44fn7tSf9Y9H8.jpeg&quot;,&quot;caption&quot;:&quot;&quot;,&quot;width&quot;:&quot;891&quot;,&quot;height&quot;:&quot;177&quot;,&quot;originalName&quot;:&quot;2.jpeg&quot;}"><p><img src="https://img1.daumcdn.net/thumb/R1280x0.fjpg/?fname=http://t1.daumcdn.net/brunch/service/user/2fEJ/image/7hqazmpjAgnCnl44fn7tSf9Y9H8.jpeg" data-filename="2.jpeg"><span></span></p></div><p data-app="{&quot;type&quot;:&quot;text&quot;,&quot;data&quot;:[{&quot;type&quot;:&quot;text&quot;,&quot;text&quot;:&quot;브레드크럼의 유용성은 특히 많은 양의 콘텐츠가 수직형 또는 계층 구조로 되어 있을 때 더욱 두드러집니다. 반면, 단일 레벨 웹사이트에서는 사용하지 않는 것이 좋습니다. 브레드크럼의 유형에는 위치 기반, 경로 기반, 속성 기반이 있으며, 각각의 특징이 다릅니다. 위치 기반 브레드크럼은 사이트 구조를 쉽게 이해하게 하며, 경로 기반은 이전 탐색 경로를 보여주지만 혼란을 초래할 수 있습니다. 속성 기반은 이커머스 사이트에서 카테고리를 명확히 해주고, 소비자가 원하는 제품을 쉽게 찾도록 돕습니다.&quot;}]}">브레드크럼의 유용성은 특히 많은 양의 콘텐츠가 수직형 또는 계층 구조로 되어 있을 때 더욱 두드러집니다. 반면, 단일 레벨 웹사이트에서는 사용하지 않는 것이 좋습니다. 브레드크럼의 유형에는 위치 기반, 경로 기반, 속성 기반이 있으며, 각각의 특징이 다릅니다. 위치 기반 브레드크럼은 사이트 구조를 쉽게 이해하게 하며, 경로 기반은 이전 탐색 경로를 보여주지만 혼란을 초래할 수 있습니다. 속성 기반은 이커머스 사이트에서 카테고리를 명확히 해주고, 소비자가 원하는 제품을 쉽게 찾도록 돕습니다.</p><p data-app="{&quot;type&quot;:&quot;text&quot;,&quot;data&quot;:[{&quot;type&quot;:&quot;text&quot;,&quot;text&quot;:&quot;브레드크럼 내비게이션을 설계할 때는 주 내비게이션을 대체하지 않고, 현재 페이지에 링크를 걸지 않으며, 구분 기호를 사용하고, 크기와 여백을 적절히 설정해야 합니다. 또한, 디자인의 중심이 되지 않도록 하고, 모바일에서는 사용하지 않는 것이 좋습니다. 이러한 점들을 고려하여 브레드크럼을 효과적으로 활용할 수 있습니다.&quot;}]}">브레드크럼 내비게이션을 설계할 때는 주 내비게이션을 대체하지 않고, 현재 페이지에 링크를 걸지 않으며, 구분 기호를 사용하고, 크기와 여백을 적절히 설정해야 합니다. 또한, 디자인의 중심이 되지 않도록 하고, 모바일에서는 사용하지 않는 것이 좋습니다. 이러한 점들을 고려하여 브레드크럼을 효과적으로 활용할 수 있습니다.</p><p data-app="{&quot;type&quot;:&quot;text&quot;,&quot;data&quot;:[{&quot;type&quot;:&quot;text&quot;,&quot;style&quot;:{&quot;font-family&quot;:&quot;Nanum Gothic&quot;},&quot;data&quot;:[{&quot;type&quot;:&quot;text&quot;,&quot;text&quot;:&quot;위글은 &quot;}]},{&quot;type&quot;:&quot;text&quot;,&quot;style&quot;:{&quot;font-family&quot;:&quot;Nanum Gothic&quot;},&quot;data&quot;:[{&quot;type&quot;:&quot;text&quot;,&quot;text&quot;:&quot;요약문입니다.&quot;}]}]}"><span>위글은&nbsp;</span><span>요약문입니다.</span></p><p data-app="{&quot;type&quot;:&quot;text&quot;,&quot;data&quot;:[{&quot;type&quot;:&quot;text&quot;,&quot;style&quot;:{&quot;font-family&quot;:&quot;Nanum Gothic&quot;},&quot;data&quot;:[{&quot;type&quot;:&quot;text&quot;,&quot;text&quot;:&quot;이 글에 대한 &quot;}]},{&quot;type&quot;:&quot;text&quot;,&quot;data&quot;:[{&quot;type&quot;:&quot;text&quot;,&quot;style&quot;:{&quot;font-family&quot;:&quot;Nanum Gothic&quot;},&quot;data&quot;:[{&quot;type&quot;:&quot;text&quot;,&quot;text&quot;:&quot;전체 번역 원문&quot;}]}],&quot;styleType&quot;:&quot;bold&quot;},{&quot;type&quot;:&quot;text&quot;,&quot;data&quot;:[{&quot;type&quot;:&quot;text&quot;,&quot;style&quot;:{&quot;font-family&quot;:&quot;Nanum Gothic&quot;},&quot;data&quot;:[{&quot;type&quot;:&quot;text&quot;,&quot;text&quot;:&quot;은 아래 링크를 클릭해주세요~&quot;}]}],&quot;styleType&quot;:&quot;bold&quot;}]}"><span>이 글에 대한&nbsp;</span><b><span>전체 번역 원문</span></b><b><span>은 아래 링크를 클릭해주세요~</span></b></p><p data-app="{&quot;type&quot;:&quot;text&quot;,&quot;data&quot;:[{&quot;type&quot;:&quot;anchor&quot;,&quot;url&quot;:&quot;https://maily.so/uiux/posts/ef5361d0&quot;,&quot;data&quot;:[{&quot;type&quot;:&quot;text&quot;,&quot;text&quot;:&quot;https://maily.so/uiux/posts/ef5361d0&quot;}],&quot;target&quot;:&quot;_blank&quot;}]}"><a target="_blank" href="https://maily.so/uiux/posts/ef5361d0">https://maily.so/uiux/posts/ef5361d0</a></p></div></div>

UX 컨설턴트 전민수

브레드크럼 Breadcrumbs UX 원칙(요약문)  브레드크럼(빵부스러기)은 핸젤과 그레텔에서 유래된 용어로, 웹사이트나 웹 앱에서 사용자의 위치를 나타내는 보조 내비게이션 시스템입니다. 브레드크럼 내비게이션은 사용자에게 '맥락 정보'를 제공하여 현재 위치, 가능한 경로, 콘텐츠의 가치를 명확히 전달하는 데 도움을 줍니다. 이 시스템은 사용자가 상위 페이

[UI/UX 원칙 #5] 브레드크럼 UX 원칙

댓글