접근 가능한 디자인 – 그래픽 디자이너를 위한 5가지 필수 비밀

포용성은 더 이상 무시할 수 없는 디자인 트렌드가 되고 있습니다. 브랜드와 메시지를 정확하게 포착하는 디자인을 만드는 것이 중요합니다. 그러나 더 중요한 것은 고객이 올바른 방식으로 보고 처리하는 디자인을 만드는 것입니다. 여기에는 다양한 종류의 장애가 있는 사람들을 위한 디자인이 포함됩니다. 어떤 형태로든 장애를 안고 사는 인구의 상당 부분이 있습니다. 미국에서만 성인 6,100만 명입니다. 따라서 접근 가능한 디자인은 가볍게 여길 수 없는 것입니다. 세계 장애인의 날은 12월 3일입니다. 이제 접근 가능한 디자인에 대해 이야기할 좋은 시간입니다.

위 이미지에서 숫자 73이 보이시나요? 모두가 할 수 있는 것은 아닙니다! 그리고 색상을 구별하는 데 어려움을 겪는 사람들도 타겟 청중의 일부입니다. 그렇기 때문에 접근 가능한 디자인의 우선순위를 정하는 것이 중요합니다. 어디서부터 시작해야 할지 모르십니까? 우리는 당신을 얻었다! 모든 차이를 만들 수 있는 간단한 조정 및 디자인 고려 사항에 대한 실행 가능한 몇 가지 팁을 제공합니다.

접근 가능한 디자인 - 그래픽 디자인 관점에서

대표적인 광고와 마케팅의 포용성에 대해 이야기할 때 종종 다양한 문화적 표현을 포함한다는 개념으로 제한됩니다. 다양한 인구통계의 사람들이 소속감을 느끼게 합니다. 다양한 인종을 인정하고 포용합니다. 그러나 포용성은 그 이상입니다. 장애가 다른 사용자의 경험을 평가하고 미세 조정하는 것은 포용적 마케팅의 또 다른 중요한 구성 요소입니다.

접근 가능한 디자인은 꽤 방대한 영역입니다. 여기에는 모든 고객 접점에서 접근성을 위한 설계가 포함됩니다. 접근 가능한 UI 디자인부터 모든 종류의 사용자가 간편하게 사용할 수 있는 앱 기능에 이르기까지 브랜드가 취할 수 있는 몇 가지 조치가 있습니다. 하지만 이 블로그에서는 특히 그래픽 디자인의 접근성에 대해 이야기할 것입니다. 여기에는 장애가 있는 사용자가 쉽게 사용할 수 있는 판촉 그래픽을 만드는 것이 포함됩니다.

대부분의 브랜드는 실명 및 청각 장애와 같은 신체 장애를 고려합니다. 그러나 인지 장애에도 상당한 관심이 필요합니다. 실어증, 자폐증, 난독증, ADHD – 당신이 그들에게 제시하는 정보를 사람들이 처리하기 어렵게 만드는 몇 가지 인지 장애가 있습니다. 귀하가 생각하기에 화면에서 훌륭해 보인다고 생각하는 디자인인 귀하의 광고가 그들에게는 매우 다르게 보일 수 있습니다.

예를 들어 텍스트와 배경의 대비가 충분하지 않아 사용자가 중요한 정보를 놓치면 어떻게 될까요? 또는 인포그래픽의 원형 차트에 매개변수마다 다른 색상이 있지만 색맹 사용자가 구분할 수 없는 경우에는 어떻게 해야 할까요? 디자인의 목적이 사라집니다. 이것이 접근성 기능을 고려하는 것이 마케팅 및 브랜딩 디자인에서 중요한 이유입니다.

그리고 가장 중요한 부분은 마케팅에서 접근 가능한 디자인이 결국 그렇게 어렵지 않다는 것입니다. 약간의 조정만 하면 일반 청중과 장애인 모두를 위한 디자인이 준비됩니다. 이를 달성하기 위한 몇 가지 아이디어를 살펴보겠습니다.

1. 타이포그래피에 주의를 기울이세요

타이포그래피의 다양한 측면은 사본의 가독성과 가독성에 영향을 미칩니다. 올바른 서체를 선택하고 글꼴 스타일을 지정하는 데 항상 자신을 제한할 수는 없지만 몇 가지 측면을 고려하면 시각 및 신경 장애가 있는 사람들이 디자인을 훨씬 더 편리하게 만들 수 있습니다.

