Где взять бесплатные картинки для сайта или блога

Авторский блог является неким виртуальным представительством, поэтому должен выглядеть уникально. Проблема в том, что большинство бесплатных шаблонов (если не все) доступны каждому в сети, поэтому достаточно велик шанс встретить два абсолютно одинаковых сайта. Я говорю сейчас исключительно о дизайне шапки сайта и других элементов макета, так как это первое, что бросается в глаза посетителя. Это можно сравнить с тем, когда вы идете на вечеринку или праздник и встречаете человека, который одет точно также. Могу предположить, что вы его возненавидите и будете всячески избегать:)

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

Поэтому предлагаю вашем вниманию несколько сайтов с «хедерами», которые помогут персонализировать и приукрасить ваш проект:

1. 45 Free Beautiful Blog Headers — классный список от Smashing Magazine, некоторые шапки содержат исходники (.psd файлы), поэтому можно их слегка модифицировать.
2. Free Webpage Headers — неплохая коллекция из нескольких сотен изображений размером 800×200. Картинки отсортированы по категориями для более удобной навигации и поиска.
3. Dreamstime — на самом деле на этом сайте за изображений нужно платить, тем не менее есть раздел с бесплатными экземплярами.
4. stock.xchng — не смотря на странное название, на сайте можно найти тысячи бесплатных изображений для блогов.
5. Stock Vault — сайт, где дизайнеры и фотографы могут поделиться своими работами.
6. FreeFoto — довольно неплохой сайт, где также можно поискать изображения для шапки.

Платные (премиум) сайты

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

1. Fotolia — за $1 можно найти классные уникальные изображения для вашего сайта, достаточно легкая регистрация и покупка «кредитов» сразу после настройки своей учетной записи.
2. Stockxpert — вот еще один ресурс, если вы не нашли подходящего «хэдэра» на Fotolia, стоимость также начинается с одного доллара.
3. Shutterstock — несколько отличается от предыдущих, так как платить придется помесячно. За 30 дней сможете скачать до 750 изображений.
4. Photo Library (также известен как Index Stock) — навигация там сложная, зато картинки без наложения логотипа (watermark), поэтому многие можно сохранить.
5. Getty Images — картинки высокого качества на симпатичном сайте, хотя вряд ли пригодятся для блога.
6. Photos.com — еще один великолепный сайт с фотками высшего качества. Вы платите $99 в месяц, но можете при этом скачивать столько изображений, сколько вам захочется. Это хороший вариант для маленького бизнеса или фирм, которым требуются изображения для веб-сайтов.
7. Creastock.com — предлагают фотографии хорошего качества, но стоимость при этом не очень маленькая.

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

Пост написан по мотивам — Top 5 Free Blog Header Image Websites.

design-mania.ru

шапка сайта PNG, векторы, осчс, иконы для свободного скачивания

резюме доклада флаер «представление элементов брошюра шаблон а4 установленные для рекламы рекламы на сайте

800*800

день рождения макет сайта

1200*1200

снег дрейф вектор праздники новогодний дизайн замороженный лед снежная шапка снежок изолированных иллюстрация

5000*5000

новогодняя шапка прозрачный элемент материал

2500*2500

шапка бакалавра

1200*1200

Рождество снежная шапка

1200*1200

компьютерное зрение примером концепцииквартиру концепции веб дизайна веб сайтов и мобильных websitevector иллюстрация

2000*2000

визитная карточка визитная карточка шаблон горизонтальной простой чистой формат шаблона бизнес баннер шаблон для веб сайта

800*800

красный Санта шляпа вектор снег одежда праздник объект сезонный аксессуар Санта Клаус праздник красный и белый шапка зима Рождество дизайн изолированных реалистичные иллюстрации

5000*5000

вектор голубой веб сайта баннер фон художественного дизайна

1200*1200

Новости сайта в поле заголовок

1200*1200

Счастливого Рождества название типография красный с новогодней шапкой

1200*1200

кроликовый пасхальный кролик малая красная шапка

1200*1200

бизнес управления финансами платить за клик значок образование для веб сайтов и разработка приложений плоской векторной иллюстрации

5000*5000

блоги обновления контента и новостей круто вектор подписаться на кнопку с курсора а уведомление в квартире дизайн идеально для потокового видео на сайте баннеры

5000*5000

дизайн веб сайта баннер

3000*1400

Векторная иллюстрация фон сайта в разработке

800*800

сообщение веб сайтов

1200*1200

в рождественской шапке

1200*1200

больше любит изометрический примером концепцииизометрический квартиру концепции веб дизайна веб сайтов и мобильных websitevector иллюстрация

2000*2000

вектор красочный сайт баннер справочная арт дизайн

1200*1200

вектор ведьма шапка

1200*1200

иллюстрации к бизнес решения поисковой оптимизациисовременные вектор иллюстрации концепций для веб сайта и мобильного веб сайтов начать

2000*2000

концепция развития программ и кодирования применение значок для веб сайтов

5000*5000

Новогодняя шапка коммерческий материал

2000*2000

бизнес технологий и финансов icon set для веб сайтов и мобильных приложений

5000*5000

ru.pngtree.com

Урок фотошоп — Как сделать шапку для сайта или блога

Дорогие друзья сегодня мы с вами рассмотрим такой актуальный вопрос – как сделать шапку для сайта или блога? После изучения данного урока вы научитесь делать шапки для сайтов в фотошопе. Делать мы будем вот такую шапку:

(нажмите на картику для просмотра оригинала)

 

У меня стоит Photoshop CS4 (английская версия). Будем считать что к нам поступил заказ на изготовление шапки для сайта или блога. Заказчик прислал образец будущей шапки и пояснил:

Слева на шапке хочу тематическую иконку + название сайта и слоган, справа будет 3 тематических картинки из мульфильмом и фильмов. Снизу на шапке будет горизонтальное меню (по центру).

(нажмите на картику для просмотра оригинала)

И так, садитесь по удобнее, я начинаю свой рассказ 🙂 1. Создаем новый документ File→New (Файл→Новый или CTRL+N– в скобочках вместе с переводом буду указывать сокращения – проще говоря “горячие” клавиши, которые позволяют экономить время в программе фотошоп). В окошке я указал следующие параметры:

В итоге получился новый документ:

(нажмите на картику для просмотра оригинала)

После этого сделаем небольшую настройку фотошопа: Ставлю галочку Auto-Select (Автоматически выбрать) и в выпадающем меню выбираю Layer (Слои) – данная настройка позволяет выбрать любой слой по клику на нем.

Включаем шкалу-линейку для документа: Идем Views→Rules (Вид→Линейки или просто жмем CTRL+R) должна появиться горизонтальная и вертикальная шкала-линейка. Сразу же следует убедиться, что данные на линейке отображаются в пикселях. Для этого щелкаем дважды мышкой по самой шкале с линейкой и выбираем такие данные: После этого я с помощью направляющих (щелкаете по линейке и тянете мышку вправо или вниз), размечаю места под основные элементы шапки:

(нажмите на картику для просмотра оригинала)

Направляющие можно Показывать/Прятать с помощью View→Show→Guides (Вид→Показывать→Направляющие) или CTRL+; 2. Приступим к созданию основных элементов шапки. Создадим фон для шапки. Идем Windows→Layers (Окно→Слои или F7). Дважды щелкаем по слою Background, тем самым преобразуем его в простой слой (название слоя я указал – fon-shapki)

Далее еще раз дважды щелкаем по слою fon-shapki и открывается окошко со стилями слоя, там выбираем нужный стиль для слоя, я выбрал градиентную заливку — Gradient Overlay (Заливка градиентом) и поставил следующие настройки. Щелкаем два раза по полоске с градентом: В следующем окошке щелкаем мышкой по левому маркеру: В открывшемся окошке, внизу указываем цвет 196ca6 и жмем OK. Далее щелкаем по правому маркеру и в открывшемся окошке указываем цвет 0048a0 и жмем OK. Далее копируем наш слой с фоном. В палитре Layers (Слои, F7) выбираем наш слой мышкой, далее кликаем мышкой на слои и не отпуская кнопки мыши переносим слой на следующую иконку и отпускаем мышку. Создастся новый слой – копия предыдущего (можно просто нажать CRTL+J). Не снимая выделение со нового слоя, установим ему Opacity (Непрозрачность) в 18%. Далее щелкаем два раза новому слою, снимаем галочку с Gradient Overlay (Заливка градиентом) и ставим галочку Pattern Overlay (Заливка текстурой), ставим следующие настройки: Все фон для шапки у нас готов. 3. Далее сделаем фон для горизонтального меню снизу. Делаем новый слой – нажимаем по пиктограмме или просто жмем Shift+Ctrl+N (у нас получился новый прозрачный слой). После этого выбираем инструмент Rectangular Marque Tool (Прямоугольное выделение, M) и рисуем прямоугольное выделение.

(нажмите на картику для просмотра оригинала)

После этого заливаем наше выделение произвольным цветом. Берем инструмент Paint Bucket Tool (Ведро, G) и кликаем по выделению (я выбрал цвет 165394).

Переходим в стили нового слоя и ставим галочки напротив следующих пунктов: Drop Shadow (Отбрасывать тень), Gradient Overlay (Градиентная заливка), Stroke (Обводка), со следующими настройками: После этого укажем Opacity (Непрозрачность) слою в 80%.

(нажмите на картику для просмотра оригинала)

После того как у нас готов фон, можно приступать к созданию других элементов шапки. 4. Напишем название сайта, слоган и текст для горизонтального меню. Для этого выбираем инструмент Horizontal Type Tool (Горизонтальный текст) и щелкаем на шапке в том месте, в котором планируем написать надпись, и пишем ее. Маленькая подсказка. Cлои очень удобно двигать или перетаскивать из документа в документ с помощью инструмента Move Tool. Я выбрал для названия сайта надпись “Myvideo.com” и настройки текста выбрал следующие:

Для слогана выбрал надпись “только лучшее видео и фильмы” и следующие настройки текста: Для пунктов меню я выбрал надписи “Главная”, “О сайте”, “Контакты”, “Поиск”, “Реклама на сайте”, “Блог” я выбрал следующие настройки текста: И вот что у меня получилось.

(нажмите на картику для просмотра оригинала)

Для слоя с названием сайта, применил следующие настройки для стилей слоя (Drop Shadow и Bevel and Emboss).

Что бы изменить цвет текста, выбираем инструмент , щелкаем прямо по тексту с названием сайта и выделяем текст для которого нужно изменить цвет (я выбрал цвет — add7fe). 5. После этого нам нужно подобрать тематическую иконку. Иконку можно легко найти на интересном сайте Iconfinder.com, просто заходим на сайт, вводим слово характеризующее нужную нам тематику (я ввел слово — Video) и нажимаем Search (Поиск). Выбираем понравившуюся иконку и сохраняем (кликаем правой кнопкой мыши по картинке и выбираем пункт Сохранить изображение…) ее на компьютер. Я выбрал такую картинку: Далее открываем картинку в фотошопе File→Open. Теперь нужно перенести слой с иконкой в наш документ с шапкой. Для этого выбираем инструмент Move Tool, выбираем слои с иконкой, кликаем правой кнопкой мыши и выбираем пункт Dublicate Layer (Копия слоя). В появившемся окошке указываем, какой слой, в какой документ копировать: После проделанных манипуляций иконка должна добавиться в документ с шапкой. Как видим, она имеет гораздо больший размер, чем нам нужен, будем ее уменьшать. Для этого идем Edit→Free Transform (Правка→Свободная Трансформация, Ctrl+T). Вокруг картинки образовалась рамочка с маркерами. Далее для равномерного уменьшения картинки, нажмем Shift и не отпуская его делаем рамку меньше (уменьшая мышкой рамку) тем самым трансформируем картинку как нам нужно. У меня получилось вот так:

(нажмите на картику для просмотра оригинала)

Как видите большую часть шапки мы уже сделали, осталось добавить тематические картинки справа и у нас получиться интересная шапка для сайта или блога. 6. Покажу, на примере как я делал первую картинку. Как видите на конечном образце шапки (картинка в самом начале этой новости), все картинки вставлены в рамочки. Нам нужно создать рамку и поместить в нее картинку с нашим изображением. Для этого создадим новый слой Shift+Ctrl+N. Выбираем инструмент инструмент Rectangular Marque Tool (Прямоугольное выделение) и рисуем прямоугольное выделение. Удобно делать выделение с направляющимися (если нужен точный размер), но можно и без них (на глаз).

Заливаем наше выделение любым цветом берем инструмент Paint Bucket Tool (Ведро, G) или просто жмем Alt+Backspace. После этого щелкаем по слою два раза и попадаем в стили слоя. Я выставил такие настройки для Drop Shadow, Color Overlay: Тематические картинки мультфильмов и фильмов я взял с сайта Kinomania.ru. После того как мы подобрали картинки, открываем их в фотошопе. Переносим каждую картинку в документ с нашей шапкой.

([color=#ce2c2c]Внимание![/color] Слой с картинкой после добавления в новый документ может оказаться ниже других слоев распложенных в этом документе. Порядок слоев в документе можно изменять мышью. Для этого в палитре Layer (Слои, F7) выберите нужный слой, нажмите мышью на него, теперь не отпуская мышь перетащите слой выше или ниже других слоев в документе.) Если вы хотите что бы слой оказался выше всех слоев – выделите слой и нажмите Shift+Ctrl+].)

(нажмите на картику для просмотра оригинала)

Далее будем делать эффект выхода картинки из кадра. Для этого мы будем использовать маски в фотошопе. Выбираем слой с нашей картинкой, после этого выбираем инструмент инструмент Rectangular Marque Tool (Прямоугольное выделение, M) и рисуем прямоугольное выделение поверх сделанного фона.

После этого в палитре Layers (Слой, F7), нажимаем на кнопочку . Далее убираем замочек (кликаем по нему мышкой) между картинкой и ее маской. После этого выбираем саму картинку. Проделанные действия позволят нам двигать картинку внутри маски, так же внутри картинку можно трансформировать. Двигать картинку можно клавишами — Вправо, Влево, Вверх и Вниз на клавиатуре или с помощью инструмента Move Tool. Двигая и трансформируя картинку добьемся нужного нам результата:

(нажмите на картику для просмотра оригинала)

Теперь нам осталось только добавить ковбою обрезанную шляпу. Для этого идем в палитру со слоями (жмем F7), выделяем наш слой с картинкой и выбираем пиктограмму с маской слоя.

Далее устанавливаем в фотошопе цвет переднего/заднего плана по умолчанию (черный/белый), для этого жмем D на клавиатуре, так же можно изменять цвета местами с помощью клавиши X (есть так же соответствующие кнопочки внизу панели с инструментами). После этого выбираем инструмент Brush Tool (Кисть, B). Теперь рисуя кистью когда выбран Черный цвет — как цвет переднего плана, на картинки у нас будет маска стираться, а когда у кисти будет стоять Белый цвет – как цвет переднего фона, картинка у нас будет появляться. Проще говоря, при активном Черном цвете, кисточка работает как Резинка (т.е. стирает изображение), а при активном Белом цвете кисточка работает как Восстановитель (восстанавливает все то, что скрыто). Аккуратно обработав картинку кистью, у нас получился эффект выхода из картинки (шапка выходит за пределы картинки). Добавим внутреннюю тень для картинки. Добавим стиль для слоя Inner Shadow (Внутренняя Тень). вот что получилось: Осталось повторить все эти действия для второй и третьей картинки. В конечном итоге у меня получилась готовая шапка для сайта или блога. (нажмите на картику для просмотра оригинала)
Шапка получилась простенькая, но со вкусом.

blogohelp.ru