Оправдано ли применение иконочных шрифтов?

 
Посетитель
small user social cms
МедальАвторитет форумаКубок зрительских симпатийПочетный донор проекта
Сообщений: 2928
Вопрос возник после прочтения нескольких тем, после чего пришла идея использовать иконочные шрифты на сайте)

Вопрос в следующем, допустим есть набор из 100 иконок (картинок) 128х128рх которые часто применяются на сайте в разных размерах.
Вывожу одни и те же картинки изменяя стилями под нужный размер...
Как бы картинки кешируются - тут вроде все нормально.

А если "преобразовать все картинки в шрифт и использовать его - какие тут могут быть недостатки в плане скорости формирования страницы?
Есть ли вообще какие либо "подводные камни"?
Посетитель
small user social cms
МедальКубок зрительских симпатийПочетный донор проекта
Сообщений: 820
В скорости формирования будет только то что если на странице используется 1 иконка шрифта то она все равно загрузить все ваши 128 из шрифта, хотя нынешние браузеры уже кеширует фонты, мобильные версии не все еще так умные.

Ну и вопрос в том что вы не сделаете полноцветной иконки, всегда будет 1 цвет.
Редактировалось: 1 раз (Последний: 18 июня 2014 в 16:49)
Компоненты, модули, шаблоны, разработка на заказ - широкий выбор всего
Реклама
cms
Посетитель
small user social cms
Медаль
Сообщений: 427
reload, 1 главный камень - если отключены в браузере картинки, как быть?) Мало кто конечно таким страдает, тем не менее, исключать этого не стоит. Разве что делать какую-то проверку, в зависимости включены или отключены.
от 16% в месяц на автопилоте
Недорогой и надежный хостинг Промокод 20% скидка - 841de7-20
Модератор
small user social cms
МедальПочетный донор проектаКубок зрительских симпатийАвторитет форума
Сообщений: 1422
reload, со шрифтами, которые вы сами подключаете, в опере например, довольно часто что нибудь случается: либо букв вообще нет, хотя они есть, но совершенно невидимые, либо шрифт просто не работает. И происходит само по себе: то работает, то не работает.
Нормальный хостинг, сервера быстрые - пользуюсь сам.
Посетитель
small user social cms
МедальАвторитет форумаКубок зрительских симпатийПочетный донор проекта
Сообщений: 2928
maxisoft:
Ну и вопрос в том что вы не сделаете полноцветной иконки, всегда будет 1 цвет.
Нет, все продумано) фон и цвет настраивается как у большинства иконок... цвет шрифта задается в css и там же фон...
А вот то что из-за одной иконки будут подгружаться все, конечно не совсем по феншую...

scanread:
1 главный камень - если отключены в браузере картинки, как быть?)
так их и не будет) будет шрифт!

lokanaft:
со шрифтами, которые вы сами подключаете, в опере например, довольно часто что нибудь случается
под все браузеры можно сделать... но то что браузеры сами по себе временами тупят, тут конечно ничего не сделать(
Посетитель
small user social cms
МедальАвторитет форумаКубок зрительских симпатий
Сообщений: 1981
Достоинства:
1. шрифт загружается одним не очень большим (читай - грузится быстро) файлом.
2. загрузится, даже если картинки и js отключены страдающим от паранойи посетителем.
3. свободных шрифтов достаточно много.
Недостатки:
1. Подключение достаточно муторное
2. Очень старые браузеры могут не поддерживать свойство css, подключающее шрифты
3. Не все шрифты свободны. Это как раз связано с конвертером шрифтов - конвертер отказывается конвертировать несвободные шрифты. На сайтах шрифтов выложен, как правило, только ttf.
NOP
Посетитель
small user social cms
МедальАвторитет форумаКубок зрительских симпатийПочетный донор проекта
Сообщений: 2928
Странник, из своих картинок мы ведь создаем свой уникальный шрифт!
или я что то путаю?)
Посетитель
small user social cms
МедальКубок зрительских симпатийАвторитет форума
Сообщений: 1842
Давно использую иконочный шрифт, огромный плюс для меня это быстрота работы с ними, записал цвет и размер и все готово, а для картинки открыть фотошоп поработать там несколько минут а потом уже ставить его на сайт.
Чем меньше знаешь - тем Больше тупой.
OneMinima шаблон ICMS2
Посетитель
small user social cms
Медаль
Сообщений: 471
Странник:
Не все шрифты свободны. Это как раз связано с конвертером шрифтов - конвертер отказывается конвертировать несвободные шрифты. На сайтах шрифтов выложен, как правило, только ttf.

