📘 HTML과 JavaScript 연결하기✅ JavaScript란?웹페이지에 동적인 기능을 추가하는 프로그래밍 언어✅ HTML에서 JS 연결 방법html인사하기✅ 외부 파일 연결html✅ 팁onclick, onchange, onmouseover 등 이벤트 활용HTML과 JS를 분리하면 유지보수에 유리

📘 반응형 웹을 위한 HTML 구조✅ 반응형 웹이란?화면 크기에 따라 레이아웃이 자동으로 조정되는 웹사이트✅ HTML에서의 준비 태그 필수html✅ 예제 구조html 헤더 메뉴 본문 푸터✅ 팁CSS의 media query와 함께 사용모바일 사용자도 고려한 구조 설계

📘 HTML과 SEO (검색엔진 최적화)✅ SEO란?검색엔진에서 웹페이지가 잘 노출되도록 최적화하는 작업✅ HTML에서 중요한 요소요소설명페이지 제목 (검색 결과에 표시됨)페이지 설명~구조화된 제목내부/외부 링크alt이미지 설명 (검색엔진 인식 가능)✅ 예제html✅ 팁키워드를 자연스럽게 포함시멘틱 태그 사용으로 검색엔진 이해도 향상

📘 HTML 폼 검증과 유효성 체크✅ 기본 유효성 검사html 제출✅ 주요 속성속성설명required필수 입력min, max숫자 범위 제한minlength, maxlength글자 수 제한pattern정규식 패턴 검사✅ 팁브라우저에서 자동으로 유효성 검사사용자 경험 향상에 효과적

📘 HTML로 간단한 웹페이지 만들기✅ 목표지금까지 배운 내용을 활용해 실제 웹페이지 하나를 만들어보기✅ 예제: 나만의 소개 페이지html 안녕하세요, minhee입니다! 웹 개발을 배우고 있어요. HTML이 너무 재밌어요! 이메일 보내기 ✅ 팁간단한 스타일을 적용해 보기 좋게 만들기이미지, 텍스트, 링크를 조화롭게 배치

📘 웹 접근성과 HTML✅ 웹 접근성이란?장애가 있는 사용자도 웹 콘텐츠를 동등하게 이용할 수 있도록 하는 것HTML은 접근성을 높이는 데 중요한 역할을 합니다✅ 접근성 향상 태그와 속성요소설명alt이미지 설명label폼 요소에 이름 부여aria-*스크린 리더용 속성role요소의 역할 지정✅ 예제: 접근성 있는 폼html 이메일: ✅ 팁색상 대비, 키보드 접근성도 고려시멘틱 태그 사용으로 스크린 리더 호환성 향상