작은 글꼴을 사용하기 전에 두 번 생각하십시오

작은 글꼴은 눈에 많은 부담을 줍니다. 그리고 사용자가 메시지를 받기 위해 더 열심히 일하게 만듭니다. 그렇지 않을 가능성이 있습니다! 또한 12px 미만의 글꼴은 특히 휴대폰에서 읽기 어려울 수 있습니다. 전 세계 웹 트래픽의 58.99%가 모바일 장치에서 발생한다는 점을 고려할 때 작은 글꼴을 피하는 것은 접근성 디자인을 위한 좋은 결정임이 분명합니다.

따라서 영웅 텍스트의 크고 굵은 글꼴은 주의를 끌거나 스크롤을 멈추는 역할을 할 뿐만 아니라 여러 사용자가 쉽게 읽을 수 있도록 합니다. 다른 섹션의 글꼴 크기를 다양화하면 모든 종류의 사용자가 계층 구조를 더 쉽게 이해할 수 있습니다. 가장 큰 글꼴은 대부분의 사람들이 가장 먼저 인지하는 글꼴이고 가장 작은 글꼴은 아마도 마지막 글꼴이기 때문입니다.

당신이 선택한 서체는 중요하다

아름답고 읽기 쉬운 세리프 글꼴이 많이 있습니다. 의심의 여지가 없습니다. 그러나 시각 장애가 있는 사람들을 염두에 두고 디자인하는 경우에는 산세리프 글꼴이 분명한 이점이 있습니다. 깔끔하고 군더더기 없는 글자 모양으로 읽기가 더 편리합니다. 그리고 이것은 인쇄 및 디지털 디자인 모두에 적용됩니다.

산세리프 서체 내에서는 획이 매우 가는 글꼴을 피해야 합니다. 장식 글꼴은 시각 장애가 있는 사용자를 위해 디자인할 때 작동하지 않는 다른 종류입니다. 적당히 장식적인 글꼴을 사용하는 것은 괜찮습니다. 그러나 핵심 메시지를 전달하는 섹션, CTA 및 텍스트가 많은 영역은 더 읽기 쉬운 대안이 있어야 합니다.

글자 간격에 주의하세요

커닝 또는 사본의 문자 사이의 간격은 독자가 정보를 올바르게 읽을 수 있도록 합니다. 그리고 그들은 어려움 없이 그것을 읽는다. 서로 너무 가까운 글자는 전체 텍스트를 읽기에 불편하게 만들 수 있습니다. 시각 장애가 있고 읽기에 인지 장애가 있는 사람들에게 글자 사이의 간격이 너무 작으면 더 큰 문제가 됩니다. 청중에게 의도한 효과가 없다면 좋은 카피가 무슨 소용이 있겠습니까? 또는 나쁜 경험으로 인해 고객이 귀하의 브랜드를 포기한다면 어떻게 될까요?

적절한 간격의 문자와 어수선하지 않은 전체 레이아웃이 필요한 것입니다. 바쁜 디자인이 아닙니다. 장애인뿐만 아니라 아무도 그것을 좋아하지 않습니다.

위의 명함은 마음챙김 타이포그래피 조정에 대한 위의 모든 아이디어를 통합합니다. 전체적으로 단순한 산세리프 글꼴을 사용합니다. 문자 사이의 간격은 텍스트를 읽을 수 있게 합니다. 그리고 마지막 터치로 QR 코드는 완벽한 하이브리드 디자인을 만드는 데 도움이 됩니다. 코드를 스캔하면 웹 사이트 링크, 소셜 미디어 페이지 및 직통 링크가 있는 디지털 명함으로 이동합니다. 이처럼 사용자 중심의 감각적인 디자인은 모든 유형의 사용자가 좋아할 것입니다.

Kimp Tip: 선택한 타이포그래피가 독자의 눈에 편한지 모르겠나요? 아래 문자를 서로 옆에 적으십시오.

• 대문자 "i"
• 소문자 "l"
• 그리고 숫자 "1"

