Евгений Степанищев

Я — эксперт в области разработки веб-приложений и безопасности в интернете. Каждый месяц мой блог посещают около 90 тысяч человек. Работаю техническим директором в «Системах документооборота», занимаюсь электронным правительством.

[Без заголовка]

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

Человек я терпеливый, но после последней покупки решил рассказать вам печальную историю о приобретении никоновской оптики в Москве. По работе мне приходилось использовать оптику высокого класса, купленную в европе, потому я не сразу понял, что происходит =)

Началась вся беда естественно с… женщин ! =) Жена увлеклась фото. Первый сигнал — покупка полтинников 50/1.8 — из 3-х экземпляров 1 был более-менее резким, без ярко выраженных фф/бф. Почитав (в рунете!), что это практически норма, успокоился =) Далее 85/1.8 — та же история. Дальше интереснее! Покупка в фотомаркете 35-70/2.8 — выбирали вместе с продавцами, из 5 стекол все оказались с фф/бф ! Так же плачевно окончилась история с 55-200 VR. При тестовых снимках в Праге я был поражен его резкости для такой цены, потому здесь брал, не ожидая подвоха. А зря =) Сдал его обратно. Последняя капля — Никкор 12-24/4 — согласитесь, — недешевое стекло. Брак — мыло по левой стороне на 12—14мм. Обменял на… мыло по правой стороне на 12-14мм. Взял Сигмо - нет проблем =) При этом на западе такой проблемы не знают!

В Праге в Фотошкоде мне сказали, что в Россию техника Никон идет, минуя всего одно звено в производственной цепочке, — это ОТК =) Ни Никон, ни дистрибьюторов в этом винить нет смысла. Таможенные пошлины в нашей любимой стране таковы, что дилеры вынуждены были обратиться к производителю с просьбой снизить себестоимость техники. Как выяснилось - единственный способ, - исключить полную проверку на соответствие всех норм. А надо сказать, — 20% стоимости это как раз тестирование. Не знаю, относится ли это ко всей технике, ввозимой в Россию… к примеру, хороший знакомый из Эльдорадо сказал, что для их торговой сети это вообще норма, — это все, что втыкается в розетку =)

Сорри за сумбур, но накопилось =) Слишком уж много времени занимает беготня с возвратами и обменами.
Комментировать
4 ноября 2007 13:02

Перенос и FireFox

Как известно — FireFox последний из браузеров, который не поддерживает мягкий перенос (shy). Explorer, как один из продвинутых браузеров (не надо смеяться, я не шучу), начал его поддерживать самым первым. Мягким переносом верстальщик может указать где в длинном слове, при необходимости, можно сделать перенос, например, если слово не умещается в колонку. Я прочитал несколько статей на эту тему, но нигде эту задачу решить не смогли. Между тем, в FireFox действует нестандартный тег WBR, который позвляет добиться того же самого, но без символа переноса. Что не совсем то. Кстати, CSS применить к WBR нельзя. Как же быть?

Проблему я решил, но, увы, с потерями: придётся подбирать один параметр для каждого вида шрифта, слово разорванно тегом и поисковые машины проиндексируют его по частям, а полный (совместимый с Opera, FF и IE6) вариант довольно громоздок.

Во-первых, я сразу отказался от тега WBR, потому что любой HTML-валидатор укажет на то, что тег нестандартный. В FireFox действует Zero-width space, символ с кодом 8203, «пробел нулевой ширины». Он позволяет добиться того же самого — разорвать слово в определённом месте.

С идеей как это всё реализовать, я определился сразу — строка при переносе должна открывать концевой символ. А, если переноса нет, вставать поверх него. Вдоволь помучавшись с перекрытием через «position: absolute», и селектором «:after», я вдруг вспомнил о теге «Q», где можно указать текст перед и после этого тега (вообще-то указываются там открывающая и закрывающая кавычка, но сути-то это не меняет). Стало значительно проще. Для того, чтобы один символ затёр другой без остатка, я применяю «background: inherit» — наследуя фон из тегов выше.

