Background

Статья очень крутая и интересная даже не специалистам.

Было проблемно переносить её под формат функционала пикабу, прошу понять и простить

Пару лет назад я прочитал интересные факты о жизненном цикле периодических цикад. Обычно мы не видим вокруг себя много этих насекомых, потому что бóльшую часть своей жизни они проводят под землёй и тихо сосут корни растений.

Однако, в зависимости от вида, каждые 7, 11, 13 или 17 лет периодические цикады одновременно массово вылезают на свет и превращаются в шумных летающих тварей, спариваются и вскоре умирают.

Хотя наши странные цикады весело уходят в иной мир, возникает очевидный вопрос: это просто случайность, или числа 7, 11, 13 и 17 какие-то особенные?

Оказывается, у этих чисел есть кое-что общее. Все они простые числа, которые делятся только на себя и на единицу (это 1, 2, 3, 5, 7, 11, 13, 17, 19, 23 и так далее).

Почему это так важно?

Исследования показали, что численность животных, которые питаются цикадами — обычно птицы, пауки, осы, рыбы и змеи — часто демонстрируют более короткий цикл 2–6 лет между пиком и спадом популяции. Таким образом, если бы наши цикады появлялись, например, каждые 12 лет, то каждый хищник с жизненным циклом 2, 3, 4 или 6 лет мог бы синхронизировать циклы подъёма своей численности с регулярным появлением цикад. На самом деле, они наверное объявили бы всеобщий праздник обжорства под названием День Цикады.

Это не очень весело, если вы — цикада.

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

Находчивые малые, правда?

Замечательно. Но как это относится к веб-дизайну?

Пару недель назад мы рассматривали, как делать бесшовную заливку (тайлинг). Это суперполезная вещь, но бывает трудно соблюсти правильный баланс.

С одной стороны, вы хотите использовать файлы как можно меньшего размера, чтобы получить максимальную пользу от эффекта тайлинга. Однако, как только вы заметите какую-то особую черту в фоне — например, маленький сучок на фоне древесного волокна — который повторяется через одинаковые интервалы, то сразу теряется вся иллюзия натуральной случайности.

Может быть, можно позаимствовать какие-то идеи у цикад, чтобы сломать этот паттерн?

Генерация натуральной случайности средствами CSS

Пример 1

Хватит болтовни. Вот маленькая проверка концепции. Тест не должен выглядеть идеально красиво, но он хорошо демонстрирует суть. Помня о «принципе цикады», я сделал три квадратных полупрозрачных PNG размером 29, 37 и 53 пикселя, соответственно, и установил их как фоновые изображения в элементе HTML на тестовой странице.

И вот результат.

Как видите, эти квадратики перекрывают друг друга и взаимодействуют, генерируя новые паттерны и цвета. И поскольку мы используем волшебные простые числа, паттерн не будет повторяться очень долго.

Насколько именно долго? 29 × 37 × 53… или 56 869 пикселей!

Это для меня была какая-то революция. Я проверил свои вычисления трижды, но математика полностью надёжная. Помните, ведь это крошечные графические файлы, менее 7 килобайт вместе, при этом генерируют текстуру почти 57 000 пикселей в ширину.

Вы можете представить, что произойдёт, если добавить ещё четвёртый квадратик, например, 43 пикселя? Или не можете представить, потому что числа становятся слегка зверскими и могут загипнотизировать, если смотреть на них слишком долго. Достаточно сказать, что вы получите цифру, более подходящую для терраформирования планет, чем для веб-дизайна.

Ok. Теоретически, геометрические фигуры хорошо работают, но как ещё можно использовать эту идею?

Пример 2

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

Для этого примера я буду называть этот промежуток «блоком сборки (ruffle unit), и в отличие от первого примера, он будет более важным, чем строгие размеры в пикселях тех изображений, с которыми мы работали.

Во-первых, я собираюсь выбрать один из таких блоков и превратить его в элемент для бесшовного фона. Это JPEG размером всего 8kb.

Результат.

