5 мая в Киеве я впервые выступал на Яндекс.Субботнике.
На нем я старался показать, как с помощью БЭМ инструментов и подходов можно создавать приложения для социальных сетей, используя общую кодовую базу.
Видео и презентацию можно найти в клубе Яндекс.Субботника.
Приложение на Facebook: https://apps.facebook.com/yandexphotoday/
Приложение на Вконтакте: http://vk.com/app2900887_6035860
Исходный код приложения: https://github.com/banzalik/yasubb-kiev2012.
Задавать вопросы можно тут.
В 99.9% случаев CSS свойство zoom используется верстальщиками для активации hasLayout в IE. Я хочу рассказать о том 0.01% проценте использования этого свойства.
В те времена, когда трава была зеленее, миром правил IE, а дизайнеры учились рисовать сайты- приходилось часто сталкиваться с неоднозначными дизайнерскими решениями.
Одним из этих решений — кастомные скроллбары, например такие:
Читать далее
Попался мне на глаза достаточно интересный способ значительно уменьшить размер большого полупрозрачного PNG.
Начнем с примера. PNG — 334Кб, aJPG — 74 Кб.
Суть приёма в следующем.
Читать далее
Многие сайты львиную долю посетителей получают за счет источников переходов, это могут быть сайты, поисковые системы, каталоги, вики.
Так, вот почему бы не использовать уже загруженный jQuery у тех пользователей, которые только что пришли с подобных сайтов?
Предположим, у нас 3 сайта, которые генерируют существенный процент трафика.
Все они используют jQuery. Если определять HTTP_REFERER и подставлять сурс на jquery, используемый сайтом-источником перехода — можно получить профит, ведь в большинстве случав jQuery будет еще находится в кеше. Конечно, надо не забыть поставить сессионную куку, которая будет помнить, что у этого пользователя сегодня jquery кастомный, а не дефолтный.
Да, у этого приема есть и минусы, например надо постоянно мониторить генераторы трафика на актуальность ссылок, но это все делается весьма несложными автоматами.
p.s. Эту технику можно применять не только для jquery.
Возможно, этот велосипед уже где-то описывался, лично мне он пришел в голову только сегодня.
1861097.9903115.1306696357.2f536c093d61f73b3df89ed9d24b05d8
Решил померять как быстро отрисовываются теги без применения к ним каких-либо стилей.
Суть теста — генерируем 10к тегов на одной странице и меряем reflow.
Результаты оказались очень любопытные.
Пока даю весьма скромную таблицу, с малым набором тегов.
| Тег | Safari 4.0.5 (mac) | FF 3.6.3 (mac) | Opera 10.53 (mac) | iPad |
|---|---|---|---|---|
| div | 173 | 270 | 218 | 710 |
| span | 52 | 608 | 113 | 294 |
| p | 173 | 287 | 235 | 711 |
| b | 50 | 607 | 116 | 299 |
| i | 50 | 600 | 1164 | 297 |
Очень странные результаты показал IE — почти нулевые рефлоу (поэтому пока не заполняю таблицу с результатами IE*)
Вывод:
Скоро проведу более детальное исследование + проверим скорость основных css свойств.
upd. имена тегов в таблице ведут на соответствующие тесты
В продолжение моей вчерашней записи про CSScomb в WebStorm спешу поделиться более усовершенствованным скриптом.
Теперь он обрабатывает только .css файлы и умеет ходить по папкам, да-да, теперь можно применять CSScomb прямо к папке, содержащей css файлы или прямо к папке проекта.
Обновленный файл лежит по старой ссылке.
Инструкция по устаноке в предыдущей статье.
Есть хороший проект называется CSScomb от Вячеслава Олиянчука aka miripiruni. Суть его в том, что он сортирует CSS свойста согласно определенному порядку, который мы выставляем самостоятельно. Уже есть плагины для Coda и TextMate. Однако я пользуюсь WebStorm (WebIde) и очень захотелось подобного функционала именно в нем. Ну что ж сказано — сделано 
Читать далее
Больше всего камней в IE8, со стороны разработчиков, летело из-за того, что в нем не работали фильтры, которые понимали IE6-IE7.
Однако это не так, IE8 (в режиме IE=EmulateIE8) умеет отрабатывать фильтры.
Разработчики IE8 просто поменяли синтаксис вызова фильтра, теперь прийдется писать не
filter: progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#000000');
а
-ms-filter: "progid:DXImageTransform.Microsoft.Shadow(Strength=4, Direction=135, Color='#000000')";
Пример работы: http://banzalik.ru/labs/ie8filter/
P.s. эта информация несколько раз мелькала в интернетах, но почему-то должного внимания к себе не привлекла.
Все знают про проблему полупрозрачных PNG-24 в IE6, выглядит она так
Серый фон, который заливает всю прозрачность, можно менять на произвольный цвет.
Эта статья о том, как избавиться от серого фона при этом не потеряв полупрозрачность
Читать далее
Так получилось, что я использовал технику вставки шрифтов в страницу еще до выступления Вадима в Минске, поэтому решил написать небольшое дополнение к выступлению Вадима Макеева — «Веб-шрифты vs. Шрифты для веба.«.