반응형

html구조 2

테이블 접근성 구현 방법: caption과 scope 차이 및 올바른 사용법

공공기관 고도화 대응 정리공공기관 프로젝트에서테이블은 QA에서 가장 많이 걸리는 영역 중 하나다.특히 자주 지적되는 항목이:caption 누락scope 잘못 사용th/td 구조 오류의미 없는 table 사용이번 글에서는실무에서 바로 적용 가능한 기준으로 정리한다. 1. caption은 왜 필요한가?caption은 단순 제목이 아니다.스크린리더는테이블을 읽기 전에 caption을 먼저 읽는다.즉,“이 테이블이 무엇을 설명하는지”를 알려주는 장치다. ❌ 잘못된 예 이름 부서 → 스크린리더는“테이블 시작, 2열 10행” 이런 식으로만 읽는다. ✅ 올바른 예 직원 정보 목록 이름 부서 caption은 화면에 보여도 되고,숨겨도 된다 🔹 화면에 보이지..

환경 세팅 & HTML 구조

HTML을 시작하기 위한 필수 준비물: 개발 환경 세팅HTML을 배우기 위해 꼭 복잡한 툴이 필요한 것은 아닙니다. 하지만 효율적으로 작업하고 실시간 결과를 확인하기 위해서는 최소한의 개발 환경을 세팅해 두는 것이 좋습니다.가장 추천하는 도구는 바로 [VS Code (Visual Studio Code)]입니다. 무료이며, 가볍고, 다양한 확장 기능을 통해 HTML뿐 아니라 CSS, JS까지 연동해서 사용할 수 있습니다.VS Code 설치 방법:공식 사이트에 접속운영체제에 맞는 설치 파일 다운로드 후 실행설치가 완료되면 실행 후 기본 폰트, 테마, 확장팩 설치 가능추천 확장팩:Live Server: HTML 파일을 저장할 때마다 브라우저가 자동으로 새로고침 되어 실시간 확인이 가능Prettier: 코드 자..

반응형