프로젝트 파일을 다운로드하고 저장합니다. Dreamweaver에서 create-hyperlinks.html을 열고 분할 뷰에서 소스 코드(Source Code)를 확인합니다.

보기를 선택하고 수직 분할을 선택 해제 하면 코드 뷰와 라이브 뷰가 세로로 나란히 표시되므로 HTML을 손쉽게 읽을 수 있습니다.

라는 제목의 섹션으로 스크롤한 다음 ABOUT이라고 되어 있는 첫 번째 메뉴 항목을 찾습니다.

먼저 ABOUT이라는 단어 앞과 뒤에 앵커 태그()를 추가한 다음 href=" " 속성을 여는 태그에 추가합니다. 따옴표(" ") 안에 전체 웹 URL http://www.nasa.gov를 입력합니다.

웹 사이트 외부의 페이지로 연결할 때 해당 페이지를 별도의 창에서 열리도록 하여 사용자가 사이트에서 떠나지 않도록 하는 것이 좋습니다. 그렇게 하려면 target="_blank" 속성을 추가합니다.

일반적인 웹 사이트는 여러 개의 페이지 또는 문서로 구성되어 있습니다. 사용자는 기본 메뉴 또는 페이지의 다른 부분에 있는 링크를 클릭하여 해당 페이지에 액세스하게 됩니다. 이 예제에서는 프로젝트 파일에 포함되어 있는 gallery.html로 연결되는 링크를 만들어 봅니다.

IMAGES라는 단어 앞과 뒤에 태그를 추가한 다음 여는 태그에 href=" 를 입력하고 gallery.html을 찾아 열기를 클릭합니다.

웹 사이트의 일부 페이지에는 콘텐츠 양이 많아 스크롤해야 하는 경우가 있을 수 있습니다. 앵커 링크를 활용하면 사이트 방문자가 링크를 클릭해 동일한 페이지의 다른 부분으로 신속하게 이동할 수 있습니다. 앵커 링크를 만드는 데에는 두 단계만 거치면 됩니다.

우선 연결하려는 페이지의 섹션에 고유한 id를 추가합니다. 이 실습 파일에는 42행에

그 다음 내비게이션 메뉴에서 ARTICLES 단어 앞뒤에 태그를 추가한 다음 href=" " 속성을 추가합니다. 따옴표(" ") 안에 해시태그(#)를 먼저 입력한 다음 위의 id를 정확하게 지정합니다.

브라우저에서 미리보기(Preview in Browser)를 클릭하여 원하는 브라우저를 선택하고 하이퍼링크를 테스트하십시오.

변경 내용을 확인하려면 파일을 저장해야 합니다.