모든 하이퍼 링크가 기본 색상 (링크의 경우 파란색, 방문한 링크의 경우 보라색) 인 사이트를 만들었습니다. 그들은 호버에서 빨간색으로 변합니다.
하이퍼 링크에 항상 파란색을 사용하는 것이 좋습니다. 따라서 사용자는 하이퍼 링크가 무엇인지, 그렇지 않은 것이 무엇인지 신속하게 확인할 수 있습니다. 그러나 내 동료 중 일부는 동의하지 않고 다른 색상을 원합니다.
이것에 대한 당신의 생각은 무엇입니까?
방문하지 않은 링크의 경우 # 0000FF 및 방문한 링크의 경우 # 800080과 같은 표준은 거의 모든 사람이 사용하는 경우에만 좋습니다. 그렇지 않으면 사용자는 표준이 언제 준수되는지 예측하지 못하므로 더 이상 표준을 사용하여 사이트 동작을 예측할 수 없습니다. 불행히도 대부분의 웹 사이트는 이러한 색상 표준을 따르지 않습니다. 우연한 설문 조사 (임의의 설문 조사와 혼동하지 말 것)에서 3 분의 1 미만의 사이트가 표준을 준수하는 것으로 나타났습니다. 내 경험상 웹에 비교적 익숙하지 않은 사용자는 표준을 알지 못할 수도 있습니다. 단지 자신의 경험에서 얻을 수있는 것이 아닙니다. 색상이 디자이너가 표준을 엄격하게 준수하기위한 미적 및 브랜딩 목적으로 그래픽 속성에서 너무 중요한 것으로 입증되었습니다. 솔직히 말해서, 그것은 훌륭한 표준이 아니 었습니다. 일부 사용자는 채도가 높은 파란색 텍스트, 특히 오래된 사용자에게 집중하기가 어렵습니다. 전반적으로이 표준을 더 이상 준수 할 필요가 없다고 생각합니다.
그러나보다 광범위하게 정의 된 의미에서 링크를 파란색으로 만드는 것이 여전히 타당합니다. 내가 조사한 사이트의 80 % 이상이 링크에 파란색 음영을 사용합니다. 따라서 표준 사용자가 신뢰할 수있는 표준은 아니지만, 푸르스름한 색이 다른 색보다 더 링크 적이라고 가정하는 경향이 있습니다. 내가 본 것에서 뚜렷한 색상 인 경우 링크에 파란색이 아닌 색상을 사용하여 벗어날 수 있습니다. 각 컬러 텍스트 위에 마우스를 문질러 링크인지 확인하십시오). 그러나 파란색을 사용하는 것이 합리적이라면 파란색으로 이동하십시오.
색상 선택보다 더 중요한 것은 링크에 밑줄 , 적어도 상단 또는 사이드 바 메뉴에없는 링크의 경우입니다. 내가 본 사이트의 90 % 이상이 링크를 구별하기 위해 밑줄을 긋는 것으로 보았지만 (종종 마우스 오버에만 해당됨) 매우 일관된 규칙을 따릅니다. 밑줄은 또한 완전히 색맹 인 소수의 사용자와 관련된 문제를 포함하여 색상의 접근성 문제를 깔끔하게 회피합니다.
6 년 전 Jakob Nielsen이 권장하는 것과 동일한 것 을 추천합니다.
기부 사이트의 경우, 방문하지 않은 모든 링크에 대해 하나의 색상을 사용하십시오. 방문하지 않은 링크를 의미하기 위해 여러 색상을 사용하면 사이트의 학습 부담이 증가하고 사용자가 선택할 링크를 검색하기가 더 어려워집니다.
"컬러"란 색조가 있음을 의미합니다. 링크는 검은 색, 흰색 또는 회색이 아니어야합니다. 색상이 아닌 것은 사용자에게 연결되지 않은 텍스트를 나타냅니다.
사이트의 팔레트에 파란색이 있으면 해당 파란색을 사용하여 링크하십시오.
사이트에서 비 링크 텍스트에 대해 선택한 링크 색상을 사용하지 마십시오. 이렇게하면 링크가 무엇인지 링크가 아닌지에 대해 혼동을 일으켜 링크 색칠의 목적을 상실하게됩니다.
모든 링크에 밑줄을 긋습니다. 마우스 오버 밑줄을주의해서 사용하십시오. 링크가 파란색이거나 링크가 상단 또는 사이드 바 메뉴에있는 경우에만 고려합니다.
비 링크에 밑줄을 긋지 마십시오. 강조하기 위해 기울임 꼴 또는 굵게를 사용하십시오.
정적 콘텐츠가있는 사이트의 경우 연구에 따르면 다른 색으로 방문한 링크 를 표시하는 것이 좋습니다. 그러나 방문하지 않은 링크에 특정 색상이 없으면 방문한 링크에 무엇을 사용해야하는지 알기가 어렵습니다. 내가 조사한 사이트 중 3 분의 1만이 방문한 링크와 방문하지 않은 링크를 구별하며, 이들 중 대부분은 방문한 링크에 자주색을 사용하지 않으므로이 사용자가이 컨벤션에 얼마나 익숙한 지 모르겠습니다. 색상 코딩은 여기에서 임의적입니다. "방문"을 의미하는 자주색 자체는 없습니다. 사용자는 링크를 클릭하고 돌아가서 색상 변경을 확인한 후 의미를 유추 할 수 있지만 한 달 후 사이트로 돌아 오는 사용자를 상상하고 일부 링크는 한 가지 색상이지만 다른 일부는 다른 색상입니다. 어느 것이 어느 것인지 기억하기 어렵다.
내가 제안 할 수있는 것은 더 넓은 사용자 경험을 활용하고 방문한 링크에 "착한"색을 적용하는 것입니다. 방문하지 않은 링크의 색상보다 색 채도가 낮아야하지만 (# 800080 대 # 0000FF 사용에 따라) 채도를 낮추는 것만으로는 모든 사용자가 방문하지 않은 곳과 적절히 구분하기에 충분하지 않을 수 있습니다. 또 뭐요? 자주색 대 파란색을 사용하는 것과 일관되게 일부 사이트처럼 색조를 빨간색으로 이동합니까? 다른 사이트처럼 링크를 "흐리게"보이도록 더 밝은 색상을 사용 하시겠습니까? 일반 텍스트와 링크가 더 잘 어울리도록 다른 사이트처럼 어두운 색상을 사용 하시겠습니까? 나는 이것이 약간의 연구가 필요하다고 생각하고, 우리는 그것을 표준으로 만들어야합니다.
컨벤션은 색 구성표에서 허용하는 경우 좋지만 내부 일관성이 더 중요하므로 파란색/보라색/빨간색 팔레트를 고수 할 필요는 없습니다. 또한 링크가 일반 텍스트와 차별화되어야합니다. 차별화는 일반적으로 색상, 무게 또는 밑줄로 수행됩니다. 링크 상태에 따라 색상이 다르면 사용성이 향상됩니다.
링크가 파란색이어야하는지 여부는 오래된 토론입니다. 예를 들어 Jakob Nielsen은 수년에 걸쳐 변화를 겪었지만 이것을 옹호하는 것으로 알려져 있습니다. in Homepage Usability Nielsen & Loranger 2006, 100 쪽).
#0000FF
보다 더 중요한 컬러 링크는 change = 방문한 색상 링크 . 반드시 자주색이 아니라 something (특히) 다릅니다.
나의 (영감받은) 의견 : 미학 is 중요합니다. 따라서 전체 시각적 느낌과 일치하는 distinct 링크 색상 (#0000FF
또는 다른 색상)으로 이동합니다.
이 끔찍한 파란색 인 이유는 색맹 사람들 (즉, 색맹의 가장 일반적인 경우)이 검은 색과 파란색을 구별 할 수 있기 때문에 실제로 차이를 볼 수 있기 때문입니다. 휴면 가능한 사용자가 색맹 일 가능성이있는 경우 (예 : Google 또는 bing)이 규칙을 따르는 것이 좋습니다. 그렇지 않으면 디자인에서 작동하지 않으면 그렇게 할 필요가 없습니다. 그러나 최소한 링크에 밑줄을 긋거나 색상과 다르게 만들 수 있습니다.
그들은 청색 일 필요는없고 단지 일관성 일 필요는 없습니다. 그리고 일관성있게, 나는 그들이 모두 하나의 색이어야 함을 의미하지는 않습니다. 탐색의 링크 대 바닥 글의 링크 대 콘텐츠의 링크-해당 영역 내에서 일관되고 클릭 가능한 것으로 눈에 띄는 한 각각의 색상을 가질 수 있습니다.
제 생각에는 버튼 색상도 링크 색상과 일치하여 사용자에게 링크 색상이 아니라 "클릭 할 수있는"색상을 제공하는 것이 가장 좋습니다. 또한 방문 링크에 대한 이전 의견에 동의합니다. 크게 다를 필요는 없지만 눈에 띄게 다를 필요는 없습니다.
마지막으로, 링크 색상을 정의 할 때 배경색과 텍스트 색상을 정의하십시오.
흰색 배경, 검은 색 텍스트 및 파란색/보라색 링크로 시작한다고 가정하지 마십시오. 사용자가이를 변경할 수 있습니다. 기본 색상 이외의 색상을 사용하도록 브라우저를 설정해야 사이트 및 기타 여러 사이트에서 색상을 정의하지 못한시기를 확인할 수 있습니다. (브라우저 배경색을 밝은 회색, 적갈색 텍스트, 밝은 녹색 링크, 진한 녹색 방문 링크 및 주황색 링크 호버로 설정했습니다.)
첫째, 링크의 주요 문제는 특정 색상인지 여부가 아니라 링크임을 명확히하기 위해 충분히 차별화되도록하는 것입니다.
@VirtuosiMedia와 @jensgram은 방문한 링크 차별화가 훌륭하지만 여전히 핵심은 단순히 링크가 눈에 띄도록하는 것입니다. 특히, 지금은 정보와는 달리 정보 과부하와 스캔이 많기 때문에 링크를 한눈에 볼 수 있어야하며, 방문한 페이지, 특히 방문한 페이지에서 방문하지 않은 정보를 아는 것이 도움이됩니다. . 많은 사이트가 동일한 자료에 연결된 하나의 주요 주제 영역 또는 산업 내에서 컨텐츠를 읽는 경우 개념이 더 중요하다고 생각합니다. 우리는 항상 사용자가 브라우저 설정에서 방문한 링크의 동작을 무시할 수 있음을 기억해야합니다.
@Lukas와 @Charles 또한 밑줄이 반드시 작동하지는 않는다는 데 동의합니다. 충분히 높은 대비를 위해 디자인하는 경우 단순히 다른 색을 사용하는 색맹 인 사람들에게는 충분하지 않을 수 있습니다. 더 많은 차별화를 제공할수록 링크를 제공 할 수 있고 그 이후의 유사 클래스 변형이 많을수록 좋습니다. 예를 들어 단순한 스타크 디자인의 경우 # 333 텍스트 색상 및 # 000 링크 색상으로는 시력이 낮거나 색맹 인 사용자에게는 충분하지 않지만 검은 색 링크를 굵게 표시하고 밑줄을 만드는 것으로 충분할 수 있습니다. 그런 다음 상태는 호버 및 활성 상태에서 변경 한 다음 다시 위에서 변경 한 경우 # 999와 같이 변경하는 것이 가장 좋습니다.
@Stewbob 정말요? 디자인이 파란색으로 고착 되더라도해야합니까? 거의.
특정 색상이 중요하지 않거나 심지어 밑줄이 있다고 생각하지 않습니다. 그들이 클릭 될 수 있다는 것이 즉시 명백한 한 괜찮습니다.
나는 내가 클릭 할 수있는 것을 찾기 위해 (마우스로) 사냥을 가야했던 사이트에있었습니다. 커서가 작은 손으로 바뀌면 클릭 할 수 있다는 것을 알았습니다. 나에게 그것은 매우 열악한 디자인입니다.
각 사이트 디자인은 다르지만 일반적으로 페이지를 (수동으로)보고 클릭하여 작업을 수행 할 수있는 것이 분명해야한다고 생각합니다. 사물이 좋은 곳이라는 관점에서 일반적인 표준을 따르고 있다고 말하면서. 많은 웹 사이트에서 오른쪽 상단에 계정 정보가 있습니다. 다시 한 번 나는 과거에 "로그 아웃/오프"링크를 찾으려고 5 분 이상을 보내야했던 사이트에있었습니다.