Q1: HTML에서 `
` 태그란 무엇인가요?
`
` 태그는 문서 내 모든 상대 URL의 기준이 되는 기본 URL(base URL)을 지정하는 데 사용되는 HTML 태그입니다. 즉, 문서 내에서 상대경로로 링크나 리소스를 참조할 때 이 기준이 되는 주소를 설정합니다.
---
Q2: `
` 태그는 어디에 위치해야 하나요?
`
` 태그는 반드시 `` 태그 내부에 위치해야 하며, 문서 내에 한 번만 사용할 수 있습니다.
---
Q3: `
` 태그의 주요 속성은 무엇인가요?
- `href`: 상대 URL의 기준이 될 기본 URL을 지정합니다.
- `target`: 문서 내 모든 링크의 기본 타겟(예: 새 창, 현재 창 등)을 지정할 수 있습니다.
---
Q4: 예제를 보여주세요.
```html
페이지 링크
```
위 예제에서 `
` 태그의 `href="page.html"`은 `https://www.example.com/subdirectory/page.html`로 해석되며, 링크는 새 창에서 열립니다.
---
Q5: `` 태그가 없을 때와 있으면 어떻게 다른가요?
- 없을 때는 상대 URL이 현재 문서의 위치를 기준으로 해석됩니다.
- `` 태그가 지정되면, 해당 태그의 `href` 속성 값이 상대 URL 해석 기준이 되어 문서 위치와는 상관없이 해당 기준으로 링크가 생성됩니다.
---
Q6: `` 태그를 여러 개 사용할 수 있나요?
아니요, `` 태그는 문서당 반드시 하나만 있어야 합니다. 여러 개가 있다면 브라우저가 첫 번째 태그만 인식하고 나머지는 무시합니다.
---
Q7: `` 태그를 사용할 때 주의할 점은 무엇인가요?
- 한 문서에 한 번만 사용해야 하며, 복수 사용 시 혼란이 발생합니다.
- `href` 속성을 잘못 지정하면 링크가 엉뚱한 위치로 연결될 수 있습니다.
- 자바스크립트나 CSS 등에서도 상대 경로를 참조할 때 영향을 받을 수 있으니, 문서 전체 리소스 경로를 꼼꼼히 점검해야 합니다.
---
Q8: `` 속성은 어떤 경우에 유용한가요?
모든 링크에 동일한 타겟을 지정하고 싶을 때 유용합니다. 예를 들어, 모든 링크를 새 창(_blank)이나 프레임셋의 특정 프레임에서 열게 할 수 있습니다. 다만, 개별 링크에서 `target` 속성이 있으면 개별 설정이 우선합니다.
---
Q9: `` 태그는 HTML5에서 지원되나요?
네, `` 태그는 HTML5 표준이며, 주요 브라우저에서 모두 지원됩니다.
---
Q10: `` 태그가 없는 경우에만 상대 URL 기준이 현재 문서라고 할 수 있나요?
네. ``가 지정되지 않은 경우 상대 URL은 문서가 위치한 URL을 기준으로 해석됩니다. 따라서 `` 태그는 문서 내 상대 링크의 기준점을 명확히 할 때 사용합니다.
HTML에서 `<base>` 태그는 문서 내에서 상대 URL을 해석하는 기준이 되는 기본 URL을 설정하는 데 사용됩니다. 이 태그는 `<head>` 섹션에 위치해야 하며, 문서 내의 모든 상대 링크와 이미지 경로에 영향을 미칩니다. `<base>` 태그는 주로 웹 페이지의 링크가 여러 페이지에 걸쳐 있을 때, 링크를 보다 쉽게 관리하고 일관성을 유지하기 위해 사용됩니다. 기본 사용법 `<base>` 태그는 두 개의 주요 속성을 가질 수 있습니다: 1. href : 기본 URL을 지정합니다. 이 URL은 상대 URL을 해석하는 기준이 됩니다. 2. target : 링크가 열리는 방식을 지정합니다. 예를 들어, `_blank`를 사용하면 새 탭에서 링크가 열리게 됩니다. 예제 다음은 `<base>` 태그의 간단한 사용 예제입니다: ```html <!DOCTYPE html> <html lang="ko"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Base Tag Example</title> <base href="https://www.example.com/" target="_blank"> </head> <body> <h1>Base Tag 사용 예제</h1> <p><a href="about.html">About Us</a></p> <p><a href="contact.html">Contact</a></p> <p><img src="images/logo.png" alt="Logo"></p> </body> </html> ``` 위의 예제에서 `<base>` 태그는 `href` 속성을 통해 기본 URL을 `https://www.example.com/`으로 설정하고 있습니다. 따라서 문서 내의 모든 상대 링크는 이 URL을 기준으로 해석됩니다. 예를 들어, "About Us" 링크는 실제로 `https://www.example.com/about.html`로 연결되며, 이미지 경로는 `https://www.example.com/images/logo.png`로 해석됩니다. 주의사항 1. 단일 사용 : 문서 내에서 `<base>` 태그는 한 번만 사용할 수 있습니다. 여러 개의 `<base>` 태그가 존재할 경우, 첫 번째 태그만 <a href='https://sangseek.com/sangseeks/유효/ko'>유효</a>합니다. 2. 상대 URL의 해석 : `<base>` 태그가 설정되면, 모든 상대 URL은 이 기본 URL을 기준으로 해석됩니다. 따라서, 절대 URL을 사용하는 경우에는 `<base>` 태그의 영향을 받지 않습니다. 3. SEO와 접근성 : `<base>` 태그를 사용할 때는 SEO(검색 엔진 최적화)와 접근성 측면에서도 고려해야 합니다. 상대 URL이 잘못 설정되면 링크가 깨지거나 잘못된 페이지로 연결될 수 있습니다. 4. 스크립트와 스타일시트 : `<base>` 태그는 링크, 이미지, 스크립트, 스타일시트 등 모든 상대 URL에 영향을 미칩니다. 따라서, 스크립트나 스타일시트의 경로도 주의 깊게 설정해야 합니다. 결론 `<base>` 태그는 웹 페이지의 링크와 리소스를 관리하는 데 유용한 도구입니다. 올바르게 사용하면 웹 페이지의 유지 관리와 일관성을 높일 수 있지만, 잘못 사용하면 링크가 깨지거나 잘못된 페이지로 연결될 위험이 있으므로 주의가 필요합니다. 웹 개발 시 `<base>` 태그를 적절히 활용하여 효율적인 링크 관리를 구현해 보세요.