그리고 글꼴 크기의 경우 디자인에서 조금 떨어져서 확대하지 않고도 편안하게 텍스트를 읽을 수 있는지 확인하세요. 팀원들로부터 몇 가지 다른 관점을 얻으면 좋습니다.

타이포그래피 작업이 걱정되시나요? Kimp 팀에 문의하십시오.

2. 색상 대비는 특별한 주의가 필요합니다.

대비는 모든 디자인에서 필수적인 요소입니다. 색상 대비는 두 색상이 얼마나 다른지 알려줍니다. 색상이 거의 혼합되면 대비가 너무 낮은 경우 전경과 배경에 나란히 배치하거나 서로 겹쳐 배치합니다. 좋지 않은 대비는 모든 종류의 사람들에게 고통이 될 수 있습니다. 그리고 시각 장애가 있는 사람들이 메시지를 소비하기가 특히 어렵습니다.

W3C(World Wide Web Consortium)에 따르면 전경 텍스트와 배경 간의 명암비는 4.5:1 이상을 권장합니다.

동시에 대비가 너무 높으면 여전히 많은 불편함을 유발할 수 있습니다. 빨간색 배경에 녹색 텍스트가 있는 아래 예가 좋은 예입니다. 대비가 높지만 조합이 눈에 무거울 수 있습니다.

또한 고대비 색상과 관련된 깜박임 및 번쩍이는 애니메이션을 원하지 않습니다. 빛에 민감한 사람들에게는 힘들 수 있습니다.

Kimp Tip: 글꼴로 선택한 빨간색이 회색 배경에서 잘 보일지 궁금해하는 대신 WebAIM Contrast Checker와 같은 온라인 도구를 사용하여 명암비를 알아보세요.

3. 텍스트 오버레이 사용 시 주의

접근 가능한 디자인을 만들려는 경우 피해야 할 또 다른 디자인 측면은 복잡한 배경에 텍스트 오버레이를 배치하는 것입니다. 백그라운드에서 많은 작업이 진행 중일 때는 가장 읽기 쉬운 글꼴도 읽기 어려운 경우가 있습니다. 예를 들어 난독증이 있는 사람에게는 더 힘들 수 있습니다. 인구의 약 10%가 난독증을 앓고 있습니다. 비즈니스 전단이나 명함 또는 소셜 미디어 디자인은 읽기 쉬워야 합니다.

복잡한 배경은 사진이나 무늬가 있는 배경이 될 수 있습니다. 이 두 디자인 모두 훌륭한 배경을 만들지만 전경에 있는 텍스트를 제대로 표현하지 못할 수도 있습니다.

이를 방지하기 위해 단색 또는 반투명한 텍스트 상자나 악센트를 사용할 수 있습니다. 글꼴 색상과 악센트 색상 사이의 명암비를 다시 확인하십시오.

예를 들어, 아래 디자인은 사진을 빛나게 하는 동시에 텍스트를 읽기 쉽게 만듭니다.

대비 관련 문제는 특히 식품 라벨이나 의약품 라벨과 같은 응용 분야에서 폭발할 수 있습니다. 알레르기 고지 사항이나 성분 목록 및 복용량 지침이 명확하지 않은 경우 포장 디자인이 사용자에게 안전상의 위험이 될 수 있습니다.

따라서 작업할 수 있는 공간이 제한된 패키징과 같은 응용 프로그램의 경우 시도해 볼 수 있는 아이디어가 있습니다. Kellogg's는 시각 장애가 있는 사람들을 위한 특별한 포장 디자인을 도입했습니다. 지원을 위해 스크린 리더를 사용하는 사람들이 스캔할 수 있는 온팩 코드가 있습니다. 이는 디자인을 하이브리드로 유지하고 모든 종류의 청중에게 적합하도록 하는 한 가지 방법일 뿐입니다.

4. 색맹을 위한 디자인

색상 선택은 그 자체로 스트레스가 많은 결정입니다. 하지만 색맹이 있는 사용자에게 적합하도록 만들어야 한다면 어떨까요? 좋은 소식은 많은 디자인 도구를 사용하여 색맹인 사람들을 위해 디자인할 수 있다는 것입니다.

색맹의 가장 흔한 유형은 적색맹, 황색맹, 삼색맹입니다. 최종 사용자가 한 색상을 다른 색상과 다르게 볼 수 없는 경우 글꼴 및 배경에 다른 색상을 사용하거나 인포그래픽의 계층 구조를 캡처하기 위해 다른 색상을 사용하는 결정은 모두 무의미한 것으로 판명됩니다.

