Archive / Markup / Target

<a>, <area> 태그에 적용하여 링크의 대상창을 지정하는 속성이다. 프레임을 사용할 경우 프레임의 name 속성과 <a> 태그의 target 속성을 같게 해 주면 <a> 태그를 클릭했을 때 name이 같은 프레임의 내용이 변경되게 된다. 만약 동일한 name을 가진 프레임이 없을 경우에는 새창이 뜨게 된다.

<a href="mypage.html" target="mainframe">

이 target의 값 중에 미리 정해진 값들이 있는데 각각 정해진 동작을 하게 된다.

  • _blank : 새창
  • _parent : 현재프레임의 부모창
  • _self : 현재창
  • _top : 브라우져 최상단 창

프레임의 깊이가 1단계일 경우, _parent와 _top은 같은 동작을 하게 된다. 깊이가 2단계 이상일 경우 _top은 항상 창의 전체 주소가 변경되지만 _parent는 바로 위의 프레임만 변경이 된다.

새창을 띄우기 위해서 win이나 new와 같은 값을 사용하는 경우를 볼 수 있는데 _blank와는 동작이 다르기 때문에 구별해서 사용해야 한다. win과 _blank 둘다 한번 클릭을 했을 때에는 새창이 뜨게 되지만 한번 더 눌러보면 win은 아까 떴던 창의 내용이 바뀌고 _blank는 또 다른 새창이 뜨게 된다. 새 창을 띄우기 위해서는 _blank를 사용하는 것이 바람직하다.

HTML Transitional이나 XHTML Transitional 에는 <a> 태그에 target 속성이 존재하지만 strict DTD에는 target 속성이 존재하지 않는다. 링크를 새 창으로 열거나 새 탭으로 열 때 사용자의 의견을 최대한 존중하고 강제로 새창을 띄우지 않게 하려는 의미로 생각된다. 또한 사용자에게 미리 알리지 않고 뜨는 새창은 접근성을 떨어뜨리기 때문에 되도록이면 피하는 것이 좋다.

strict DTD를 사용하면 target 속성을 사용할 수 없기 때문에 유효성 검증(validation)을 통과하기 위해서 자바스크립트로 새창을 띄우는 것을 볼 수 있는데 이것은 접근성을 떨어뜨리게 되고 사용자에게 불편함을 주기 때문에 피해야 한다. 실제로 이 방법을 사용할 때 사용자가 새탭에서 열기 위해서 커멘드(컨트롤) + 마우스클릭을 하면 탭과 새창이 같이 열리는 경우가 발생하게 된다. 새창을 사용해야 한다면 strict DTD를 사용하지 않고 transitional DTD를 사용해야 한다.

Page last modified on May 26, 2009, at 09:03 AM

Powered by PmWiki