서로 충돌하는 대체 스타일 태그가 발견되었습니다: %1$s.

내.맘.대.로 2025. 9. 25. 08:45

Conflicting alternate style tags found: %1$s.

이 오류는 HTML 문서의 <head> 섹션에서 대체 스타일시트를 설정하는 방식에 논리적인 충돌이 있음을 의미합니다.

대체 스타일시트는 독자에게 여러 가지 디자인 테마(예: '낮 모드', '밤 모드', '세피아 모드')를 선택할 수 있도록 제공하는 고급 기능입니다. 🎨 독자는 뷰어의 설정을 통해 선호하는 스타일을 고를 수 있습니다.

이 오류는 이 '테마 선택지'를 제공하는 규칙에 문제가 생겼다는 뜻입니다.

가장 흔한 원인은 '기본 테마'로 설정된 스타일시트가 두 개 이상이기 때문입니다.

rel="stylesheet"와 title="테마이름"을 모두 가진 <link> 태그는 '기본 테마(Preferred Style)'로 간주됩니다.
규칙상 '기본 테마'는 단 하나만 존재해야 합니다.

책의 기본 표지가 두 종류일 수 없는 것처럼, 기본 테마가 여러 개이면 뷰어는 어떤 것을 먼저 보여줘야 할지 혼란에 빠집니다.

오류가 발생한 HTML/XHTML 파일을 엽니다.
<head> 섹션 안에서 CSS 파일을 연결하는 모든 <link> 태그를 찾습니다.
rel="stylesheet"와 title="..." 속성을 동시에 가지고 있는 <link> 태그가 여러 개 있는지 확인합니다.
그 중 하나만 남기고, 나머지는 rel="stylesheet"를 rel="alternate stylesheet"로 변경하여 '대체 테마'로 지정합니다.

오류가 발생하는 코드:➡️ title이 있는 rel="stylesheet"가 두 개이므로 어떤 것이 기본값인지 알 수 없어 충돌이 발생합니다.

HTML

<head>
  ...
  <link rel="stylesheet" href="day.css" title="밝은 테마">
  <link rel="stylesheet" href="night.css" title="어두운 테마">
  ...
</head>

올바르게 수정한 코드: ✅➡️ '밝은 테마'를 기본값으로 두고, '어두운 테마'는 선택 가능한 '대체' 스타일로 변경하여 충돌을 해결했습니다.

HTML

<head>
  ...
  <link rel="stylesheet" href="day.css" title="밝은 테마">
  <link rel="alternate stylesheet" href="night.css" title="어두운 테마">
  ...
</head>