Представьте себе абстрактный разговор абстрактного заказчика с абстрактным верстальщиком.

— У тебя бага в менюшке, все наверх съехало, — говорит заказчик.
— Посмотрел во всех браузерах, нету! Ты в каком смотришь? — говорит верстальщик.
— В фаерфоксе.
— Нормально все там, — говорит верстальщик, просмотрев сайт во всех версиях фаерфокса.
— Осталось бага. Если это важно, то я с мака.

Задача: менять горизонтальное положение блочных элементов по линейной зависимости при изменении размера окна браузера.
Решение: термин «пропорциональность» подразумевает линейную зависимость двух параметров. Вспоминаем школьный курс геометрии: линейная зависимость — это прямая, её уравнение выглядит следующим образом: Y=aX+b. Для построения уравнения прямой необходимо и достаточно знать координаты двух точек, принадлежащих этой прямой. Если принять за Y горизонтальное положение блока, а за X — ширину окна, то задача сводится к определению параметров a и b.

Пост тем, кто хочет немножко отвлечься от работы и поразвлекаться с умом.

Сегодня наткнулся на интересный проект: contextfree

Все помнят курс теории компиляторов с университета? contextfree — генератор изображений на основе контекстно-свободных грамматик. Терминалами выступают простые графические примитивы (CIRCLE, SQUARE, TRIANGLE и т.д.). Нетерминалы задаем мы. Правила вывода могут включать в себя так называемые преобразования (повернуть, отразить, сдвинуть, поменять цвет). На основе этой простой модели можно получать очень интересные вещи… буквально несколькими строчками кода.

Начнем с простого примера:
startshape JustASquare //Начальный символ грамматики

background { b -1 } //Здесь мы задаем фон. b -1 - означает преобразование
//По умолчанию фон белый (brightness = 1), мы изменяем brightness до 0.

rule JustASquare { // Здесь мы задаем простое правило.
SQUARE { b 1 r 45 } // Белый квадрат, повернутый на 45 градусов.
}



Немножко о режиме выделения для тех, кому лень проходить vimtutor, или тех, кто ещё сомневается в том, что Vim это действительно удобно.

Режим выделения в Vim это одна из тех грандиозных вещей (наряду с *, = и text-objects), которые делают этот редактор особенно удобным. Как вы уже знаете, в Vim есть режим Visual, в котором можно выделять текст, чтобы потом с выделением что-нибудь делать, например, засунуть его в регистр, отформатировать, заменить в нем что-нибудь регулярным выражением или ещё что-нибудь. Чтобы войти в этот режим, нужно нажать v, а потом перемещать курсор обычными командами, передвигающими курсор в обычном режиме, расширяя таким образом область выделения.

Режимов выделения есть несколько: обычный, построчный и блочный. Обычный включается командой v и выделяет текст от символа до символа. Построчный включается командой V (Shift+v) и выделяет строки целиком. Блочный включается командой Ctrl+V (под Windows может включаться Ctrl+Q, если Ctrl+V занято под вставку текста из клипборда) выделяет вертикальный блок текста (не захватывает начала и концы строк в середине выделения, как это происходит в обычном режиме).

«Для меня vi это Дзен.
Использование vi — это практика дзена.
Каждая команда является коаном.
Полный смысла для пользователя,
Бессмысленный для непосвященного.
Вы познаете истину каждый раз когда вы его используете.»
--reddy@lion.austin.
на сколько хорошо ты знаешь язык vim?
посмотри на клавиатуру,
можешь ли ты сказать что выполняет каждая буква?
как много ты знаешь?
как много используешь?

Эта статья покажет как настроить PHPIDS. PHPIDS (PHP-Intrusion Detection System) — это легко используемая, хорошо структурированная, быстрая прослойка для анализа безопасности ваших приложений. IDS — не является прослойкой для анализа данных, введенных пользователем, он только распознает, когда пытаются атаковать ваш сайт. на основе набора проверенных и оттестированных правил каждой атаке сопоставлен рейтинг ее опасности. Это позволит легко сохранять статистику по атакам или отсылать уведомления для команды разработчиков.

Передо мною встала задача — «объединить» несколько типов объектов с разными свойствами в одной таблице для «глобального» поиска. Я перепробовал несколько решений такой задачи. Возможно, вы предложите что-то новое, чего я не смог разглядеть в потенциале SQL.

Рассмотрим задачу более конкретно:

Все люди, вовлеченные в проектирование различных БД, думаю, нередко задаются вопросом о нужной структуре. На данный момент, есть два варианта хранения данных, каждый из которых, в свою очередь, имеет ряд своих недостатков.

1. Объединенное хранение

Например, есть таблица типов объектов (ObjectsTypes), таблица самих объектов (Objects) и их свойств (ObjectsFields). По желанию, можно хранить еще и типы полей-свойств, это не принципиально.
Связи между таблицами определены однозначно (объект имеет один тип (typeID) и ряд свойств, связанных с родительским объектом полем objectID), между объектами связь осуществляется и с помощью древовидной структуры (родитель ← ребенок) и путем заведения отдельной таблицы (ObjectsRelations) для сетевой структуры, в которой дочерний элемент может иметь несколько родительских.

2. Индивидуальное хранение

Если представлять эту реализацию на примере, то для хранения блогов нужна таблица Blogs с полями, относящимися к нему, таблица BlogsTopics, хранящая посты и их свойства, таблица BlogsVotes, содержащая все пользовательские голоса и т.д. Можно до бесконечности развивать этот пример — смысл такого хранения в том, что для каждого типа данных создается своя таблица (если нужно, то несколько).

Я считаю, что для индивидуальных решений, например, для системы Хабры, идеально подошел бы второй вариант, а первый можно использовать в коммерческих решениях (как, собственно, многие и делают).
Хотелось бы услышать неозвученные мной доводы в пользу каждого из методов.

