효과적인 이메일 및 랜딩 페이지에 적합한 색상 선택

게시 됨: 2014-08-28

색상은 강력합니다. 감정을 전달하고, 관심을 끌고, 분위기를 조성하고, 진술할 수 있습니다. 또한 귀하의 이메일을 군중에서 눈에 띄게 만들 수 있습니다. 그러나 더 중요한 것은 올바른 색상 조합을 통해 온라인 마케팅 캠페인을 모든 유형의 잠재 고객이 액세스하고 읽을 수 있도록 할 수 있다는 것입니다. 색상이 메시지를 전달할 수 있는 다양한 방법을 살펴보고 시각적 접근성을 위한 몇 가지 모범 사례와 온라인 도구를 살펴보겠습니다.

색상 상자 분위기 조성

색상은 이메일과 랜딩 페이지에서 전반적인 느낌을 불러일으키는 데 좋습니다. The Logo Company에 따르면 일반적으로 각 색상과 관련된 특성은 다음과 같습니다.

  • 빨간색: 흥분, 에너지, 대담함, 로맨스
  • 녹색: 평화, 성장, 건강, 자연
  • 파란색: 신뢰, 믿음직함, 힘, 침착함
  • 주황색: 친근함, 쾌활한 자신감, 창의성
  • 검은색: 힘, 힘, 정확성
  • 흰색: 깨끗하고 단순하며 쉬움

물론 색상의 의미는 시간이 지남에 따라 바뀔 수 있습니다. 1940년대까지 어린 소년은 소녀가 아닌 분홍색 옷을 입었습니다. 그 의미는 전 세계를 여행하면서 바뀔 수도 있습니다. 전 세계 고객을 대상으로 마케팅하는 경우 동일한 색상이 다른 고객에게 다른 의미를 가질 수 있음을 염두에 두어야 합니다. 예를 들어, 보라색은 일본에서는 특권과 부의 색이지만 브라질에서는 종종 애도의 색입니다. 중국에서 빨간색은 행운과 행복을 의미할 수 있습니다. 다른 문화권에서는 전쟁, 위험 또는 욕망을 의미할 수 있습니다.

색상 결합

이메일 및 웹 디자인에서 색상은 독자에게 중요한 메시지와 행동 촉구를 안내하는 데 중요한 역할을 합니다. 색상이 너무 많으면 산만해질 수 있습니다. 색상이 너무 적으면 메시지가 혼란스럽거나 재미가 떨어질 수 있습니다. 색상은 메시지의 전체 계층 구조를 설정할 수 있습니다. (버튼과 같은) 무언가가 밝은 색상으로 배경에서 눈에 띄면 자동으로 가장 먼저 눈에 띕니다.

이메일 방문 페이지
이 이메일은 화려하지 않으면서 축제 분위기를 연출합니다. 랜딩 페이지는 이메일의 전체적인 디자인과 색 구성표와도 일치합니다.

이 일치하는 이메일 및 랜딩 페이지의 색상에 대해 다른 점이 있습니까? 색상은 상당히 보완적입니다. 그것은 그들이 색상환의 반대편에 산다는 것을 의미합니다. 서로 잘 어울리고 눈에 잘 띄는 두 가지 색상을 찾으려면 보색부터 시작하는 것이 좋습니다. 이 예에서는 클릭 유도문안(CTA) 버튼으로 더욱 선명한 빨간색을 사용했습니다.

색상환에서 인접한 세 가지 색상의 조합을 유사한 색상 체계라고 합니다. 노란색, 황록색 및 녹색은 종종 빨간색, 빨간색-주황색 및 주황색과 마찬가지로 잘 어울립니다. 검정색과 회색 음영을 결합하거나 빨간색과 분홍색을 결합하는 것과 같은 단색 색 구성표를 사용할 수도 있습니다. 색상이 있는 배경의 모든 텍스트를 완전히 읽을 수 있도록 충분한 대비가 있는지 확인하십시오.

읽기 쉽게 유지

