11가지 웹사이트 해킹으로 완벽한 UX 만들기

게시 됨: 2016-06-15

좋은 웹사이트는 사용자가 해당 페이지를 클릭하고, 페이지를 탐색하고, 웹사이트 소유자가 인정할 만큼 충분히 오래 머물게 하는 데 필요한 모든 측면과 요소의 완벽한 조합입니다.

웹 사이트는 주로 최고의 기능, 최고의 전자 상거래 플랫폼 및 최신 확장을 위해 설정되며, 이는 웹 사이트가 지속되어야 하는 경우 매우 중요합니다. 그러나 웹 사이트 평가 연구에서 과소 평가되고 알려지지 않은 또 다른 요소는 UX 또는 사용자 경험입니다. 믿거 나 말거나, 이것은 웹 사이트가 가장 높은 순위의 클릭자가 될 것인지 아니면 인터넷에서 떠 다니는 쓰레기가 될 것인지를 결정하는 주요 요소 중 하나입니다.

UX가 얼마나 중요한가

사용자 경험 또는 UX는 단순히 사용자가 디지털 인터페이스와 상호 작용할 때 느끼는 방식입니다. 대부분의 요소에는 디자이너와 개발자 모두의 철저한 작업이 포함되며 다른 요소에는 환경 및 사용자 기본 설정이 포함됩니다. 이러한 요소는 접근성, 인터페이스의 사용성, 성능, 디자인/테마/미학, 인체 공학 및 마케팅의 유용성으로 구성됩니다. 디지털 플랫폼에서의 모든 인간 상호 작용은 이러한 요소에 크게 의존하므로 인터넷에서 주목을 받아야 하는 좋은 웹 사이트는 이를 UX에 통합해야 합니다.

UX에 영향을 미치는 요소

이러한 요소가 좋은 사용자 경험의 기둥이지만 사용자 경험을 통해 웹사이트의 효율성을 측정하는 인간적인 측면은 사용성에만 국한되지 않습니다. 이 특정 주제에 대한 여러 연구자와 연구를 통해 우리는 인간의 감정이 웹사이트의 외관과 시각적으로 사람을 연결하는 데에도 중요한 역할을 한다는 것을 확인했습니다. 이를 고려하여 웹 사이트 비즈니스에 미치는 영향에 대해 이야기해 보겠습니다.

웹사이트 양식

먼저 양식이 있습니다. 귀하가 정보에 대해 안심할 수 있도록 하지 않으면 아무도 정보를 입력하고 싶어하지 않는다는 점을 기억하십시오. 양식은 의심할 여지 없이 고객으로부터 정보를 획득하고 이를 마케팅, 맞춤형 제품, 가격 견적 및 기타 여러 용도 측면에서 다양한 이점에 사용하는 필수 메커니즘입니다. 양식은 또한 관리자가 청중의 요구를 이해하고 조직의 목표를 설정하는 데 도움이 되는 조회 프로세스의 필수적인 부분입니다.

해결책:

웹사이트에 양식을 유지하고 고객과 계속 소통하려면 질문을 낮게 유지하고 옵션 필드를 허용하고 속성 아래 지침으로 설명을 설정해야 합니다.

필드의 자리 표시자 텍스트

양식에 대해 이야기하면서 자리 표시자 텍스트를 사용하여 양식 필드에 필요한 답변 유형을 예시할 수도 있습니다. 자리 표시자 텍스트는 제거 가능한 텍스트 형식으로 필드에 입력된 예입니다. 아이디어는 정말 훌륭하고 고객이 양식이 요구하는 내용을 더 잘 이해할 수 있도록 도와줍니다. 문제는 내가 많은 웹사이트에서 경험한 것처럼 필드에 정보를 입력하려고 할 때; 자리 표시자 텍스트는 텍스트와 섞여 그대로 유지됩니다. 그것을 제거하는 유일한 방법은 수동으로 삭제하는 것입니다. 그렇지 않으면 양식이 처리되지 않습니다. 이제 정보를 입력해야 하는 20개의 다른 필드가 있다고 상상해 보십시오.

해결책:

고객이 화를 내지 않고 올바른 정보를 입력하도록 하려면 고객이 정보를 입력하는 즉시 자리 표시자 텍스트가 사라지도록 하십시오.

속성의 서식 지정

이 문제는 정보에 적합한 올바른 유형의 필드를 사용하여 피할 수 있습니다. 다만, 이와 같은 규정이 없는 경우에는 반드시 숫자, 문자 등 이용자가 입력해야 하는 정보의 형식에 관한 지시를 추가하여야 합니다. 고객이 잘못된 형식의 정보를 입력할 때까지 기다렸다가 오류 메시지만 수신하면 해당 사용자는 상점에서 사라진 것과 같습니다.

