Вопрос по картинке loading.gif, возможно странный, но все же.
Если мы готовим обычные изображения типа jpg в двух размерах, для обычного монитора и для 4k отдельно в два раза больше.
То нужно ли готовить два разных loading.gif?
Вопрос критичен, т.к. сама гифка вписана в текущем проекте в дизайн станицы. И размер имеет что называется значение.
Для 4К-монитора вы должны готовить изображения в два раза больше только в том случае, если там есть масштабирование 200%. Почитайте получше о retina-ресурсах.
Верстать вы должны под размер viewport. Многие пользователи этого ресурса до сих пор этого не понимают.
Ваша гифка закешируется и "зависнет" при повторном обновлении страницы, если об этом не позаботится. А грузить её вновь и вновь - ну нафик. Сделайте прелоадер на CSS и не придумывайте себе проблем.
Тут несколько моментов.
- На css я сам такое дело точно не сделаю. А девелопер вряд ли захочет таким заморочиться.
- Гифка кастомная.
- Не понял насчет зависнет. Чего она зависнет то?
Я вот тут нашел тему сделать loading в формате SVG. По идее это решение проблемы. не знаю насколько это правильно, юзабельно и кросплатформенно!?
Вот смотрю я на вашу кастомную гифку с 5k и выглядит это ужасно, как в плане качества, так и в плане дезайна. Не модно уже гифки, понимаете. Нет ни одного аргумента в пользу гифки, какой бы то ни было.
Ну это ж не вопрос красоты, тут вопрос техники.
А по красоте, для самой гифки взята часть логотипа. Я не могу использовать другую форму.
Края темно фиолетовая, это подложка, что бы на цветной фон без рваных краев легла.
Я так понял у меня два пути, либо через css либо делать в формате svg
А гиф, между прочим, нельзя использовать еще и по лицензионным ограничениям. Решайте через svg.
В svg хранится векторная графика (которой всё равно на разрешение), стилями в css с помощью keyframes создаете зацикленную анимацию атрибутов.
Это самый актуальный вариант.