색맹은 백인 남성에게 가장 흔한 것으로 추정됩니다. 이것이 대상 청중을 설명하는 경우 색맹 안전 색상 팔레트를 선택하는 것에 대해 논쟁의 여지가 없습니다.

Adobe 색상과 같은 도구를 사용하면 색상 팔레트가 색맹 안전 여부를 확인할 수 있습니다. 선택한 색상이 색맹인 사람에게 어떻게 보이는지 시뮬레이션을 보고 동일하게 나타나는 색상을 식별할 수 있습니다. 아래 이미지에서 가로줄이 나타나는 색상은 색맹 사용자와 비슷하게 보이는 색상입니다. 접근 가능한 디자인을 목표로 한다면 이러한 까다로운 조합을 피하십시오.

또는 기존 디자인을 확인하고 색맹에 안전하도록 만들고 싶다면 Coblis-Color Blindness Simulator와 같은 온라인 도구를 사용하여 디자인이 색맹 사용자에게 어떻게 보이는지 확인할 수 있습니다.

CTA 버튼이 튀어나와 일반 사용자의 관심을 끌지만 색맹 사용자의 배경에서는 거의 보이지 않는다면 여전히 표시를 놓치고 있는 것입니다. 모든 사용자가 중요하고 모든 사용자 상호 작용이 중요합니다. 따라서 올바른 색상을 선택하십시오.

Kimp 팁: 색상 기반 계층 구조에만 의존하는 대신 글꼴 크기 및 기타 요소를 사용하여 내용을 명확하게 만드십시오.

5. 동영상에는 명확한 캡션을, 이미지에는 대체 텍스트를 추가하세요.

일부 사용자는 스크린 리더에 의존한다는 점을 기억하세요. 따라서 관련 대체 텍스트를 사용하지 않는 한 이미지가 그들에게 아무 소용이 없을 수 있습니다. 예, 대체 텍스트는 SEO에 도움이 되는 것 이상의 역할을 합니다. 사용자가 액세스할 수 있는 디자인을 만드는 데 도움이 됩니다. 하지만 예, 요점을 유지하십시오 – 긴 설명을 피하십시오.

비주얼의 다른 텍스트 측면은 비디오의 캡션입니다. 자동으로 생성된 자막에 의존하지 마세요. 텍스트 오버레이를 사용하여 비디오를 통해 사용자를 안내합니다. YouTube에서 챕터를 만들어 더 나은 콘텐츠를 만들 수 있습니다. 마지막으로 배경으로 사라지지 않는 명확하고 읽기 쉬운 글꼴로 캡션을 추가하세요. 그리고 여기에 움직이는 배경이 있다는 것을 기억하십시오.

캡션을 추가하면 소셜 미디어에서 자신의 비디오를 음소거 상태로 시청하는 것을 선호하는 사람들의 요구 사항을 충족하는 데도 도움이 됩니다. 어느 쪽이든 승리입니다. 소셜 미디어 플랫폼이 최근 비디오에 대한 자동 캡션을 추가한 LinkedIn과 같은 접근성 기능을 우선시한다는 사실은 접근성 디자인을 진지하게 받아들여야 할 때라는 좋은 지표입니다.

Kimp로 접근 가능한 디자인 단순화

마케팅에서 접근 가능한 디자인은 청중 그룹 중 하나의 어려움과 요구 사항을 무시하지 않고 시각적인 힘을 활용하는 것입니다. 사실, 잠시 동안 "대상 그룹"의 개념을 잊어버리고 일련의 고유한 개인과 일대일로 통신하고 있음을 이해하십시오. 그것은 브랜드 디자인을 보는 방식을 바꿉니다! 그리고 브랜드를 위해 이러한 접근 가능한 디자인을 만드는 데 도움이 필요한 경우 당사 디자이너에게 알려주시면 다양한 고객 인구 통계의 요구를 충족할 수 있는 최고의 광고 및 소셜 미디어 게시물을 제안할 수 있도록 기꺼이 도와드리겠습니다.

지금 가입 하고 Kimp 구독을 7일 동안 무료로 사용해 보세요.

관련 게시물