Свыше 400 оптимизированных бесплатных вебшрифтов на любой вкус - http://webfont.ru/
Дают сразу код подключения, и полный пакет - css, eot, ttf, woff. Некоторые шрифты идут сразу семьями.
Редактировалось: 2 раз (Последний: 18 июня 2014 в 19:54)
Посетитель
small user social cms
МедальКубок зрительских симпатийАвторитет форума
Сообщений: 1168
Думаю reload, имел ввиду шрифт-иконок, вроде как Font Awesome
Дополнения для InstantCMS 2 | Готовый сайт Доска объявлений
Посетитель
small user social cms
МедальАвторитет форумаКубок зрительских симпатийПочетный донор проекта
Сообщений: 2928
Evanescence:
Думаю reload, имел ввиду шрифт-иконок, вроде как Font Awesome
Именно то! по описанию вроде сложно перепутать
"икончный шрифт = шрифт из иконок" laugh
Только у меня свой личный набор картинок-иконок с размерами около 128х128рх
Их и думаю перевести в шрифт...
Из плюсов, удобное масштабирование и управление цветом, а минусы хотел узнать...

Не все ведь такое применяют, хотя обычные иконки вроде логичней шрифтами забросить - видать не все тут гладко)
Гоша с Яшей до сих пор спрайты штампуют...

Но у меня вопрос не по обычным маленьким иконочкам, а по более большим (элементы визуальной навигации)
Картинки конечно все оптимизированы, но в работе со шрифтами больше своды - легче управлять стилями (цвет, тень, прозрачность, размер) и все на лету, допустим при наведении курсора...
Посетитель
small user social cms
МедальКубок зрительских симпатийПочетный донор проекта
Сообщений: 820
reload:
Картинки конечно все оптимизированы, но в работе со шрифтами больше своды - легче управлять стилями (цвет, тень, прозрачность, размер) и все на лету, допустим при наведении курсора..

Ну если вы смотрите удобство по этим параметрам то имее смысл вообще отказаться от шрифтов в пользу SVG если интересно то вот сравнение использования шрифтов против svg inline графики

http://css-tricks.com/icon-fonts-vs-svg/

свое мнение высказал гуру CSS
Компоненты, модули, шаблоны, разработка на заказ - широкий выбор всего
Посетитель
small user social cms
Медаль
Сообщений: 848
maxisoft, эх, а подобных мнений на русском нема? scratch
Модератор
small user social cms
МедальПочетный донор проектаКубок зрительских симпатийАвторитет форума
Сообщений: 1422
maxisoft:
css-tricks.com
Ну и конечно же, где посмотреть на всю красоту кривой вёрстки, если не на таком сайте:
http://3.firepic.org/3/images/2014-06/19/2979t8ktz08a.png
vs
http://3.firepic.org/3/images/2014-06/19/f25swb0597bd.png
Нормальный хостинг, сервера быстрые - пользуюсь сам.
Посетитель
small user social cms
МедальАвторитет форумаКубок зрительских симпатийПочетный донор проекта
Сообщений: 2928
maxisoft:
Ну если вы смотрите удобство по этим параметрам то имее смысл вообще отказаться от шрифтов в пользу SVG

... кстати вынужден с вами таки согласиться!)

maxisoft, спасибо за наводку!
В начало страницы
Предыдущая темаСледующая тема Перейти на форум:
Быстрый ответ
Чтобы писать на форуме, зарегистрируйтесь или авторизуйтесь.