62 (+1)

Выпуск №5

Как сделать качественный скриншот?
Oбзор программ для создания скриншотов
Быстрые клавиши это удобно (HomeSite)

Поиск по сайтуДля желающих написать письмоПослать ссылку другуВерсия для распечатки


День добрый! Перед началом выпуска несколько слов о голосовании по созданию новых скинов для калькулятора. Я продлеваю его до следующего выпуска, так что у тех, кто еще не успел проголосовать, есть шанс в этом поучаствовать. Но честно говоря, голосование идет более чем вяло. Неужели никому не интересно даже посмотреть на то, что получится, или даже поучаствовать? Уверяю, что с технической точки зрения это будет сделать несложно, и лезть в код JavaScript не нужно - достаточно умения владеть графическим редактором. Давайте так - сначала вы проголосуете, а потом будете читать этот выпуск. Форма для голосования находится внизу странички. Идет? ;)



Полезное

Как сделать качественный скриншот?

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

У вас наверняка возникнет вопрос - что называть качественным скриншотом? В конце концов, ведь это так просто: нажал "PrScr" - и готово. А с другой стороны, я встречаю массу непрофессионально сделанных снимков экрана. Одни авторы норовят вместо скриншота одного окна каждый раз вставлять изображение экрана целиком, другие уменьшают скриншот до изображения почтовой марки, третьи сохраняют его в JPEG с такой степенью сжатия, что остается только рассматривать квадратики. Но начнем по порядку...

Самый простой способ получения скриншота не требует применения абсолютно никаких новых программ, т.к. эта возможность встроена в большинство операционных систем. И конечно же - в Windows. Причем для этого достаточно нажать всего одну кнопку. Вы наверняка догадались (или точно знали), что это клавиша "PrScr" (т.е. Print Screen - печать экрана), и располагается она в правом верхнем углу клавиатуры. Во времена DOS эта клавиша использовалась как средство быстрой распечатки экрана на принтере - отсюда и появилось название "Print Screen". В современных же системах нажатие этой клавиши делает графический снимок содержимого экрана и помещает его в буфер обмена. Осталось лишь запустить свой любимый графический редактор, создать новый документ и вставить в него содержимое буфера. Вуаля - и скриншот готов. А вот если вместо "PrScr" нажать комбинацию "Alt-PrScr", то в буфер обмена будет помещено только изображение активного окна, а не весь экран, что, несомненно, очень удобно.

А вот о форматах, в которых нужно сохранять скриншот, поговорим подробнее. Существует два основных способа применения скриншотов - в полиграфии и в электронных документах, частным случаем которых является web-страничка. Если вы собираетесь печатать скриншот как иллюстрацию к статье, то ничего лучше формата TIFF для этого не придумано - выбирайте его, и не забудьте поставить LZW-сжатие, чтобы файл не был уж слишком неприличного размера. В дальнейшем TIFF-файл можно легко импортировать в любую программу для верстки.

Для электронных же документов, как всем известно, можно использовать либо GIF, либо JPEG. Так какой же вариант предпочтительнее? Давайте подумаем о том, что же такое есть скриншот? В большинстве случаев он представляет собой картинку, на которой изображен интерфейс какой-либо программы, и гораздо реже изображено что-то иное (обычно это скриншот какой-нибудь игры или фильма в полноэкранном режиме). Чем характерны скриншоты, на которых изображены интерфейсы программ? А тем, что, как правило, в таких изображениях используется достаточно ограниченный набор цветов, встречаются большие области сплошного цвета и имеется очень много мелких деталей. Все это прекрасно подходит для формата GIF, а вот использование JPEG только испортит картинку, и при этом мы почти не выиграем в размере. Поэтому наиболее предпочтительным форматом для использования в электронных документах является GIF.

Часто скриншот перед применением требует предварительной обработки, а именно изменения размеров. Причем для web-странички скриншот приходится уменьшать, а для полиграфии, соответственно, увеличивать. При увеличении размера скриншота выбирайте линейный способ масштабирования ("nearest neighbor" - ближайший сосед). И используйте только кратный масштаб увеличения - в 2, 3, 4 раза. При этом вы получите четкие границы, а не размытые, как при квадратичном или кубическом масштабировании. С последующим корректным уменьшением размера скриншота справится любая программа для верстки - ведь увеличивать изображение имеет смысл только для печати, не правда ли? А вот при уменьшении скриншота действуйте ровно наоборот - используйте кубическую (предпочтительнее) или квадратичную интерполяцию. Это позволит избежать проблем исчезновения линий и зубчатости скриншотов.

