반응형 웹 디자인을 위한 세 가지 콘텐츠 전략: 계획, 우선 순위 지정, 추출

대부분의 마케터에게 "반응형 웹 디자인"이라는 용어는 웹 개발자와 와이어 프레임의 이미지를 떠올리게 할 가능성이 큽니다. 그러나 문장의 문자열과 텍스트 덩어리를 염두에 두어야 합니다.

콘텐츠는 처음부터 리드를 끌어들인 다음 판매 주기를 통해 리드하는 엔진입니다. 그리고 반응형 웹 디자인의 주된 역할은 웹 방문자가 휴대폰, 태블릿 또는 데스크탑에 있든 관계없이 콘텐츠를 쉽게 이해할 수 있도록 하는 것입니다.

반응형 웹 디자인은 각 문장이 더 많은 독자를 끌어들이고 더 많은 리드를 모으도록 콘텐츠를 재구성할 수 있는 기회입니다.

반응형 디자인이란?

먼저 반응형 웹 디자인에 대한 약간의 배경 지식입니다. 개념은 간단합니다. 웹 방문자가 사용하는 장치에 따라 모바일 또는 데스크톱 디자인을 자동으로 최적화하는 단일 웹사이트를 만듭니다. 웹 사이트가 반응하는지 확인하는 쉬운 방법 중 하나는 데스크톱 보기(및 전체 화면 보기가 아닌 창 보기)에서 웹 사이트의 오른쪽 하단 모서리를 잡고 천천히 스마트폰 크기로 축소하는 것입니다. 웹 사이트가 축소되면서 모바일 친화적인 보기로 전환되면 반응형입니다. 단순히 읽기 어려운 스크롤 앤 핀치 웹사이트로 축소되면 반응하지 않습니다.

반응형 디자인은 모바일이 동일한 콘텐츠를 위한 또 다른 플랫폼이 아니라는 이해에서 시작됩니다. 모바일의 급속한 성장은 콘텐츠의 형태, 구성 및 크기를 변화시켰습니다. 그리고 사람들은 모바일 콘텐츠에서 근본적으로 다른 것을 기대합니다.

이러한 기대는 이메일 마케팅, 소셜 또는 웹 콘텐츠 등 회사 콘텐츠 캠페인의 모든 구성 요소에 적용됩니다. 웹사이트의 콘텐츠는 반응형이어야 하고 모바일에 최적화되어야 하지만 이메일 마케팅 템플릿과 소셜 캠페인도 그래야 합니다.

반응형 디자인이 필요한 이유

반응형 디자인이 없다면 필요합니다. 구글은 반응형 디자인이 없는 기업의 검색 순위에 불이익을 주고 있다. 그리고 모바일 웹 트래픽은 어디에나 존재하기 때문에 모든 웹사이트는 동일한 웹사이트에서 모바일 및 데스크톱 사용자에게 지능적으로 서비스를 제공해야 합니다.

몇 가지 간단한 통계: 모바일은 모든 유료 검색 클릭의 41%, 모든 유료 검색 지출의 31%(Merkle RKG) 및 모든 이메일 열기의 53%(Litmus)를 유도합니다. 모바일 트렌드를 감안할 때 이러한 수치는 곧 줄어들지 않을 것입니다.

진정으로 모바일에 최적화된 콘텐츠를 제작한 결과는 엄청날 수 있습니다. Act-On은 반응형 디자인으로 리드가 93.5% 증가했음을 발견했습니다. 판매 리드를 즉시 두 배로 늘릴 수 있는 다른 간단한 솔루션은 무엇입니까?

반응형 디자인을 위해 콘텐츠를 최적화하는 3단계.

1. 부서 간 계획

반응형 디자인은 단순히 디지털 팀을 웹 개발에 느슨하게 하는 문제가 아닙니다. 카피라이터, 디자이너 및 전략가 간의 팀 노력입니다.

효과적인 계획을 세우면 콘텐츠, 코딩 및 디자인이 모두 딱 들어맞아 웹사이트를 리드 생성 기계로 만들 수 있습니다. 웹 방문자 프로필, 방문자 동기 및 원하는 결과와 같은 기본 사항을 파악하여 처음부터 시작하십시오. 누가 귀하의 웹사이트를 방문하고 있습니까? 왜? 그들이 귀하의 사이트에 도착하면 무엇을 하기를 원하십니까?

