Вставка графических файлов

(0 голосов)
    Среда, 29 Февраля 2012 18:06
Вставка графических файлов
Имеется несколько проблем, из-за которых у Web-дизайнеров проходили постоянные споры с момента появления Интернета. А вот одна из них: картинка для Интернет-страницы - это польза или вредительство? "Естественно, польза! - кричат одни, - создавать интернет-страницы без графического оформления – все равно, что купить билет на трамвай и не проехать!", "Это же вредительство!" - кричат другие, - "попытайтесь-ка загрузить такую графику нашими слабенькими модемами!"

Принуждая посетителей это совершать, мы только обогащаем кошельки Интернет-провайдерам! А если делать с помощью графики все оформление Интернет-страницы, то большинство его не смогут увидеть, поскольку они уже отключили в своем браузере функцию загрузки рисунков!" Вроде бы, эта дискуссия вот-вот должна завершиться: ведь на смену передачи данных по телефонным кабелям активно приходят высокоскоростные устройства передачи информации. Но успокоит ли это любителей спорить? Мне кажется, навряд, ли.

Но есть проблемы не менее важные, чем дискуссия между Веб-дизайнерами. Одной из таких проблем является большое желание пользователя увидеть на мониторе свое изображение с крупной надписью типа: "Посмотрите все на меня, такого красивого". Итак, мы решили сфотографироваться в нарядной рубашке. Но как внедрить фотографию на Интернет-страницу? Что будем делать? "Скопировать и разместить" - не получится. "Переместить и вставить" - тоже. Это не Microsoft Word. Это текстовый редактор, и никакие изображения в него не вмещаются. Но мы и не будем пытаться вставлять программу изображение. Достаточно показать программе ссылку на это изображение, чтобы программа-браузер в нужное время знала, куда обратиться за изображением. А как переместить изображение на монитор, браузер решит сам.

Итак, мы должны показать в HTML-программе две составляющие: во-первых, какой графический файл мы внедряем, а во-вторых, из какой папки мы его берем. Этот процесс осуществляется с помощью ключевого слова (что в переводе с английского image означает "изображение") и применить с параметр src (от английского source - "источник").

Посмотрите, ключевое слово — одинарное (нет такого ключевого слова). Действительно, для чего ему нужно ключевое слово завершения? Это ключевое слово только показывает ту точку, куда внедряется содержимое графического файла. Как программа-браузер ищет файл с графикой? Вероятно, если графический файл располагается в той же папке, что и файл с программой для Интернет-страницы, то ищет только по имени. А если графический файл размещен в другой папке? Ведь такое тоже может быть.

Кроме того, если на Интернет-странице размещено много разнообразных объектов, то именно так и делают: размещают код в одну папку, а картинки, чтобы не мешали, в другую, или даже в разные папки. Теперь следует обратить особое внимание на некоторые моменты процесса внедрения графических файлов в Интернет-страницу.

Стандартное применение тега <IMG>

Просто написать путь, как мы обычно делаем, еще не все, что нужно сделать для того, чтобы программа-браузер нашла файл. Придется отучиваться от многолетней привычки работать в операционных системах Microsoft. Ведь только в таких системах путь к файлу указывается через обратные косе черты. Internet это не Windows, и веб-дизайнеру придется отучиваться от многих привычек. Любая программа-браузер, даже такая как Internet Explorer, будет работать по принципам Internet. А Internet действует по правилам прописывания пути к файлу, которые пришли к нам из UNIX. Вкратце мы их перечислим. Вложенные папки указываются через прямую черту, а не через косую черточку, как мы обычно делаем: MyHTML/MyDocs/vasya.gif. Как и в операционной системе DOS, прописывать полный путь не нужно. К примеру, если исходный код страницы располагается в папке MyHTML, а картинка находится во вложенной папке под названием MyGraphics, то изображение можно найти так: .

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

Вообще, в данной ситуации действует знакомое любому веб-дизайнеру правило HTML по поводу кавычек: если веб-дизайнер не уверен, стоит ли ставить кавычки, то обязательно нужно ставить их. Если же Интернет-страница располагается на одном компьютере, а изображение — на другом, стоит прописать полный адрес, к примеру: 

<img src="http://www.мойсайт.ru/myhtml/mydocs/vanya.gif">

В отличие от ключевых слов HTML, в именах папок и файлов имеет огромное значение,тот момент, большими или маленькими буквами будет прописано имя файла с расширением.. К примеру, для многих программ-браузеров и других приложений, работающих с Internetом, valya.gif и valya.GIF — не одинаковые файлы.

Для того чтобы не запутаться и не помнить каждый раз, строчными или прописными буквами прописано конкретное имя, Web-дизайнеры подчиняются неписанному соглашению: все имена каталогов и файлов пишут только строчными (маленькими) буквами.

Нужно быть внимательным, не только создавая новые каталоги, но и корректируя графические файлы. К примеру, графический редактор Photoshop дает файлам расширения, которые набраны прописными (большими) буквами. И в заключение. Если веб-дизайнер не нуждается в лишних проблемах, то ни в коем случае не нужно использовать кириллицу в именах файлов и папок.

Вообще, если веб-дизайнер работает в русской версии Windows и размещает исходные коды Интернет-страниц в каталоге Мои документы, профессионалы советуют скопировать папку с картинками туда же. Не стоит обращать особого внимания на, создаваемую в автоматическом режиме программами Microsoft Office, каталог Мои рисунки.

Другие материалы в этой категории: « Напутствие НОВИЧКУ

Оставить комментарий

Убедитесь, что вы вводите (*) необходимую информацию, где нужно
HTML-коды запрещены