교차 장치 최적화 15 가지 팁

Sep 13, 2025

어떻게

모든 장치를위한 디자인! Anna Dahlström. 그 중요성에 대해 말할 것입니다 디바이스 - 불가지론 UX 시스템 구축 ...에서 런던 생성 , 21-23 9 월. 그녀는 왜 장치에 불가지론 된 디자인이 중요한지, 그것이 의미하는 것과 우리가 어떻게 그것에 대해 가는지를 걷고 있습니다. 지금 예약 ...에!

나는 15 년 전에 HTTP 로그 파일과 사용자 에이전트 문자열을 망쳐 놓고 초기 John Lewis Ecommerce 웹 사이트에서 흔들리는 모든 다른 장치를 분석 및 이해하려고 시도했습니다. 제 시간에 돌아갈 수 있다면 내가 어떤 조언을 주시겠습니까?

이것이 일 것입니다 : 지금부터 일하는 모든 웹 사이트 또는 제품이 깨졌습니다 - 당신은 어떤 장치 나 브라우저에서, 그리고 얼마나 심각하게 지는지 모르겠습니다. 이러한 결함을 사냥하면 거의 모든 다른 작업이 함께 할 것인 것보다 고객에게 더 쉽게 돈을 벌 수 있습니다.

고객이 신속하게 불평 할 경향이 있음에도 불구하고 대다수는 귀하의 장치 경험에 버그를보고하지 못하고 있다는 것을 깨닫는 데 15 년이 걸립니다. 소수의 불만 사항을 얻으면 손에 큰 재해가있을 것입니다. 불만 사항을 부여하지 않으면 여전히 깨졌습니다.

우리는 웹 사이트 방문객이 장치 및 브라우저 문제에 대한 우리의 '카나리아'가 될 수는 없으며, 우리는 책임을지고, 우리가 테스트하는 방법에 대해 더 똑똑하고 더 똑같이 똑같이해야합니다. 장치 호환성은 권한이 아닌 권한이 아니며 잘못된 차별의 한 형태입니다.

이 기사에서는 교차 장치 최적화 및 A / B 테스트를 기억하는 주요 규칙에 대해 설명합니다. 최적화 팁을 먼저 태클. 장치 호환성, 성능 및 유용성으로 기본적인 실수를하고 있으면 A / B 테스트를 통해 귀찮게하지 않습니다. 먼저 깨진 물건을 찾아서 수정하십시오. 그런 다음, A / B 테스트를 실행할 수있는 충분한 트래픽이있을 때 (적어도 500 개 이상의 전환 또는 체크 아웃) - 새로운 실수를 만들 수 있습니다.

01. 응답 성이 모든 것을 해결하지 않는다고 가정하지 마십시오

나는 한 번 반응하지 않는 작은 모바일 사이트를 만들었지만 매년 수익에서 10 억 유로의 가장 좋은 부분을 차지합니다. 필요한 작업의 경우 완벽합니다. 그것은 유체 레이아웃 용어에 반응하지 않지만이를 사용하는 거의 모든 사람의 요구에 응답합니다. 그 차이를 알아라.

때로는 사람들이 그것을 생각합니다 반응 형 웹 디자인 디지털 숙달의 표시입니다. 그것은 단지 품질을 전달하지 않는 속성입니다. '웹 사이트가있다'또는 '웹 사이트를 클릭하면 물건을 클릭 할 수 있습니다.' 그것은 훌륭한 교차 장치 경험을 보장하지 않습니다.

팀이 고객 지식을 무시했기 때문에 피상적 인 슬릭스런 사이트가 많은 반응이 있지만 유용성에 실패합니다. 하나의 좋은 예가 있습니다 전자 상거래 웹 사이트 그것은 대응하고 수익의 40 %를 잃어 버렸습니다. 그것은 훌륭한 모바일 경험을 지었지만 데스크탑 버전은 빨려졌고, 그 돈의 80 %가 어디에서 왔는지입니다. 황금 거위가 어디에서 살인을 피하고 싶다면 도움이되는 곳을 알고 있습니다!

02. 귀하의 연구를 먼저합니까?

사이트를 최적화하면 페이지 내용을 해킹하여 시작되지 않습니다. 입술이 '고객 여정'이라고 말할 때 연구를하는 것으로 시작됩니다. 나오는 것은 동화가 아닙니다. 방문자, 업무 및 목표, 진입 점, 장치 믹스, 경로, 흐름 및 포기 구역을 먼저 알아야합니다. 당신이 이해하지 못하는 문제를 해결하는 것은 매우 어렵습니다.

Analytics 데이터 사용 사용자 경험 연구, 설문 조사 또는 피드백은 '여행'에 대한 헛소리, 자아 및 가정을 제거하는 신속하고 가벼운 방법입니다. 한 시간의 정보에 입각 한 데이터는 수천 시간의 의견의 의견의 가치가 있습니다.

추가 읽기 : ' 한 시간에 전환 연구 ' ' 연구를위한 세션 재생 도구 '

03. 장치가 아닌 사람을 추적하십시오

A Google Analytics User ID view showing overlapping device usage — 겹치는 장치 사용을 보여주는 Google Analytics 사용자 ID보기

사용자를 추적하는 Analytics 설정을 사용하지 않는 한 대신 장치를 추적 할 수 있습니다. 회사는 '모바일'트래픽이 변환되지 않는다고 불평하고 실제로 트래픽이 완전히 다른 장치에서 변환하는 것을 알게됩니다.

사람들은 휴대 전화를 사용하여 바구니에 제품을 탐색하고 추가 할 수 있지만 체크 아웃을 통과하는 것이 까다로울 수 있습니다. 그래서 노트북에서 판매를 마무리하십시오. 이 사이트는 모바일 고객과 데스크탑 고객의 두 사람으로 생각합니다.