해결책:

이것은 고객이 좌절하고 웹 사이트를 포기하기로 결정할 때 주로 결제 페이지에서 발생합니다. 필드 아래의 예를 사용하여 사용자를 명확히 할 수 있습니다.

오류 메시지 방지

오류 메시지가 전문 웹사이트에서 자동화된 수정 시스템의 필수적인 부분이라는 것을 누구도 반박할 수 없습니다. 그러나 그것들을 사용하는 방법이 더 큰 논쟁거리입니다. 이러한 메시지가 고객의 UX에 어떤 영향을 미치는지 이해하기 위해 등록을 위해 사용자 ID와 비밀번호를 입력하여 제품을 구매하려는 온라인 구매자의 입장이 되어 보겠습니다. 6-7번 시도하면 등록할 수 없습니다. 오류 메시지에는 "사용자 ID를 다시 입력하십시오"만 표시되며 "해당 사용자는 이미 사용 중입니다"라고 표시되어야 합니다!

해결책:

이러한 알 수 없는 오류 메시지는 고객을 좌절시키고 즉각적인 이탈로 이어집니다. 항상 개발자에게 오류 메시지가 다시 표시되는 것을 방지하기 위해 올바른 조치를 취해야 하는 것을 사용자에게 적절하게 알려주는 자체 설명 오류 메시지를 생성하도록 요청하십시오.

큰 헤더

나는 이 일이 어떻게 발전했는지 이해할 수 없는 것 같으며, 웹사이트의 페이지에 대형 고정 탐색 헤더를 사용하는 웹사이트의 수가 증가하면서 인터넷에서 트렌드가 되었습니다. 이제 문제는 사용자가 페이지를 아래로 스크롤할 때마다 실제로 중요한 콘텐츠를 보는 데 어려움을 겪는다는 것입니다. 이러한 큰 헤더 및 유사한 요소는 콘텐츠를 차단하고 사용자가 그 아래의 중요한 콘텐츠를 읽거나 볼 수 없도록 합니다. 카테고리와 더 큰 글꼴이 있는 더 큰 웹 사이트에서는 콘텐츠가 완전히 숨겨지기 때문에 이 문제가 더욱 중요해집니다.

해결책:

이 문제를 해결하기 위해 관리자는 개발자에게 이러한 대형 고정 탐색 헤더를 사용하지 않고 대신 사용자가 텍스트를 제대로 읽을 수 있도록 하는 간단한 헤더를 사용하도록 요청할 수 있습니다.

반응형 디자인 채택

기하급수적인 기술과 가제트의 현대 시대에 압도적인 비율의 온라인 사용자가 랩톱이나 데스크톱 컴퓨터에 비해 상대적으로 작은 화면을 가진 태블릿 및 기타 휴대용 장치에서 웹사이트를 보고 사용합니다. 문제는 웹 사이트가 더 작은 화면에서는 수용하지 못하는 반면 더 큰 화면에서는 완벽하게 수용할 때 발생합니다. 이것은 고객을 위한 직선적인 "NOP"입니다. 장치에서 웹 사이트를 확장할 수 있는 기능이 없으면 대부분의 사용자가 휴대용 장치에서 탐색하기 때문에 웹 사이트는 사용자에게 도달하지 않습니다.

해결책:

반응형 웹사이트는 모든 장치에서 패닝, 크기 조정 및 스크롤을 최소화하여 최적의 보기 및 대화형 경험을 제공할 수 있는 사이트를 만들기 위한 웹 디자인 접근 방식입니다.

대비를 위해 더 밝은 음영 사용

공식적으로 검은색인 것과 대조적으로 어두운 것을 보아야 할 때 어떤 일이 발생합니까? 당신은 내 요점을 이해합니까? 설명하겠습니다. 텍스트에 어두운 글꼴을 사용하고 더 어두운 배경에 설정하면 그 결과 사용자는 절대적으로 실명하게 됩니다. 평행 스펙트럼 글꼴과 대비는 읽기 장애를 유발할 뿐만 아니라 고객에게 잘못된 선택을 반영하므로 절대 선택하지 마십시오.

해결책:

대비로 밝은 색조를 사용할 수 있습니다. 나는 많은 상위 순위 웹 사이트에서 직접 보았습니다. 그들은 노란색, 옅은 흰색, 구름 흰색 및 밝은 주황색과 같은 밝은 색조를 배경으로 영리하게 사용했습니다.

