Dreamweaver에서 이미지, 동영상, 색상, 스크립트, 링크, 라이브러리 항목 등의 에셋을 사용하는 방법을 살펴봅니다.
에셋 정보
Adobe Dreamweaver를 사용하면 이미지, 동영상, 색상, 스크립트, 링크 등 사이트에 저장된 에셋을 추적하고 미리보기할 수 있습니다. 에셋을 현재 문서의 페이지에 삽입하려면 에셋을 직접 끌어다 놓으세요.
에셋은 다양한 소스에서 얻을 수 있습니다. 예를 들어 Adobe® Fireworks® 또는 Adobe® Flash® 같은 애플리케이션에서 에셋을 만들거나, 동료로부터 받거나, 클립 아트 CD 또는 그래픽 웹 사이트에서 복사할 수 있습니다.
Dreamweaver는 또한 라이브러리와 템플릿이라는 두 가지 특수한 유형의 에셋에 대한 액세스를 제공합니다. 둘 다 연결된 에셋입니다. 라이브러리 항목이나 템플릿을 편집하면 Dreamweaver가 해당 에셋을 사용하는 모든 문서를 업데이트합니다. 라이브러리 항목은 일반적으로 사이트 로고나 저작권 같은 작은 디자인 에셋을 나타냅니다. 더 큰 디자인 영역을 제어하려면 대신 템플릿을 사용하세요.
라이브러리 항목 정보
라이브러리는 웹 페이지에 배치할 수 있는 개별 에셋이나 에셋의 사본 모음을 포함하는 특별한 Dreamweaver 파일입니다. 라이브러리에 있는 이러한 에셋을 라이브러리 항목이라고 합니다. 라이브러리에 저장할 수 있는 항목에는 이미지, 표, 사운드, Adobe Flash로 만든 파일 등이 있습니다. 라이브러리 항목을 편집할 때마다 해당 라이브러리 항목을 사용하는 모든 페이지를 자동으로 업데이트할 수 있습니다.
예를 들어 모든 페이지에 슬로건을 표시하려는 기업을 위한 대형 사이트를 구축한다고 가정해 보겠습니다. 슬로건을 포함하는 라이브러리 항목을 만들어 모든 페이지에서 해당 라이브러리 항목을 사용할 수 있습니다. 슬로건이 변경되면 라이브러리 항목을 변경하여 해당 항목을 사용하는 모든 페이지를 자동으로 업데이트할 수 있습니다.
Dreamweaver는 각 사이트의 로컬 루트 폴더 내 Library 폴더에 라이브러리 항목을 저장합니다. 각 사이트에는 고유한 라이브러리가 있습니다.
텍스트, 표, 양식, Java 애플릿, 플러그인, ActiveX 요소, 탐색 막대, 이미지 등 문서의 본문 섹션에 있는 모든 요소에서 라이브러리 항목을 만들 수 있습니다.
이미지 같은 연결된 항목의 경우 라이브러리는 해당 항목에 대한 참조만 저장합니다. 라이브러리 항목이 올바르게 작동하려면 원본 파일이 지정된 위치에 남아 있어야 합니다.
그러나 라이브러리 항목에 이미지를 저장하는 것이 유용할 수도 있습니다. 예를 들어 라이브러리 항목에 완전한 img 태그를 저장하면 사이트 전체에서 이미지의 alt 텍스트나 src 속성까지도 쉽게 변경할 수 있습니다. (하지만 이미지 편집기를 사용하여 이미지의 실제 크기를 변경하지 않는 한, 이 기법을 사용하여 이미지의 폭 및 height 속성을 변경하지는 마세요.)
라이브러리 항목에 링크가 포함되어 있으면 새 사이트에서 링크가 작동하지 않을 수 있습니다. 또한 라이브러리 항목의 이미지는 새 사이트로 복사되지 않습니다.
라이브러리 항목을 사용하면 Dreamweaver는 항목 자체가 아니라 해당 항목에 대한 링크를 웹 페이지에 삽입합니다. 즉, Dreamweaver는 해당 항목의 HTML 소스 코드 사본을 문서에 삽입하고 원본 외부 항목에 대한 참조가 포함된 HTML 주석을 추가합니다.자동 업데이트를 가능하게 하는 것은 바로 이 외부 참조입니다.
Dreamweaver 비헤이비어가 첨부된 요소를 포함하는 라이브러리 항목을 만들 때 Dreamweaver는 해당 요소와 이벤트 핸들러(onClick, onLoad, onMouseOver 등 어떤 이벤트가 액션을 트리거하는지 지정하고 이벤트가 발생할 때 호출할 액션을 지정하는 속성)를 라이브러리 항목 파일에 복사합니다. Dreamweaver는 관련된 JavaScript 함수를 라이브러리 항목에 복사하지 않습니다. 대신 라이브러리 항목을 문서에 삽입할 때 Dreamweaver가 해당 문서의 head 섹션에 적절한 JavaScript 함수를 자동으로 삽입합니다(아직 없는 경우).
JavaScript를 수동으로 코딩하는 경우(즉, Dreamweaver 비헤이비어를 사용하지 않고 만드는 경우) Call JavaScript 비헤이비어를 사용해 코드를 실행하면 라이브러리 항목의 일부로 만들 수 있습니다. Dreamweaver 비헤이비어를 사용해 코드를 실행하지 않으면 코드가 라이브러리 항목의 일부로 유지되지 않습니다.
라이브러리 항목에서 비헤이비어를 편집하려면 특별한 요구 사항이 있습니다. 라이브러리 항목에는 스타일시트를 포함할 수 없습니다. 이러한 요소의 코드가 head 섹션의 일부이기 때문입니다.
