[ux] UX 원칙

14 May 2021

개발

UX 원칙

버튼

버튼은 충분히 크게 만들어라.
버튼을 컨텐츠와 가까운 곳에 배치하라.
버튼 두 개를 너무 가까이 배치하지마라.

드롭다운 메뉴

드롭다운 메뉴를 사용할때는, 옵션이 매우 많은 경우에 사용.
그렇지 않은 경우에는 메뉴를 열고 선택하는 등의 비용이 더 클 수 있다.

인피니트 스크롤

`피드 스타일에서만 사용해야한다.`

컨텐츠의 시작과 끝을 확인할 수 있는 방법이 없다.

한정된 목록을 가진 (할 일, 메시지, 이메일)에서 사용될 경우, 위와 같은 문제로 인해서 페이징 처리를 하는 것이 좋다.

인피니트 스크롤의 경우 `정보 검색성 측면`에서는 문제가 있다.

무엇을 보게 될지를 알 수 없기 때문이다. 실제로 만약 페이지를 새로고침하거나, 페이지를 벗어났다가 돌아오는 경우에는 앞서 본 컨텐츠가 사라질 수 있다.

웹 접근성

컨텐츠로 건너뛰기

웹 사이트에 여러가지 목록(네비게이션) 이후에 컨텐츠가 제공되는 것이 일반적이다. 하지만 시각장애인에게는 이러한 목록을 하나씩 내려가는 것을 원치 않을 것이다. 그렇기 때문에 컨텐츠로 건너뛰기 링크를 사용하는 것이 좋다

<body>
<div class="skip-navigation">
	<p><a href="#content">메뉴 건너뛰기</a></p>
</div>

<div id="wrap">
	<h1><img src="logo.png" alt="OOO구청"></h1>
	<h2>대메뉴</h2>
	<ul>
		<li><a href="intro.html">구청소개</a>
		<li><a href="board.html">참여마당</a>
		----------------------
	</ul>
	----------------------

	<div id="content">
	----------------------

</body>

일반 사용자에게는 보이지 않도록 설정.

.skip-navigation {
	height: 1px;
	width: 1px;
	position: absolute;
	overflow: hidden;
	top: -10px;
}

#UX