Итак, один из минусов — это размер символа переноса в вашем экранном шрифте. Задаётся он в стиле (см. ниже) в параметре «margin-right» и для выбранной мной Tahoma равен 0.36em. Полный пример, работающий в FireFox таков (я выбрал «заброшенный» тег «VAR», чтобы реализовать задуманное):
<!-- Soft hyphen emulation in FireFox -->
<style type="text/css">
    body { background: white }
    var>q { quotes: "" "-"; margin-right: -0.36em }
    var { font-style: normal; background: inherit }
</style>

<var><q>оченьдлинноеслово&#8203;<var>продолжениеоченьдлинногослова</var></var>
Стоит браузеру разорвать слово в месте, где стоит пробел нулевой ширины и из-под второй половины слова появляется символ переноса. С полным вариантом всё немного сложнее — в Opera всё будет работать и так, в IE — нет. Там масса проблем — символ не будет перекрываться фоном, даже если вынести символ переноса из «Q» в текст, но можно заставить работать «shy». Для этого придётся убрать нулевой пробел, если его оставить в IE рядом с «shy», эффект будет непредвиденным.

Поэтому мы его убираем (кстати, можно попытаться вставить его через атрибут «content» селектором «var>var:before», если текст у нас в Unicode):
<!-- Soft hyphen in FireFox, Opera, IE6 -->
<style type="text/css">
    body { background: gray; font-size: 20px; font-family: Tahoma }
    var>q { quotes: "" "-"; margin-right: -0.36em }
    var { font-style: normal; background: inherit }
    * html var b { display: none }
</style>
<var><q>оченьдлинноеслово<b>&#8203;</b>&shy;<var>продолжениеоченьдлинногослова</var></var>
2 комментария
3 ноября 2007 17:18

Неуловимый тег HYPE

Разбирая заметки сайта за 2000—2003 гг. (всё думаю — конвертировать их или не нужно), наткнулся на старую заметку, где я пытался разобраться с недокументированными тегами браузеров. На тот момент актуальными были Internet Explorer и, почивший ныне, Netscape Navigator (другой браузер под тем же именем зачем-то до сих пор выпускает AOL). Оказалось, что, по меньшей мере, один из «секретных» тегов браузера от Netscape дожил до наших дней — это HYPE.

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

The hype tag is just for fun. It only effects the UNIX version which can affor to have a sound file compiled into the binary. If we have the memory, create a fake image tag to replace the <HYPE> tag and process it.
Легко убедиться, что тег присутствует, если попробовать в FireFox повесить на него любой CSS стиль. Кстати, тег таким же образом «работает» и в Опере, потому что (и это оказалось для меня большим сюрпризом) в Опере можно использовать любое сочетание букв в качестве тега. Самая старая Опера, которая у меня есть на компьютере — 8.02 прекрасно отобразила красный бордюр вокруг свежеизобретённого мной тега «REDBORDER» со стилем «background: 1px solid red».

Я думаю, что тег, возможно, не совсем бесполезен, так как Internet Explorer за тег его не считает. Возможно, таким образом можно применять CSS к какому-то блоку, незаметно для Internet Explorer или скрывать от него часть контента (применяя «display: none» на тег HYPE).
Комментировать
3 ноября 2007 15:50

Alternativa Game

На блоге «Флэш Потрошитель» увидел ссылку на любопытный проект — движок Alternativa3D (есть небольшая демострационная версия, нещадно отъедающая память).

Alternativa3D (81.40КБ)

Alternativa3D — движок для MMORPG Alternative, который сделан на Flash9. В демонстрационной версии представлен небольшой кусок ланшафта с дорогами, травой, деревьями и домом. Всё это можно вращать, менять угол обзора. Скорость очень приличная — я попробовал игру на второй домашней машине, очень слабенькой (Pentium III-1.1GHz, 512Mb, GeForce3 Ti200), ниже 25 fps не опускается. Основные характеристики движка: У создателей игры большие планы:

В одиночку или сообща игроки строят финансовые империи, делают политическую карьеру, создают криминальные группы, плетут интриги в борьбе за влияние и территорию, продают и покупают, организуют бизнес, просто работают и общаются.

