5월 9일 화요일로 제19대 대통령 선거가 얼마 남지 않게 되었습니다. 이번 주요 대선 후보자들의 사이트를 4Grit가 만든 웹품질 자동 분석 사이트 ‘시멘틱마인’으로 비교-분석해보았습니다. 결과가 궁금하시지 않으신가요? 사용성과 접근성, SEO, 성능, 모바일 친화성 등 분석 결과를 소개합니다.
시멘틱마인을 통해 여러분의 사이트를 자동 분석할 수 있습니다.
아래 내용은 일부 내용만을 요약 또는 발췌한 것입니다. 상세한 내용은 시멘틱 마인으로 분석해보세요!
분석 일시 : 2017년 4월 28일 금요일 오전 10시
*결과는 사이트 콘텐츠 개편 현황, 방문자수, 일자 등에 상황에 따라 달라질 수 있습니다.
1. 문재인 더불어민주당 후보
– 사이트 주소: http://moonjaein.com/
– 전체 점수: SEO – 71점, 접근성 – 58점, 성능 – 56점
(1) 사용성
– 버튼에 접근하거나 클릭했을 때 디자인 인터랙션을 제공하는지
– 가로 해상도가 1920픽셀일 경우 가로 스크롤이 생기지 않는지
Error
– (14곳) 페이지 내에서, 링크나 버튼을 클릭할 때 새 창으로 열리는 수행에 대한 예측을 할 수 있는가
(2) 접근성 – 장애인, 고령자 등 웹 사이트에서 제공하는 정보에 비장애인과 동등하게 접근하고 이해할 수 있도록 보장하는 것을 의미합니다.
– 주 언어 명시: 시각 장애 환경에서 화면 낭독기로 웹에 접근했을 때, 주 언어가 명시되어 있어 해당 언어에 알맞게 출력되고 콘텐츠의 이해가 수월합니다.
Error
– 명도 대비: (2곳) 저시력, 노안과 같은 시각 장애 환경에서 콘텐츠를 바르게 이해하기 어렵습니다. 콘텐츠와 배경 간의 명도 대비는 4.5:1 이상으로 보장해야 합니다.
(3) SEO – SEO(Search-Engine Optimization, 검색엔진 최적화)란 네이버, 구글과 같은 검색엔진이 자료를 수집하고 순위를 매기는 방식에 맞게 웹 페이지를 구성하여 검색 결과 상위에 나타날 수 있도록 하는 작업을 의미합니다.
– Server(5XX) Errors: 서버 측 실행에 이상 없습니다.
– URL Too Long: 웹 페이지 주소의 길이가 적절합니다.
Error
– Too Many Links: 이 페이지에 제공되는 링크의 개수가 너무 많습니다. 페이지 내에 링크의 수는 200개 이하로 유지하는 것을 권장합니다. 페이지에 너무 많은 링크가 있다면 여러 개의 페이지로 나눌 수 있습니다.
(4) 성능
– Server response time: 서버 응답 시간이 빠릅니다.
– Prioritize the content: 스크롤 없이 볼 수 있는 콘텐츠의 우선순위가 올바르게 지정되었습니다.
Error
– Optimize Images: 이미지의 형식을 적절하게 지정하고 압축하면 데이터 용량을 크게 줄일 수 있습니다.
(5) 모바일
– 플래시: 플래시가 사용되지 않았습니다.
UX 품질 진단 요약
2. 홍준표 자유한국당 후보
– 사이트 주소: http://strongkorea.co.kr/
– 전체 점수: SEO – 77점, 접근성 – 65점, 성능 – 29점
(1) 사용성
– 가로 해상도가 1920픽셀일 경우 가로 스크롤이 생기지 않는지
Error
– (1곳) 라벨이 없는 서식을 마우스로 가리키면 말풍선으로 보충설명을 보여주는지
(2) 접근성
– 콘텐츠 블록 제목: 적절한 제목 요소로 페이지의 주고를 탐색하고 이해할 수 있습니다.
– 사용자가 의도하지 않은 기능: 사용자가 의도하지 않은 기능으로 인해 웹 사용에 방해를 받지 않습니다.
Error
– 명도 대비: (명도 대비 4.5:1 미만, 3:1 이상 39곳)(명도 대비 3:1 미만 55곳) 저시력, 노안과 같은 시각 장애 환경에서 콘텐츠를 바르게 이해하기 어렵습니다. 콘텐츠와 배경 간의 명도 대비는 4.5:1 이상으로 보장해야 합니다.
(3) SEO
PASS
– Meta Description Copied: 페이지의 Meta Description 내용이 본문 그대로 제공되지 않습니다.
– Flash Page Existence: 이 페이지에는 플래시 콘텐츠가 포함되어 있지 않습니다.
Error
– <H1> Tag Empty: 문서 구조의 대표 제목 <H1> 태그가 제공되지 않았습니다. 중요한 키워드를 포함한 실질적인 헤드라인을 <h1> 태그로 표현하는 것이 좋습니다. 1~2개의 중요한 키워드를 포함하여 작성하는 것을 권장합니다.
(4) 성능
– Compression: 압축 사용(네트워크를 통해 전송되는 용량 감소). 압축이 사용 설정되어 있습니다.
Error
– Optimize Images: 이미지를 최적화하여 줄일 수 있는 용량. 이미지의 형식을 적절하게 지정하고 압축하면 데이터 용량을 크게 줄일 수 있습니다.
(5) 모바일
– 플래시: 플래시가 사용되지 않았습니다.
UX 품질 진단 요약
3. 안철수 국민의당 후보
– 사이트 주소: http://ahncs.kr/
– 전체 점수: SEO – 74점, 접근성 – 80점, 성능 – 87점
(1) 사용성
– 텍스트로 구성된 행의 길이가 최대 65자 이하로 구성되어 있는지
– 말풍선의 내용이, 말풍선의 주체가 되는 대상의 내용과 중복되지 않는지
Error
– (7곳) 페이지 내에서, 링크나 버튼을 클릭할 때 새 창으로 열리는 수행에 대한 예측을 할 수 있는가
(2) 접근성
– 특정 장치에 의존적인 콘텐츠: 시각 및 운동 장애 환경에서 마우스를 사용할 수 없을 때에도 키보드만으로 웹 콘텐츠 기능을 이용하는데 문제가 없습니다.
Error
– 자동으로 재생되는 소리 제어: (1곳) 3초 이상의 음성이 자동으로 재생되어 시각 장애 환경에서 화면 낭독기로 웹 콘텐츠에 접근했을 때 혼란이 발생합니다. 자동 재생 콘텐츠는 시작 부분에서 제어할 수 있어야 합니다.
(3) SEO
– Flash Page Existence: 이 페이지에는 플래시 콘텐츠가 포함되어 있지 않습니다.
– Disabled Contents at Mobile OS: 모바일 OS에서 동작하지 않는 mp3, flash 파일 등이 제공되지 않습니다.
Error
– HTML Sitemap: 페이지 내에 사이트맵 콘텐츠가 제공되지 않습니다. 사이트의 모든 페이지 또는 가장 중요한 페이지에 대한 링크가 있는 간단한 사이트맵 페이지가 효과적입니다. 검색엔진 웹 크롤러는 이 파일을 읽고 사이트를 더 지능적으로 크롤링하게 됩니다.
(4) 성능
– Minigy HTML: HTML 축소 가능한 용량. HTML이 축소되었습니다.
– Minify CSS: CSS 축소 가능한 용량. CSS가 축소되었습니다.
Error
– Render-Blocking Files: 스크롤 없이 볼 수 있는 콘텐츠에서 렌더링을 차단하는 자바스크립트 및 CSS. 페이지에 차단 스크립트 리소스 4개 및 차단 CSS 리소스 2개가 있습니다. 따라서 페이지 렌더링이 지연됩니다.
(5) 모바일
– 플래시: 플래시가 사용되지 않았습니다.
UX 품질 진단 요약
4. 유승민 바른정당 후보
– 사이트 주소: http://www.ysm21.com/
– 전체 점수: SEO – 68점, 접근성 – 84점, 성능 – 80점
(1) 사용성
– 버튼에 접근하거나 클릭했을 때 디자인 인터랙션을 제공하는지
– 텍스트로 구성된 행의 길이가 최대 65자 이하로 구성되어 있는지
Error
– (4곳) 버튼/링크를 클릭하기 전 다음 수행 동작 방식을 예측할 수 있는 요소를 제공하는지
(2) 접근성
주 언어 명시: 시각 장애 환경에서 화면 낭독기로 웹에 접근했을 때, 주 언어가 명시되어 있어 해당 언어에 알맞게 출력되고 콘텐츠의 이해가 수월합니다.
Error
W3C Validation: (중복으로 제공된 ID 속성값 14곳) W3C 명세에 맞지 않는 마크업 코드가 제공되고 있습니다. 명세에 맞지 않는 마크업으로 인해 브라우저의 잘못된 해석을 야기할 수 있고, 모든 사용자 환경에서 동일한 콘텐츠 제공을 보장할 수 없습니다.
(3)SEO
– Title Tag Used Twice: 페이지 내에 Title 태그가 중복되지 않습니다.
– Image File Name Too Long: 이미지 파일명(src 속성값)의 문자열이 150 글자를 초과하지 않습니다.
Error
– Meta Description Length: Meta Description 값의 길이가 존재하지 않거나, 너무 길어 조정이 필요합니다.
(4)성능
– Prioritize the content: 표시되는 콘텐츠의 우선순위 지정. 스크롤 없이 볼 수 있는 콘텐츠의 우선순위가 올바르게 지정되었습니다.
– Redirection: 방문 페이지 리디렉션 사용 여부. 페이지에 리디렉션이 없습니다.
Error
– Server response time: 서버 응답 시간의 최적화. Google 테스트에서 서버가 0.59초 후에 응답했습니다.
(5) 모바일
– 플래시: 플래시가 사용되지 않았습니다.
UX 품질 진단 요약
5. 심상정 정의당 후보
– 사이트 주소: http://www.minsim.or.kr/xe/
– 전체 점수: SEO – 72점, 접근성 – 75점, 성능 – 40점
(1) 사용성
– 버튼에 접근하거나 클릭했을 때 디자인 인터랙션을 제공하는지
Error
– (8곳) 버튼/링크를 클릭하기 전 다음 수행 동작 방식을 예측할 수 있는 요소를 제공하는지
(2) 접근성
– 포커스 시각화: 키보드나 마우스를 통해 포커스를 받은 부분을 시각적으로 인지 가능합니다.
– 콘텐츠 블록 제목: 적절한 제목 요소로 페이지의 주고를 탐색하고 이해할 수 있습니다.
Error
– 이미지의 대체 텍스트: (대체 텍스트 미제공 8곳) 시각 장애 환경에서 화면 낭독기를 통해 텍스트가 아닌 콘텐츠를 바르게 인식할 수 없습니다. 텍스트가 아닌 콘텐츠는 원래 제공하고자 하는 정보 그대로 대체 텍스트를 제공해야 합니다.
(3)SEO
– URL Parameters Too Many: 이 페이지의 URL에서 parameter가 노출되지 않습니다.
– Robots.txt File Existence: Robots.txt 파일이 사이트의 루트 디렉터리에 존재합니다.
Error
– Text/HTML Ratio: 이 페이지에 포함된 Text Contents의 비율이 너무 적거나 높아 조정이 필요합니다.
(4) 성능
– Prioritize the content: 표시되는 콘텐츠의 우선순위 지정 스크롤 없이 볼 수 있는 콘텐츠의 우선순위가 올바르게 지정되었습니다.
– Compression: 압축 사용(네트워크를 통해 전송되는 용량 감소). 압축이 사용 설정되어 있습니다.
Error
– Optimize Images: 이미지를 최적화하여 줄일 수 있는 용량. 이미지의 형식을 적절하게 지정하고 압축하면 데이터 용량을 크게 줄일 수 있습니다.
(5) 모바일
– 플래시: 플래시가 사용되지 않았습니다.
UX 품질 진단 요약
이상, 제19대 대통령 선거 후보 홈페이지의 UX를 시멘틱마인으로 자동 분석한 결과였습니다.
*본 점수는 각 후보자의 사이트 코드를, 4Grit가 연구한 UX품질 평가 기준에 따라 분석한 결과입니다.
실제와 편차가 있을 수 있는 점 양해바랍니다.
여러분의 사이트도 자동으로 분석할 수 있습니다.
URL 한 줄 입력이면 분석이 완료되니 지금 바로 시작해보세요!