처음부터 부서 간 협업을 통해 프로젝트가 디자인 종소리와 휘파람과 체계적이고 효과적인 콘텐츠 사이의 균형을 유지할 수 있습니다.

2. 명확한 계층 구조에서 콘텐츠 우선 순위 지정

콘텐츠의 우선 순위 지정은 반응형 웹 디자인에서 필수적입니다. 데스크톱 브라우저 페이지의 공간이 휴대용 크기로 축소되면 콘텐츠가 뒤죽박죽이 됩니다. 넓은 다중 열 웹 페이지가 단일 열 모바일 페이지로 압착됩니다. 웹 사이트가 올바르게 설계되지 않은 경우 가장 중요한 콘텐츠 중 일부가 페이지 하단에 표시될 수 있으므로 도달하려면 긴(너무 긴) 스크롤이 필요합니다.

생성된 콘텐츠에 우선순위 수준을 할당하면 가장 중요한 콘텐츠가 맨 위로 올라가도록 보장하는 구조가 생성됩니다. 계층에 따라 콘텐츠를 식별하여 콘텐츠 계층 구조를 만듭니다. 이러한 식별은 마케팅 또는 카피라이팅 팀에서 이상적으로 발생해야 하며 디자이너 및 프로젝트 관리자에게 명확하게 전달되어야 합니다. 이 협업은 모바일 뷰어를 위한 콘텐츠 계층 구조를 유지하는 디자인으로 이어질 것입니다.

콘텐츠를 모바일 크기로 추출

소프트웨어 또는 운영 체제 사용자가 기능적이고 직관적인 디자인을 기대하는 것처럼 오늘날의 독자는 전문적으로 간결한 덩어리로 제작된 콘텐츠를 기대합니다.

콘텐츠 전략은 독자를 위한 UI나 UX와 유사하다고 생각하세요. 사용자 경험 디자인에 시간과 노력, 반복이 필요한 것처럼 콘텐츠는 독자를 염두에 두고 여러 번 작업해야 합니다. 숨겨진 구조는 사용성(콘텐츠의 경우 가독성)에 막대한 영향을 미칩니다.

최종 초안 이후에도 여전히 많은 양의 회색 텍스트를 독자에게 제시하고 있다면 또 다른 콘텐츠 증류가 필요합니다. 사진 및 비디오와 같은 멀티미디어 제품으로 세분화된 글머리 기호, 광고 문구 및 간결한 텍스트가 남을 때까지 콘텐츠를 계속 세분화하십시오. 데이터가 많은 복잡한 텍스트 청크를 인포그래픽으로 변환하는 것을 고려하십시오. 여기서 텍스트와 시각적 요소의 쌍은 데이터를 쉽게 소화할 수 있는 시각적 요소로 변환할 수 있습니다.

세로 청킹 - 텍스트를 나란히 배치할 수 있는 세로 청크로 나누고 각각 고유한 헤드라인과 사진을 포함하여 독자가 옆으로 스캔하고 세로 청크를 하나씩 소비할 수 있도록 합니다.

이 한입 크기의 콘텐츠 전달 시스템은 회색 텍스트의 벽보다 시각적으로 더 매력적이며 독자에게 작가와 디자이너가 이미 개별 생각을 식별하고 타이트한 텍스트로 만들고 간결하게 제시하는 작업을 완료했음을 알립니다. 방법.

반응형 디자인은 이미 너무 긴 할 일 목록에 추가해야 할 한 가지가 아닙니다. 성가심이나 낮은 우선 순위가 아닙니다. 단일 프로젝트에서 콘텐츠를 선명하게 만들고 웹 디자인을 개선하며 모바일 구매자를 만족시킬 수 있는 기회 입니다 .

~ 개발 프로세스 관리, 비용 예측 및 모바일 우선 전환을 포함하여 반응형 웹 디자인에 대한 모든 요령을 배우고 싶습니까? 전체 웨비나 보기 반응형 디자인: 웹 페이지 및 이메일에 대해 해야 할 일과 하지 말아야 할 일 10가지.