Новости

Зображення та мультимедія в HTML документах

  1. Графіка і картинки
  2. Відео кліпи
  3. гіперпосилання
  4. звуки
  5. рухомий текст

У документах HTML може використовуватися зображення і графіка, звук, а також мультиплікації і відеозображення. Для передачі зображень і звуку використовуються команди: IMG і BGSOUND .

Простий рухомий текст можна задати, використовуючи команду MARQUEE (Ця команда підтримується поки тільки MS Internet Explorer).
Наприклад: Це рухомий текст для MS_IE.

Графіка і картинки

Графічні файли включаються в HTML документи за допомогою команди IMG . Допускається використання файлів у форматі GIF або JPG / JPEG (для систем, що працюють під MS Windows, допускаються файли формату BMP).

Наступний приклад демонструє, вставку в документ GIF файлу:

<IMG SRC = "internet.gif" WIDTH = 46 HEIGHT = 46 ALT = "Earth">

Атрибут SRC = визначає URL адреса (ім'я) графічного файлу. У наведеному прикладі файл буде розміщений в квадраті шириною 46 і висотою 46 пікселів відповідно. Якщо розміри зазначені атрибутами HEIGHT = (висота) і WIDTH = (ширина), не збігаються з розмірами графічного файлу, то останній масштабується. Масштабування може привести до різкого погіршення якості графічного файлу, тому рекомендується ставити розміри відповідають розмірам графічного файлу.

Рекомендується для великих графічних файлів (більше 10 Kb) завжди ставити їх розміри, для прискорення роботи переглядача. Якщо розміри не задані, то зустрівши графічний файл переглядач припиняє висновок тексту і чекає поки перекачається вся картинка, щоб визначити її розміри.

Атрибут ALT = вказує, що ставити на місце малюнка, якщо ваш переглядач не вміє показувати графічні файли або внаслідок повільній швидкості перекачування ви не отримали файл по мережі.

Якщо ви вставляєте команду IMG в документ, то переглядач розміщує наступний за нею текст внизу від картинки. використовуючи атрибут ALIGN = можна перемістити, наступний перед і за картинкою текст.

Допустимі значення атрибута ALIGN =

приклади:

Кожен "поважаючий" себе WEB сервер (програми, поддержівающе протокол передачі гіпертексту) має свій базовий набір картинок (іконок - icons) для встакі в документи, які генеруються за замовчуванням (наприклад, лістинг директорії), см. список картинок WEB сервера Apache , На якому розміщений даний курс (стадарно ці картинки розташованих у віртуальній директорії сервера / icons).

"Плаваючи" картинки

використовуючи атрибут ALIGN = зі значеннями LEFT або RIGHT можна створити "плаваючу" картинку, яку буде обтікати текст. В кінці плаваючого об'єкта обов'язково має бути присутня команда BR з атрибутом CLEAR = , Який припиняє обтікання картинки. Після цієї команди текст виводиться нижче графічного файлу.

Розглянемо наступний приклад:

<IMG SRC = "picture.gif" ALIGN = LEFT HSPACE = 4> Тут розташовується текст, який слід помістити справа поруч з картинкою. Текст повинен обтікати картинку <BR CLEAR=LEFT> Тут розташовується текст, який слід помістити нижче картинки. Що дасть:

Тут розташовується текст, який слід помістити справа поруч з картинкою Тут розташовується текст, який слід помістити справа поруч з картинкою. Текст повинен обтікати картинку
Тут розташовується текст, який слід помістити нижче картинки.

Атрибут HSPACE = задає горизонтальний відступ між текстом і картинкою. Якщо даний атрибут не заданий, то текст буде розташовуватися впритул до картинки. (Див. Також атрибут VSPACE = ).

Декілька порад:

Завжди використовувати атрибути завдання розміру картинки. В цьому випадку переглядач, не чекаючи поки перекачається вся картинка, буде подолжать паказивать документ далі.

Використовувати картинки, переважно в форматі JPEG / JPG. (Картинки в форматі GIF, особливо які мають велику кількість деталей повільно отрісовиваємих на не дуже потужних машинах, типу PC-386).

Якщо хототе щоб користувач з інтересом читав ваші сторінки, то разі не вставляйте в документ картинки більше 40 Kb. Для картинок більшого розміру використовувати гіперпосилання з обов'язковими зазначенням її обсягу (наші канали поки що недостатньо швидкі, щоб перекачувати великий обсяг даних).

Не слід використовувати більше 256 кольорів. Більшість ваших читачів-клієнтів використовують 8-бітну відеокарту і велика кількість квітів (True Color) все одно не побачить. Картинки високою колірною можливості розв'язання завжди перевіряйте на 256 колірному режимі (хоча це не панацея від усіх бід - деякі комп'ютери можуть довільно міняти палітру, але все ж деяка гарантія, що вас побачать).