Ну и напоследок - несколько полезных советов, которые могут пригодиться при создании скриншотов:

  • Перед тем как делать скриншот можно попробовать изменить размеры окна программы и тем самым избежать ненужного масштабирования.
  • При захвате скриншота не всегда обязательно в качестве иллюстрации приводить весь экран. Часто достаточно лишь фрагмента, а потому - кадрируйте скриншот перед использованием.
  • Если вы описываете особенности интерфейса программы, то дополнительно к уменьшенному скриншоту, располагающемуся в тексте статье, создайте ссылку на его полный вариант в масштабе один к одному.
  • При сохранении в формате GIF оставляйте только минимально необходимое количество цветов из последовательного ряда: 2, 4, 8, 16 ,32, 64, 128, 256. Всегда выбирайте адаптивную палитру. Если в интерфейсе программы встречаются градиенты, то включите случайную диффузию и увеличьте количество используемых цветов на 1-2 ступени.


Обзоры

Oбзор программ для создания скриншотов

О том, как сделать качественный скриншот, мы уже поговорили. А теперь поговорим о том, чем их удобнее всего делать. Программ, позволяющих захватить часть изображения с экрана и в дальнейшем сделать что-то с ним (официальное английское название таких программ - Screen Captures, т.е. дословно - захватчики экрана), имеется достаточно большое количество. Но, как известно, не все йогурты одинаково полезны, и поэтому я порекомендую всего лишь две программы, которые использую сам и которые кажутся мне очень удобными.


HardCopy Pro v2.1



HardCopy Pro

Домашняя страничка: http://www.desksoft.com/
Объем дистрибутива: 241 KB (Загрузить и LZW-патч)
Статус программы: Evaluation Version, $20.00
Ограничения: можно использовать 30 дней

Очень маленькая и очень удобная программка. При запуске прячется в трей и перехватывает нажатия горячих клавиш (обычно это вышеупомянутая клавиша "PrScr"). В отличие от встроенного в Windows захвата экрана или активного окна целиком, HardCopy поддерживает также захват лишь части изображения. В этом режиме после нажатия горячей клавиши, появляется перекрестие, которое позволяет вам определить нужную область экрана.

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

  • сохранить изображение в файл (поддерживаются форматы: BMP, GIF, JPG, PNG, TIF);
  • сохранить изображение файл автоматически (имя файла при этом определяется как задаваемое в настройках базовое имя файла плюс порядковый счетчик);
  • скопировать изображение в буфер обмена;
  • запустить любимый графический редактор (его вы можете определить в настройках) и передать ему изображение для редактирования;
  • ну и, наконец, просто распечатать скриншот на принтере.

Но самое замечательное - это то, что любое из этих действий можно назначить действием по умолчанию, и тогда все будет происходить совершенно прозрачно для вас, т.е. без вызова окна программы и совершения ненужных действий. Появляется такая замечательная вещь, как последовательные скриншоты: просто нажимаете "PrScr" несколько раз в нужных местах - и все это автоматически складывается в заранее указанную папочку. Когда вам понадобится сделать штук 20-30 скриншотов, вы это оцените, поверьте мне.

Из дополнительных возможностей следует отметить такие вещи, как включение курсора в скриншот, возможность скадрировать изображение непосредственно в программе и автоматическое конвертирование скриншота в нужный цветовой режим (например, можете сразу конвертировать TrueColor-изображение в 256-цветное).

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


SnagIt v6.0.1



SnagIt

Домашняя страничка: http://www.techsmith.com/
Объем дистрибутива: 3.92 MB (Загрузить)
Статус программы: Trial Version, $39.95
Ограничения: можно использовать 30 дней

С полгода назад мне в руки попала замечательная программа, которая умеет, в общем-то, делать все то же самое, что и HardCopy, но есть у нее одна очень удобная возможность, которая и делает программу замечательной. А именно - умение снимать скриншоты, которые не умещаются на экране!

Типичный пример - web-страничка, которая полностью не помещается на экране (по правде говоря, большинство страничек именно такие). В этом случае приходится делать несколько скриншотов, а потом склеивать их в PhotoShop'e, что очень неудобно. Так вот, эта программа умеет делать такие скриншоты! Достаточно при захвате изображения указать окно, в котором есть линейка прокрутки, - и программа автоматически будет его прокручивать, снимать скриншоты и склеивать их в единое изображение. Это настолько удобно! Вы даже представить себе не можете, пока не попробуете.

Эта маленькая возможность полностью компенсирует огромный объем программы. Как вы можете заметить, она на два порядка тяжелее, чем HardCopy, но еще раз повторюсь - она стоит того. И именно она покрывает оставшиеся 10% моих потребностей в скриншотопроизводстве :)

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

  • захват фиксированной части экрана;
  • захват не только прямоугольной области на экране, но и области в виде круга или замкнутого многоугольника (ума не приложу - для чего это может понадобиться);
  • захватывать видеопоследовательности и кодировать их сразу в AVI-файл (даже со звуком). Вероятно, это удобно для быстрого создания демо-роликов программ.
  • сканировать изображения (через Twain-интерфейс, конечно);
  • захватывать изображения в DirectX-программах (как известно, простые программы этого делать не могут ввиду принципиально иного метода прорисовки окна в таких программах);
  • автоматически делать скриншоты через определенный промежуток времени и выкладывать их на FTP или отсылать по электронной почте; может быть полезным для владельцев web-камер.