Если посмотреть на этот фон с численной стороны и представить каждый каждый блок в виде числа, то получится следующее: 1, 2, 3, 1, 2, 6, 1, 2, 1, 3, 2, 1, 6, 2, 1, 1, 3, 1, 1, 6, 1, 1, 2, 3…

Паттерн там есть, но его очень сложно распознать.

В этом примере практически бесконечный фон в виде театральной завесы стоил нам всего лишь 53kb. И конечно, можно без труда добавить четвёртый слой — возможно, размером в 11 блоков — если нужно. Однако, я не думаю, что здесь это требуется.

Также имейте в виду: в этом примере используются самые минимальные простые числа — 1, 3 и 7. Если бы мы взяли, скажем, 11, 13 и 17, то могли бы сделать гораздо более сложную вариацию на заданном размере. В реальности всё сводится к масштабу текстуры относительно ширины экрана.

Пример 3

Мой последний пример не столько практического плана, сколько ради развлечения с простыми числами. Я не собираюсь снова разбирать теорию, потому что базовая концепция такая же, как и в предыдущих двух примерах, но я буду рад, если вы попробуете отредактировать его в FireBug.

2 200 лет назад китайский император Цинь Шихуанди создал терракотовую армию численностью 8000 человек для охраны своей могилы. Полноразмерная статуя каждого воина, лошади и оружия представляет собой уникальное изделие ручной работы.

Используя простой CSS, простые числа и набор изображений, мы собираемся собрать нашу собственную могучую армию. Может ей и не хватает роста, но зато она берёт своей многочисленностью.

Ссылка.

Поддержка браузеров

Я оставил разметку простой, используя множественные бэкграунды в элементе HTML. Такой вариант поддерживается всеми современными браузерами (Firefox 4, Chrome 10, IE9, Opera 11, Safari 5), но, очевидно, не всеми старыми версиями.

Однако если ставить условием обратную совместимость, то подходящим вариантом может быть тайлинг в html, body и контейнер div. Возможно, контейнер может быть не семантическим, но эта маленькая поблажка потенциально может сильно отразиться на всём сайте. Решать вам.

Эти три примера первыми пришли мне в голову, но я уверен, что есть много более грамотных способов использовать идею. Например:

Бесконечный городской пейзаж

Неповторяющаяся текстура дерева

Звёздное небо

Плотные джунгли

Облачное небо

Может, есть ещё какие-то идеи?

Источник. Подборка интересной копипасты (ТГ)

Здравствуйте, разбирал сейчас барахлишко-барахло и пришел к выводу, что эта субстанция является какой-то константой, ведь у меня, сколько я себя помню, было четыре барахла, и даже если одно я разбирал и выкидывал, оставалось все равно четыре! Но сегодня не об этом, сегодня очередное барахло принесло мне очередную ностальгию по детству, сильным переживаниям, а так же "фишку" с Алисой Милано!!! (Вторая любимая после "Пикачу").

А у вас были эти детские влюбленности в кого-то на экране? Как далеко они заходили, может даже писали своим объектам воздыхания письма какие-то или все ограничивалось просмотром кино с их участием, плакатом на стене и футболкой с изображением?

У меня было почти все из этого! И "одной из" была как раз Алиса Милано из Зачарованных (потом каждый раз, когда видел ее где-то еще, сердечко екало). Долгое время Лана, из Тайны Смолвиля, пыталась потеснить ее. Ну а всех их затмила для меня девчушка из сериала "Город пришельцев" - Шири Эпплби!!!

Она была милой как в общении на экране, так и внешне, а еще в ней был какой-то огонек! Когда надо было, в ней появлялся стержень, несмотря на повседневную мягкость! Но это ладно, все еще хуже было с сериалом "Девочки Гилмор", и - Алексис Бледес.