Играющие имеют возможность перемещаться по виртуальному миру, взаимодействовать друг с другом: общаться, драться, обмениваться предметами, покупать и продавать их; арендовать и покупать недвижимость, развивать собственные навыки и физические данные, организовываться в группы для достижения общих целей.
Любопытно будет взглянуть.
Комментировать
2 ноября 2007 23:43

Пиксельные марки

Марка (4.74КБ) Интересный проект — пиксельные марки, собирает марки, наприсованный в пикельной технике художниками по всему миру. «Цена» на марке означает её популярность. На рисунке слева — марка известного дизайнера Sham. Правила участия очень просты — вы скачиваете один из двух шаблонов и рисуете в нём марку на одну из четырёх тем: «food», «fantasy», «sports» или «characters», выбираете каким шрифтом будет напечатана «цена» марки (один из пяти вариантов размеров) и отсылаете её на сайт.
Комментировать
2 ноября 2007 19:08

Монетизация траффика

Обычно я плохо отношусь к рекламе, она навязчива, она тратит моё время без разрешения и отвлекает от основого содержания, паразитирует на нём. Посмотрите на средний сайт центральной полосы интернета — всё мигает, при заходе на страницу ¾ экрана закрыто Flash-баннером, вокруг и посредине текста — баннеры, рекламные вставки, ссылки и прочее. В свете всеобщей монетизации (два интересных блога, где я бываю чаще всего — Димы Смирнова и Ильи Бирмана монетизированы уже несколько месяцев), всё, кажется, должно бы стать ещё хуже. Но нет, я обнаружил, что меня это явление не раздражает.

Для тех, кто не знает, монетизация, по сути — извлечение прибыли из своего сайта, часто — при помощи каких-то сервисов (той же «Sape», которую используют оба вышеупомянутых блога).

Не раздражает оно меня, думаю, по очень простой причине. Все блоги для меня делятся на две категории: «мне стоит читать» и «мне не стоит читать». В первую категорию попадают только талантливые и умные люди, такие же умные и талатливые как я или обладающие этими качествами в большей степени, пишущие на волнующие меня темы. Т.е., пока никто не обиделся, во второй категории тоже есть талантливые и умные, но если мне не интересны особенности игры на «Forex» или послеродовой синдром у курапаток, то я его не читаю.

Люди, которых я читаю, как талантливые и умные, выбирают ненавязчивые методы монетизации. «Sape» это вообще не реклама — это интимные отношения с «Яндексом», димины ссылки на сайт с фотографиями звёзд не пытаются играть с моими чувствами («такой хорошенький котёнок ест „Дрискас“», «после кружки пива „Мочаково“ они все пойдут к нему домой»), а заказные статьи, если они есть, действительно являются мнением авторов этих блогов.

Резюме — меня радует, что бóльшая часть методов монетизации органично встраивается в контент. Это либо исключительно текстовая реклама (а значит её можно гармонично встроить в дизайн сайта и она не будет оттягивать на себя всё внимание, мешая сосредоточиться на главном), либо контекстная реклама, т.е., потенциально, увеличивающая ценность материала. Баннерная реклама попадается реже и это, как правило, партнёрская реклама, т.е. баннер можно изменить под дизайн сайта.
Комментировать
2 ноября 2007 15:58

Крутой лох

Короны (0.54КБ) Корон на «Блоговаре» я набрал аж десять штук. Если знать как, это очень просто, с появлением ботов стало ещё проще — можно было просто встать в очередь и дожидаться, когда боты скинут первых. Сейчас дела обстоят значительно хуже. Вчера Ильшат Саетов обнаружил, что правила игры поменялись — боты применяют боевые заклинание не на того, кто стоит на первом месте, а на того, у кого корона.

Очень неприятная ситуация — чем дольше у тебя корона, чем дальше ты сползаешь из таблицы. Когда у тебя её перехватят, выбираться снизу, возможно, придётся очень долго. Если её перехватят. Потому что многие поняли — лучше дождаться когда у ботов «сядут батарейки» (боты тратят деньги на заклинания, деньги у ботов конечные) и потом продолжить борьбу, чем красоваться в короне, но потом пытаться набрать УНЦ. Так что в надписе на короне «Типа Как Бы Крутой Блог» ключевые слова, пока, «типа как бы».
Комментировать
2 ноября 2007 10:49

