David Dias

JavaScript에서 문자열을 코드로 실행하는 부분을 찾습니다. eval()과 문자열을 전달한 타이머 등을 점검하고 용도에 맞는 대체 방법으로 수정을 돕습니다.

• eval() 등 문자열 실행 부분 찾기
• JSON 분석에 쓰는 eval() 대체
• 문자열 타이머를 함수 참조로 변경

모호한 링크 문구를 찾아 대상 페이지의 내용을 설명하는 표현으로 고치도록 돕습니다. 렌더링된 페이지를 확인해 검색 엔진과 화면 읽기 프로그램이 링크의 의미를 이해하도록 지원합니다.

• 모호한 링크 문구 수정
• 화면 읽기 프로그램 사용자를 위한 링크 점검
• 내부 링크의 과도한 키워드 사용 확인

화면 요소의 역할을 전달하는 ARIA 역할에 필수 속성이 있는지 점검합니다. 실제 HTML과 조작 중 상태를 확인하여 화면 낭독기에 필요한 정보의 누락을 수정합니다.

• 사용자 정의 슬라이더의 필수 속성 점검
• 공통 UI 구성 요소의 접근성 검토
• 화면 낭독기에 전달되는 상태 정보 확인

툴팁의 보충 정보가 스크린 리더에 전달되는지 점검합니다. 읽기용 이름과 표시를 유발하는 요소의 연결을 확인하고 수정안과 검증 방법을 제시합니다.

• 툴팁의 스크린 리더 출력 확인
• 표시를 유발하는 요소와 설명의 연결 점검
• 공통 툴팁 구성 요소 검토

화면 요소의 역할과 ARIA 속성이 맞는지 점검합니다. 출력 HTML과 상호작용 상태를 살펴보고, 스크린 리더가 의미를 올바르게 이해하도록 속성 삭제나 수정을 안내합니다.

• 공통 컴포넌트의 ARIA 속성을 점검합니다
• 디자인 시스템의 접근성을 확인합니다
• 의도와 다른 읽기 결과를 조사합니다

HTML 메타 태그와 HTTP 응답 헤더의 noindex를 조사하고, 실제 출력에서 중요한 상품이나 글이 검색 결과에서 잘못 제외되었는지 확인하는 스킬입니다.

• 주요 페이지의 검색 제외 여부 확인
• 관리 페이지와 보조 페이지의 제외 설정 점검
• noindex와 disallow의 용도 구분

HTML의 ARIA 속성에서 오타나 존재하지 않는 이름을 찾아 표준에 맞게 수정을 돕습니다. 보조 기술에 역할과 상태가 전달되는지 검증하는 방법도 안내합니다.

• HTML의 ARIA 속성 오타를 점검합니다
• 화면 읽기에 상태가 빠지는 원인을 조사합니다
• 공통 구성 요소의 접근성 속성을 확인합니다

진행률 표시줄에 어떤 작업인지 알려 주는 이름이 있는지 점검합니다. 레이블과 값 속성을 정리해 스크린 리더 사용자도 진행 상황의 의미를 이해하도록 합니다.

• 진행률 표시줄의 접근 가능한 이름 점검
• 로딩 표시에 작업 이름 추가
• 현재 진행 값과 범위 확인

웹사이트 이미지를 점검하고 압축 효율이 높은 AVIF 도입을 돕습니다. 크기와 로딩 방식도 확인하며 미지원 브라우저에 WebP나 JPEG를 제공하는 구성을 검토합니다.

• 사이트 사진에 AVIF를 도입할 때
• 미지원 브라우저에 WebP와 JPEG를 제공할 때
• 첫 화면 이미지의 크기와 로딩 방식을 점검할 때

제휴 링크나 후원 콘텐츠 앞에 금전적 제휴 관계를 알리는 문구가 있는지 점검합니다. 실제 HTML과 HTTP 응답도 확인하고 문구와 표시 위치 수정을 지원합니다.

• 제휴 관계 공개 문구 점검
• 후원 표시 방식 통일
• 실제 페이지의 표시 상태 확인

사이트의 목적과 운영자를 소개하는 페이지를 점검하거나 작성합니다. 조직의 역사, 사명, 전문성, 연락처를 확인하고 실제 페이지 출력에서 정보 누락을 찾습니다.

• 기존 사이트 소개 페이지 점검
• 조직과 사명을 소개하는 페이지 작성
• 페이지 출력의 운영자 정보 확인

CSS 애니메이션에서 렌더링 부담이 큰 속성을 찾아 transform과 opacity를 사용하는 수정을 제안합니다. 화면 너비와 조작 상태별 표시 및 동작 줄이기 설정도 확인합니다.

• 끊기는 애니메이션 점검
• 위치나 크기를 바꾸는 속성 수정
• 동작 줄이기 설정 확인