효과적인 이메일에 적합한 색상을 선택할 때 시각 장애가 있는 사람은 디자인을 탐색하는 데 어려움을 겪을 수 있다는 점을 기억하는 것이 중요합니다. CUD(Color Universal Design)는 원래 일본에서 개발된 디자인 시스템으로 디자이너가 다양한 유형의 색각을 가진 사람들을 고려하는 데 도움을 주기 위해 고안되었습니다. 컬러 유니버설 디자인의 핵심 원칙은 다음과 같습니다.

  • 실제 조명 조건과 사용 환경을 고려하여 모든 색각인이 쉽게 식별할 수 있는 색 구성표를 선택하십시오.
  • 다양한 색상뿐만 아니라 다양한 모양, 위치, 선 종류 및 색상 패턴의 조합을 사용하여 색상 차이를 구분할 수 없는 사용자를 포함하여 모든 사용자에게 다양한 방식으로 정보를 전달합니다.
  • 사용자가 커뮤니케이션에서 색상 이름을 사용해야 하는 경우 색상 이름을 명확하게 명시합니다.
  • 시각적으로 친근하고 아름다운 디자인을 지향합니다.

어떤 형태의 색맹은 남성의 약 8%와 여성의 1%에 영향을 미치므로 고대비 요소를 사용하는 것이 항상 좋은 생각입니다. Adobe Photoshop은 소프트 교정 기능으로 CUD를 지원합니다. 이를 통해 디자이너는 다양한 유형의 색맹이 있는 사람들에게 이미지가 어떻게 보이는지 확인할 수 있습니다.

색맹 시뮬레이터와 같은 온라인 도구를 사용하여 색맹인 사람에게 그래픽이 어떻게 보이는지 확인할 수도 있습니다.

다음은 Act-On 로고가 시각 장애의 세 가지 주요 유형을 의미하는 방법입니다.

Protanopia 로고
Protanopia: 빨간색을 볼 수 없거나 녹색 또는 청록색과 구별할 수 없습니다.

노안 로고
녹색맹: 녹색을 보지 못하거나 빨간색과 구분하지 못하는 것.

Tritanopia-act-on-logo
Tritanopia: 파랑과 노랑, 파랑과 녹색, 노랑과 보라를 구별할 수 없음.

접근성 색상환과 같은 도구를 사용하여 선택한 색상 쌍(예: 배경에 대한 텍스트)을 테스트합니다. W3C(World Wide Web Consortium)에서 정의한 표준과 밝기 및 대비를 비교하여 다양한 유형의 색맹에 조합이 어떻게 나타나는지 이해하는 데 도움이 될 수 있습니다. W3C 사이트에서 장애가 있는 사용자가 인터넷에 액세스할 수 있도록 하는 데 도움이 되는 더 많은 지침과 리소스를 찾을 수 있습니다.

브랜드 반영

이메일 메시지와 랜딩 페이지를 디자인할 때 브랜드를 지속적으로 강화하는 것도 중요합니다. 전반적인 브랜딩 색상 팔레트를 염두에 두고 기존의 모양과 느낌이 다른 경우 청중이 여전히 알아볼 수 있는 방식으로 수행하십시오. 이메일 캠페인에서 사용하는 색상과 디자인 요소는 브랜드와 정확히 일치하거나 반영할 필요는 없지만 전체적인 스타일과 톤을 반영해야 합니다. 이러한 종류의 일관성은 독자의 마음에 자신감을 심어주는 데 도움이 됩니다.

캐나다 국기
오, 캐나다. 당신은 군중 속에서 눈에 띕니다.

예를 들어, 캐나다의 새로운 스팸 방지 법률에 대한 Act-On 웨비나를 위한 이메일 및 랜딩 페이지를 만들 때 캐나다 국기를 디자인에 통합하고 싶었을 것입니다. 결국 빨간색은 강력한 색상이며 주홍 단풍잎만큼 캐나다를 잘 나타내는 것은 없습니다.

대신 이메일에는 브랜드 아이덴티티를 강화하는 색상과 디자인 요소를 사용했고 랜딩 페이지에도 그대로 가져왔습니다. 그렇게 하면 독자들은 이것이 스팸 메시지 자체가 아니라는 것을 확신할 수 있습니다.

전자 메일 방문 페이지
그러나 가장 중요한 색상 고려 사항은 다음과 같습니다. 청중에게 효과적인 것은 무엇입니까? 이메일 캠페인에서 다양한 색상 조합을 테스트해 보셨습니까? 다른 버튼 색상 옵션을 사용해 보셨습니까? 랜딩 페이지에 대한 A/B 테스트를 실행해 보셨습니까? 테스트는 고객과 잠재 고객의 공감을 얻을 수 있는 가장 좋은 방법이며 결과는 스스로를 말해줍니다.

이메일 마케팅을 이제 막 시작하셨습니까? 이 무료 툴킷으로 시작하십시오.

이메일 마케팅 툴킷 시작하기