Я маленький сам рос с главной героиней на протяжении всех сезоном и какая же она классная! Просто влюбляешься в таких вот и при этом потом чувствуешь себя идиотом, что столько чувств пустил в это, потом уже оправдываешь себя, что мол ничего, это нормально, даже полезно давать волю эмоциям. А на смену этим переживанием приходит обычная грусть от того, что ее нет, нет такого человека, нет моей Рори, и особенно грустно, что ее нет не только для меня, но и просто что ее нет в природе вообще. Нет девочки, что теряла свой дневник, нет девочки, которая так любила своих родителей и была мила с бабушкой и дедушкой, не существует и девушки, которая поехала на концерт Enya в Нью-Йорк(. Нет ее, нигде нет, вообще нет. Есть лишь актриса Алексис Бледес, которой на данной момент почти 40, у нее ребенок, муж, она ругается матом и любит...ой, да мало ли что она любит, я даже не хотел это узнавать. Не стоило с ней интервью смотреть, мне сердце разрывало, когда я видел свою Рори на стуле, но она говорила странные вещи ведущему, смеялась не так скромно как Рори, говорила не так как Рори, сидела не так как она. Я не сумасшедший, ну или да, но без крайностей. Понимаю, что все это всегда артисты и у них своя жизнь, что они ходят в туалет, а еще ковыряют в носу и может еще где, ругаются матом и бывают злыми и подлыми, но я не хочу, не хочу этого знать! С тех пор я смотрю кино и ничего не узнаю про самих актеров!

Вот узнаю я, что кто-то детей своих избивал, как мне потом смотреть фильм с ним? Как мне выкинуть этот факт из головы? Может он гениальный актер, может я бы влюбился в этот фильм, но в голове у меня будет одна мысль "эта падла бьет детей". У вас как с этим, вам важен бэкграунд артистов кино и сериалов?

У меня просто не выходит отгородиться как от плохого, так и от хорошего бэкграунда. И плохой я бы предпочел не узнавать, поэтому и стараюсь избегать всяких интервью и так далее. Если моя милая любимая актриса начнет хамить журналистке, то магия уйдет, она может и не знает, но мы с ней связанны!!! А вот стоит ей нахамить и все, любовь ушла! Если говорят, что Полански педофил, нет, я не верю в это на 100% от одних обвинений, да и там все настолько у них расплывчато. Но блин, мысль все-равно где-то рядом, что вот этот персонаж, артист, который его играет, мучал детей. В общем да, для меня чертовски влияет, и я вспомнил про это именно из-за недавно просмотренного "Простая формальность" с Полански и Депардье, фильм просто потрясающий, да и музыка Морриконе, слова же написал режиссер Торнаторе (у меня плотно в ассоциации с ним сидит один Крис Хэмсворт на другом Крисе Хэмсворте), а Депардье спел, но вот про Полански говорят гадости, про Депардье я и сам гадости могу сказать (пару раз общался вживую, точнее наблюдал со стороны его некрасивое поведение), так вот зная все это, смотреть фильм было по прежнему здорово, классное кино, но иногда симпатия к героям чуть ослабевала невольно от этих знаний.

Впрочем работает и хороший бэкграунд, ну вот Никулин, я его любил как актера, классный мужик, веселый, всегда что-то смешное с ним идет, но прочитал его книгу "Почти серьезно", про войну, цирк, семью, жизнь и проникся таким уважением к человеку, что во-первых ознакомился с теми фильмами, которые еще не видел с его участием, а так же получал больше удовольствия, когда видел его в кадре!!! Как вот говорят в киношных судах США, выходит там инвалид или еще кто и судья просит присяжных не принимать это во внимание во время приговора, но это так не работает, ты все равно человека жалеешь или восхищаешься им за какие-то свершения. Если вот Вася, здоровый и умный зашел на Эверест, он молодец, но если это сделал Петя без руки и ноги, то он СУПЕР молодец. Результат тот же, но история этого результат и приложенные усилия тоже важны для оценки финальной!!!

Думаю тут много людей примерно моего (30 лет) возраста, поэтому буду рад, если поделитесь своими "влюбленностями", может я просто забыл кого? Ведь была Габриэль из Зена Королева Воинов, был и Чак Норрис из Уокера, да мало ли, Халк Хоган из Гром в раю на худой-то конец!!!!! Удачи вам и желаю больше в жизни копить положительный бэкграунд людей!