Примечание: ниже расположен перевод статьи «Serving JavaScript Fast», написанной года два назад, но нисколько не потерявшей своей актуальности. Автор предлагает достаточно большой комплекс мер для ускорения загрузки и работы CSS/JS-файлов. Ссылки и частичные переводы данной статьи достаточно широко цитируются в Рунете, однако, полностью она еще нигде не появлялась, а полезных советов в ней довольно много. Мои комментарии далее курсивом.

Следующее поколение веб-приложений будет использовать весьма «тяжелые» JavaScript- и CSS-framework'и. Мы собираемся продемонстрировать, как увеличить скорость взаимодействия таких приложений и ускорить их работу.

Все эти так называемые «Веб 2.0» приложения, их глубокое взаимодействие с содержанием страницы и самим пользователем сильно увеличили сложность использования CSS и JavaScript. Для того чтобы быть уверенными в небольшом размере приложений, нам нужно оптимизировать как размер, так и саму природу всех файлов, которые нужны для нормальной работы нашей страницы. Мы должны быть уверены, что добились оптимума удобства использования сайта для пользователей. На практике это означает, что нам нужно добиться максимального уменьшения размера страницы и ускорения ее работы, при этом предотвращая загрузку ненужных ресурсов, которые не изменились с момента последнего обращения.

читать дальше на webo.in →

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

(картинка Кликабельна)

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

Ну тогда предлагаю под другим углом взглянуть на проблему защиты Web-форм.

Я не являюсь разработчиком данного сервиса, просто мне очень понравилась идея и исполнение. Захотелось поделится. И попиарить =)


«У людей с IQ выше среднего часто бывает так, что скапливается множество прочитанных книг. Выкинуть их жалко, а читать второй или третий раз уже не хочется. Мы предлагаем менять такие книжки.»
Да, BookRiver действительно предлагает обменять прочитанную книгу на другую, интересную вам. Ну или просто подарить её.

Не так давно на Хабре был опубликован сей труд: «Еще раз о трекбаре», в котором описывается простой скрипт для создания таких вот ползунков:


Благодаря откликам пользователей возможности первой версии скрипта были существенно расширены. Она выросла до v3.0, с одновременным обновлением статьи, описывающей новый функционал. Однако, некоторые изменения откладывались «на потом», т.к. требовали более серьезного вмешательства в код. И вот долгожданное «потом» настало и вышла четвертая версия JS-TrackBar.

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

Проблема недостаточной умственной работоспособности и утомления, как выяснилось, заботит очень многих. На «Хабре» нашлись граждане, которые, кто в шутку, кто всерьез советовали в комментариях амфетамины, прозак, ноотропил, гинкго, винпоцетин.

Уровень невежества некоторых «советчиков» зашкаливает. В этой заметке я расскажу о том, что не надо делать. О том, что надо делать, расскажу в следующей.

Я не сомневался, что моя акция с раздачей иконок будет иметь успех. Учитывая, что в данном случае «халява» не благоукраденная, как варез, или что-то в этом роде. Авторские иконки, каждая из которых — моё метафорическое видение блога-участника акции, его темы и характера.

Итак, первые десять участников уже получили иконки, и осветили акцию в своих блогах. Я решил составить в этом посте минигалерею, со ссылками на конкретные применения (разместить успели не все, но это — дело времени).

1. Подкастер и радиогик Росновский, получил «сплэш-айкон» с плюющимся весёлым динамиком:

2. Еретик, у которого «по пять страниц» обо всём читабельном на свете обрёл архивную арэсэс-книгу:

3. ИКЕА-блог иконку не получил… В традициях компании ему достались составляющие, для самостоятельного монтирования:

«Чтобы стать экспертом в практической или научной области, нужны огромный труд и долгое время. Если человек добросовестно трудится каждый час рабочего дня, когда-нибудь он проснется одним из самых компетенткых специалистов своего поколения.»
Ульям Джеймс

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

Но ведь программы пишут люди, такие же, как мы с вами. Одни становятся выдающимися программистами и достигают больших успехов, другие же забрасывают профессию. Перефразируя классика, можно сказать: «покажи мне свой код, и я скажу, кто ты». Исследования показывают, что лучшие программисты создают программы в 10 раз быстрее, чем их менее квалифицированные коллеги. Время, уходящее на отладку кода, а также объем и быстродействие итоговой программы, уровень ошибок и число обнаруженных ошибок также различаются примерно в 10 раз.

В этой статье попытаемся ответить на вопрос, какими же качествами должен обладать человек для того, чтобы писать совершенный код.

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

Со страницы проекта на Google Code скачиваем архив.

В архиве будет папка blueprint/ там и содержатся основные файлы фреймворка, их и подключаем к странице:

<link rel="stylesheet" href="css/blueprint/screen.css" type="text/css" media="screen, projection">
<link rel="stylesheet" href="css/blueprint/print.css" type="text/css" media="print"> 
<!--[if IE]><link rel="stylesheet" href="css/blueprint/ie.css" type="text/css" media="screen, projection"><![endif]-->

Существует много разных способов css разметки. Некоторые базируются на абсолютном позиционировании, другие используют float'ы. Первый метод плохо поддерживает «резиновость» макета, тогда как второй это неплохой способ разметки.

Но, как и многие мощные инструменты, float'ы имеют свои изъяны. Для начала, верстка на основе float'ов не такая простая к пониманию, а также float'ы есть источником многих багов (в основном в ИЕ), что делает их не идеальным вариантом в погоне за кроссбраузерностью.

Итак, речь далее пойдет о

В этой статье я расскажу вам как сделать RSS иконку любого цвета, используя всего одну картинку.

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