Как сделать такой background?

Question

[Конан Варвар]

Коллеги, всем привет.
Подскажите пожалуйста как сделать такой background. Не прошу сделать за меня, просто прошу рекомендаций и совета.

Comments

[Сергей delphinpro]

Как же это трудно, залить картинку прямо в вопрос...

[Конан Варвар]

Сергей delphinpro, Как же это трудно нажать на ссылку в вопросе...

[Сергей delphinpro]

Конан Варвар, решение вопроса нужно вам, а не отвечающим. не надо передёргивать.

[Конан Варвар]

Сергей delphinpro, Вы придираетесь :) Я сам в свободные минуты захожу поотвечать на вопросы и куда больше раздражает когда люди вообще ничего не добавляют ни ссылок, ни картинок, а всё пытаются на словах объяснить. Но лично меня никогда не затрудняло нажать на ссылку :)

Answer 1

[lagudal]

Я за svg вариант - можно вывести как кодом, так и как картинку. При любом из этих вариантов данный фон будет легкий, не более 1кб. Картинка растр по любому в высоком разрешении будет тяжелее, к тому же вектор всегда вектор, без потери качества.

Answer 2

[Дима Горичей]

Картинкой

Comments

[Конан Варвар]

А еще какие-то идеи?

Answer 3

[profesor08]

Картинка, canvas, svg. Но если ты надеешься на какое-то решение при помощи css, то можешь посмотреть в сторону clip. Естественно будет работать только в самых новых браузерах и то не во всех. Поэтому твой вариант - картинка.

Comments

[Конан Варвар]

Пока ждал ваши ответы, погуглил и именно такой вывод и сделал. Картинка самый надежный вариант. Спасибо за ответы :)

[Евгений]

Под IE оптимизацию делает только больной ублюдок.

А так как самые популярные браузеры (Хром, Сафари, Мозила) работают без проблем то и вопросов никаких нет. Опера умерла в муках, Доля IE упала на уровень дна.

[Конан Варвар]

Евгений, По поводу IE всё же не могу с Вами согласиться. Сейчас под IE 11 и Edge оптимизировать не те муки как было раньше. Тут и flex поддерживается и много других современных штук. Не говорю что все супер, но и не такая боль, которую мы ощущали пару лет тому назад.

[Евгений]

Конан Варвар, Но зачем , если доля IE мизерная и падает и падает с каждым годом?

Лидером, как нетрудно догадаться – остался Google Chrome. К концу года он завоевал 55,04%. Далее идет огромный разрыв и твёрдое второе место занимает Apple Safari с 14,86% в декабре 2017 года. Третье место у UC Browser – 8,69%. Тройка лидеров не изменилась за год более того, все они немного прибавили в аудитории.

Четвертое место занял Firefox. – 5,72%. В ноябре состоялся релиз одного из самых больших обновлений браузера, за все время его существования. К сожалению, выход Firefox Quantum не помог нарастить аудиторию. Если в октябре аудитория была 6,08%, то к декабрю она не только не смогла существенно увеличиться, но и снизилась до 5,72%.

Далее идет тройка браузеров, которые ожесточено делили полтора процента весь год. К концу 2017-го года Opera заняла 4,03%, у Internet Explorer 3,35% и 2,88% у Samsung Internet. Эта тройка постоянно меняет позиции и в будет интересно пронаблюдать как изменится аудитория данных браузеров в 2018-м году.

@JaredWinter,

Это белорусские "программисты" делают веб-приложения под IE, так как они больны чем-то неизвестным. Из-за чего и создаётся кучу гемора и проблем.

Вот если делать сайт для бизнеса, то мне реально было бы пофиг на аудиторию которая придёт благодаря IE. Если они используют IE, значит они уже могут далеко не нормальные клиенты, а благодаря тому что у меня не будет оптимизации под веселые браузеры.

html5accessibility.com

IE поддерживает 56 % html5 нормально.

Я уже говорил какой выход)

<!--[if IE 7]><script>window.location.href = "https://www.google.ru/chrome/browser/desktop/";</script><![endif]-->
<!--[if IE 8]><script>window.location.href = "https://www.google.ru/chrome/browser/desktop/";</script><![endif]-->
<!--[if IE 9]><script>window.location.href = "https://www.google.ru/chrome/browser/desktop/";</script><![endif]-->
<!--[if IE 10]><script>window.location.href = "https://www.google.ru/chrome/browser/desktop/";</script><![endif]-->
<!--[if IE 11]><script>window.location.href = "https://www.google.ru/chrome/browser/desktop/";</script><![endif]-->

[Конан Варвар]

Евгений, я понял Вашу идею, согласен на 95%.
5% - я предпочитаю делать свою работу максимально кроссбраузерной, во избежание неприятных казусов, ну и конечно для личного самоудовлетворения :)

Answer 4

[forspamonly2]

раскрасить в цсс, тремя радиальными градиентами. один из них эллиптический придётся ещё наклонить.