글 페이지의 구조화 데이터를 점검하고 제목, 이미지, 게시일, 작성자 등을 확인합니다. Article 형식의 JSON-LD 추가와 실제 제공되는 페이지의 검증을 돕습니다.

• 블로그 글의 구조화 데이터 점검
• Article 형식의 JSON-LD 추가
• 제목·이미지·게시일·작성자 누락 확인

배터리 잔량이나 저장 용량을 나타내는 미터의 접근성 이름을 점검합니다. 누락된 이름을 추가해 스크린 리더가 수치의 의미를 전달하도록 돕습니다.

• 잔량 및 용량 미터의 레이블 확인
• 미터에 스크린 리더용 이름 추가
• 공통 UI 컴포넌트의 미터 점검

브라우저의 뒤로 및 앞으로 이동 시 메모리에서 페이지를 복원하는 방식을 점검합니다. 복원을 막는 이벤트 처리와 복원 후 오래된 정보가 남는 원인의 수정을 돕습니다.

• 뒤로 및 앞으로 이동이 느린 원인 조사
• 캐시 복원을 막는 처리 확인
• 복원 후 오래된 정보가 남는 오류 수정

HTML에서 더 이상 권장되지 않는 ARIA 역할과 직접 쓰면 안 되는 추상 역할을 찾고, 권장 역할이나 기본 HTML 요소로 바꾸는 방안을 검토합니다.

• 기존 코드의 사용 중단 권고 역할을 찾습니다
• 기본 HTML로 대체할 방안을 검토합니다
• 공통 UI 구성 요소의 역할을 점검합니다

글과 블로그의 작성자 이름, 직책, 프로필 링크를 점검합니다. 실제 페이지와 HTML을 바탕으로 작성자 정보를 다듬어 누가 쓴 내용인지 알 수 있도록 돕습니다.

• 블로그의 작성자 정보 점검
• 작성자 이름·직책·프로필 링크 추가
• 생성된 HTML의 작성자 정보 검토

보조 기술에 화면 요소의 역할을 전달하는 ARIA 속성을 점검하고 오타와 정의되지 않은 값을 수정합니다. 표준 HTML로의 교체와 키보드 조작, 화면 낭독 확인도 지원합니다.

• ARIA 역할의 오타와 미정의 값 찾기
• 사용자 정의 컨트롤을 표준 HTML로 교체
• 공통 화면 구성 요소의 접근성 점검

페이지 로딩 시 음성과 영상의 자동 재생을 점검합니다. 자동 재생 해제나 음소거, 키보드로 쓰는 일시 정지 기능을 마련해 사용자가 재생을 제어하도록 합니다.

• 로딩 시 음성과 영상의 자동 재생 점검
• 영상 음소거와 일시 정지 기능 추가
• 재생 제어 기능의 키보드 접근 확인

기사의 저자 소개에 주제와 관련된 경험, 자격, 전문 프로필 링크가 있는지 확인합니다. 렌더링된 HTML과 구조화 데이터 등을 검토해 SEO 개선 지점을 제시합니다.

• 기사의 저자 소개를 점검합니다
• 자격 설명과 전문 프로필 링크를 개선합니다
• HTML과 구조화 데이터의 저자 정보를 검토합니다

페이지의 accesskey 속성값 중복을 점검해 키보드 단축키 충돌을 찾습니다. 값 재할당이나 불필요한 속성 제거를 제안하고 수정 후 확인 방법을 정리합니다.

• 키보드 단축키 중복 확인
• 상호작용 요소의 키보드 이동 검토
• 단축키 수정 후 동작 확인

표 머리글과 셀의 대응 관계를 점검해 화면 낭독으로도 데이터의 의미가 전달되는 HTML로 정리합니다. 단순한 표부터 병합 셀이 있는 복잡한 표까지 확인합니다.

• 표의 화면 낭독 지원을 확인할 때
• 병합 셀과 머리글의 관계를 검토할 때
• 디자인 시스템의 표를 검토할 때

로그인부터 다단계 인증과 계정 복구까지 점검하고, 붙여넣기 차단이나 인증 코드 수동 입력처럼 이용을 방해하는 인증 절차의 개선을 돕습니다.

• 전체 로그인 과정의 접근성을 점검합니다
• 인증 코드 붙여넣기와 자동 완성을 확인합니다
• 비밀번호 재설정과 계정 복구를 점검합니다

도구 설명을 키보드와 화면 낭독기로 이용할 수 있는지 점검합니다. HTML 속성, 표시와 닫기 동작, 명암비를 검토하고 수정할 요소와 위치를 제시합니다.

• 도구 설명의 키보드 조작 점검
• 화면 낭독기의 보충 설명 전달 확인
• 표시 동작과 Escape 키 닫기 점검