Как создать карту изображения с помощью GIMP: 10 шагов (с изображениями)

Оглавление:

Как создать карту изображения с помощью GIMP: 10 шагов (с изображениями)
Как создать карту изображения с помощью GIMP: 10 шагов (с изображениями)

Видео: Как создать карту изображения с помощью GIMP: 10 шагов (с изображениями)

Видео: Как создать карту изображения с помощью GIMP: 10 шагов (с изображениями)
Видео: ИМПОРТ РАСТРОВОГО ИЗОБРАЖЕНИЯ. ИЛЛЮСТРАТОР. Adobe Illustrator. Базовый курс. 2024, Апрель
Anonim

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

Шаги

Создание карты изображения с помощью GIMP Шаг 1
Создание карты изображения с помощью GIMP Шаг 1

Шаг 1. Составьте исходный рисунок, который вы будете отображать

Вы можете использовать картинки, изображения - все, что вам подходит. Здесь мы будем использовать wikiHow, форум wikiHow и iGoogle.

Создание карты изображения с помощью GIMP Шаг 2
Создание карты изображения с помощью GIMP Шаг 2

Шаг 2. После создания изображения (или его открытия) перейдите в Фильтры >> Интернет >> ImageMap

Диалоговый экран GIMP ImageMap

Создание карты изображения с помощью GIMP Шаг 3
Создание карты изображения с помощью GIMP Шаг 3

Шаг 3. Щелкните прямоугольник в правой части экрана, затем выберите одно из изображений, которое вы хотите использовать

На этом снимке экрана выбрано wikiHow. Введите необходимую информацию в появившемся диалоговом окне.

Щелкните прямоугольник, и вы увидите точное расположение рисунка

Создание карты изображения с помощью GIMP Шаг 4
Создание карты изображения с помощью GIMP Шаг 4

Шаг 4. Продолжите этот процесс для остальной части карты

Создайте карту изображения с помощью GIMP Шаг 5
Создайте карту изображения с помощью GIMP Шаг 5

Шаг 5. После того, как вы закончите определение всех областей связи, сохраните карту изображений

GIMP автоматически предложит сохранить это как файл с расширением.map. Если хотите, можете сохранить как то. Но этот файл содержит HTML-код (без изображений), который нам нужно отредактировать и скопировать на нашу собственную веб-страницу, поэтому рекомендуется сохранить его как [имя файла].html и сразу перейти к шагу 7.

Создание карты изображения с помощью GIMP Шаг 6
Создание карты изображения с помощью GIMP Шаг 6

Шаг 6. ЕСЛИ вы не сохранили его как файл HTML, найдите сохраненный файл и переименуйте его в расширение.html

Вы можете получить предупреждение об изменении расширений файлов. Нажмите «Да», чтобы продолжить.

Создание карты изображения с помощью GIMP Шаг 7
Создание карты изображения с помощью GIMP Шаг 7

Шаг 7. Используйте текстовый редактор, чтобы открыть этот HTML-файл

Вы заметите, что этот файл просто содержит список координат и URL-адресов. Это код, который сообщает браузеру, какие URL-адреса назначить какой части вашего изображения.

Создание карты изображения с помощью GIMP Шаг 8
Создание карты изображения с помощью GIMP Шаг 8

Шаг 8. Убедитесь, что путь к файлу указан в

Image
Image

ссылки на изображение, на которое нужно сопоставить URL-адреса.

Неправильное направление его на изображение может привести к тому, что изображение вообще не будет отображаться.

Шаг 9. ДОПОЛНИТЕЛЬНО:

Используйте браузер, чтобы открыть HTML-файл; если все работает, вы должны увидеть изображение со всеми URL-адресами, отображенными на нем, в соответствии с определенными вами областями.

Создание карты изображений с помощью GIMP Шаг 10
Создание карты изображений с помощью GIMP Шаг 10

Шаг 10. Добавьте карту изображения в HTML-код своей веб-страницы

Вам нужно будет скопировать ВСЕ строки кода, которые вы видите, включая

тег (который определяет путь к исходному изображению) и все, что находится между тегами. Вот и все! Готово.

Рекомендуемые: