В этой публикации речь пойдет о тех самых файлах favicon.ico, по которым можно быстро узнавать сайт в выдаче поисковых систем или среди горы закладок в браузере. Для своих проектов у меня встала такая задача, но в opensorce готовых решений я найти не смог. Возможно, плохо искал, или, может, такие решения уже появились, но во всяком случае я, как всякий нормальный программист, написал свое решение. Со временем его немного подморофетил и выложил в opensource, собственно, о нем я сейчас и хочу рассказать.
Мое решение написано для nodejs и системы сборки grunt и выложено в npm, пакет называется grunt-favicon. Расширение представляет из себя задачу для grunt, которое из любого графического формата может делать иконки для сайта.
Приведу сразу пример:
Файл Gruntfile.js
module.exports = function (grunt) {
grunt.loadNpmTasks("grunt-favicon");
grunt.initConfig({
favicon: {
options: {
// тут пишутся глобальные опции расширения
},
create_icons: {
options: {
// а тут пишутся опции каждой отдельной таски,
// если они отличаются от глобальных
},
files: [
{
ext: ".ico",
expand: true,
dest: "build/images",
cwd: "sources/images",
src: ["*.png", "*.jpg"]
}
]
}
}
});
};
Это пример конфигурации Gruntfile.js, в которой создана задача favicon:create_icons, которая для каждого файла *.png или *.jpg из папки sources/images создаст аналоги, но только иконки и разместит их в папке build/images с теми же названиями и путями.
Запустить такую задачу можно из командной строки при помощи команды:
grunt favicon:create_icons
Но прежде необходимо установить само расширение:
npm install grunt-favicon --save-dev
У расширения не так много опций, всего 2 штуки:
- countOfImages — количество изображений, которое будет включать в себя иконка. Размер вложенных изображений строго предопределен: 16x16, 32x32, 48x48, 64x64, 128x128, 256x256. Например, если задано 3, то иконка будет содержать 3 изображения: 16x16, 32x32, 48x48. Максимальное значение — 6.
- colorDepth — глубина цвета в количестве битов (от 1 до 8).
У моего решения есть зависимость — это установленный глобально ImageMagick. Для Windows дистрибутив можно скачать с официального сайта, для Debian, Ubuntu или Mint пакет можно установить из командной строки:
sudo apt-get install imagemagick
Для Redhut, Centos или Fedora пакет можно устанавливать так:
sudo yum install ImageMagick
Преобразовывать можно любые графические форматы, с которыми умеет работать ImageMagick, а он умеет работать с очень многими форматами.
По хорошему создание таких иконок — это очень редкий кейс, но мне для своих проектов нужно было создавать иконки из *.png файлов. Так же надеюсь, что такая задача может ещё кому либо пригодиться, буду рад отзывам и предложениям.
Расширение grunt-favicon
Официальный сайт ImageMagick
