Fireworks CS5에서 이미지 맵을 만들고 링크하는 방법 - 그래픽을 만들 때 인형

비디오: [누구나 쉽게 만드는 홈페이지요리사] 1분내에 빈 DIV에 임포트 삽입하기. 2025

Adobe Fireworks Creative Suite 5에서 그래픽을 만들고 여러 핫 스폿 (하이퍼 링크)을 추가하면 그것은 이미지 맵으로 알려지게됩니다.

이미지 맵을 사용하여 이미지에서 클릭 가능한 영역을 정의합니다.

Fireworks에서 이미지 맵 만들기

이미지 맵을 만들려면 다음 단계를 따르십시오.

여러 개의 핫스팟을 할당하려는 그래픽 파일을 엽니 다.
도구 패널의 웹 섹션에서 사각형 핫 스폿 도구를 클릭 한 채로 숨겨진 핫스팟 도구 (직사각형, 원 또는 다각형) 중 하나를 선택합니다.
직사각형 또는 원형 도구를 선택한 경우 클릭하고 드래그하여 핫스팟을 정의합니다. 다각형 도구로 영역을 만들려면, 사용자 정의 영역을 생성하기 위해 점대 점을 클릭하고 놓기 만하면됩니다.

도형이 옳지 않다면 두려워하지 마십시오. 포인터 및 하위 선택 도구를 사용하여 핫스팟을 이동하고 크기를 조정할 수 있습니다.

핫스팟을 정의한 후 핫스팟을 연결할 위치 (일반적으로 웹 페이지)를 정의 할 수 있습니다.

창 → URL을 선택하십시오.

URL 패널이 나타납니다.
이 영역을 선택한 후 뷰어가 이동할 URL 주소를 입력하십시오.

나중에 URL 텍스트 상자의 오른쪽에있는 더하기 기호를 클릭하여 사용할 수 있도록 라이브러리에 URL을 추가 할 수 있습니다.

웹 사이트 (외부 링크) 이외의 페이지를 참조하는 경우 http: //로 링크를 시작해야합니다.
창 → 레이어를 선택하여 레이어 패널을 표시합니다.

작성한 핫스팟은 웹 레이어의 별도 하위 레이어로 나타납니다.
이 하위 계층의 이름을 두 번 클릭하고 더 적절한 이름을 지정하십시오.

사용할 수있는 URL 이외의 링크 유형은 다음과 같습니다.

전자 메일 주소 : URL 텍스트 상자에 mailto: 사용자 주소 를 입력하여 열리는 링크를 만듭니다 귀하의 주소가 이미 입력되어 있고 갈 준비가 된 메시지 창!
Fireworks 문서의 다른 페이지로 연결 : 많은 사람들이 Fireworks에서 웹 사이트의 프로토 타입을 만들고 한 페이지에서 다른 페이지로 연결되는 링크를 보여줍니다. [페이지] 패널을 사용하여 문서에 페이지를 추가 한 다음 [링크] 드롭 다운 메뉴를 사용하여 한 페이지에서 다른 페이지로 연결할 수 있습니다.

Fireworks에서 여러 페이지를 내보내려면 파일 → 내보내기를 선택한 다음 페이지 드롭 다운 메뉴에서 모든 페이지를 선택합니다. 새로 만든 HTML 파일을 브라우저에서 열어 링크를 테스트 할 수 있습니다.