텍스트 및 이미지

웹사이트는 멀티미디어만큼이나 텍스트 중심이어야 합니다. 사용자는 단순히 텍스트 설명에 의존하여 제품을 그릴 수 없습니다. 눈은 서면 문서보다 이미지의 시각적 세부 사항을 훨씬 더 신뢰하지만, 서면 세부 사항 없이는 이미지가 의도한 대로 말할 수 없습니다. UX 외에도 텍스트는 SEO 기술을 통한 마케팅과 관련하여 매우 중요합니다.

해결책:

타이포그래피, 색상 및 크기가 대다수의 심리적 호소에 맞도록 최적화되어 있는지 확인해야 합니다. 마찬가지로 사용하는 이미지는 이상적인 보기 경험을 위해 확대/축소 기능이 있는 HD여야 합니다.

색상 선택

사람의 눈은 약 천만 가지 색상을 감지할 수 있지만 웹사이트에 사용할 색상을 선택하여 글꼴에 추가할 수 있다는 의미는 아닙니다. 많은 색상이 단순히 공존할 수 없으므로 색상을 신중하게 선택해야 합니다. 짙은 파란색이 검정색 배경과 구별되지 않는 것처럼 주황색 배경에 네온 녹색을 스팸할 수 없습니다.

해결책:

현재 어떤 색상이 유행하고 있는지는 잘 모르겠지만, 클릭 유도문안 버튼에는 녹색을, 음수 간격에는 흰색을, 대부분의 글꼴에는 검정색을 적절하게 사용하는 것은 모든 웹사이트에서 통합하는 안전한 방법입니다. 언제든지 예술적인 터치를 줄 수 있지만 위에서 언급한 기본 규칙을 준수하면 됩니다.

행동 촉구

우리의 일상 생활에서 예를 들어 설명하겠습니다. 평범한 날 노점상에게서 물건을 사려고 할 때, 물건을 보지 않고 포장 마차 근처로 끌리는 이유는 무엇입니까? 대부분의 공급업체가 관심 지점을 통합하여 구매자를 끌어들이기 위해 사용하는 구호입니다. 유사하게, 귀하의 상점은 "행동 유도"를 올바르게 사용하는 경우에만 구매자를 유치하기에 충분할 것입니다.

솔루션:

"행동 유도"는 청중이 특정 행동을 실행하도록 즉시 유발하는 트리거입니다. 세련된 버튼이 있는 매력적인 문구나 문장을 사용하면 매우 좋은 클릭 유도문안을 만들 수 있습니다.

모바일 기기용 터치 기능

이것은 흥정하기 가장 성가신 요소 중 하나이며 가장 나쁜 부분은 사이트 소유자가 무차별적으로 하고 있기 때문에 인터넷 전체에 퍼진다는 것입니다. 귀하의 설정이 모바일 사용자를 위한 터치 대상인 경우, 하나님의 사랑을 위해 사용자가 상호작용할 수 있는 공간을 남겨주세요. 나는 온라인 상점에서 야구 모자를 사려고 했지만 엄지손가락으로 "결제" 버튼을 누르려고 할 때마다 "평가" 버튼을 누르지 않을 수 없었습니다. 이것은 사용자를 좌절시킬 뿐만 아니라 웹사이트에서 멀어지게 만듭니다.

해결책:

다른 사용자는 나만큼 참을성이 없을 것이므로 자신의 웹사이트에 갇히기 전에 디자이너에게 웹사이트의 다른 터치 대상 옆에 적절한 간격으로 버튼을 배치하도록 요청하십시오. 그렇지 않으면 구독자나 구매자를 얻지 못할 수 있으며 문제를 파악하지도 못합니다.

결론

이 모든 악명 높은 문제는 열심히 일한 많은 웹 사이트가 UX 문제를 일으켜 결국 웹 사이트를 인터넷에 떠 다니는 유령선으로 손상시키는 주요 이유입니다. 약간의 노력을 추가하고 예방 조치를 취함으로써 이러한 문제가 비용이 많이 드는 재앙으로 이어지는 것을 방지할 수 있습니다. 이러한 문제 각각에 대한 솔루션에 주의를 기울인다면 사용자와 고객에게 유망한 경험을 성공적으로 제공할 뿐만 아니라 웹사이트를 검색 엔진의 최고 클리커로 올릴 수 있을 것이라고 확신합니다. UX와 관련하여 " 고객 경험에서 시작하여 기술로 다시 작업해야 합니다." – 스티브 잡스 .