На веб-странице можно размещать изображения только в тех графических форматах, которые распознаются браузером. Это форматы GIF, PNG, JPG (JPEG). Мы уже встречались с этими форматами, когда изучали графический редактор GIMP (Урок 15 этого блога)
Давайте освежим свои знания - посмотрим слайды 16-22 презентации К.Ю.Полякова «Компьютерная графика и анимация». Часть II
В перечисленных форматах используется сжатие данных. Если увеличивать степень сжатия, то качество изображения ухудшается, и наоборот (слайды 17 -22).
Подробнее о форматах можно прочитать ЗДЕСЬ.
Давайте теперь обратим внимание на размеры изображения (высота и ширина).Эти атрибуты задают ширину и высоту (в пикселах) прямоугольника, в который выводится картинка.
Если атрибуты не заданы, картинка рисуется в естественных размерах. Когда размеры прямоугольника не совпадают с размерами картинки, браузер производит масштабирование картинки, подгоняя ее под указанные величины.
Поэтому рекомендуется всегда записывать эти атрибуты и указывать в них естественные размеры картинки. Если размеры указываются неверно — картинка выводится браузером с искажением. Если указание размеров вовсе опущено — на экране происходит маленькое землетрясение в момент прихода картинки из сети. Ведь, не зная размеров картинки, браузер оставляет под нее на экране стандартный прямоугольник, продолжая строить остальные элементы. Когда картинка загружена, браузеру приходится полностью перерисовывать экран.
Давайте освежим свои знания - посмотрим слайды 16-22 презентации К.Ю.Полякова «Компьютерная графика и анимация». Часть II
В перечисленных форматах используется сжатие данных. Если увеличивать степень сжатия, то качество изображения ухудшается, и наоборот (слайды 17 -22).
Подробнее о форматах можно прочитать ЗДЕСЬ.
Давайте теперь обратим внимание на размеры изображения (высота и ширина).Эти атрибуты задают ширину и высоту (в пикселах) прямоугольника, в который выводится картинка.
Если атрибуты не заданы, картинка рисуется в естественных размерах. Когда размеры прямоугольника не совпадают с размерами картинки, браузер производит масштабирование картинки, подгоняя ее под указанные величины.
Поэтому рекомендуется всегда записывать эти атрибуты и указывать в них естественные размеры картинки. Если размеры указываются неверно — картинка выводится браузером с искажением. Если указание размеров вовсе опущено — на экране происходит маленькое землетрясение в момент прихода картинки из сети. Ведь, не зная размеров картинки, браузер оставляет под нее на экране стандартный прямоугольник, продолжая строить остальные элементы. Когда картинка загружена, браузеру приходится полностью перерисовывать экран.
Практическая работа с сайтом
- На локальном диске в своей папке по ИКТ создать папку web-img
- Поместить в эту папку все изображения, которые вы хотите разместить на страницах сайта.
- В GIMP изменить, если требуется, размеры изображений.
Требования к каждому изображению:- Ширина для своих изображений - не более 400 пикселей
- Ширина для картинок с ВУЗами - не более 200 пикселей
- Размер файла - 100 - 200 Кб
- Показать папку с изображениями учителю
- Внести изображения в таблицы (загрузить с локального диска):
- На главной странице .
Сегодня ввести текст и подпись к фотографии - На странице с ВУЗами: не менее 4-х картинок. Страница в итоге не должна занимать более 2-х экранов, лучше один экран
- На странице Портфолио: 4 строки, в каждой строке по 2 изображения
- Показать сайт учителю
Комментариев нет:
Отправить комментарий