WORK ABOUT LAB CONTACT
contact@yellow-finger.com
02.2205.4128
Designing for (Realistic) Attention
(현실적인) 주의를 끌기 위한 디자인
Designing for (Realistic) Attention
When I advise that a webpage — like a service detail page — have a maximum main body word-count of 150 words, I’m really recommending that it ask a
서비스 세부 정보 페이지와 같은 웹 페이지에 최대 150단어의 본문 단어 수가 있다고 조언할 때, 저는 정말로 그것이 다음과 같은 질문을 하는 것을 추천합니다
요약 :)
서비스 세부 정보 페이지와 같은 웹 페이지의 최대 본문 단어 수가 150단어라고 조언할 때 독자에게 30초를 약속하도록 요청하는 것이 정말 좋습니다. 우리가 역사적으로 SEO를 염두에 두고 작성한 유형인 1,500단어 기사를 읽는 데 6-10분 정도 걸릴 수 있습니다. 검색 엔진 알고리즘이 길이를 보상하더라도 점점 더 적은 수의 사람들이 그렇게 하고 있습니다.

내가 말했듯 이 평균적인 사람은 분당 250단어를 읽을 수 있습니다 . 그렇게 하기로 선택한 사람은 거의 없습니다 . 이 게시물에서 다른 것을 얻지 못하면 그대로 두십시오.

이것이 스캔 만 하는 사람들을 위해 페이지를 구조화하는 것이 매우 중요한 이유입니다.

최근에 아웃라인은 정보 아키텍처라고 썼습니다 . 나는 사람들이 페이지의 내용을 빠르고 정확하게 훑어볼 수 있는 것이 얼마나 중요한지 강조했습니다 . 아웃라인의 들여쓰기/내어쓰기 구조는 스캐너가 콘텐츠와 해당 메타 콘텐츠를 모두 이해하는 데 도움이 됩니다.

더보기→

출처.
Christopher Butler. (2023.05.05). chrbutler. Designing for (Realistic) Attention . 2023.05.08. https://www.chrbutler.com/designing-for-realistic-attention
평균적인 사람은 분당 250단어를 읽을 수 있습니다. 서비스 세부 정보 페이지와 같은 웹 페이지의 최대 본문 단어 수가 150단어라고 조언할 때 독자에게 30초를 약속하도록 요청하는 것이 정말 좋습니다. 우리가 역사적으로 SEO를 염두에 두고 작성한 유형인 1,500단어 기사를 읽는 데 6-10분 정도 걸릴 수 있습니다. 검색 엔진 알고리즘이 길이를 보상하더라도 점점 더 적은 수의 사람들이 그렇게 하고 있습니다. 내가 말했듯 이 평균적인 사람은 분당 250단어를 읽을 수 있습니다 . 그렇게 하기로 선택한 사람은 거의 없습니다 . 이 게시물에서 다른 것을 얻지 못하면 그대로 두십시오. 이것이 스캔 만 하는 사람들을 위해 페이지를 구조화하는 것이 매우 중요한 이유입니다. 최근에 아웃라인은 정보 아키텍처라고 썼습니다 . 나는 사람들이 페이지의 내용을 빠르고 정확하게 훑어볼 수 있는 것이 얼마나 중요한지 강조했습니다 . 아웃라인의 들여쓰기/내어쓰기 구조는 스캐너가 콘텐츠와 해당 메타 콘텐츠를 모두 이해하는 데 도움이 됩니다. 스캐닝은 콘텐츠 및 메타 콘텐츠를 처리하는 방법입니다. 단락의 주제는 내용입니다. 메타 콘텐츠는 다른 단락, 헤드라인 등과의 관계입니다. 예를 들어 지금 읽고 있는 단락의 주제는 콘텐츠와 메타 콘텐츠를 구분합니다. 이 단락 위의 헤드라인은 단락과 시각적 개체로 결합되어 둘 사이의 메타 콘텐츠 또는 "부모/자식" 관계를 생성합니다. 헤드라인 스캔, 단락 읽기 헤드라인 구조 스캔은 콘텐츠와 메타 콘텐츠를 모두 명확하게 만듭니다. 뒤에 오는 내용을 정의하고 그 아래에 있는 단락이나 텍스트와 어떻게 관련되는지(예: 요약) 시각적으로 보여줍니다. 페이지에서 정보를 신중하게 배열하면 스캐너가 주제와 의도를 매우 빠르게 파악하는 데 도움이 되며 페이지 레이아웃에 사용할 수 있는 시각적 규칙에 쉽게 적용할 수 있습니다. 개요의 텍스트와 같은 시각적 요소 정렬 세로 방향 구조에서 뒤따르는 요소보다 폭이 넓은 요소는 텍스트 개요의 헤드라인처럼 작동합니다. "풀 블리드 히어로 이미지" 또는 "풀 블리드 행"과 같이 시각적으로 페이지의 전체 너비에 걸쳐 있는 요소는 스캐너에 페이지 콘텐츠의 최상위 수준에 대한 전체 "내어쓰기" 신호를 보냅니다. 예를 들어 스캐너가 더 좁은 텍스트 열 중간에서 풀 블리드 요소를 발견하면 거의 페이지 헤더로 돌아가는 것과 같습니다. 이 요소는 뒤따르는 요소를 지원하는 요소가 아니라 일반적으로 전체 페이지와 관련되어 있음을 나타냅니다. 그것은 사실일 수도 있고 아닐 수도 있습니다. 그러나 일반적으로 풀 블리드 요소를 사용하는 디자이너는 "위로 돌아가기" 또는 "완전히 내어쓰기" 메시지를 전달하려는 의도가 없습니다. 특히 특별한 요소 또는 이미지. 물론 이것은 스캐너와 진정한 풀 블리드 시각적 범위를 혼동하지 않고도 수행할 수 있습니다. 텍스트 개요가 작동하는 방식을 고려하고 이를 페이지의 정보 아키텍처에 적용할 때 가장 미묘한 들여쓰기 및 내어쓰기도 페이지에 대한 스캐너의 이해를 안내하는 데 매우 효과적입니다. 활동적인 청중 과 주변 인식을 위한 디자인 페이지 방문자의 80%는 페이지 를 읽지 않는다는 점을 기억하세요 . 항상. 20% - 기껏해야 - 그렇게 할 것입니다. 그렇다고 해서 100%의 노력이 20%의 청중에게만 도움이 된다는 의미는 아닙니다. 청중의 80%가 활동적인 것으로 간주될 수 있는 반면 청중의 20%는 주위를 의식하고 있는 것으로 간주되어야 함을 의미합니다. 그러나 100%의 노력은 청중 100%에게 서비스를 제공하는 데 사용되어야 합니다. 다음은 매우 간단한 예입니다. 일반적으로 사례 연구의 헤드라인은 (1) 문제 , (2) 솔루션 , (3) 결과 의 개념적 구조를 모두 따르는 경향이 있으며 문자 그대로 그렇게 작성됩니다. 그러나 문제 제목을 문단 위에 두는 것은 라벨만 붙일 뿐입니다. 스캐너가 뒤따르는 텍스트를 읽을 것이라고 가정합니다. 그러나 대부분의 스캐너가 이 작업을 수행하지 않는다는 것을 알고 있으므로 단락의 내용을 요약하기 위해 헤드라인을 다시 작성하는 것이 옳은 일입니다. 예를 들어 " 솔루션 "은 " 출시 시간 60% 단축 "이 됩니다. 이 작은 카피라이팅 노력은 청중의 100%에게 도움이 됩니다. 시각적 언어는 항상 구조를 제공해야 합니다. 시각적 언어 아래에서 페이지의 구조를 보기 시작하면 포함된 내용, 관련 여부 및 다음에 수행해야 하는 작업을 스캐너에 더 잘 알리도록 조정할 수 있는 많은 기회를 찾을 수 있습니다.