Чи не злоупотребляте анімаційними GIF'ам (такими як на цій сторінці), це сильно ускладнює управління на слабкій машині, особено для Netscape.

Відео кліпи

використовуючи команду IMG можна вставити в документ відео-кліп (відео файл типу .avi - Audio Video Interleave). Для завдання відео фрагмента використовується атрибут DYNSRC = .

приклад:

<IMG DYNSRC = "TheEarth.avi" SRC = "TheEarth.gif" WIDTH = 46 HEIGHT = 46 LOOP = INFINITE ALIGN = RIGHT>

У цьому прикладі відео-кліп буде демонструватися безперервно: атрибут LOOP = має значення LOOP = INFINITE. атрибути CONTROLS і START = керують способом програвання кліпу (кліп може стартувати відразу після завантаження документа або після того як користувач натисне на зображення задане атрибутом SRC = .

Використання відео-кліпів в документах поки істотно стримується швидкістю передачі даних по мережі (розмір файлу з кліпом як правило більше мегабайта) і тим, що далеко не всі засоби перегляду має можливість показувати відео-фрагменти або вимагають завантаження спеціальних пакетів для підтримки відео.

гіперпосилання

Картинка може бути засобом завдання і управління вибором гіперпосилань в HTML документі (hot spot "anchoring"). У цьому випадку на команду IMG повинна вказувати гіперпосилання, що визначається командою A .

За замовчуванням переглядач малює рамку навколо картинки, яка зазначена як гіперпосилання. Ви можете прибрати отрисовку рамки, використавши атрибут BORDER = в команді IMG з значенням нуль.

Крім цього ви маєте можливість створити "активну" (з гіперпосиланнями) картинку, в якій різні частини картинки мають різні посилання. Це є досить потужним апаратом навігації в WWW (див. активні карти ).

звуки

команда BGSOUND задає фонові звуки або музику під час перегляду документа. Атрибут SRC = повинен вказувати на URL відповідного звукового файлу (.WAV, .AU, MIDI). Атрибут LOOP = вказує на частоту програвання звукового файлу.

приклад:

<BGSOUND SRC = "boing.wav" LOOP = 5> Ви будете чути звук 5 разів.

Якщо LOOP = INFINITE (або LOOP = -1) то звук грається безперервно.

Для програвання звукових файлів комп'ютер користувача повинен бути обладнаний звуковою картою.

рухомий текст

команда MARQUEE дозволяє задати рухомий текст (ця команда підтримується поки тільки MS Internet Explorer).

приклад:

<B> <FONT COLOR = GREEN> <MARQUEE DIRECTION = RIGHT BEHAVIOR = SCROLL SCROLLAMOUNT = 10 SCROLLDELAY = 200> Рухомий текст. </ MARQUEE> </ FONT> </ B>

Що дасть:

Рухомий текст.

У цьому прикладі текст Рухомий текст. рухається зліва направо зі швидкістю 10 пікселів з затримкою 200 мілісекунд.

Для команди MARQUEES застосовуються атрибути ALIGN (LEFT або RIGHT), подібно до картинкам (IMG), установка BACKGROUND COLOR, HEIGHT, WIDTH, і горизонтальні і вертикальні відступи.

Федотов АФедотов А.М. Введення в Internet
Документація по Інтернет технологій

Початок створення курсу: Mondy, 19-Aug-1996 10:12:15 NOVST
Дата останньої модифікації: Friday, 13-Mar-1998 00:00:00 NOVT
© 1996 - 2001, А.М.Федотов
© 1996 - 2001, Інститут обчислювальних технологій СО РАН, Новосибірськ

Уважаемые партнеры, если Вас заинтересовала наша продукция, мы готовы с Вами сотрудничать. Вам необходимо заполнить эту форму и отправить нам. Наши менеджеры в оперативном режиме обработают Вашу заявку, свяжутся с Вами и ответят на все интересующее Вас вопросы.

Или позвоните нам по телефонам: (048) 823-25-64

Организация (обязательно) *

Адрес доставки

Объем

Как с вами связаться:

Имя

Телефон (обязательно) *

Мобильный телефон

Ваш E-Mail

Дополнительная информация: