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

На самом деле, у каждого изображения есть свой правообладатель - фотограф или издатель, купивший эксклюзивные права на это изображение. Использование этой картинки без разрешения - нарушение автоских прав. Если у вас небольшой проект и взять с вас нечего, вам могут просто погрозить пальчиком и потребовать убрать картинку, но если у проекта большая посещаемость, он, как говорится "на виду", в этом случае можно схлопотать гораздо сильнее. Сейчас даже проводятся семинары на тему - как заработать на судебных исках за неправомерное использование фотографий (пример - http://www.nn.ru/community/biz/photography/?do=read&thread=28188843&topic_id=68165525). То есть, дело-то серьезное!

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

Бесплатный фотобанк Pexels.com

https://www.pexels.com - вот ссылка на него. Фотографии высокого качества оттуда можно скачать совершенно бесплатно, безо всякой регистрации и просмотра рекламы. На сайте есть раздел "лицензия",  в котором четко сказано, что фотографии абсолютно бесплатны как для личного, так и для коммерческого использования. Их можно модифицировать и распространять, никто за это слова не скажет. В качестве благодарности можно поддержать авторов фотографий, закинув им денег на кошелек PayPal.

 

Вроде бы все хорошо, но есть несколько нюансов.

  • Изображений в банке пока не очень много
  • Лица на по большей части фотографий не славянского типа, это накладывает некоторые ограничения на использование картинок на сайте с т.з. здравого смысла - вы часто видите среди клиентов наших фирм, скажем, мексиканцев или афроамериканцев? :) Наверное, нет, поэтому на сайте фирмы такие картинки размещать не стоит - они там выглядят по меньшей мере странно.
  • Сайт полностью на английском языке и поисковые запросы нужно вводить тоже на английском языке.

 

Несмотря на эти ограничения, сайт мне очень помогает в работе!

Иконочный шрифт Font Awesome

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

Недавно и в этой области я для себя сделал открытие - иконочный шрифт Font Awesome. Он представляет собой огромный и совершенно бесплатный набор векторных иконок, которые вставляются на сайт при помощи средств CSS и тега <i>. На сайте это выглядит примерно так:

Иконки в меню сайта сделаны при помощи Font Awesome. 

Как пользоваться этим шрифтом? Нужно сделать 3 простых действия:

  1. Нужно скачать шрифт и разархивировать его в папку на вашем сервере, например, /font-awesome.
  2. В заголовочной части шаблона сайта, там где подключаются стили CSS, добавить новую строчку:
     <link rel="stylesheet" href="/font-awesome/css/font-awesome.min.css">
  3. На странице с иконками найти нужную пиктограмму, кликнуть по ней - откроется страница с HTML-кодом для вставки этой пиктограммы в текст. Например, такой:
    <i class="fa fa-book" aria-hidden="true"></i>
  4. Копируем этот код и вставляем его в нужное место страницы.

Если вы знакомы с CSS, можно тегу <i> добавить свойство style="...",  в котором прописать цвет, фон, размер, прозрачность и прочие свойства элемента.

Еще один пример использования Font Awesome для оформления каталога услуг одной коммерческой фирмы. В данном случае был увеличен размер иконок, причем без потери качества, так как они векторные.

На сегодня все! 

Я думаю, данная статья помогла вам решить если не все, то хотя бы большинство проблем, связанных с картинками и иконками для сайта. Если вы поделитесь ссылкой в социальной сети (о большем не прошу), буду очень благодарен!