Совет 1: Как вставить логотип в сайт

Как правило, логотип размещается на сайтах в формате изображения, а конкретный способ его вставки в уже существующие страницы зависит от их дизайна и использованного способа верстки. В некоторых случаях можно обойтись вообще без редактирования исходного кода, в других поможет визуальный редактор системы управления, а в третьих без ручной правки HTML-кода не обойтись.
Как вставить логотип в сайт
Инструкция
1
Если шапка сайта выполнена в формате изображения, логотип можно поместить поверх существующей картинки с использованием любого графического редактора. Это самый простой вариант, не требующий редактирования страниц. Чтобы им воспользоваться, отыщите файл с изображением шапки на сервере сайта и загрузите его в компьютер. Затем откройте его с помощью графического редактора - для предстоящей операции вполне достаточно возможностей стандартного Paint ОС Windows.
2
Поместите поверх открытой картинки изображение логотипа - в Paint для этого предназначен пункт «Вставить из» в выпадающем списке «Вставить». Мышкой перетащите логотип в нужное место фонового изображения, измените нужным образом его размеры и сохраните результат комбинацией клавиш Ctrl + S. Загрузите файл шапки с логотипом на сервер, заменив им исходный файл, и операция будет завершена.
3
Для вставки логотипа в HTML-код страницы удобнее всего использовать графический режим (режим WYSIWYG) редактора страниц, который есть в большинстве систем управления сайтами. Открыв нужную страницу в таком редакторе, кликните место, в которое следует поместить логотип, и нажмите кнопку вставки изображения в меню. На экране должен появиться диалог, в котором вам надо указать место хранения файла с логотипом в компьютере. В зависимости от редактора, в этом же диалоге могут быть и поля для ввода дополнительных параметров - размеров картинки, отступов от соседних элементов страницы и т.д. Все заполнив, нажмите кнопку OK, а затем сохраните отредактированную страницу.
4
При отсутствии возможности использовать редактор страниц вносить теги в исходный код придется «вручную». Для этого отыщите на сервере файл нужной страницы, загрузите его в компьютер и откройте в любом текстовом редакторе - например, в «Блокноте». Эта операция требует некоторого знания языка верстки гипертекста - вам надо найти в HTML-коде правильное место для размещения тега логотипа. Сам этот тег в простейшем варианте можно записать, например, так:

<img src="logo.png" />
5
Добавив строку в исходный код, сохраните страницу и замените отредактированным файлом хранящийся на сервере оригинал. Затем загрузите туда же файл с изображением - для примера из предыдущего шага этот файл должен называться logo.png и храниться в той же папке сервера, куда помещена отредактированная страница.
Видео по теме

Совет 2: Как вставить значок сайта

Для вставки значка с логотипом вашего сайта существует два способа. Один из них подразумевает создание файла иконки в корневом каталоге, а другой – вставку кода при помощи специального редактора.
Как вставить значок сайта
Вам понадобится
  • - графический редактор;
  • - блокнот.
Инструкция
1
Откройте корневой каталог вашего сайта. Создайте в нем файл с названием favicon.ico. Данный файл будет поддерживать отображение значка вашего сайта перед адресной строкой в браузере.
2
В случае, если иконка вашего сайта не готова, создайте ее при помощи программы Adobe Photoshop, предварительно скачав соответствующий плагин, или другого графического редактора, который поддерживает работу с таким типом файлов, например, Microangelo, QTam Bitmap to Icon, Axialis IconWorkshop. Предварительно проверьте работу в разных браузерах, не только касательно отображения иконки сайта в адресной строке, но и в каталоге «Избранное».
3
В теге < head > вашей страницы пропишите следующий код: < link rel="shortcut icon" href="путъ/название_файла.ico" type="image/x-icon" / >. В этом случае будет поддерживаться ссылка на различные вариации размеров изображения, что достаточно удобно, но менее надежно.
4
Здесь вы можете использовать как обычный редактор «Блокнот», так и специальные программы, предназначенные для более удобного написания кода, например, бесплатная утилита Notebook, которая поддерживает отображение нумерации строк и служит достаточно удобным программным обеспечением при частом редактировании.
5
Создайте иконку для вашего сайта, заранее продумав все ее детали. Лучше всего сразу же определиться с дизайном и размером (здесь – в зависимости от метода ее добавления, поскольку в первом случае доступно лишь использование файла с разрешением 16x16).
6
Также вы можете воспользоваться специальными файлами .atn для Adobe Photoshop, которые позволяют автоматически создавать иконки с нужными эффектами, найти их можно в интернете на тематических форумах или на сайте deviantart.com в разделе “Actions”.
Видео по теме
Полезный совет
Выполняйте обязательную проверку на всех браузерах.
Совет полезен?
Поиск
Добавить комментарий к статье
Осталось символов: 500