Эмблемы на прозрачном фоне. PNG формат: особенности, плюсы и минусы

Онлайн-программма Pixir-делаем прозрачный фон у картинки.

Сергей Фещуков

Бывает попадается очень подходящая картинка для вашего поста и всё бы хорошо... Но фон картинки не подходит под фон блога или блока с текстом. Явно ни у одного меня такая проблема и ни у одного меня фон не белый, который подходил бы в большинстве случаев. Мне нужен прозрачный фон !

В интернете я не нашел нормальных идей как сделать прозрачный фон для готовой картинки, поэтому начал сам экспериментировать и нашел более менее подходящее решение!

Как сделать прозрачный фон у картинки

Возьмём в пример одну простую картинку в формате.jpg (вообще формат не важен особо):

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

Загружаем наше изображение. Справа в окошке "Слои" появится слой "Фоновый", на котором замочек (не дает удалять фон картинки).

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

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

Теперь удаляем фон нажатием кнопочки "Delete" и получаем нужное нам изображение с прозрачным фоном.

В итоге на выходе получаем то же изображение с прозрачным фоном.

Единственный минус Pixlr - нельзя изображение сохранить в формат.gif, который тоже сохраняет прозрачный фон, но намного легче, чем формат.png. Но если нет другого выхода, почему бы не воспользоваться этим?

спасибо Натальи Петровой

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

Как сделать логотип в конструкторе

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

Вот моя подборка самых лучших онлайн конструкторов

1. Logaster – самый лучший конструктор логотипов

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

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

Вы можете изменить:

текст в логотипе
шрифт
цвет иконки и текста
добавить тень
изменить расположение элементов.

Основные преимущества сервиса:

Возможность бесплатно скачать готовую эмблему в малом расширении;

Логотипы доступны для скачивания во всех популярных форматах и расширениях - PNG, PDF, JPEG, SVG.

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

В логотипе поддерживается кириллица.

Создание логотипа занимает всего несколько минут. Напоминаю, что .

А вот короткое промо-видео сервиса:

2. Genlogo – удобный и многофункциональный

На следующих шагах нужно выбрать подходящую цветовую гамму и шрифт.

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

После того, как вы определитесь со стилем, вам предложат скачать результат файлом PNG с прозрачным фоном. Разрешение по ширине: 800 пикселей. Этого вполне достаточно для публикации на сайте или в социальных сетях. Стоимость – 590 RUB.

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

3. Turbologo – современный и многофункциональный

Варианты подбираются на лету. Кроме того, у них самая большая база иконок – более 1 млн.

В общем, мне понравилось:) Если хотите попробовать самостоятельно – жмите на кнопку:

4. Cool text – лучший бесплатный конструктор

Очень хороший конструктор логотипов. Для того, чтобы воспользоваться им переходим по адресу http://cooltext.com . Мы сразу попадаем на страницу с шаблонами. Выглядит он вот так.

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

Cool Text мне нравиться именно потому, что настроек тут довольно много. Вы можете выбрать:

текст надписи (само собой);
шрифт;
цвет шрифта;
фон (в большинстве случаев);
градиент фона(тоже в зависимости от шаблона);
формат сохранения файла;

Про формат файла следует упомянуть отдельно. Я, обычно, сохраняю логотипы в формате PNG/Transparency. PNG – это формат графических файлов, который очень часто используется в вебдизайне, благодаря тому, что по размеру картинки получаются меньше, чем в других форматах. Ну а transparency означает, что картинка будет с прозрачным фоном.

После того, как вы закончили редактировать, щелкните по кнопке «Create Logo ». Сразу после этого, вы попадете на страницу на которой будет ссылочка «Download image », по которой вы сможете загрузить картинку к себе на компьютер.

Основные преимущества:

Более 50 тыс. различных вариантов эмблем на выбор.
Здесь публикуют свои работы лучшие дизайнеры со всего мира.
Демократичные цены. За 6$-10$ можно купить отличный профессиональный логотип, это дешевле, чем заказывать у фрилансера или в студии веб-дизайна.
Логотипы предоставляются в редактируемых форматах, например PSD. Это значит, что Вы сможете в Photoshop подставить в логотип название своего сайта или фирмы.
С помощью фильтров можно сортировать по категориям и цене.

Есть и недостатки:

Оплата только PayPal. Как зарегистрироваться в PayPal смотрите .
Сайт на английском языке. Если не владеете английским то, Вам придется воспользоваться переводчиком сайтов. О том, как это сделать на примере браузера Google Chorome .

Где заказать разработку логотипа