SnagIt Studio
В комплекте с собственно программой для захвата экрана идут также две небольшие утилиты. Это каталогизатор скриншотов "SnagIt Catalog Browser" и несложный графический редактор "SnagIt Studio".

"SnagIt Catalog Browser" представляет собой типичный вьюер картинок с поддержкой миниатюр. С этой точки зрения, он ничем не отличается от десятков других подобных программ, только поставляется в одном комплекте с программой для захвата экрана.

Используя этот вьюер, вы можете легко просматривать созданные скриншоты (равно как и любые другие изображения) и осуществлять над ними базовый набор операций. К ним относятся: конвертирование изображений в разные форматы, масштабирование, смена цветовой модели, изменение разрешения (не путать с масштабированием) и пакетная обработка.

Графический же редактор "SnagIt Studio" ориентирован именно на работу со скриншотами. Например, вы можете очень легко добавить к изображению нужные пояснения, выделить цветом определенный фрагмент скриншота или создать стрелки-указатели. Причем все дополнительные графические элементы выполнены в виде векторов, и следовательно, вы можете сколько душе угодно заниматься наиболее подходящей компоновкой изображения, не боясь за его качество.

По возможностям этот редактор обеспечивает лишь базовые операции над векторными примитивами - вероятно, таким был CorelDraw! первой версии :). А с другой стороны, много ли возможностей вам необходимо, чтобы довести скриншот до ума? Мне лично и этих возможностей выше головы, т.к. дополнительную обработку я предпочитаю делать в соответствующих и предназначенных для этого программах.



Полезное

Быстрые клавиши - это удобно (HomeSite)

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

  • Ctrl+B - выделить фрагмент полужирным начертанием (<b></b>).
  • Ctrl+I - выделить фрагмент курсивом (<i></i>).
  • Ctrl+U - выделить фрагмент подчеркиванием (<u></u>).
  • Ctrl+С - центрировать фрагмент текста (<center></center>).

  • Ctrl+Shift+P - заключить выделенный фрагмент в теги параграфа (<p></p>).
  • Ctrl+Shift+A - сделать выделенный фрагмент ссылкой (<a></a>).

  • Ctrl+[ - перейти в начало предыдущего тега.
  • Ctrl+] - перейти в начало следующего тега.
  • Ctrl+M - найти и перейти к соответствующему закрывающему тегу. Курсор при этом должен находиться внутри открывающего тега.

  • Tab - сдвинуть выделенный фрагмент текста вправо на величину табуляции.
  • Shift+Tab - сдвинуть выделенный фрагмент текста влево на величину табуляции.

  • Ctrl+< - вставить символы открывающего тега (<>) и поместить курсор между ними.
  • Ctrl+> - вставить символы закрывающего тега (</>) и поместить курсор между ними.

  • Ctrl+Shift+B - вставить в текст тег разрыва строки (<br>).
  • Ctrl+Enter - вставить в текст тег разрыва строки (<br>) и перейти на новую строку.
  • Ctrl+Shift+Space - вставить в текст неразрывный пробел (&nbsp;).
  • Ctrl+Shift+M - вставить в текст тег HTML-комментария и разместить курсор внутри (<!-- -->).

  • Ctrl+K - поставить/убрать закладку в тексте.
  • Ctrl+Shift+K - перейти к следующей закладке. Переход осуществляется по кругу в порядке возрастания номера закладки.

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

  • Shift+F2 - вызвать ниспадающий список параметров для текущего тега. После нажатия этой комбинации можете набрать первые несколько букв параметра - и он автоматически подсветится, осталось только нажать 'Enter'. Если параметр требует дополнительного ввода данных, то после его вставки откроется второй список - с возможными вариантами.

  • Ctrl+F4 - открыть диалоговое окно для редактирования тега, на котором находится курсор.
  • Ctrl+Shift+X - вызвать окно для вставки спецсимволов (например, § или ©).

И еще несколько полезных советов при использовании HomeSite. Если вы перетащите мышкой файл, находящийся во встроенном проводнике, то HomeSite автоматически сгенерирует ссылку на этот файл. Если же файл будет рисунком, то автоматически сгенерируется тег <img>, причем с проставленными размерами и параметрами border=0 и alt="". Все вышеописанные комбинации могут быть переопределены, если вы привыкли к другим клавишам. И сделать это можно в меню Options->Customize->Keyboard Shortcuts. Впрочем, заглянуть туда не помешает и в том случае, если вы не собираетесь переопределять клавиши, просто для справки - чтобы узнать оставшиеся сокращения.


Предыдущий выпускНаверхСледующий выпуск


Свои мнения, пожелания и вопросы по выпускам Вы можете присылать по адресу mike@cherry-design.ru.
Я оставляю за собой право цитировать письма, пришедшие по вышеуказанному адресу.
Copyright © 2001-2008 Михаил Мельников. Перепечатка без разрешения запрещена.