Robots.txt для роботов?

На блоге «ODP (DMOZ) неофициально» нашёл ссылку на больше забавное, чем полезное исследование на тему применения файла robots.txt.

Andrew Wooster прошёлся скриптом, написанным на Python, по известнейшему каталогу DMOZ и скачал все robots.txt сайтов, которые там зарегистрированы. Получилась достаточно большая база — 12Гб (около 4,6 миллиона доменов). Бóльшая часть сайтов (чуть больше 65%) этого файла не имеют, что ожидаемо, вот у меня, например, его тоже нет, у меня нечего запрещать к индексированию.

В остальной части встречались самые разные проблемы — это и нестандартные HTTP-коды ответа (например, 999 или 666), ошибочные mime-типы (например, text/x-perl, video/x-ms-asf или image/jpeg), файлы в других текстовых форматах (RTF, MS Word, HTML, LateX, KOffice — всё текстовые форматы), неверная кодировка (UTF-16 или, например, совсем уж экзотическая для многих французская «nf_z_62-010»), ошибочный формат комментариев (С++-комментарии или HTML), иструкции роботу на натуральных языках, файлы в формате info.txt, ошибки синтаксиса (опечатки, изменение порядка, ошибочное использование расширений), открыто указываются места расположений секретных каталогов (phpmyadmin, админка, частные данные) и так далее.

Какие выводы? В свете последних дискуссий о том, должен ли поисковик индексировать сайт без явного согласия на то веб-мастера, замечает Andrew Wooster, поисковикам придётся иметь очень нетривиальный парсер robots.txt, отпределяющий кодировки и форматы, поддерживающий все расширения и исправляющий любые ошибки. И даже в этом случае, если сторонники подобного запрета победят, ¾ интернета, если судить по кодам ответа, будет просто недоступна поисковым системам (DMOZ — достаточно хорошая выборка, это не мусорные сайты).
Комментировать
2 ноября 2007 01:35

Азбука: история букв

Пока искал шрифты, наткнулся на крайне интересный проект «Азбука» — истории о буквах. Написано увлекательно, хорошо иллюстрированно, понятно даже неподготовленному читателю. Отдельное спасибо проекту за статью о букве «ё», цитирую небольшую часть (выше читируемого текста приводится мнение Артемия Лебедева по поводу это буквы, смотрите статью):

Рассказав исторический анекдот про княгиню Дашкову, Лебедев забыл упомянуть, что княгиню поддержали ряд ведущих деятелей культуры того времени, включая Державина, который первый начал использовать букву в деловой переписке. Уже в 1795 появилось первое печатное издание, в котором встречается буква ё, — книга Ивана Дмитриева «Мои безделки». А в 1796 году окончательно популяризовал букву Карамзин, напечатав в Московской университетской типографии свою первую стихотворную книжку «Аониды». В ней с буквой ё были напечатано три слова: орёл, мотылёк, слёзы.

Зачем нужны выносные элементы? Спросите у любого шрифтовика — он ответит: выносные элементы улучшают читаемость текста, без них текст выглядел бы монотонно. Именно поэтому в раннем средневековье с появлением большого количества религиозной литературы появился и минускульный шрифт — предтеча строчный букв, который отличался от маюскульного шрифта (прописных букв) более плавными формами, большей убористостью и большим количеством выносных элементов, за которые «цеплялся» человеческий глаз, благодаря чему повышалась скорость чтения. Умляут — не выносной элемент, но функции у него те же.

Если посмотреть с художественной точки зрения, выносные элементы создают ритм, а ритм в свою очередь улучшает эстетические свойства шрифта. Это, кстати, и является одной из основных причин, почему латинский алфавит «красивей» кириллического. И по этой же причине текст набранный кириллицей называют «забором»: строчные буквы в массе своей копируют буквы прописные, а у них выносные элементы — большая редкость (Ц, Щ, Й, отчасти Ф в кириллице; Q, отчасти J в латинице).
Комментировать
1 ноября 2007 17:38

Фокусы с GIF, прозрачность и hover

