Студопедия

Главная страница Случайная страница

Разделы сайта

АвтомобилиАстрономияБиологияГеографияДом и садДругие языкиДругоеИнформатикаИсторияКультураЛитератураЛогикаМатематикаМедицинаМеталлургияМеханикаОбразованиеОхрана трудаПедагогикаПолитикаПравоПсихологияРелигияРиторикаСоциологияСпортСтроительствоТехнологияТуризмФизикаФилософияФинансыХимияЧерчениеЭкологияЭкономикаЭлектроника






  • Как продвинуть сайт на первые места?
    Вы создали или только планируете создать свой сайт, но не знаете, как продвигать? Продвижение сайта – это не просто процесс, а целый комплекс мероприятий, направленных на увеличение его посещаемости и повышение его позиций в поисковых системах.
    Ускорение продвижения
    Если вам трудно попасть на первые места в поиске самостоятельно, попробуйте технологию Буст, она ускоряет продвижение в десятки раз, а первые результаты появляются уже в течение первых 7 дней. Если ни один запрос у вас не продвинется в Топ10 за месяц, то в SeoHammer за бустер вернут деньги.
    Начать продвижение сайта
  • Вставка звука и видео






    Звуковые эффекты на веб-страницах создаются с помощью аудио­файлов. Наиболее распространены следующие форматы:

    · wav – стандартный формат Windows-приложений;

    · midi – этот формат содержит запись нот и коды музыкальных инст­рументов, по которым синтезируется звук;

    · mp3 – этот формат характеризуется высокой степенью сжатия.

    Звук на страницах часто используется для озвучивания событий – нажатия кнопки, перехода по гиперссылке, открытия окна. Часто стра­ницы сопровождаются звуковым фоном.

    Для подключения звукозаписи в фоновом режиме используется тег < bgsound> со следующими атрибутами:

    src – задает URL-адрес звукового файла;

    loop – определяет количество повторений файла;

    volume – задает уровень звука. Может принимать значения от -10000 до 0, т. е. звук можно только приглушать. Значение 0 – макси­мальный уровень звука.

    В страницу можно «встроить» аудиоплейер с помощью тега < embed> с атрибутами:

    src – URL-адрес звукового файла;

    width, height – размеры панели управления проигрывателя (в пик­селах или процентах от полного размера);

    autostart – может принимать два значения: true – начало вос­произведения сразу после загрузки страницы и false – включение звука пользователем.

    На веб-страницах можно размещать видеофайлы в разных фор­матах:

    · MPEG – видеофайлы (расширение.mpg или.mpeg) в этом формате обычно имеют большой размер, обеспечивают высокое качество видео;

    · AVI – большинство видео- и аудиофайлов в Windows сохранены в этом формате (расширение файлов. avi);

    · QuickTime – небольшой размер файлов в этом формате не требует длительной загрузки по сети (расширение файлов.mov).

    Для вставки видеофайлов можно воспользоваться тегом < embed> с атрибутом

    src=" URL – адрес видеофайла".

    Также можно воспользоваться тегом < img> с атрибутом

    dynsrc=" URL – адрес видеофайла".

    Задание 5.2. Запишите определения основных понятий в тетрадь.

    Коротко о главном

    < IMG src=”…” …> — тег для вставки рисунка.

    Браузеры поддерживают графические форматы GIF, JPG, PNG.

    Большое количество графических изображений замедляет загруз­ку веб-страницы, особенно если изображения «весят много».

    < BGSOUND> – тег для подключения звукозаписи в фоновом режиме.

    < EMBED> – тег для загрузки и отображения видео- и аудиофайлов.

    < IMG dynsrc=" URL-адрес видеофайла" > — использование тега < img> для вставки видеофайлов.

     

     

    Задание 5.3.

    Ø Скопируйте рисунки с расширениями.gif,.jpg, которые будут размещены на страницах, в свою папку. При необходимости переименуйте их в Fon1.jpg, Ris1.gif, Ris2.jpg.

    Ø Отредактируйте, созданный ранее HTML-документ str2F.html (F – первая буква вашей фамилии), в котором будут использованы:

    • в качестве фона – рисунок с расширением jpg, например Fon1.jpg;

    • заголовок – бегущая строка с текстом «В документ можно встав­лять рисунки формата JPG и GIF»;

    • первый рисунок – рисунок с расширением gif, например Ris1.gif;

    • текст к первому рисунку: «Рисунки можно размещать справа или слева от текста или других рисунков»;

    • второй рисунок – рисунок с расширением jpg, например Ris2.jpg;

    • последний рисунок вставить три раза, каждый раз меняя его размер;

    • текст ко второму рисунку: «Размеры рисунков можно изменять».

    Ø Для этого в открывающий тег < BODY> допишите атрибут background=" Fon1.jpg".

     

    < BODY background=" Fon1.jpg" >

    Ø Перед закрывающим тегом < /BODY> вставьте следующую последовательность тегов:

     

    < FONT size=" +5" color=" blue" >

    < MARQUEE> B документ можно вставлять рисунки форматов JPG и GIF

    < /MARQUEE>

    < /FONT>

    < HR color=" blue" >

    < IMG src=" ris1.gif" align=" right" >

    < FONT color= " navy" >

    < РРЕ> Рисунки можно размещать

    справа или слева

    от текста или других рисунков < /PRE>

    < /FONT>

    < HR>

    < IMG src=" ris2.jpg" >

    < IMG src=" ris2. jpg " width=" 80" heigth=" 80" >

    < IMG src=" ris2. jpg " width=" 160" heigth=" 160" >

    < FONT color=" navy" >

    < В> Размеры рисунков можно изменять < /В>

    < /FONT>

     

    Ø Сохраните HTML-документ и посмотрите, что получилось. При необходимости исправьте ошибки.

     

    Задание 5.4.

    Ø В своей папке создайте новую папку «Фамилия фрагмент сайта».

    Ø Скопируйте изображения, которые будут расположены на страницах вашего сайта.

    Ø Создайте три HTML-документа, отличающихся цветом фона, в одном из них в качестве фона используйте рисунок. Создайте гиперссылки с первого документа на второй и третий, со второго – на первый и третий, с третьего – на второй и первый. Со­храните их под именами start.html, str1.html и str2.html со­ответственно.

     

    Например

    < HTML>

    < HEAD>

    < TITLE> Главная< /TITLE>

    < /HEAD>

    < BODY bgcolor=" blue" text=" yellow" >

    < H1> Страничка CTAPT< /H1>

    < HR>

    < A href=" str1.html" > Страница 1 < /A>

    < A href=" str1.html" > Страница 1 < /A>

    < /BODY>

    < /HTML>

     

    < HTML>

    < HEAD>

    < ТIТLЕ> Страница 1< /ТIТLЕ>

    < /HEAD>

    < BODY bgcolor=" cyan" text=" blue" >

    < Н1> Страничка 1< /Н1>

    < HR>

    < A href=" start.html" >

    < IMG sгс =" ris2.JPG " align=" left" >

    < /A>

    < A href=" str2.html" >

    < IMG sгс =" ris3.JPG " align=" right" >

    < /A>

    < /BODY>

    < /HTML>

     

    < HTML>

    < HEAD>

    < ТIТLЕ> Страница 2 < /ТIТLЕ>

    < /HEAD>

    < BODY bgcolor=" Ris1.jpg" text=" blue" >

    < Н1> Страничка 2< /Н1>

    < HR>

    < A href=" start.html" > Главная < /A>

    < A href=" str2.html" > Страница 1 < /A>

    < /BODY>

    < /HTML>

     

    Задание 5.5.

    Ø Скопируйте в свою папку любой звуковой файл формата.mpЗ и переименуйте его в «soundtrack».

    Ø Откройте HTML-документ str2.html, созданный в предыдущем задании. Подключите фоновое звуковое сопровождение. Для этого вставьте тег

     

    < bgsound src=" soundtrack.mpЗ" loop=" 2" volume=" -1000" >

     

    где soundtrack.mpЗ – звуковой файл.

    Ø Просмотрите результат.

     

    Задание 5.6.

    Ø Создайте новую папку «Школьное кафе», в которую скопируйте рисунки для оформления страничек, переименуйте их соответственно в fotofon.jpg, fotofon1.jpg и т.д.

    Ø Создайте следующие документы и свяжите их гипертекстовой связью.

     

    Документ main.html

    < HTML>

    < HEAD>

    < TITLE> Школьное кафе< /TITLE>

    < /HEAD>

    < BODY background=" fotofon.jpg" >

    < H1 align=" center" > Школьное кафе «Ласунак»< /Н1>

    < HR>

    < Н2> Меню на сегодня: < /Н2>

    < HR>

    < OL>

    < LI> < A href =" first.html" > Супы< /А>

    < LI> < A href =" second.html" > Горячие блюда< /А>

    < LI> < A href =" fast food.html" > Булочки< /А>

    < LI> < A href =" other.html" > Сладости< /А>

    < /OL>

    < /BODY>

    < /HTML>

     

    Документ first.html

    < HTML>

    < HEAD>

    < TITLE> Школьное кафе – супы< /TITLE>

    < /HEAD>

    < BODY background=" fotofon1.jpg" >

    < H1 align=" center" > Супы< /Н1>

    < HR>

    < OL>

    < LI> Борщ < /LI>

    < LI> Рассольник < /LI>

    < LI> Молочный с овощами < /LI>

    < /OL>

    < A href=" main.html" > Ha главную< /А>

    < /BODY>

    < /HTML>

     

    Ø Остальные HTML-документы «Школьного кафе» оформите самостоятельно.

     

     


    Лабораторная работа №6. «Таблицы в HTML-документе»

    Задание 6.1. Изучите материал темы «Таблицы в HTML-документе», добавьте новую ось в логико-смысловую модель «Структура HTML-приложения».






    © 2023 :: MyLektsii.ru :: Мои Лекции
    Все материалы представленные на сайте исключительно с целью ознакомления читателями и не преследуют коммерческих целей или нарушение авторских прав.
    Копирование текстов разрешено только с указанием индексируемой ссылки на источник.