Dreamweaver 웹 페이지에서 미디어 오브젝트를 삽입 및 편집하고 디자인 노트를 사용하는 방법 등에 대해 학습합니다.
Dreamweaver 문서에서 SWF 및 FLV 파일 외에도 다른 오디오 또는 비디오 오브젝트를 삽입할 수 있습니다. 미디어 오브젝트와 함께 액세스 가능성 속성을 삽입한 경우 HTML 코드에서 해당 액세스 가능성 속성 값을 설정하고 편집할 수 있습니다.
삽입 패널의 HTML 범주에서 삽입할 오브젝트의 유형에 해당하는 아이콘을 선택합니다.
[삽입] > [HTML] 하위 메뉴에서 해당 오브젝트를 선택합니다.
미디어 오브젝트의 소스 파일을 선택하고 특정 매개 변수를 지정할 수 있는 대화 상자가 나타납니다.
이러한 대화 상자가 나타나지 않게 하려면 [편집] > [환경 설정] > [일반](Windows) 또는 [Dreamweaver] > [환경 설정] > [일반](Macintosh)을 선택한 다음 [오브젝트 삽입 시 대화 상자 보기] 옵션의 선택을 취소합니다. 대화 상자를 표시하는 모든 환경 설정을 무시하려면 오브젝트를 삽입하는 동안 Control 키(Windows) 또는 Option 키(Macintosh)를 누릅니다.
[편집] > [환경 설정] 대화 상자에서 미디어를 삽입할 때 속성을 표시하도록 선택한 경우 접근성 속성 대화 상자가 나타납니다.
개체를 선택하고 코드 보기에서 HTML 코드를 편집하거나, 마우스 오른쪽 버튼을 클릭(Windows) 또는 Control 키를 누른 상태에서 클릭(Macintosh)한 다음 [태그 코드 편집]을 선택하여 미디어 개체 속성을 편집할 수도 있습니다.
제목
미디어 오브젝트의 제목을 입력합니다.
액세스 키
[텍스트 상자]에 키보드 해당 문자(한 글자)를 입력하여 브라우저에서 양식 오브젝트를 선택하십시오.이렇게 하면 사이트 방문자가 Control 키(Windows)와 액세스 키를 함께 사용하여 개체에 액세스할 수 있습니다. 예를 들어, 액세스 키로 B를 입력하면 브라우저에서 Ctrl+B를 사용하여 오브젝트를 선택하십시오.
탭 인덱스
양식 오브젝트의 탭 순서 번호를 입력합니다. 탭 순서 설정은 페이지에 다른 링크와 양식 개체가 있고 사용자가 특정 순서로 탭을 통해 이동해야 하는 경우에 유용합니다. 한 개체에 대해 탭 순서를 설정하는 경우 모든 개체에 대해 탭 순서를 설정해야 합니다.
[취소]를 클릭하면 문서에 미디어 오브젝트 플레이스홀더가 나타나지만 Dreamweaver에서 접근성 태그나 속성을 연결하지 않습니다.
소스 파일을 지정하거나 치수 및 기타 매개변수와 속성을 설정하려면 각 오브젝트에 대해 [속성 검사기]를 사용하십시오.오브젝트의 접근성 속성을 편집할 수 있습니다.
미디어 파일용 외부 편집기 시작
Dreamweaver에서 외부 편집기를 시작하여 대부분의 미디어 파일을 편집할 수 있습니다.Dreamweaver에서 파일 편집 시 실행할 편집기를 지정할 수도 있습니다.
파일 형식과 연결된 편집기를 확인하려면 Dreamweaver에서 [편집] > [환경 설정]을 선택하고 범주 목록에서 [파일 형식/편집기]를 선택하십시오.확장자 열에서 파일의 확장자를 클릭하여 편집기 열에서 연결된 편집기를 확인하십시오.파일 형식에 연결된 편집기를 변경할 수 있습니다.
[파일] 패널에서 파일을 더블클릭할 때 시작되는 편집기를 기본 편집기라고 합니다.예를 들어 이미지 파일을 더블클릭하면 Dreamweaver가 Adobe Fireworks와 같은 기본 외부 이미지 편집기에서 파일을 엽니다.
[파일] 패널에서 파일명을 마우스 오른쪽 버튼으로 클릭(Windows) 또는 Control 키를 누른 상태로 클릭(Macintosh)하고 컨텍스트 메뉴에서 다음으로 열기를 선택합니다.
[디자인] 보기에서 현재 페이지 내의 미디어 요소를 마우스 오른쪽 버튼으로 클릭(Windows) 또는 Control 키를 누른 상태로 클릭(Macintosh)하고 컨텍스트 메뉴에서 [다음으로 편집]을 선택합니다.
Dreamweaver에서 시작할 편집기를 지정합니다.
Dreamweaver에서 파일 형식을 편집할 때 사용할 편집기를 지정하고, Dreamweaver에서 인식하는 파일 형식을 추가하거나 삭제할 수 있습니다.
특정 파일 형식에 대해 시작할 외부 편집기를 명시적으로 지정합니다
.gif, .wav, .mpg와 같은 파일 이름 확장자가 왼쪽 확장자 아래에 나열됩니다. 선택한 확장자와 연결된 편집기가 오른쪽 편집기 아래에 나열됩니다.
파일 형식과 새 편집기를 연결하려면 편집기 목록 위의 더하기(+) 버튼을 클릭하고 나타나는 대화 상자를 완성합니다.
예를 들어, Acrobat의 애플리케이션 아이콘을 선택하여 파일 형식과 연결합니다.
편집기를 파일 형식의 기본 편집기로 설정하려면(즉, 파일 패널에서 파일 형식을 두 번 클릭할 때 열리는 편집기), 편집기 목록에서 편집기를 선택하고 [기본으로 설정]을 클릭합니다.
파일 형식에서 편집기 연결을 해제하려면 편집기 목록에서 편집기를 선택하고 편집기 목록 위의 빼기(-) 버튼을 클릭합니다.
새 파일 형식과 연결된 편집기 추가
예를 들어, 시스템에 설치된 XML 편집기와 연결하려는 경우 .xml .xsl을 입력할 수 있습니다.
파일 유형 제거하기
파일 형식을 제거한 후에는 실행 취소할 수 없으므로 제거하려는 것이 확실한지 확인하십시오.
미디어 오브젝트에 디자인 노트 사용하기
Dreamweaver의 다른 객체와 마찬가지로 미디어 객체에 Design Notes를 추가할 수 있습니다. Design Notes는 특정 파일과 연결된 메모로, 별도의 파일에 저장됩니다. Design Notes를 사용하여 이미지 소스 파일 이름과 파일 상태에 대한 댓글 등 문서와 연결된 추가 파일 정보를 추적할 수 있습니다.
객체에 Design Notes를 추가하기 전에 사이트를 정의해야 합니다.
파일 패널에서 파일을 선택하고 상황에 맞는 메뉴를 표시한 다음 상황에 맞는 메뉴에서 [Design Notes]를 선택하여 미디어 객체에 Design Note를 추가할 수도 있습니다.
FLV가 아닌 비디오 추가
다양한 방법과 다양한 형식을 사용하여 웹 페이지에 비디오를 추가할 수 있습니다. 비디오는 사용자에게 다운로드되거나 다운로드하는 동안 재생되도록 스트리밍될 수 있습니다.
대부분 AVI 또는 MPEG 파일 유형의 클립을 사용합니다.
클립에 링크하려면 "클립 다운로드"와 같은 링크용 텍스트를 입력하고 텍스트를 선택한 다음 속성 검사기에서 폴더 아이콘을 클릭합니다.비디오 파일을 찾아 선택합니다.
사용자는 Real Media, QuickTime, Windows Media와 같은 일반적인 스트리밍 형식을 보려면 도우미 애플리케이션(플러그인)을 다운로드해야 합니다.
플러그인 내용 삽입
브라우저 플러그인용 QuickTime 동영상과 같은 콘텐츠를 만든 다음 Dreamweaver를 사용하여 해당 콘텐츠를 HTML 문서에 삽입할 수 있습니다.대표적인 플러그인에는 RealPlayer와 QuickTime이 있으며, 콘텐츠 파일에는 mp3 및 QuickTime 동영상이 포함됩니다.
문서 창의 디자인 보기에서 브라우저 플러그인에 의존하는 동영상과 애니메이션을 직접 미리 볼 수 있습니다.모든 플러그인 요소를 한 번에 재생하여 사용자에게 페이지가 어떻게 보일지 확인하거나, 각각을 개별적으로 재생하여 올바른 미디어 요소를 임베드했는지 확인할 수 있습니다.
ActiveX 컨트롤에 의존하는 동영상이나 애니메이션은 미리 볼 수 없습니다.
플러그인 콘텐츠를 삽입한 후 속성 관리자를 사용하여 해당 콘텐츠의 매개변수를 설정합니다.속성 관리자에서 다음 속성을 보려면 플러그인 개체를 선택하십시오.
속성 관리자에는 처음에 가장 일반적으로 사용되는 속성이 표시됩니다.오른쪽 아래 모서리의 펼침 화살표를 클릭하여 모든 속성을 확인하십시오.
플러그인 콘텐츠 삽입 및 속성 설정
[삽입] 패널의 [일반] 카테고리에서 [미디어] 버튼을 클릭하고 메뉴에서 [플러그인] 아이콘
을 선택하십시오.[삽입] > [미디어] > [Plugin]을 선택하십시오.
이름
스크립트 작업 시 플러그인을 식별하기 위한 이름을 지정합니다. 속성 관리자의 맨 왼쪽에 있는 레이블이 없는 텍스트 상자에 이름을 입력하십시오.
W 및 H
페이지의 개체에 할당될 폭과 높이를 픽셀 단위로 지정하십시오.
소스
소스 데이터 파일을 지정합니다. 폴더 아이콘을 클릭하여 파일을 찾아보거나 파일 이름을 입력하십시오.
플러그인 URL
pluginspace 속성의 URL을 지정합니다. 사용자가 플러그인을 다운로드할 수 있는 사이트의 전체 URL을 입력하십시오.페이지를 보는 사용자에게 플러그인이 없는 경우 브라우저에서 이 URL에서 다운로드를 시도합니다.
정렬
오브젝트가 페이지에서 정렬되는 방식을 결정합니다.
V 간격과 H 간격
플러그인의 위, 아래, 양쪽에 픽셀 단위로 여백을 지정하십시오.
테두리
플러그인 주위에 나타나는 테두리의 폭을 지정합니다.
매개 변수
플러그인에 전달할 추가 매개변수를 입력하기 위한 대화 상자를 엽니다.많은 플러그인이 특정 매개 변수에 응답합니다.
또한 [속성] 버튼을 클릭하여 선택한 플러그인에 할당된 속성을 볼 수도 있습니다.이 대화 상자에서 폭과 높이와 같은 속성을 편집, 추가, 삭제할 수 있습니다.
Document 창에서 플러그인 콘텐츠 재생
삽입한 미디어 요소 중 하나를 선택한 다음 [보기] > [플러그인] > [재생]을 선택하거나 속성 관리자의 [재생] 버튼을 클릭합니다.
[보기] > [플러그인] > [모두 재생]을 선택하면 선택된 페이지에서 해당 플러그인을 사용하는 모든 미디어 요소가 재생됩니다.
[모두 재생]은 현재 문서에만 적용됩니다. 예를 들어 프레임세트의 다른 문서에는 적용되지 않습니다.
플러그인 내용 재생 중단하기
[보기] > [플러그인] > [모두 멈춤]을 선택하여 모든 플러그인 콘텐츠 재생을 중지할 수도 있습니다.
플러그인 문제 해결
Document 창에서 플러그인 콘텐츠를 재생하는 단계를 따랐지만 일부 플러그인 콘텐츠가 재생되지 않는 경우 다음을 시도해 보십시오:
관련 플러그인이 컴퓨터에 설치되어 있고 콘텐츠가 설치된 플러그인 버전과 호환되는지 확인합니다.
텍스트 편집기에서 Configuration/Plugins/UnsupportedPlugins.txt 파일을 열고 문제가 있는 플러그인이 나열되어 있는지 확인합니다. 이 파일에는 Dreamweaver에서 문제를 일으키기 때문에 지원되지 않는 플러그인 목록이 기록되어 있습니다. (특정 플러그인에 문제가 발생하면 이 파일에 해당 플러그인을 추가하는 것을 고려해 보십시오.)
메모리가 충분한지 확인합니다. 일부 플러그인은 실행하는 데 추가로 2~5MB의 메모리가 필요합니다.
비헤이비어를 사용하여 미디어 조절
페이지에 비헤이비어를 추가하여 다양한 미디어 객체를 시작하고 중지할 수 있습니다.
Shockwave 또는 Flash 조절
Shockwave 동영상이나 SWF 파일에서 플레이, 정지, 되감기하거나 프레임으로 이동하세요.
사운드 재생
소리를 재생할 수 있습니다. 예를 들어 사용자가 링크 위로 마우스 포인터를 이동할 때마다 음향 효과를 재생할 수 있습니다.
플러그인 확인
사이트 방문자에게 필수 플러그인이 설치되어 있는지 확인한 다음 적절한 플러그인이 있는지 여부에 따라 다른 URL로 라우팅할 수 있습니다. 이는 플러그인에만 적용되며, Check Plugin 비헤이비어는 ActiveX 컨트롤을 확인하지 않습니다.
매개변수를 사용하여 미디어 객체 제어
SWF 파일 및 플러그인을 제어할 수 있는 특정 매개 변수를 정의합니다. 매개 변수는 object, embed 및 applet 태그에 사용됩니다. 매개 변수는 오브젝트 유형에 따라 다른 속성을 설정합니다. 예를 들어 SWF 파일에서 object 태그에 대한 quality 매개 변수 <paramname="quality"value="best">를 사용할 수 있습니다. [매개 변수] 대화 상자는 속성 관리자에서 사용할 수 있습니다. 오브젝트에 필요한 매개 변수에 대한 정보는 해당 오브젝트에 대한 설명서를 참조하십시오.
ActiveX 컨트롤의 데이터 파일을 식별하는 널리 인정받는 표준은 없습니다. 사용 중인 ActiveX 컨트롤의 설명서를 참조하여 사용할 매개변수를 확인합니다.
매개 변수의 이름 및 값 입력하기
문서 창에서 매개 변수를 가질 수 있는 오브젝트를 선택합니다.
속성 관리자가 열려 있지 않으면 속성 관리자를 열고 아래쪽에 있는 [매개 변수] 버튼을 클릭합니다. 속성 관리자가 확장되어 있어야 합니다.