Macromedia dreamweaver вставить видео
Вы можете вставить видео HTML5 и аудио HTML5 в web-страницы, используя Dreamweaver. Видео и звуковые элементы в HTML5 определяют новый способ включить и отобразить видео и аудио на web-странице.
Эта особенность доступна только для подписчиков продуктов Creative Cloud .
Dreamweaver позволяет Вам вставлять и анонсировать аудио HTML5 в web-страницах.
Вставьте аудио HTML5
1. Установите курсор, где Вы хотите вставить аудио.
2. Выберите Вставку> СМИ> Аудио HTML5. Звуковой файл вставлен в указанном местоположении.
3. В панели Properties (Инспектор свойств), введите следующую информацию:
Укажите замещающий текст, заголовок, текст, который будет отображен в браузерах, не поддерживающих HTML5, выберите элементы управления аудио (пуск, стоп, пауза) и другое.
1. Сохраните web-страницу.
2. Выберите Файл> Предварительный просмотр в Браузере. Выберите браузер, в котором Вы хотите анонсировать аудио
Эта особенность доступна только для подписчиков продуктов Creative Cloud .
Вставьте видео HTML5
1. Установите курсор, где Вы хотите вставить видео.
2. Выберите Вставку> СМИ> Видео HTML5. Видео элемент HTML5 будет вставлен в указанном местоположении.
3. В панели Properties, определите значения для различных опций.
Вставьте элементы HTML5
Выберите на панели "Вставка" (Окно> Вставка) Размещение для списка элементов, которые Вы можете вставить в свое размещение страницы HTML5.
Чтобы редактировать свойства вставленных семантических элементов, выберите элемент и редактируйте его свойства в инспекторе свойств .
Вы можете также использовать меню Вставка (Вставка> Размещение), чтобы вставить семантические тэгы.
Семь новых семантических тэгов для этого выпуска: Статья, В стороне, HGroup, Навигация, Раздел, Заголовок, и Нижний колонтитул.
Подробнее - в обучающих материалах Adobe
Вы можете импортировать Adobe Edge Animate compositions (файлы OAM) в Dreamweaver. Состав помещен в местоположение курсора.
Dreamweaver помещает извлеченное содержание файла OAM в папке, названной edgeanimate_assets по умолчанию. Вы можете изменить местоположение значения по умолчанию в диалоге Установки Сайта.
Подробнее - в обучающих материалах Adobe
Элемент Холста в HTML5 - контейнер для динамически произведенных графических символов. Эти графические символы созданы, используя JavaScript.
Чтобы определить местонахождение элемента Холста, выберите Вставку> Холст. Альтернативно, откройте панель Вставка(Окно> Вставка), и выберите "Обычный".
Чтобы редактировать свойства элемента Холста, выберите элемент и редактируйте его свойства в панели Properties (в Инспекторе свойств).
Как часть поддержки HTML5, новые признаки были добавлены к панели Properties (Инспектор свойств) для элементов формы. Кроме того, были добавлены четыре новых элемента формы - почта, ищите, позвоните, URL (были введены в разделе Форм панели Вставка - Insert).
Подробнее - в обучающих материалах Adobe
Использование Живого Поиска для определения местонахождения файлов, основанных на имени файла или тексте в файлах. Сайт, отобранный в панели Files, используется для поиска.
Живой Поиск использует Центр внимания API в Mac OS. Любая настройка, которую Вы применяете к персональным настройкам Центра внимания, также используется для Живого Поиска.
Подробнее - в обучающих материалах Adobe
Автоматическая загрузка файлов на Сервер, продолжая работать с Dreamweaver, загрузка сайта Business Catalyst.
HTML5 supports video and audio tags that allow users to play video and audio files in a browser, without an external plug-in or player. Dreamweaver supports code hints for adding video and audio tags.
Live View renders the video, providing a preview of the video that you are embedding in the web page.
Although you can embed any video in your web page, Live View does not always render all videos. The audio and video tags are supported in Dreamweaver using the Apple QuickTime plug-in. In Windows, if the Apple QuickTime plug-in is not installed, the web page does not render the media content.
To know how to insert HTML5 video, see Insert HTML5 videos in Dreamweaver.
Вставка файлов FLV
Видеофайлы FLV легко добавить на веб-страницу и без использования средства разработки Flash. Для этого потребуется готовый файл FLV.
Dreamweaver вставляет компонент SWF для воспроизведения файла FLV. При просмотре в браузере этот компонент отображает выбранный файл FLV, а также набор элементов управления воспроизведением.
Dreamweaver дает возможность передавать видео в формате FLV посетителям сайта следующими методами.
Видео с последовательной загрузкой
Файл FLV загружается на жесткий диск посетителя сайта, а затем воспроизводится. В отличие от традиционных методов доставки видео «загрузить и открыть», последовательная загрузка позволяет начать воспроизведение видеофайла до того, как он будет полностью загружен.
Содержимое видео потоком передается по сети и начинает воспроизводиться на веб-странице после быстрого заполнения буфера, который обеспечивает плавность воспроизведения. Для использования потокового видео на веб-странице необходим доступ к серверу Adobe® Flash® Media Server.
Для использования в Dreamweaver необходим готовый файл FLV. Можно вставлять видеофайлы, созданные с помощью двух видов кодеков (технологий компрессии и декомпрессии): Sorenson Squeeze и On2.
Как и для файлов SWF, при вставке файла FLV Dreamweaver вставляет код, который проверяет наличие у пользователя версии проигрывателя Flash Player, необходимой для воспроизведения видео. Если у пользователя нет подходящей версии, то на страницу выводится альтернативное содержимое, предлагающее пользователю загрузить последнюю версию Flash Player.
Для просмотра файлов FLV у пользователя должен быть установлен проигрыватель Flash Player версии 8 или выше. Если пользователь не имеет подходящей версии проигрывателя Flash Player, но при этом установлена версия Flash Player 6.0 r65 или выше, то в браузере вместо альтернативного содержимого отображается предложение выполнить экспресс-установку Flash Player. Если пользователь отказывается от экспресс-установки, то на странице отображается альтернативное содержимое.
Изменение сведений о загрузке проигрывателя Flash Player
При вставке файла FLV на страницу Dreamweaver вставляет код, который определяет наличие у пользователя правильной версии проигрывателя Flash Player. Если она отсутствует, то на странице будет отображено альтернативное содержимое, предлагающее пользователю загрузить последнюю версию проигрывателя. Это содержимое можно в любой момент изменить.
Эта процедура также применима и к файлам SWF.
Если у пользователя нет требуемой версии, но имеется проигрыватель версии Flash Player 6.0 r65 или выше, то браузер предложит выполнить экспресс-установку Flash Player. Если пользователь отказывается от экспресс-установки, то на странице отображается альтернативное содержимое.
Щелкните значок глаза на вкладке файла SWF или FLV.
Чтобы переключиться в альтернативный режим просмотра содержимого, можно также нажать сочетание клавиш Ctrl + «]». Чтобы вернуться в режим просмотра SWF/FLV, нажимайте сочетание клавиш Ctrl + «[» до тех пор, пока не будет выбрано все альтернативное содержимое. Затем нажмите Ctrl + «[» еще раз.
В качестве альтернативного содержимого файлы SWF и FLV добавлять нельзя.
Задание параметров потокового видео
В диалоговом окне «Вставка FLV» можно задать параметры потоковой загрузки файла FLV, вставляемого на веб-страницу.
Выберите пункт меню «Вставка» > «HTML» > «Flash-видео» (или щелкните значок «Flash-видео» в категории «HTML» на панели «Вставка»).
Задает имя воспроизводимого FLV-файла (например, myvideo.flv). Расширение .flv указывать не обязательно.
Определяет внешний вид компонента видео. Просмотреть выбранную оболочку можно под всплывающим меню «Оболочка».
Ширина FLV-файла в пикселях. Dreamweaver определяет ширину FLV-файла и автоматически заполняет соответствующие данные в этом поле.
Высота FLV-файла в пикселях. Dreamweaver определяет высоту FLV-файла и автоматически заполняет соответствующие данные в пикселях в этом поле.
Параметр «Всего с оболочкой» означает ширину и высоту файла FLV вместе с шириной и высотой выбранной оболочки.
Сохраняются те же пропорции высоты и ширины компонента видео. Этот параметр выбран по умолчанию.
Канал активного видео
Определяет, является ли видеосодержимое активным. Если выбран вариант «Канал активного видео», Flash Player воспроизводит видеопоток, передаваемый с сервера Flash® Media Server. Имя канала активного видео указывается в текстовом поле «Имя потока».
Чтобы включить «Канал активного видео», необходимо выбрать один из вариантов оболочки «Ореола» из поля «Оболочка». При выборе параметра «Канал активного видео» на оболочке компонента отображается только элемент управления громкостью, так как активным видеопотоком управлять невозможно. Кроме того, параметры «Автоматический режим» и «Автоматическая перемотка» в этом режиме не работают.
Указывает, будет ли воспроизводиться видео сразу же при открытии веб-страницы.
Указывает, осуществляется ли возврат к начальной позиции после завершения воспроизведения видео.
Указывает время в секундах, необходимое для буферизации видео перед воспроизведением. По умолчанию время буферизации равно 0, то есть воспроизведение видео начинается сразу же после нажатия кнопки «Воспроизвести». (Если выбран параметр «Автоматический режим», воспроизведение начинается сразу же после установления соединения с сервером.) В случае доставки видео со скоростью потока, превышающей скорость соединения посетителя, или при вероятности проблем с полосой пропускания или подключением может понадобиться задать определенное время для буферизации. Например, чтобы передать на веб-страницу 15 секунд видео до начала его воспроизведения, установите для буферного времени значение 15.
Команда «Вставить FLV» создает SWF-файл проигрывателя видео и файл оболочки SWF для отображения видеосодержимого на веб-странице. Команда также создает файл main.asc, который необходимо загрузить на сервер Flash Media Server. (Для отображения новых файлов может потребоваться нажать кнопку «Обновить» на панели «Файлы».) Эти файлы сохраняются в том же каталоге, что и файл HTML, к которому добавляется видеосодержимое. При передаче файла HTML, содержащего файл FLV, не забудьте передать на веб-сервер файлы SWF, а также файл main.asc на сервер Flash Media Server.
Если файл main.asc уже есть на сервере, то прежде чем передавать файл main.asc, созданный командой «Вставить FLV», проконсультируйтесь с администратором сервера.
Изменение компонента FLV
Выделите местозаполнитель компонента видео в окне документа Dreamweaver, щелкнув значок FLV в центре местозаполнителя.
Тип видео (например, с последовательной загрузки — на потоковую) с помощью инспектора свойств изменить нельзя. Чтобы изменить тип видео, удалите компонент FLV и вставьте его вновь командой «Вставка» > «Мультимедиа» > «FLV».
Перед тем, как вставлять какое-то изображение на сайт, предварительно его нужно оптимизировать и сохранить в подходящем формате. Затем следует подобрать на странице подходящее место для вставки этого изображения и установить там текстовой курсор.
Теперь выполняем команду меню Insert (Вставить) | Image (Изображение) (++). Также можно использовать кнопку Image (Изображение) на вкладке Common (Общее) панели инструментов Insert (Вставка):
Откроется диалоговое окно Select Image Source (Выбор источника изображения):
Обратите внимание, в правой части диалогового окна располагается панель Image Preview (Предварительный просмотр изображения), на которой не только осуществляется предварительный просмотр выбранного изображения, но и отображаются его характеристики: размер, формат, объем и предполагаемое время загрузки.
Раскрывающийся список Папка и список доступных гpaфических файлов, расположенный ниже, позволяют выбрать нужное изображение. Щелкаем на кнопке ОК. Изображение будет вставлено на место установки текстового курсора:
Изменить размеры изображения (если вы захотите это сделать), можно несколькими способами. Первый – ручной. Сначала выделите изображение щелчком левой кнопки мыши. На панели Properties (Свойства) отобразятся свойства выделенного изображения, а само изображение получит тонкую окантовку, на правой и нижней границах появятся три небольших черных квадрата. Это так называемые маркеры изменения размера изображения:
Чтобы изменить размер изображения ручным способом, нужно перетащить эти маркеры в нужном направлении. Для синхронизации горизонтального и вертикального размеров следует удерживать нажатой клавишу .
Второй способ заключается во вводе в соответствующие поля панели Properties (Свойства) значений вертикального (Н) и горизонтального (W) размеров. По умолчанию размеры изображения задаются в пикселах, но можно задавать их и в процентах от размера страницы. Для этого после введенного в поле размера нужно поставить знак процента %.
Если значения в полях размеров изображения выделены жирным шрифтом, значит, они уже были изменены. Первоначальные размеры изображения отображаются более тонким начертанием.
Чтобы восстановить истинные значения изображения нужно щелкнуть по закругленной стрелке, изображенной правее полей ввода размеров изображения.
В Dreamweaver также можно изменить относительное расположение изображения и обтекающего его текста. Для этого предназначен список Align (Выравнивание), расположенный, как Вы уже догадались, на панели Properties (Свойства):
По умолчанию установлено значение Default. Остальные девять параметров:
- Baseline — нижняя граница изображения совпадает с базовой линией текста;
- Тор — верхняя граница изображения совпадает с верхней линией текста;
- Middle — середина изображения совпадает с базовой линией текста;
- Bottom — нижняя граница изображения совпадает с низом текста;
- TextTop — верхняя граница изображения совпадает с верхней границей самого высокого символа текста;
- Absolute Middle — середина изображения совпадает с центральной линией текста;
- Absolute Bottom — нижняя граница изображения совпадает с нижней границей самого нижнего символа текста;
- Left – изображение выровнено по левому краю;
- Right – изображение выровнено по правому краю.
По умолчанию изображение помещается на страницу без всякой окантовки. Но бывает, что рисунок надо как-либо выделить. Для этого используется рамка (или, как ее еще часто называют, – граница). Ширина рамки в пикселах задается в поле ввода Border (Граница), расположенном на панели Properties (Свойства) графического изображения:
Нулевое значение или отсутствие значений не задают рамки вообще. Рамка имеет только черный цвет. На рисунке представлены примеры использования границ толщиной 0, 1, 5, 10, 25 пикселов:
Изменение и удаление компонента FLV
Чтобы изменить настройки видео для веб-страницы, выберите заполнитель компонента видео в окне документа Dreamweaver и воспользуйтесь инспектором свойств. Еще одним методом является удаление и повторная вставка компонента видео с помощью меню «Вставка» > «HTML» > «Flash-видео».
Задание параметров для видео с последовательной загрузкой
В диалоговом окне «Вставка FLV» можно задать параметры последовательной загрузки файла FLV, вставляемого на веб-страницу.
Выберите пункт меню «Вставка» > «HTML» > «Flash-видео» (или щелкните значок «Flash-видео» в категории «HTML» на панели «Вставка»).
В диалоговом окне «Вставка FLV» выберите во всплывающем меню «Тип видео» пункт «Последовательная загрузка».
Определяет внешний вид компонента видео. Просмотреть выбранную оболочку можно под всплывающим меню «Оболочка».
Ширина FLV-файла в пикселях. Dreamweaver автоматически определяет ширину FLV-файла и отображает данные в этом поле.
Высота FLV-файла в пикселях. Dreamweaver автоматически оптимизирует высоту FLV-файла и отображает данные в этом поле.
Параметр «Всего с оболочкой» означает ширину и высоту файла FLV вместе с шириной и высотой выбранной оболочки.
Сохраняются те же пропорции высоты и ширины компонента видео. Этот параметр выбран по умолчанию.
Указывает, будет ли воспроизводиться видео сразу же при открытии веб-страницы.
Указывает, осуществляется ли возврат к начальной позиции после завершения воспроизведения видео.
Команда «Вставить FLV» создает SWF-файл проигрывателя видео и файл оболочки SWF для отображения содержимого видео на веб-странице. (Для отображения новых файлов может потребоваться нажать кнопку «Обновить» на панели «Файлы».) Эти файлы сохраняются в том же каталоге, что и файл HTML, к которому добавляется видеосодержимое. При передаче на сервер файла HTML, содержащего файл FLV, Dreamweaver передает эти файлы как зависимые (если в диалоговом окне «Разместить зависимые файлы?» было выбрано значение «Да»).
Edit or delete an FLV component
Change the settings for the video on your web page, by selecting the video component placeholder in the Dreamweaver Document window and using the Property inspector. Another way is to delete the video component and reinsert it by selecting Insert > HTML > Flash Video.
Edit the FLV component
Select the video component placeholder in the Dreamweaver Document window by clicking the FLV icon at the center of the placeholder.
You cannot change video types (from progressive download to streaming, for example) by using the Property inspector. To change the video type, delete the FLV component, and reinsert it by selecting Insert > Media > FLV.
Узнайте, как встраивать видео в веб-страницы и вставлять файлы FLV в Dreamweaver.
HTML5 поддерживает теги для видео и звука, позволяющие пользователям воспроизводить видео- и аудиофайлы в браузере без помощи внешних подключаемых модулей или проигрывателей. Dreamweaver поддерживает подсказки по коду при добавлении тегов для видео и звука.
В представлении «Интерактивный просмотр» видео обрабатывается и дается предварительный просмотр видеофайла, встраиваемого в веб-страницу.
Хотя в веб-страницу можно встраивать любое видео, в представлении «Интерактивный просмотр» не всегда обрабатываются все видеофайлы. В Dreamweaver теги для звука и видео поддерживаются с помощью подключаемого модуля Apple QuickTime. В операционной системе Windows веб-страница не обработает медиаконтент, если подключаемый модуль Apple QuickTime не установлен.
Чтобы узнать, как вставлять видео HTML5, см. раздел Добавление видео HTML5 в Dreamweaver.
Вставка файла FLV
Выберите меню «Вставка» > «HTML» > «Flash-видео».
В диалоговом окне «Вставка FLV» выберите во всплывающем меню «Тип видео» пункт «Последовательная загрузка» или «Потоковое видео».
Microsoft Internet Information Server (IIS) не обрабатывает вложенные теги object. Для ASP-страниц при вставке файлов SWF или FLV Dreamweaver вместо вложенных тегов object использует вложенные теги object/embed.
Inserting FLV files
Вставка звуковых и видео файлов
Путешествуя по Интернету, вы наверняка встречали сайты с музыкальным сопровождением. Чаще всего музыка встречается на домашних страничках, но и тематические сайты не исключение.
Мне, если честно, не очень нравятся сайты, которые используют музыкальное сопровождение в качестве фона. При длительном просмотре сайта одна и та же мелодия изрядно надоедает. Так что не увлекайтесь 🙂
Самое главное, что нужно учитывать при выборе фоновой музыки – это ее соответствие теме вашего сайта. И вообще подумайте, логично ли будет на вашем сайте использовать фоновую музыку?
Музыка, так же, как и фоновый рисунок, не должна отвлекать от содержимого страницы. Если это именно фоновая музыка, то лучше всего будет использовать просто мелодию без слов.
Впрочем, помимо фоновой мелодии можно записать приветствие голосом, и сделать так, чтобы оно запускалось при каждом заходе на сайт. Или добавить звуковые эффекты к различным действиям пользователя – к примеру, звук «клац» при нажатии на ссылки.
Прежде чем помещать на страницу звук, нужно создать или подобрать подходящий звуковой файл. Сейчас существует несколько форматов для хранения таких документов: MP3, WMA и WAV. Они являются универсальными и проигрываются практически всеми проигрывателями.
Внедрить звуковой файл на страницу можно посредством обычной ссылки (о создании ссылок будет рассказано немного позже). Но этот способ не лучший, так как требует много усилий со стороны пользователя. Лучше использовать его для представления, например, своей коллекции музыки.
Более эффективный способ – внедрить на страницу звук, который начнет воспроизводиться при загрузке данной страницы. Для этого необходимо подключить так называемый модуль расширения (Plugin). Это небольшие специальные программы представляют собой динамические библиотеки Windows (DLL) и загружаются браузером автоматически для воспроизведения аудио или видеофайла.
Для подключения такого модуля расширения, как всегда, сначала выбираем подходящее место на странице и устанавливаем там текстовой курсор. Затем выполняем команду меню Insert (Вставка) | Media (Мультимедиа) | Plugin (модуль расширения):
Для ускорения процесса можно воспользоваться кнопкой Media (Мультимедиа) на вкладке Common панели инструментов Insert. В раскрывшемся списке выбираем последний пункт – Plugin.
В любом из двух вариантов откроется диалоговое окно Select File (Выбрать файл). Если выбранный звуковой файл располагается не в папке сайта, Dreamweaver сообщит об этом и предложит сохранить его в нужной папке. В примере файл уже находится там, где ему и следует находиться.
Теперь нажимаем кнопку ОК и смотрим, что у нас получилось. В том месте на странице, где вы установили текстовой курсор, появился небольшой серый прямоугольник, на котором изображен такой же знак, как перед пунктом Plugin кнопки Media вкладки Common. Как вы уже догадались, это и есть знак модуля расширения.
Теперь переведем взгляд ниже, а именно, на панель Properties, где сейчас отображаются свойства модуля расширения:
Как видите, здесь можно настроить высоту, ширину модуля, отступы и выравнивание. А также ширину границы, путь к файлу и так далее. Заметное место на панели занимает кнопочка Play. Как Вы думаете, для чего она нужна?
Теперь давайте посмотрим, как этот значок модуля расширения будет выглядеть в браузере:
Все просто. Нажимаем на стрелку (1) файл проигрывается, нажимаем на «паузу» в виде двух вертикальных линий (2) – воспроизведение останавливается.
Просто – да, но настроек как-то маловато, даже на мини-прогрыватель не тянет. Поэтому давайте вернемся в Dreamweaver, увеличим ширину модуля до 100 пикселей и посмотрим, что же отобразится в браузере.
Уже лучше, не так ли? Стало видно больше кнопок управления. Теперь увеличим ширину еще на 100 пикселей. Может, еще что-нибудь появится? 🙂
Да, наши ожидания оправдались! Однако, больше новых кнопок не появится (во всяком случае, в моем примере), так что дальше можно не экспериментировать.
Если вам не нравится этот мини-проигрыватель, и вы хотите убрать его со страницы, оставив при этом сам звук, то в поля ввода размеров модуля расширения введите единичные значения. Он будет отображаться как небольшая точка, распознать в которой проигрыватель будет достаточно сложно. Однако, в этом случае посетитель не сможет проиграть файл заново, так же как и не сможет прервать проигрывание. Не думаю, что он будет рад такой перспективе. Особенно, если звук ему не понравится.
Тогда у него будет только два пути – либо отключить громкость в колонках, либо закрыть окно с Вашим сайтом. Первый путь более затратный, со вторым же просто – один-два щелчка мыши.
Вставлять видео на страницу можно также, как и звук – посредством Plugin. Не забудьте увеличить размеры модуля расширения, чтобы поля просмотра был больше. Пример окна проигрывателя для демонстрации видеофайла:
Видеофайлы FLV легко добавить на веб-страницу и без использования средства разработки Flash. Для этого потребуется готовый файл FLV.
Dreamweaver вставляет компонент SWF для воспроизведения файла FLV. При просмотре в браузере этот компонент отображает выбранный файл FLV, а также набор элементов управления воспроизведением.
Dreamweaver дает возможность передавать видео в формате FLV посетителям сайта следующими методами.
Видео с последовательной загрузкой
Файл FLV загружается на жесткий диск посетителя сайта, а затем воспроизводится. В отличие от традиционных методов доставки видео «загрузить и открыть», последовательная загрузка позволяет начать воспроизведение видеофайла до того, как он будет полностью загружен.
Потоковое видео
Содержимое видео потоком передается по сети и начинает воспроизводиться на веб- странице после быстрого заполнения буфера, который обеспечивает плавность воспроизведения. Для использования потокового видео на веб-странице необходим доступ к серверу Adobe Flash Media Server.
Для использования в Dreamweaver необходим готовый файл FLV. Можно вставлять видеофайлы, созданные с помощью двух видов кодеков (технологий компрессии и декомпрессии): Sorenson Squeeze и On2.
Как и для файлов SWF, при вставке файла FLV, Dreamweaver вставляет код, который проверяет наличие у пользователя версии проигрывателя Flash Player, необходимой для воспроизведения видео ( Подробнее ).
Примечание. Для просмотра файлов FLV у пользователя должен быть установлен проигрыватель Flash Player версии 8 или выше.
Вставка файла FLV
1 Выберите пункт меню « Вставка » > « Мультимедиа » > « FLV ».
2 В диалоговом окне «Вставка FLV» выберите во всплывающем меню «Тип видео» пункт «Последовательная загрузка» или «Потоковое видео».
3 Укажите остальные параметры диалогового окна и нажмите кнопку «ОК».
Примечание. Microsoft Internet Information Server (IIS) не обрабатывает вложенные теги object. Для ASP- страниц при вставке файлов SWF или FLV Dreamweaver вместо вложенных тегов object использует вложенные теги object/embed.
Задание параметров для видео с последовательной загрузкой
Ограничение Сохраняются те же пропорции высоты и ширины компонента видео. Этот параметр выбран по умолчанию.
Автоматический режим Указывает, будет ли воспроизводиться видео сразу же при открытии веб-страницы.
Автоматическая перемотка Указывает, осуществляется ли возврат к начальной позиции после завершения воспроизведения видео.
Задание параметров потокового видео
Автоматический режим Указывает, будет ли воспроизводиться видео сразу же при открытии веб-страницы.
Автоматическая перемотка Указывает, осуществляется ли возврат к начальной позиции после завершения воспроизведения видео.
Буферное время Указывает время в секундах, необходимое для буферизации видео перед воспроизведением.
По умолчанию время буферизации равно 0, то есть воспроизведение видео начинается сразу же после нажатия кнопки «Воспроизвести». (Если выбран параметр «Автоматический режим», воспроизведение начинается сразу же после установления соединения с сервером.) В случае доставки видео со скоростью потока, превышающей скорость соединения посетителя, или при вероятности проблем с полосой пропускания или подключением может понадобиться задать определенное время для буферизации. Например, чтобы передать на веб-страницу 15 секунд видео до начала его воспроизведения, установите для буферного времени значение 15.
При передаче файла HTML, содержащего файл FLV, не забудьте передать на веб-сервер
файлы SWF, а также файл main.asc на сервер Flash Media Server.
Примечание. Если файл main.asc уже есть на сервере, то прежде чем передавать файл main.asc, созданный командой «Вставить FLV», проконсультируйтесь с администратором сервера.
Изменение сведений о загрузке проигрывателя Flash Player
При вставке файла FLV на страницу Dreamweaver вставляет код, который определяет наличие у пользователя правильной версии проигрывателя Flash Player.
1 В представлении «Дизайн» окна документа выберите файл SWF или FLV.
2 Щелкните значок глаза на вкладке файла SWF или FLV.
Чтобы переключиться в альтернативный режим просмотра содержимого, можно также нажать
сочетание клавиш «Control» + «]». Чтобы вернуться в режим просмотра SWF/FLV, нажимайте сочетание клавиш «Control» + «[» до тех пор, пока не будет выбрано все альтернативное содержимое. Затем нажмите «Control» + «[» еще раз.
3 Измените содержимое таким же образом, как любое другое содержимое Dreamweaver.
Примечание. В качестве альтернативного содержимого файлы SWF и FLV добавлять нельзя.
4 Щелкните значок глаза, чтобы вернуться к просмотру файла SWF или FLV.
Устранение неполадок файлов FLV
В этом разделе описаны самые распространенные причины неполадок в файлах FLV.
Просмотр неполадок, связанных с отсутствием связанных файлов
Код, создаваемый Dreamweaver CS4 и более поздних версий, основан на четырех зависимых файлах, отличных от самого файла FLV:
• swfobject_modified.js
• expressInstall.swf
• FLVPlayer_Progressive.swf
• Файл обложки (например, Clear_Skin_1.swf)
Помните, что в отличие от Dreamweaver CS3, в Dreamweaver CS4 и более поздних версиях существует еще два зависимых файла.
Первые два файла (swfobject_modified.js и expressInstall.swf) устанавливаются в папку «Сценарии», которая создается Dreamweaver в корне сайта (если она уже не создана).
Вторые два файла (FLVPlayer_Progressive.swf и файл обложки) устанавливаются в ту же папку, что и страница, в которую встраивается файл FLV. Файл обложки содержит элементы управления FLV. Его имя зависит от обложки, которая указана в параметрах, описанных в справке по Dreamweaver. Например, если выбрать обложку «Clear Skin», файл будет назван Clear_Skin_1.swf.
Для корректного отображения FLV все четыре зависимых файла НЕОБХОДИМО загрузить на удаленный сервер. Отсутствие этих файлов на сервере — самая распространенная причина того, что файлы FLV некорректно отображаются в веб-странице. Если один из этих файлов отсутствует, вместо требуемого содержимого страницы может отобразиться «белый прямоугольник».
Чтобы удостовериться в том, что все четыре зависимых файла загружены, используйте панель файлы Dreamweaver» для загрузки страницы, на которой должен отобразиться файл FLV.
При загрузке страницы Dreamweaver запрашивает, нужно ли загрузить зависимые файлы (если вы не отключили эту функцию).
Нажмите «Да», чтобы загрузить зависимые файлы.
Обнаружение неполадок при локальном предпросмотре страниц
В Dreamweaver CS4 есть новые ограничения, связанные с безопасностью: нельзя использовать команду «Просмотреть в браузере» для тестирования страницы со встроенными файлами FLV, если вы не определили локальный тестовый сервер в определении веб-сайта Dreamweaver и не используете для просмотра страницы этот тестовый сервер.
В предыдущих версиях тестовый сервер понадобился бы только при разработке страниц с использованием ASP, ColdFusion или PHP (см. раздел «Подготовка компьютера для разработки приложений» на странице 573).
Если вы создаете веб-сайты, использующие только HTML, и не определили тестовый сервер, нажмите F12 (Windows) или Opt+F12 (Macintosh) для вывода на экран элементов управления обложкой. Чтобы обойти это ограничение, нужно либо определить тестовый сервер и использовать его для предпросмотра страницы, либо загрузить файлы на удаленный сервер и просмотреть их там.
Примечание. Вероятно также, что настройки безопасности отвечают за невозможность предварительного просмотра содержимого FLV. Компании Adobe не удалось это подтвердить. Вы можете изменить настройки безопасности и посмотреть, что получится.
Другие возможные причины неполадок с файлами FLV
• Если возникли трудности с локальным просмотром, удостоверьтесь, что в меню «Правка» > «Настройки» > «Просмотреть в браузере» снят флажок «Просмотр с использованием временного файла».
• Удостоверьтесь, что установлен подключаемый модуль FlashPlayer последней версии
• Старайтесь не перемещать папки и файлы вне Dreamweaver. При перемещении файлов и папок вне Dreamweaver нельзя гарантировать, что пути на связанные файлы FLV будут корректными.
• Можно временно заменить проблемный файл FLV заведомо работающим файлом. Если замена файла сработала, значит проблема в исходном файле FLV, а не в браузере или компьютере.
Изменение и удаление компонента FLV
Чтобы изменить настройки видео для веб-страницы, выберите заполнитель компонента видео в окне документа Dreamweaver и воспользуйтесь инспектором свойств. Еще одним методом является удаление и повторная вставка компонента видео с помощью команды «Вставка» > «Мультимедиа» > «FLV».
Изменение компонента FLV
1 Выделите местозаполнитель компонента видео в окне документа Dreamweaver, щелкнув значок FLV в центре местозаполнителя.
2 Откройте инспектор свойств («Окно» > «Свойства») и внесите изменения.
Примечание. Тип видео (например, с последовательной загрузки — на потоковую) с помощью инспектора свойств изменить нельзя. Чтобы изменить тип видео, удалите компонент FLV и вставьте его вновь командой «Вставка» > «Мультимедиа» > «FLV».
Удаление компонента FLV
❖ Выделите местозаполнитель компонента FLV в окне документа Dreamweaver и нажмите клавишу «Delete».
Удаление кода определения FLV
В Dreamweaver CS4 и более поздних версиях код определения проигрывателя Flash Player вставляется непосредственно в тег объекта, содержащего файл FLV. В отличие от этого в версии Dreamweaver CS3 и ранее код определения помещался за пределами тега object файла FLV. Поэтому при удалении файлов FLV со страниц, созданных в Dreamweaver CS3 и более ранних версий, необходимо использовать команду «Удалить определение FLV», которая удаляет и сам код определения.
❖ Выберите меню «Команды» > «Удалить распознавание Flash-видео».
Устранение неполадок файлов FLV
В этом разделе описаны самые распространенные причины неполадок в файлах FLV.
Просмотр неполадок, связанных с отсутствием связанных файлов
Код, создаваемый Dreamweaver CS4 и более поздних версий, основан на четырех зависимых файлах, отличных от самого файла FLV:
файл обложки (например, Clear_Skin_1.swf).
Помните, что в отличие от Dreamweaver CS3, в Dreamweaver CS4 и более поздних версиях существует еще два зависимых файла.
Первые два файла (swfobject_modified.js и expressInstall.swf) устанавливаются в папку «Сценарии», которая создается Dreamweaver в корне сайта (если она уже не создана).
Вторые два файла (FLVPlayer_Progressive.swf и файл обложки) устанавливаются в ту же папку, что и страница, в которую встраивается файл FLV. Файл обложки содержит элементы управления FLV. Его имя зависит от обложки, которая указана в параметрах, описанных в справке по Dreamweaver. Например, если выбрать обложку «Clear Skin», файл будет назван Clear_Skin_1.swf.
Для корректного отображения FLV все четыре зависимых файла НЕОБХОДИМО загрузить на удаленный сервер.
Отсутствие этих файлов на сервере — самая распространенная причина того, что файлы FLV некорректно отображаются в веб-странице. Если один из этих файлов отсутствует, вместо требуемого содержимого страницы может отобразиться «белый прямоугольник».
Чтобы удостовериться в том, что все четыре зависимых файла загружены, используйте панель «Файлы Dreamweaver» для загрузки страницы, на которой должен отобразиться файл FLV. При загрузке страницы Dreamweaver запрашивает, нужно ли загрузить зависимые файлы (если вы не отключили эту функцию). Нажмите «Да», чтобы загрузить зависимые файлы.
Обнаружение неполадок при локальном предпросмотре страниц
В Dreamweaver CS4 есть новые ограничения, связанные с безопасностью: нельзя использовать команду «Просмотреть в браузере» для тестирования страницы со встроенными файлами FLV, если вы не определили локальный тестовый сервер в определении веб-сайта Dreamweaver и не используете для просмотра страницы этот тестовый сервер.
В предыдущих версиях тестовый сервер понадобился бы только при разработке страниц с использованием ASP, ColdFusion или PHP (см. раздел Настройка компьютера для разработки программ). Если вы создаете веб-сайты, использующие только HTML, и не определили тестовый сервер, нажмите F12 (Windows) или Opt+F12 (Macintosh) для вывода на экран элементов управления обложкой. Чтобы обойти это ограничение, нужно либо определить тестовый сервер и использовать его для предпросмотра страницы, либо загрузить файлы на удаленный сервер и просмотреть их там.
Вероятно также, что настройки безопасности отвечают за невозможность предварительного просмотра содержимого FLV. Компании Adobe не удалось это подтвердить. Вы можете изменить настройки безопасности и посмотреть, что получится. Дополнительные сведения об изменении параметров безопасности см. в технической заметке 117502.
Другие возможные причины неполадок с файлами FLV
Если возникли трудности с локальным просмотром, удостоверьтесь, что в меню «Правка» > «Настройки» > «Просмотр в реальном времени» снят флажок «Просмотр с использованием временного файла».
Удостоверьтесь, что установлен подключаемый модуль FlashPlayer последней версии
Старайтесь не перемещать папки и файлы вне Dreamweaver. При перемещении файлов и папок вне Dreamweaver нельзя гарантировать, что пути на связанные файлы FLV будут корректными.
Можно временно заменить проблемный файл FLV заведомо работающим файлом. Если замена файла сработала, значит проблема в исходном файле FLV, а не в браузере или компьютере.
Insert FLV files
You can easily add FLV video to your web pages without using the Flash authoring tool. You must have an encoded FLV file before you begin.
Dreamweaver inserts a SWF component that displays the FLV file; when viewed in a browser, this component displays the selected FLV file, as well as a set of playback controls.
Dreamweaver gives you the following options for delivering FLV video to your site visitors:
Progressive Download Video
Downloads the FLV file to the site visitor’s hard disk and then plays it. Unlike traditional “download and play” methods of video delivery, however, progressive download allows the video file to start playing before the download is complete.
Streams the video content and plays it on a web page after a short buffer period that ensures smooth play back. To enable streaming video on your web pages, you must have access to Adobe® Flash® Media Server.
You must have an encoded FLV file before you can use it in Dreamweaver. You can insert video files created with two kinds of codecs (compression/decompression technologies): Sorenson Squeeze and On2.
As with regular SWF files, when you insert an FLV file, Dreamweaver inserts code that detects whether the user has the correct version of Flash Player to view the video. If the user does not have the correct version, the page displays alternative content that prompts the user to download the latest version of Flash Player.
To view FLV files, users must have Flash Player 8 or later installed on their computers. If a user does not have the required version of Flash Player installed, but does have Flash Player 6.0 r65 or later installed, the browser displays a Flash Player express installer instead of the alternative content. If the user declines the express install, the page then displays the alternative content.
Insert an FLV file
Select Insert > HTML > Flash Video.
In the Insert FLV dialog box, select Progressive Download or Streaming Video from the Video Type pop-up menu.
Microsoft Internet Information Server (IIS) does not process nested object tags. For ASP pages, Dreamweaver uses nested object/embed code instead of nested object code when inserting SWF or FLV files.
Set options for progressive download video
The Insert FLV dialog box lets you set options for progressive download delivery of an FLV file inserted in a web page.
Select Insert > HTML > Flash Video (or click the Flash Video icon in the HTML category of the Insert panel).
Specifies the appearance of the video component. A preview of the selected skin appears beneath the Skin pop-up menu.
The width of the FLV file, in pixels. Dreamweaver determines the width of the FLV file and you can see the width automatically appearing in this field.
The height of the FLV file, in pixels. Dreamweaver automatically optimizes the height of the FLV file and you can see the height automatically appear in this field.
Total With Skin is the width and height of the FLV file plus the width and height of the selected skin.
Maintains the same aspect ratio between the width and height of the video component. This option is selected by default.
Specifies whether to play the video when the web page is opened.
Specifies whether the playback control returns to starting position after the video finishes playing.
The Insert FLV command generates a video player SWF file and a skin SWF file that are used to display your video content on a web page. (To see the new files, you may need to click the Refresh button in the Files panel.) These files are stored in the same directory as the HTML file to which you’re adding video content. When you upload the HTML page containing the FLV file, Dreamweaver uploads these files as dependent files (as long as you click Yes in the Put Dependent Files dialog box).
Set options for streaming video
The Insert FLV dialog box lets you set options for streaming video download of an FLV file inserted in a web page.
Select Insert > HTML > Flash Video (or click the Flash Video icon in the HTML category of the Insert panel).
Specifies the name of the FLV file that you want to play (for example, myvideo.flv). The .flv extension is optional.
Specifies the appearance of the video component. A preview of the selected skin appears beneath the Skin pop-up menu.
The width of the FLV file, in pixels. Dreamweaver determines the width of the FLV file, and autopopulates the width in this field.
The height of the FLV file, in pixels. Dreamweaver determines the height of the FLV file, and autopopulates the height in pixels, in this field.
Total With Skin is the width and height of the FLV file plus the width and height of the selected skin.
Maintains the same aspect ratio between the width and height of the video component. This option is selected by default.
Live Video Feed
Specifies whether the video content is live. If Live Video Feed is selected, Flash Player plays a live video feed streamed from Flash® Media Server. The name of the live video feed is the name specified in the Stream Name text box.
To enable Live Video Feed, you must select the one of the Halo skin options from the Skin field. When you select Live Video Feed, only the volume control appears on the component’s skin, because you cannot manipulate live video. Additionally, the Auto Play and Auto Rewind options have no effect.
Specifies whether to play the video when the web page is opened.
Specifies whether the playback control returns to starting position after the video finishes playing.
Specifies the time, in seconds, required for buffering before the video starts playing. The default buffer time is set to 0 so that the video starts playing instantly after the Play button is clicked. (If Auto Play is selected, the video starts playing as soon as a connection is made with the server.) You might want to set a buffer time if you are delivering video that has a higher bit rate than the site visitor’s connection speed, or when Internet traffic might cause bandwidth or connectivity problems. For example, if you want to send 15 seconds of video to the web page before the web page starts to play the video, set the buffer time to 15.
The Insert FLV command generates a video player SWF file and a skin SWF file that are used to display your video on a web page. The command also generates a main.asc file that you must upload to your Flash Media Server. (To see the new files, you may need to click the Refresh button in the Files panel.) These files are stored in the same directory as the HTML file to which you’re adding video content. When you upload the HTML page containing the FLV file, don’t forget to upload the SWF files to your web server, and the main.asc file to your Flash Media Server.
If you already have a main.asc file on your server, check with your server administrator before uploading the main.asc file generated by the Insert FLV command.
You can easily upload all of the required media files by selecting the video component placeholder in the Dreamweaver Document window, and clicking the Upload Media button in the Property inspector (Window > Properties). To see a list of required files, click Show required files.
The Upload Media button does not upload the HTML file that contains the video content.
Edit Flash Player download information
When you insert an FLV file in a page, Dreamweaver inserts code that detects whether the user has the correct version of Flash Player. If not, the page displays default alternative content that prompts the user to download the latest version. You can change this alternative content at any time.
This procedure also applies to SWF files.
If a user does not have the required version but does have Flash Player 6.0 r65 or later, the browser displays a Flash Player express installer. If the user declines the express install, the page then displays the alternative content.
Click the eye icon in the SWF file or FLV file.
You can also press Control + ] to switch to alternative content view. To return to SWF/FLV view, press Control + [ until all of the alternative content is selected. Then press Control + [ again.
You cannot add SWF files or FLV files as alternative content.
Troubleshoot FLV files
This section details some of the most common causes of problems with FLV files.
Viewing problems caused by absence of related files
The skin file (for example Clear_Skin_1.swf)
Note that there are two more dependent files for Dreamweaver CS4 and later, compared to Dreamweaver CS3.
The first two of these files (swfobject_modified.js and expressInstall.swf) are installed in a folder called Scripts, which Dreamweaver creates in the root of your site if it doesn't already exist.
The second two files (FLVPlayer_Progressive.swf and the skin file) are installed in the same folder as the page in which the FLV is embedded. The skin file contains the controls for the FLV, and its name depends on the skin chosen in the options described in Dreamweaver Help. For example, if you choose Clear Skin, the file is named Clear_Skin_1.swf.
All four dependent files MUST be uploaded to your remote server for the FLV to display correctly.
Forgetting to upload these files is the most common cause of FLV files failing to run correctly in a web page. If one of the files is missing, you might see a "white box" on the page.
To ensure that you've uploaded all of the dependent files, use the Dreamweaver Files panel to upload the page in which the FLV appears. When you upload the page, Dreamweaver asks you if you want to upload dependent files (unless you've turned off this option). Click yes to upload dependent files.
Viewing problems when previewing pages locally
Because of security updates in Dreamweaver CS4, you cannot use the Preview in Browser command to test a page with an embedded FLV unless you define a local testing server in your Dreamweaver site definition and use the testing server to preview the page.
Normally, you require a testing server only if you are developing pages with ASP, ColdFusion, or PHP (see Set up your computer for application development). If you are building websites that use only HTML, and haven't defined a testing server, pressing F12 (Windows) Opt+F12 (Macintosh) produces a jumble of skin controls onscreen. The workaround is either to define the testing server and use the testing server to preview your page, or upload your files to a remote server and view them there.
It’s possible that security settings may also be responsible for an inability to preview local FLV content, but Adobe has not been able to confirm this. You can try changing your security settings to see if it helps. For more information on changing your security settings, see Tech Note 117502.
Other possible causes for problems with FLV files
If you are having trouble previewing locally, make sure the Preview using temporary file option is deselected under Edit > Preferences > Real-time Preview.
Make sure you have the latest FlashPlayer plug-in
Be wary of moving files and folders around outside of Dreamweaver. When you move files and folders outside of Dreamweaver, Dreamweaver cannot guarantee the correct paths to FLV-related files.
You can temporarily replace the FLV file that’s giving you trouble with a known working FLV file. If the replacement FLV file works, then the problem is with the original FLV file, and not with your browser or computer.
Читайте также: