Подготовка фото для сайта

podgotovka-foto-dlya-sajta
Здравствуйте, дорогой читатель!
Сегодня я несколько отклонюсь от основной темы своего блога — «Дизайн и психология цвета«.

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

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

Поэтому, будем использовать зрительную память =)

1. Самая распространенная ошибка — слишком большая, тяжелая картинка.
Например, как в этом случае. Мы видим вполне нормальную, небольшую картинку.

kartinka_dlya_bloga1
Однако при клике изображение  открывается на пол монитора.

Все изображения в статье как всегда кликабельны и увеличиваются при клике.

kartinka_dlya_bloga2

Скриншот даже не поместился в запись … целиком 

Такая картинка загружается очень медленно, т.к. весит порой более 1 мегабайта. А это лишняя нагрузка на блог. Который в последствии будет загружаться все медленнее и медленнее. Спрашивается, зачем?

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

Однако, у многих интернет-магазинов это сделано более современно и компактно. Например так:

kartinka_dlya_bloga3
2. Картинка не имеет названия.

Назвал Ваш фотоаппарат ее как-нибудь так: IMAG04789.jpg или так — 0078945 и все. Либо, Вы откуда-то скачали изображение, и на компьютере оно у Вас так и сохранилось, например, nx—09-nuRtye.

А почему бы нам ее не переименовать? Например, Вы пишете статью о витражах. В таком случае, называем картинку vitrazh. Это лучше делать латиницей.

Если Вы не уверены в транслитерации, то можете использовать Ваш блог.
Обычно, wordpress сам выдает название, при написании заголовка. Вот, как в данной статье «Подготовка фото для сайта».
nazvanie_dlya_kartinki
Но если в Вашей статье есть ключевая фраза, которую Вы хотите использовать в названии картинки,то можно воспользоваться сайтом translit.ru.

Вбиваете в окно сайта фразу по-русски, например «Сжатие картинки «. И нажимаете на кнопочку «в транслит». Получаете следующую фразу «szhatie_kartinki».
szhatie_kartinki
Только не забудьте между словами «szhatie» и «kartinki» поставить черточку, либо нижнее подчеркивание, как в моем варианте.

Если у Вас возник вопрос «зачем как-то называть картинки», то я отвечу на него так.

  • Как минимум для порядка в Ваших файлах
  • Для оптимизации картинки
  • Чтобы правильно индексировали поисковики.

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

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

3. Бывают случаи, когда картинку вовсе не скачивают на компьютер. Т.е. просто копируют url-адрес картинки и вставляют его в статью.

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

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

4. Каждый понимает, что контент должен быть уникальным. Наша картинка — часть контента. Как сделать уникальной и ее?

Если это Ваша фотография, которую Вы сделали сами, тут не о чем беспокоиться. Она единственная и неповторимая.

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

Если Вы затрудняетесь в выборе программы, выберите фотошоп онлайн.
Например, на этом сайте http://effect-farm.ru/photoshop_online.html
Либо забейте в поисковике «фотошоп онлайн».

Там можно и сжать картинку, и повернуть на 15 градусов, и сделать многое другое. Это, конечно, не классический Photoshop, но многие функции есть в наличии.

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

Как повернуть картинку на  15 градусов, уменьшить и сохранить под Web, я покажу в следующем видео.

А в этом видео Вы можете посмотреть, как с помощью сервиса tineye.com можно проверить Вашу картинку на уникальность.

И еще не забывайте защищать свои уникальные картинки — напишите название сайта и поставьте логотип, если есть. Например, вот так:
podgotovka-foto-dlya-sajta

На этом, пожалуй, все. Если есть вопросы, задавайте. Отвечу обязательно.

С уважением, Юлиана

Хотите получать новости по этой теме? Введите Ваш E-mail:

Что такое RSS?

Популярные записи:

Juliana

Рада, что статья оказалось полезной . Желаю Вам удачи, Наталья.

Жаль только, нельзя зайти на Ваш блог, почитать, посмотреть. По какой-то причине Вы его закрыли от большинства

Миронова Варвара

Использовать простое увеличение картинки при нажатии на нее — это уже прошлое. Лучше скачать бесплатную библиотеку и сделать такое увеличение рисунка как показано на примере. Так никаких скачков на сайте не будет, в том числе и переходов на новую страницу (это еще в лучшем случае, а в худшем вместо сайта появится одна большая картинка) и предмет удастся детально рассмотреть

Александр (AKart)

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

Juliana

Это точно, Александр! Для большинства онлайн фотошоп — это выход. Спасибо за комментарий )

Татьяна Румянцева

Юлиана здравствуйте!Тема которую вы поднимаете — очень актуальна. У меня очень молодой блог и мои первые фото на нем …..это просто жах!!! Но я это понимаю сейчас а раньше не знала этой инф. У меня вопрос — вы сказали что нужно &lt> а не сказали как это сделать. Пожалуйста поделитесь информацией — это ведь важно для уникальности фотографии. спасибо.
С ув. Т.С

Ваш e-mail не будет опубликован. Обязательные поля помечены *

*

http://julianadesign.ru/wp-content/plugins/wp-monalisa/icons/wpml_bye.gif  http://julianadesign.ru/wp-content/plugins/wp-monalisa/icons/wpml_smile.gif  http://julianadesign.ru/wp-content/plugins/wp-monalisa/icons/wpml_good.gif  http://julianadesign.ru/wp-content/plugins/wp-monalisa/icons/wpml_negative.gif  http://julianadesign.ru/wp-content/plugins/wp-monalisa/icons/wpml_scratch.gif  http://julianadesign.ru/wp-content/plugins/wp-monalisa/icons/wpml_wacko.gif  http://julianadesign.ru/wp-content/plugins/wp-monalisa/icons/wpml_yahoo.gif  http://julianadesign.ru/wp-content/plugins/wp-monalisa/icons/wpml_cool.gif  http://julianadesign.ru/wp-content/plugins/wp-monalisa/icons/wpml_heart.gif  http://julianadesign.ru/wp-content/plugins/wp-monalisa/icons/wpml_rose.gif  http://julianadesign.ru/wp-content/plugins/wp-monalisa/icons/wpml_whistle3.gif  http://julianadesign.ru/wp-content/plugins/wp-monalisa/icons/wpml_yes.gif  http://julianadesign.ru/wp-content/plugins/wp-monalisa/icons/wpml_cry.gif  http://julianadesign.ru/wp-content/plugins/wp-monalisa/icons/wpml_mail.gif  http://julianadesign.ru/wp-content/plugins/wp-monalisa/icons/wpml_sad.gif 
http://julianadesign.ru/wp-content/plugins/wp-monalisa/icons/wpml_unsure.gif  http://julianadesign.ru/wp-content/plugins/wp-monalisa/icons/wpml_wink.gif