Как улучшить скриншот для статей на блоге

Делитесь с друзьями!

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

 Как улучшить скриншот перед загрузкой в статью

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

До недавнего времени я практически ничего не делала для улучшения скриншотов и лишь недавно стала этим заниматься.

Для оптимизации скриншота необходимо обрезать лишние области, которые случайно попадают на скриншот. Затем уменьшить их вес, чтобы не перегружать блог. И в конце –концов сделать так, чтобы скриншот после всех изменений был чётким и хорошо читался.

Как я вставляю скриншоты в статьи 

До написания статьи я создаю папку для скриншотов по теме статьи.

Затем пишу статью и сразу же по ходу написания делаю скриншоты.  Каждый сохраняю в созданную папку.

Скриншоты сразу же называю в соответствие с текстом, чтобы потом не путаться при загрузке скриншота в текст статьи.

Далее улучшаю скриншот так, как говорилось выше. Сейчас расскажу всё более подробно.

Обрезка изображений. Онлайн редактор Pixlr 

Я делаю скриншоты скриншотером от Яндекс Диска, но вы можете использовать и другие программы, например, скриншотер Joxi. Вы можете попробовать эту программу, тем более, что она бесплатная и позволяет сохранять скрины на компьютер или в облако.

Для обрезки и изменения размера картинки, я выбрала онлайн-редактор Pixlr

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

как улучшить скриншот для статей на блоге

Выбрав инструмент «Обрезка», выделяю нужную для работы область и нажимаю «Enter».

как улучшить скриншот для статей на блоге

Обрезанный скриншот вы можете увидеть ниже.

Затем изменяю размер скриншота. На рисунке его размер 774 на 632 пикселя. Для статей я выберу ширину 600 пикселей по ширине страницы блога. Высота подстроится автоматически.

Чтобы изменить размер перехожу в редактор, нажимаю «Изображение», далее «Размер изображения».

В поле заменяю 774 на 600, а далее сохраняю изменённое изображение, нажав «Да». Не забудьте поставить галочку в чек-боксе «Сохранить пропорции».

Извините меня, но я ошиблась с максимальной шириной моей страницы на блоге, она составляет всего 625 пикселей. Поэтому на некоторых скриншотах следует читать не 700, а 600 пк.

В меню редактора нажимаете «Файл» и кликаете левой кнопкой мыши «Сохранить». Вам редактор предложить назвать файл, т.е. присвоить ему имя. В этом редакторе нужно название писать в английской раскладке или просто поставить номер. Как раз этот скриншот вы и будете загружать в статью.

Повторите все описанные выше операции и с другими скриншотами.

Сжать скриншот. Онлайн-сервисе tinypng.com

Онлайн сервис tinypng.com не нужно устанавливать на компьютер, а загрузить можно до 20 файлов за один раз. Для этого кликните по выделенной на скриншоте области и выберите нужные файлы с компьютера.

Они загрузятся и сервис произведёт их сжатие в онлайн-режиме. Сжатые файлы можно скачать zip-архивом или сохранить в облаке Dropbox. Скриншоты лучше использовать с расширением Jpeg, т.к. весят они меньше, чем файлы Png.

Для сжатия файлов можно использовать плагины Вордпресс Compress JPEG & PNG images  и Smush. Но перегружать блог множеством плагинов как-то не хочется, когда можно быстро сжать их вручную, используя онлайн- сервис tinypng.com.

Загрузка скриншотов в статью

Оптимизиованные скриншоты я добавляю в статью обычным способом через  вкладку «Добавить медиафайл». Выравниваю по центру.

Большие скриншоты с мелким, нечитаемым текстом нужно отредактировать. Для этого кликаю мышкой по картинке, затем на иконку «Карандаш».

В появившейся панели редактирования выбираю «Настройки изображения»:

«Размер» – произвольный

«Ссылка» – медиафайл.

При этом ширина скриншота будет 600 пк, а ссылка на этот медиафайл будет сгенерирована автоматически.

В чек-боксе ставлю галочку перед надписью – «Открывать в новой вкладке». Нажимаю «Обновить».

Чтобы открыть этот скриншот в полном размере, кликните по нему левой кнопкой мыши.

Если войти в «Просмотр», то картинка со скриншотом будет активна. При нажатии на неё скриншот откроется в новой вкладке в полном размере.

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

Ищите свои методы, расскажите в комментариях, как вы это делаете.

А пока до встречи, ваша Матвеева Г.Е.

Счастливо!

One thought on “Как улучшить скриншот для статей на блоге

  1. Pingback: Партнёрские ссылки. Размещение ссылок | Инфобизнес-домашняя работа

Добавить комментарий

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

Этот сайт использует Akismet для борьбы со спамом. Узнайте как обрабатываются ваши данные комментариев.