Как вставить изображение в комментарий Живого журнала

В данной статье мы написали небольшую инструкцию, которая многим людям, ещё не искушённым в html, поможет сэкономить некоторое время.

Итак, главное. Html — это специальный формат данных, в котором почти все сайты предоставляют информацию браузерам компьютеров. Любой сайт — конструкция гораздо более сложная, нежели просто код html, но именно этот код каждый сайт выдаёт пользователю.
В html существует множество, так называемых, тегов, последовательно читая которые, браузер способен правильно выдать информацию на экран.
Один из таких тегов — это тег IMG, отвечающий за вывод в нужном месте изображения. Большинство тегов в комментариях Живого журнала (как и в других блого-сообществах) отключены за ненадобностью, но некоторые, в основном отвечающие за форматирование текста, работают. тег IMG — именно тот тег, с помощью которого в комментарии Жж вставляются картинки.

Что бы тег IMG работал, его нужно правильно записать. 

<img src="" />

При этом, внутри кавычек конструкции src=»» размещается полный адрес нужного изображения. Рассмотрим подробнее.

Ситуация 1 — вам нужно процитировать изображение, имеющееся на другом сайте.

Что бы показать, где взять адрес изображения, воспользуемся логотипом одного из наших сайтов.

Шаг 1. Открыть изображение в новой вкладке браузера.

Шаг 2. Скопировать адрес изображения в адресной строке браузера.

Шаг 3. Вставляем полученный адрес картинки в наш тег.

<img src="http://loveki.ru/logo.jpg" border="1px" />

Важно!
Полный адрес картинки должен начинаться с http:// (или https://) — без этого уточнения браузер не сможет распознать её как внешнюю относительно обрабатываемой страницы.

Шаг 4. Получаем картинку том месте, где браузер встретит получившийся таким образом тег.

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

Ситуация 2 — требуется использовать собственное изображение.

Итак. Картинка у нас на жёстком диске, как её «засунуть» в интернет?
Как обычно, всё намного проще, чем кажется. В данном случае мы рассматриваем механизм появления картинок в Живом журнале. Предполагая, что большинство пользователей Жж зарегистрированы там, рекомендую пользоваться внутренним фотохостингом Жж.

Кстати, обратите внимание, что большинство других блоговых платформ, даже индивидуальных сайтов отдельных авторов, как правило имеют подобный механизм. Отличия будутв дета

Шаг 1. На главной странице Жж находим в меню пункт «фотоальбом» и заходим туда.

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

Шаг 2. Загружаем понравившуюся картинку с жёсткого диска через стандартный загрузчик.

Шаг 3. Картинка появилась в альбоме.

Теперь проделываем тоже самое, что описано в ситуации 1 и получаем готовый тег.

<img src="http://pics.livejournal.com/kudinov_da/pic/000151ad" border="1px" /> 

Что важно знать.
Помните, что если вы копируете изображение, охраняемое законом об  авторских правах, то вы не должны нарушать его положения. Если вы не уверены, что фотоцитирование конкретного изображения не нарушает ничьих прав или личных свобод, лучше отказаться от демонстрации такого изображения другим людям.

Пара слов о фотохостингах.
Разумеется, фотографии можно размещать не только на встроенном фотохостинге Живого журнала, но и с помощью любого другого фотохостинга, которых в последнее время развелось бесконечное множество.

Яндекс не даст соврать, вариантов навалом — выбирайте любой 🙂

Атрибуты тега IMG

Главный принцип построения тега img мы рассмотрели. Что ещё он умеет?

Как видим, помимо атрибута src="", задающего адрес картинки, есть ещё несколько странных атрибутов. Каждый из них может оказаться полезным.

alt="Этот текст выводится вместо недоступного изображения" (кстати, поисковики ищут картинки, как правило, по содержимому именно этого атрибута).
title="Этот текст выводится, когда мышка задерживается над изображением"

width="640px" — атрибут, который задаёт ширину картинки в пикселях.
height="640px" — атрибут, который задаёт высоту картинки в пикселях.
Если указать только ширину или только высоту, второе значение браузер подгоняет по масштабу. Если не вводить ни то, ни другое значение, браузер покажет картинку в исходном размере.
border="1px" — атрибут, который задаёт толщину рамки в пикселях. По умолчанию равен нулю.

Теперь вы можете легко отыскать на компьютере или в сети нужную картинку, и почти молниеносно подкрепить ей любой свой комментарий 🙂

Кстати, этих нехитрых знаний будет достаточно, что бы справиться с картинками в большинстве случаев, когда вводить их потребуется с помощью html, то есть почти везде, а не только в комментариях к Жж.