Это видео недоступно.
Сожалеем об этом.

Как быть с font-awesome? - На ковре у Мурыча

Поделиться
HTML-код
  • Опубликовано: 13 окт 2020
  • Что делать с Font Awesome: если только создаете сайт и если он уже есть на работающем сайте.
    Вопрос найден в техническом чате у Евгения Калинского:
    Как лучше поступить с font-awesome?
    Если даже сохраняешь его локально, всё равно PageSpeed ругается. Есть идеи?
    На вопрос Евгения ответил Деми Мурыч: t.me/demimurych
    Форма для ваших вопросов: forms.gle/x8Hk...
    #seo #наковре #pagespeed

Комментарии • 8

  • @yyaahooyy
    @yyaahooyy 8 месяцев назад

    Согласен полностью! Я бы дополнил вторую часть видео, как быть - вернуться в первой рекомендации)

  • @ilyakutalev8607
    @ilyakutalev8607 8 месяцев назад

    Мурыч, здравствуйте! Подскажите, насколько корректна подгрузка иконок через JS посредством собранного заранее JSON файла c SVG кодом. Пример такой реализации - feathericons. Единственный минус с которым я столкнулся - иконки должны быть подогнаны к единому размеру

  • @BuggsSunny
    @BuggsSunny 3 года назад +1

    Возможно это экономия на спичках. Ради выигрыша в 10 кб изобретать костыли и велосипед.
    Понятно, что кроме 10кб мы экономим и серверное время, немного ресурсов, но я не думаю, что font-awesome.min способен ощутимо повлиять на работу сайта.
    + в настройках FA можно выбрать SVG спрайты вместо шрифта и к тому же можно выбрать себе нужные наборы, а не тащить все сотни иконок.
    Так что я думаю, что в идеальном случае лучше обойтись псевдо элементами, но если нет, то не стоит тратить время на переделывание, оно того не стоит.

    • @DemiMurych
      @DemiMurych  3 года назад +1

      А я утверждаю, что в случаях, когда соотношение контента к мусору созданному лигатурами от FontAwesome имеет хотябы близкое к 5% это уже можно увидеть невооруженным глазом на своей статистике.
      И ходить за примерами далеко ненужно. Официальный сайт материал дизайна от гугла, весь сел в лужу с такими лигатурами.
      Потому, дефакто, использование FontAwesome в формате - подключил CSS файл загрузил пачку шрифтов - один из обязательных пунктов на исправление. И делается такое исправление очень быстро.Если, конечно у нас есть специалист.
      Кстати сказать дарю идею, платного плагина для вордпресс, который автоматически конвертирует верстку страницы из подключенного FA в набор SVG инлайн иконок.

    • @BuggsSunny
      @BuggsSunny 3 года назад

      ​@@DemiMurych Привет Мурыч, снимите, пожалуйста, ролик про уникальность текста. Как рассчитываются шинглы, от скольки слов подряд считается уникальность или это реализовано по-другому, как поисковая машина хранит тексты в базе? По-видимому там есть еще и некий отпечаток текста страницы (diff checker или фингер-принт) когда поисковик понимает, что текст менялся. В интернете куча хлама на эту тему, все говорят уникальность-уникальность, но никто не исследовал что конкретно понимает поисковая машина под уникальностью. Имеется ввиду инфо-блоги. Понятно, что на фильмовом сайте уникальность - это моветон, хотя и такое делают. Еще говорят про смысловую уникальность, но я не думаю, что такое пока возможно. Рерайт - да распознает, но не думаю, что поисковая машина вникает в глубкий смысл текста .
      В общем интересная тема для исследования и экспериментов.

  • @Otshelnik-Fm
    @Otshelnik-Fm 3 года назад

    На гите я выкладывал решение для полуавтоматической сборки шрифта на основе анализа используемых на сайте: github.com/Otshelnik-Fm/otfm-extract-used-icons-on-the-site там же есть метрики что получилось.

    • @DemiMurych
      @DemiMurych  3 года назад

      Мне кажется что,
      сама по себе идея очень верная, а реализация нет.
      Ничто не мешает сделать ровно такой же плагин, который делает следующее:
      Пока проект на стадии тестирования, подключаются CSS стили которые загружают шрифт FontAwesome. То есть работа происходит в типичном режиме.
      При этом при переходе в продакшин, подключается другая таблица стилей, которая уже не содержит шрифта вообще, но содержит ссылки на конкретные svg файлы каждой иконки.
      А если пойти еще дальше, то можно все это усилить опицями по правильному инлайну таких svg иконок. В результате получится вообще супер профит.

    • @Otshelnik-Fm
      @Otshelnik-Fm 3 года назад

      @@DemiMurych для тестирования у меня dev сайт. Там все скопом и грузится. Это как раз на проде собираются иконки. Но заморачиваться с SVG желания нету - т.к. там очень много ручной работы выйдет. Иконочный шрифт подключает экосистема стороннего плагина - от него я отказаться не могу. Но отключить и переподключить из своего места могу. Поэтому такое решение. Если бы я сам контролировал сторонний плагин - может на svg и изначально сделал. Но там история сложная - к плагину более 300 дополнений и они все иконочный шрифт используют. Каждый свою иконку. Поэтому жестко ограничить пользователей автор плагина не может и отдает весь пак шрифта.