Самые внимательные, наверное, заметили, что в прошлых заметках у меня на картинке использовалась эмуляция эффекта наведения на ссылку — посмотрите, если навести на картинку мышку, «ссылка», выделенная синим, на картинке подчеркнётся. И это не JavaScript.

Объяснение очень простое — картинка сделана с прозрачностью, далее при помощи CSS под неё подставлен белый фон, а при наведении (селектор «:hover») фон меняется на голубой. Такой же эффект использован на картинке с пистолетом слева (наведите мышку). Ссылка на картинке обязательна — без неё в Internet Explorer (версии ниже 7-й) фон менять не будет, «:hover» просто не сработает. Таблица стилей для этой картинки выглядит вот так:
a.gun:hover img { background: black } /* стиль при наведении мышкой */
a.gun img { margin: 0px; background: white } /* убираем поля в Opera и подкладываем белый фон */
HTML, соотвественно:
<a href="#" class="gun"><img src="gun.gif" /></a>
Если вам не ясно, почему пистолетик «стреляет» (т.е. почему изображение движется, когда наводишь мышку), то тут всё просто — прозрачная область движется (это animated GIF), на белом фоне этого не видно, когда фон меняется, создаётся эффект движущейся пули.

Ещё интересные эффекты можно получить, если использовать альфа-канал (полупрозрачность) в формате PNG, но, к сожалению, об анимации тут придётся забыть.
Комментировать
1 ноября 2007 14:41

Русификация мелкого шрифта от Димы Смирнова

Оказывается, у Димы Смирнова так же можно скачать один бесплатный маленький шрифт — «SilkScreen Cyr»,
это русификация шрифта от Google, шрифт TTF, но в Photoshop почему-то у меня не заработал, зато в блокноте — на ура. Шрифт
лучше всего использовать размером в 8 пунктов.
Комментировать
1 ноября 2007 12:48

Мелкие шрифты от Ромы Воронежского

Недавно понадобилось написать кое-что мелким шрифтом, мелким, но читаемым. Желательно, чтобы шрифт ещё был свободно распространяемым. Я вспомнил, что много лет назад Рома Воронежский выкладывал в сеть пару мелких шрифтов и что их, кажется, можно было использовать свободно. На его основном сайте следов этих шрифтов найти не удалось, но помог Яндекс — ввёл в него «Воронежский шрифты» и почти сразу нашёл то, что искал — шрифты Ромы WebSmallC и WebCondensedC и, на той же странице, несколько мелких шрифтов Артемия Лебедева, так же для свободного использования.  Помещаю ссылочку на это богатство у себя, чтобы её больше не терять и не искать.
Комментировать
1 ноября 2007 11:17

Маркетологи

Придумал шутку про маркетологов. Для тех, кто понимает, marketolog.css:
*      { text-transform: uppercase }
:after { content: '!!!!!' }
Комментировать
31 октября 2007 23:20

Сайт на мобильных устройствах: Wall4PHP

Латвийский парень Kaspars Foigts реализовал библиотеку Wall4PHP. Это реализация WALL (Wireless Abstraction Library, оригинальная версия создана Luca Passani на Java) на языке PHP. Библиотека предназначена для поддержки сайтом мобильных устройств и позволяет на специальном языке описывать вёрстку, чтобы потом показывать сайт на том языке, который поддерживается устройством (XHTML, WML, модифицированный HTML для Imode-устройств).

Профиль устройства (что именно им поддерживается) описывается на специальном XML-языке WURFL, по этим профилям WALL определяет в каком виде устройству показать сайт. На странице автора есть англоязычное описание возможностей библиотеки, языка, а так же несколько примеров работы. Библиотека не развивается с конца 2006-го года (хотя на сайте есть TODO), но, похоже, достаточно стабильна и функциональна.
Комментировать
31 октября 2007 19:40

Хакеры и кракеры

О том, кто такие «хакеры» и чем они отличаются от «кракеров» написано достаточно давно, но мне очень нравится статья ЖЖ-пользователя Димы Сокола. Ничего нового (впрочем, для многих написанное — откровение), но изложение внятное, написано простым и понятным языком.
Комментировать
31 октября 2007 18:02