HTML <i> 태그란?
HTML에서 텍스트를 기울임꼴(이탤릭체)로 표시하려면 <i> 태그를 사용합니다. 이 태그는 특별한 의미를 부여하지 않고 시각적으로만 기울임꼴 스타일을 적용할 때 주로 활용되며, 영화 제목·책 제목·외국어 표현·기술 용어 등을 나타낼 때 유용합니다.
기본 사용 예제
아래 코드를 실행하면 <i> 태그로 감싼 'Avengers'라는 단어가 기울임꼴로 출력되는 것을 확인할 수 있습니다.
<!DOCTYPE html> <html> <head> <title>HTML i 태그</title> </head> <body> <p>우리는 영화 <i>Avengers</i>를 좋아했습니다.</p> </body> </html>
<i> 태그와 <em> 태그의 차이
단순히 기울임꼴 스타일만 필요하다면 <i> 태그를 사용하면 됩니다. 하지만 텍스트에 강조(stress emphasis)라는 의미를 함께 부여하고 싶다면 <em> 태그를 사용하는 것이 좋습니다. <em> 태그도 기본적으로 기울임꼴로 렌더링되지만, 화면 낭독기(screen reader)가 해당 부분을 강조하여 읽어주기 때문에 웹 접근성 측면에서 더 적합합니다.
즉, 디자인상의 이유로 기울임꼴이 필요한 경우에는 <i>, 문맥적으로 중요한 내용을 강조해야 하는 경우에는 <em>을 사용하는 것이 HTML5의 권장 방식입니다.