HTML - 문제 미리보기
문제 844
hard
다음 코드에서 가장 적절하지 않은 부분은?
```html
<!DOCTYPE html>
<html>
<body>
<h1>웹사이트 제목</h1>
<h3>중요한 공지사항</h3>
<p>공지사항 내용입니다.</p>
<h2 style="font-size:10px;">작은 제목</h2>
<h4>일반 정보</h4>
<p>일반 정보 내용입니다.</p>
</body>
</html>
```
```html
<!DOCTYPE html>
<html>
<body>
<h1>웹사이트 제목</h1>
<h3>중요한 공지사항</h3>
<p>공지사항 내용입니다.</p>
<h2 style="font-size:10px;">작은 제목</h2>
<h4>일반 정보</h4>
<p>일반 정보 내용입니다.</p>
</body>
</html>
```
정답: D
이 코드에는 두 가지 주요 문제점이 있습니다:
1. 제목 계층 구조 위반:
`<h1>` 다음에 `<h2>`를 건너뛰고 바로 `<h3>`를 사용했습니다. 올바른 제목 구조는 순차적이어야 합니다 (`h1 → h2 → h3 → ...`). 이는 검색엔진 최적화(SEO)와 접근성에 좋지 않습니다.
2. 잘못된 제목 사용법:
`<h2>`를 작은 크기로 만들기 위해 `font-size:10px`를 사용했습니다. 문서에서 언급했듯이 "제목을 텍스트를 크게 하거나 굵게 만들기 위해 사용하면 안 됩니다." 제목은 의미적 중요도에 따라 선택해야 하고, 크기 조절이 필요하다면 적절한 제목 태그를 선택한 후 CSS로 스타일링해야 합니다.
1. 제목 계층 구조 위반:
`<h1>` 다음에 `<h2>`를 건너뛰고 바로 `<h3>`를 사용했습니다. 올바른 제목 구조는 순차적이어야 합니다 (`h1 → h2 → h3 → ...`). 이는 검색엔진 최적화(SEO)와 접근성에 좋지 않습니다.
2. 잘못된 제목 사용법:
`<h2>`를 작은 크기로 만들기 위해 `font-size:10px`를 사용했습니다. 문서에서 언급했듯이 "제목을 텍스트를 크게 하거나 굵게 만들기 위해 사용하면 안 됩니다." 제목은 의미적 중요도에 따라 선택해야 하고, 크기 조절이 필요하다면 적절한 제목 태그를 선택한 후 CSS로 스타일링해야 합니다.
💡 학습 팁
이 문제를 포함한 HTML 과목의 모든 문제를 순차적으로 풀어보세요. 진행상황이 자동으로 저장되어 언제든지 이어서 학습할 수 있습니다.