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

Почему я вообще об этом пишу:
Уже около года я активно веду свой блог в Живом журнале - http://kudinov-da.livejournal.com/, и регулярно мне задают вопрос о том, как вставить изображение в комментарий жж.
Поэтому здесь я напишу небольшую инструкцию, которая, уверен, многим людям, ещё не искушённым в html, поможет съэкономить некоторое время.

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

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

<img src="" />, где внутри кавычек конструкци src="" размещается полный адрес нужного изображения.

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

<img src="http://pics.livejournal.com/kudinov_da/pic/000151ad" border="1px" />
как вставить изображение в комментарий Живого журнала

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

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

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

Главный принцип построения тега img мы расммотрели. Что ещё он умеет? <img src="" alt="" title="" width="" height="" border="" />

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


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

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

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

Удачи :)

 

Дмитрий Кудинов, 30 июля 2011.

Рабочие заметки

Бизнес-домены на продажу
26 марта 2017

Искусственный хаос для пользы дела
24 июля 2016

«Дизайн – это работа», советы Майка Монтейро
28 января 2016

Перейти к заметкам

 

Красивая реклама торгового центра в NY
06 ноября 2016

Простота это удобство
26 апреля 2016

Черновые эскизы как этап проектирования
14 декабря 2015

 

Фундаментальные направления маркетинга
28 августа 2016

Технология живого дизайна
16 марта 2016

Простая проверка на скорость загрузки сайта
16 ноября 2015

2009–2017 © Мастерская Дмитрия Кудинова | mail@kud.su

Специальные предложения — Сайт для бизнеса за 9990 | Реклама в Яндекс.Директ

Фотомастерская, Фотоальбом | Вдохновения
Регистрация доменных имён и хостинг