Новый логотип можно заказать у дизайнера. Это можно сделать на любой бирже фриланса.

Достоинства:

Разрабатывается индивидуально. Он гарантированно впишется в дизайн сайта по размеру, стилю и цветовой гамме.
Большинство авторов предоставляют сразу несколько вариантов на выбор.

Недостатки:

Придется потратить дополнительное время на изучение портфолио авторов и отзывы об их работе.
Для того, чтобы получить качественный результат, необходимо составить подробный список требований к готовой работе, и заранее обговорить все мелочи с дизайнером.
Разработка «под ключ» обойдется дороже, чем покупка готового или использование онлайн генератора.
Результата придется подождать от 3-х до 7-ти дней, без учета правок и исправлений.

Я перепробовал много различных бирж фриланса и, в конце концов, остановился на Kwork. Мне понравился удобный интерфейс, низкие цены и хорошая конкуренция среди исполнителей.

Создание логотипа в Photoshop своими руками

Если есть желание, время и навык работы в Photoshop, то можно создать логотип своими руками с нуля. Вот неплохое видео на эту тему:

Выводы

Теперь вкратце подведем итоги. Если Вам нужна красивая эмблема для сайта то вы можете:

Купить готовый лого в магазине. Это самый простой и удобный способ.
Воспользоваться онлайн конструктором. Это тоже очень удобно и оставляет большой простор для фантазии. Из всех онлайн сервисов для создания логотипов мне больше всего понравился Логастер . По количеству настроек и опций ни один другой сервис не может с ним сравниться. Cool Text довольно неплох, однако у него функционал поменьше. Кроме того, он англоязычный, что создает дополнительные препятствия тем, кто не владеет английским.
Заказать лого «под ключ» на бирже фриланса. Это довольно хлопотно, но дает отличные результаты.
Сделать эмблему самостоятельно. Этот вариант подходит только тем, кто умеет и любит работать в Photoshop.

«Махагон-дизайн».

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

Фирменный знак с прозрачным фоном считается универсальным. Такой логотип может:

Прекрасно вписаться в дизайн сайта;
Отлично комбинировать, с имеющимся на веб странице, набором цветов;
С успехом гармонировать с прочим соседними элементами.

Что нужно для обработки фона

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

Есть два варианта. В первом случае этот редактор надо будет скачать на компьютер и установить. Тогда интернет не понадобится. Второй вариант – использовать программу в онлайн режиме, к примеру, на сайте editor.0lik.ru.

Посмотрим, как получить логотип с прозрачным фоном.

Открываем программу и загружаем изображение с компьютера. Затем:

Заходим в раздел «Слои»;
Дважды щелкаем на замочек, расположенный справа от надписи «Задний фон». Вместо него должна появиться галочка, а название меняется на «Слой 0». Этой операцией происходит разблокировка слоя;
Слева, на панели инструментов выбираем «Волшебную палочку» (можно также нажать на клавиатуре букву W);
Кликаем по фону, который следует убрать;
В меню «Редактировать» выбираем команду «Очистить». Но проще будет нажать на клавиатуре кнопку «Delete». Если какие-то участки фона не стали прозрачными, наводим на них мышку, кликаем палочкой и очищаем, пока фон полностью не станет прозрачным.

Если есть сомнения, что фон прозрачный (не вырезался), можно провести проверку. Надо логотип поместить на другое изображение. На клавиатуре нажимаем комбинацию ctrl+C, чтобы скопировать логотип в буфер обмена. Открываем любой другой файл с изображением и, нажав комбинацию ctrl+V, размещаем логотип на фото. Если он поместился на второе изображение без фона, значит операция проведена верно.

Получив логотип на прозрачном фоне, следует нажать на меню «Файл» и сохранить картинку. Отметим, что сохранять изображение надо в форматах, поддерживающих прозрачность.

Самый популярный вариант – формат PNG , сохраняющий изображения с минимальной потерей качества. Он поддерживается всеми известными редакторами изображений:

Photoshop;
LightRoom;
Illustrator.

Поэтому он удобен и активно используется. Почти 80% логотипов сохраняются в этом формате и применяются для оформления сайтов многих компаний.

Третий тип формата, SVG – удел настоящих профессионалов. Им часто пользуются дизайнеры с программистами, потому что он создан на основе языка разметки XML, что упрощает размещение на сайте фирменного знака. Но для обычного юзера такой тип формата не подойдет.

Теперь вы знаете, как сделать прозрачным фон логотипа.

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

Свобода Настройки

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

Неограниченные Скачивания

Скажите пока ограниченному доступу к своим файлам. Как только вы скачиваете свой логотип (доступный в форматах PNG, SVG, и JPG), он становится вашим. Абсолютно никаких дополнительных вложений, если необходимо поправить дизайн или скачать логотип.

Дружелюбная Поддержка и Обслуживание Клиентов

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

В каком формате должен быть логотип? Существует огромное количество форматов, в которых можно его сохранить.

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

Векторная графика

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

Преимущества векторных изображений:
– такие изображения всегда сохраняют превосходное качество при масштабировании и редактировании;
– размер изображения почти не влияет на размер файла, поэтому он всегда невелик.

Недостатки векторных изображений:
– изображения не реалистичны;
– доступно не так много эффектов.

Изображения векторной графики в большинстве случаев имеют расширение AI, CDR, CGM, DXF. CorelDraw является самым популярным графическим редактором.

Примеры, показывающие эффект векторной графики при увеличении:

Растровая графика

Суть растровых изображений в том, что они напоминают таблицу с множеством маленьких ячеек. Ячейки таблицы называются пикселями. Пиксель – частица растрового изображения. Все пиксели одинаковые по размеру и форме. Для каждого пикселя задается свой цвет и координаты. Поскольку пиксели очень маленького размера, эта мозаика кажется единым целым, если качество изображения хорошее. При высокой разрешающей способности наши глаза не видят “пикселизацию” изображения.

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

Недостатки растровых изображений:
– большой размер файлов;
– потеря качества при масштабировании.

Изображения растровой графики в большинстве случаев имеют расширение JPG, BMP, GIF, PNG, PSD.
Рассмотрим, что произойдет с растровым изображением при увеличении:
Самая популярная программа для редактирования растровых изображений – Photoshop.

Форматы логотипа

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

Векторные форматы

.Ai – Adobe Illustrator

Векторный формат файлов.Ai от компании Adobe позволяет сохранять файл в исходном виде – все элементы логотипа, такие как иконка, текст, доступны для редактирования и в дальнейшем их можно править в любой момент. Чтобы открыть логотип в формате Ai, вам понадобится специальные программы, такие как Adobe Illustrator, CorelDRAW.

В большинстве случаев в таком формате можно менять текст. Открывается с помощью программ: Adobe Illustrator, CorelDRAW

Функции: нужен для внесения правок в оригинальный логотип.

.EPS – Encapsulated PostScript

Этот тип файла нужен для более высокого качества печати логотипа: он позволяет масштабировать логотип без потери качества. Преимущество логотипа в формате EPS – возможность одновременно использовать как растровые, так и векторные элементы изображения. Однако редактировать логотип в формате EPS значительно сложнее, чем, например, в формате Ai.

Открывать с помощью: Adobe Illustrator, CorelDRAW, Inkscape.

Функции: для использования на печатных носителях, масштабирование для печати.

.PDF – Portable Document Format

Векторный формат.PDF предпочитают многие дизайнеры по ряду причин. PDF – удобный формат, так как он без изменений отображает все шрифты, макеты страниц, векторные и растровые изображения.

Открывается программами Adobe Reader, Foxit Reader, Preview.
Редактируется такими программами, как Adobe Illustrator, CorelDRAW, Inkscape.
Функции: просмотр изображения и печать.

Растровые форматы

.PNG – Portable Network Graphics

PNG – прекрасный формат для логотипов. Он способен “сжимать” файлы без искажений. PNG был создан для замены файлов GIF, которые включают в себя всего лишь 256 цветов.

Открывать с помощью: Photoshop (удобно для редактирования), или любой другой программой для просмотра изображений.

Функции: для веб-графики и печати (300 точек на дюйм)

.JPG / .JPEG – Joint Photographic Experts Group

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

Открывать в Photoshop чтобы редактировать, для просмотра – любой другой программой.

Функции: веб-графика и печать (300 точек на дюйм).

.TIFF – Tagged Image File Format

TIFF – старшие братья JPEG файлов. Файлы TIFF более высокого качества, и занимают больше места на жестком диске.

Открывать в Photoshop – для редактирования, для просмотра открывается любой программой.
Для чего нужен: в целом для печати (300dpi).

“Минимальный набор” форматов логотипа

Чтобы использовать логотип на все случаи жизни, вам нужно иметь файл логотипа в следующих форматах:
– .Ai – для возможности редактирования логотипа. Менять цвет, фон, масштабировать.
– .EPS или.PDF – для печати.
– .PNG – для печати и работы в Интернете (для сайта, соцстраниц). Обязательно нужен вариант логотипа в PNG на прозрачном фоне, чтобы размещать его в шапке сайта, на визитке, как водяной знак на фотографии.