따라서 귀하의 전환 문제는 실제로 기여 문제입니다. 고객이 둘 이상의 장치를 사용하는 경우 어떻게 기기 경험으로 판매를 크게 할 수 있습니까? Google Analytics에는 사용자가 장치가 아닌 사람을 추적 할 수있는 사용자보기를 (로그인 한 사용자를 추적 할 수 있으며이를 이해하는 데 도움이되는 많은 분석 도구가 있습니다.

04. 더 넓은 상황을 무시하지 마십시오

이 하이퍼 모바일 장치 세계에서는 컨텍스트가 모든 것입니다. 항공사 앱에서 필요한 것은 게이트를 실행할 때와 비교하여 비행기에 48 시간 전에 매우 다를 수 있습니다. 전화를 사용하는 그 사람의 경우, 경험에 영향을 미치는 요인을 고려해야합니다. 여기에는 작업, 목표, 장치, 위치, 데이터 전송률, 뷰포트, 긴급, 동기 부여, 데이터 비용, 통화 비용 또는 심지어 방문시의 날씨가 포함될 수 있습니다.

05. 사무실에서 나가십시오

더 나은 제품을 사용하면 사무실에 소비 된 긴 일을 포함해서는 안됩니다. 커피 숍과 술집 방문으로 일하는 일을 해제하지 않는 이유는 무엇입니까? 이것은 UX 연구를 위해 고객을 찾는 가장 저렴한 방법 중 하나입니다. 프로토 타입이나 디자인에 대한 피드백과 교환하여 맥주 나 커피를 제공하는 것은 귀중한 투자 수익이 없습니다. 그리고 웹 사이트를 잊지 마십시오 - 트래픽이있는 경우 사람들을 모집하고 온라인으로 테스트를 실행할 수 있습니다.

추가 읽기 : ' 그들을 모두 지배하는 UX 도구 '

06. 모두가 iPhone을 사용하는 것을 가정하지 마십시오

Diagram showing the percentage splits across device classes, OS and models — 장치 클래스, OS 및 모델을 가로 지르는 백분율 분할을 보여주는 다이어그램

대부분의 애널리틱스 설정에서 iPhone 모델은 함께 묶여 있으며 주요 고객 장치임을 제안합니다. 데이터의 모델을 보면이 문제가 당신의 생각을 왜곡 할 것입니다. 실제 그림을 볼 수 있도록 OS 또는 플랫폼으로 장치를 분할해야합니다. Google Analytics는 내 최고의 모델이 'iPhone'이라고 말할 수 있지만 소수의 Samsung 모델도 훨씬 더 큰 잠재 고객에게 추가 될 수 있습니다.

누군가가 고객 믹스 대신 자신의 개인 장치 환경 설정에 초점을 맞추기 위해 유혹을받을 때마다 오른쪽 위의 다이어그램으로 지시합니다 (사무실 벽에 착색 할 가치가있는 경우) 데이터가 무엇을 말하는지 상기시켜줍니다.

추가 읽기 : ' 교차 장치 최적화를 위해 Google Analytics 사용하기 궁극적 인 가이드 '

Discover why your designs should be device-agnostic at Generate London — 디자인이 런던에서 기기에 불가지론 해야하는 이유를 알아보십시오.

07. 콜 추적을 잊지 마십시오

자유롭고 거의 사용되지 않는 기술에 대한 언급. 전화를 걸 수있는 터치 장치가있는 경우 전화를 추적 할 수 있습니다. 누군가가 전화 번호를 도청 할 때마다 이벤트 (또는 페이지보기)를 분석 데이터에 추가하기 만하면됩니다. 그런 다음 얼마나 많은 통화가 무엇인지 알 수 있습니다. 어떤 웹 페이지가 원하는 웹 페이지 또는 소스가 가장 많은 전화를 끊었는지 정확히 알 수 있습니다.

나는이 데이터를 사용하여 대기업에 대한 PPC 계정을 분석했습니다. 우리가 전화에서 오는 판매에서 인한 판매에 대해서는 우리의 입찰을 완전히 변경했습니다. 절약은 40 ~ 70 %의 PPC에 대해서는 40 ~ 70 % 하락했지만 동일한 수익이 컸습니다.

08. 실제 데이터를 사용하여 웹 사이트 속도를 추적합니다

많은 사람들이 Google Analytics가 귀하의 페이지가 얼마나 느리게하는지, 매일 어떻게 지속되는지에 대한 실제 방문자의 측정을 수집한다는 것을 알고 있습니다. WI-FICONNECTION에서 사이트를 탐색 할 때 성능을 상상하는 대신 데이터가 어디에서 찍는지 알려줄 수 있습니다. DOM 타이밍 보고서를보십시오.이 레코드는 웹 페이지 구조와 콘텐츠가로드하는 데 걸리는 기록을 기록합니다. 사이트를 더 빠르게 만드는 것은 게임 체인저입니다.

성능과 전환율 사이에는 거대한 상관 관계가 있으므로 느린 경우 경쟁자에게 사람들을 보내는 것만으로 마케팅 머니를 보냅니다!

추가 읽기 : ' 사이트 속도를 해석합니다 '

09. 창의적인 것보다는 테스트 방법을 복사하십시오.

테스트를 살펴볼 때 다른 회사가 실행되면 테스트를 완전히 괴롭히는 지 전혀 알지 못합니다. 그들의 데이터, 방법, qa 또는 샘플 크기는 초등 실수를 만들 수 있습니다. 너무 짧은 시간 동안 테스트를 실행하거나 데이터를 정확하게 수집했는지 확인하지 못할 수도 있습니다. 당신은 단지 모릅니다.

그리고 당신이 모든 배경 정보를 가지고 있더라도, 당신은 그들의 방법이 당신을 위해 일할 것인지 여전히 예측할 수 없었습니다. 고객, 마케팅, 웹 사이트 및 다른 모든 것들이 완전히 다릅니다. 즉, 테스트를위한 모범 사례 규칙은 주로 소재의 방법을 복사하는 것에 관한 것입니다.

추가 읽기 : ' 최상의 관행과 최적화 전문가의 끝없는 빨아 ' ' 변환 최적화 모범 사례가 실패 할 때 '

10. 계획없이 테스트하지 마십시오

귀하가 귀하의 사이트 전체에서 테스트 할 수있는 수백만 가지가 있습니다. 당신이 단지 '시작'이라면 결국 최적의 웹 사이트를 얻을 수도 있지만 우주의 열망이 먼저 얻을 수 있습니다. 경험이 깨진 물건이 있으면 먼저 (테스트하기 전에) 해결해야합니다. 그렇지 않으면 다른 모든 것을 드래그 할 것입니다. 성능 및 장치 호환성의 기본 사항이 있으면 분석을 사용하여 기회를 식별하십시오.

'그냥 변화시키는 것들'은 테스트 할 충분한 이유가 아니라는 것입니다. 좋은 테스트를 주도하기위한 증거 또는 통찰력이 필요합니다. 가장 좋은 학습은 귀하의 테스트에 채널에 훌륭한 질문을하는 것에서 비롯됩니다.

11. 가설을 수립하십시오

Ask people to describe the test they want to run using this sentence. If you’re laughing, it’s a bad test — 사람들 에게이 문장을 사용하여 실행하려는 테스트를 설명하도록 요청하십시오. 당신이 웃고 있다면, 그것은 나쁜 테스트입니다

가설 키트는 내가 가르치는 가장 유용한 것들 중 하나입니다.

[데이터 / 피드백]은 [변경]이 [충격]을 유발할 것으로 기대합니다. [데이터 메트릭]을 사용 하여이 작업을 측정 할 것입니다.

이런 식으로 질문이나 A / B 테스트를 틀 러 묻는 사람들에게 묻는 것이 왜 테스트를 실행하고 있는지 그리고 성공을 어떻게 측정 할 것인지를 생각하게합니다.

추가 읽기 : 가설 키트 3. ...에

12. 먼저 테스트 계산기를 실행하십시오

A / B 테스트 전에 테스트 계산기를 실행하는 것은 정말로 좋은 방법입니다. 마무리에 약 9 백만 년이 걸릴 것이라고 말하면, 당신은 당신의 삶에 더 유용한 것을 할 수 있습니다.

13. 95 %의 신뢰에 멈추지 마십시오

A / B 테스트를 사용하는 것은 매우 일반적인 멍청한 실수입니다. 테스트 시간을 미리 결정한 다음 해당 시간 동안 실행하고 그만 멈추고 분석해야합니다. 현실 세계에서 실행되는 대부분의 테스트는 완전히 허구로 전환됩니다. 왜냐하면 약속의 '승강기'가 전환 할 때 사람들이 실망 해지지 않습니다. 테스트를 잘못하거나 너무 오래 기다리면 결과가 발생 해야하는 일반적인 문제가 발생합니다.

추가 읽기 : ' 통계적 유의성은 유효성이 동일하지 않습니다 ' ' 모든 인터넷 마케팅 담당자가 통계 학자 여야하는 이유입니다 '

14. 장치 클래스별로 세그먼트

디자인에 다른 장치 나 중단 점이있는 경우 A / B 테스트가 완전히 다른 것으로 보입니다. 디자인이 모든 장치를 어떻게 보이는지 확실하지 않으면 어떻게 작동 할 수 있습니까? 다른 장치 클래스 또는 '중단 점'으로 데이터를 분석하고 세그리밍하지 않으면 행동 변화를 어떻게 알 수 있습니까? 내 클라이언트 중 하나는 고객이 매우 유용한 데이터 계층에서 고객을 보았습니다.

모바일, 태블릿 및 데스크톱 장치 클래스를 통해 사람들을 타겟팅하거나 분류하는 방법을 항상 이해하십시오. 장치 경험이 너무 크게 변하지 않는 '평균'방문자가 없습니다.

15. QA 테스트를 잊지 마십시오

장치 믹스를 해결하지 못했다면 A / B 테스트를 테스트하는 QA가 아닙니다. 즉, 꽤 많은 부분이 깨 졌을 것임을 의미합니다. A / B 테스트가 손상된 경우 데이터 및 의사 결정이 결함이 있습니다. 모든 테스트 디자인의 약 30-40 %가 고품질 개발자가있는 경우에도 기본 QA를 실패합니다. 즉, JavaScript입니다! 그렇지 않으면 입증 될 때까지 부서지기를 가정합니다.

요약

여기에서는 교차 장치 경험을 향상시키기위한 많은 팁을 다뤘습니다. 시작할 때 장치를 믹스하고 해당 장치 뒤에있는 고객을 이해하고 이해하는 것이 중요합니다. 다음 단계는 귀하의 노력의 우선 순위를 정하는 데 도움이되는 데이터로 작업하는 것입니다. 좋은 테스트 목록 (Google 애널리틱스의 도움으로)을 만드는 것은 개발자들에게 노력을 잘립니다. 그러나 인기있는 장치에서 제거한 결함 수를 늘릴 것입니다.

훌륭한 교차 장치 경험을 설계하는 것은 데이터, 직감, 공감 및 실험의 신중한 균형입니다. 당신이 이것들이 자존심과 의견으로 가득 찬 공간을 차지하고, 좋은 일이 번성 할 것입니다. Stephen Hawking이 ""지식의 가장 위대한 적이 무지가 아니며, 지식의 환상입니다. "

장치 - 불가지론 디자인의 중요성에 대해 알아보십시오. Anna Dahlström. ...에서 런던 생성 ...에! 에 디바이스 - 불가지론 UX 시스템 구축 , 왜 그녀는 당신이 콘텐츠 가이드 레이아웃을하도록 해야하는 이유를 설명하고, 페이지 디자인을 멀리 떨어져서 그 견해로 구성된 모듈에 초점을 맞추어 멀리 이동합니다. 지금 티켓을 예약하십시오 ...에!

이 기사는 원래 나타났습니다 그물 잡지 문제 279; 지금 등록하십시오 ...에!

교차 장치 최적화 15 가지 팁

01. 응답 성이 모든 것을 해결하지 않는다고 가정하지 마십시오

02. 귀하의 연구를 먼저합니까?

03. 장치가 아닌 사람을 추적하십시오

04. 더 넓은 상황을 무시하지 마십시오

05. 사무실에서 나가십시오

06. 모두가 iPhone을 사용하는 것을 가정하지 마십시오

07. 콜 추적을 잊지 마십시오

08. 실제 데이터를 사용하여 웹 사이트 속도를 추적합니다

09. 창의적인 것보다는 테스트 방법을 복사하십시오.

10. 계획없이 테스트하지 마십시오

11. 가설을 수립하십시오

12. 먼저 테스트 계산기를 실행하십시오

13. 95 %의 신뢰에 멈추지 마십시오

14. 장치 클래스별로 세그먼트

15. QA 테스트를 잊지 마십시오

요약

어떻게 - 가장 인기있는 기사

애니메이션의 합성 : 기본 사항을 배우십시오

시각적 개발 팁 : 아트웍으로 이야기를 전하십시오

Adobe Dimension CC 시작하기

아이소 메트릭 타이포그래피를 설계하는 방법

코렐 페인터에서 초상화 예술 작성

DAZ Studio와 Zbrush 사이를 이동하는 방법

Photoshop에서 Snapchat Geofilter를 만드는 방법

3D 렌더링에서의 움직임을 캡처하는 방법

카테고리