CSS Refresher

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

От переводчика

Приветствую всех, меня зовут Максим Иванов, и сегодня я подготовил для вас перевод заметок разработчика из Сан-Франциско Васанта Кришнамурти (Vasanth Krishnamoorthy) «CSS Refresher». Web-программирование одна из самых быстро развивающихся отраслей в наше время. Казалось бы, возьми какой-нибудь видеокурс на tuts+ и освой html-верстку, однако, как говорил разработчик Opera Software Вадим Макеев, выступая на конференции CodeFest, они все равно это делают плохо. Но давайте посмотрим, может мы итак все это знаем.

Содержание

1. Позиционирование (position)
2. Отображение элемента в документе (display)
3. Плавающие элементы (float)
4. CSS селекторы
5. Эффективные селекторы
6. Переотрисовка и перерасчет
7. CSS3 свойства
8. CSS3 медиа-запросы
9. Адаптивный web-дизайн
10. CSS3 переходы
11. CSS3 анимации
12. Масштабируемая векторная графика (SVG)
13. CSS спрайты
14. Вертикальное выравнивание
15. Известные проблемы

Уже 3 с лишним года занимаюсь дизайном и версткой почтовых рассылок, которые ориентированы на англоязычных пользователей. За время работы перелопатили огромную кучу информации, перепробовали много вариантов верстки, набили достаточное количество шишек. Были найдены и исправлены типичные баги, которые в той или иной мере повторялись во всех почтовых клиентах. Также нашлись проблемы с некоторыми CSS свойствами — различные почтовые клиенты интерпретировали их по разному. Каждое письмо тестировалось на самых популярных почтовых клиентах: Gmail, Outlook, Yahoo, Android, iOS, MozillaThunderbird, Microsoft Outlook, The Bat. Рассылки ходят на сотни миллионов пользователей и приносят очень хорошие результаты. Итак, приступим к изучению.

При создании больших сайтов, как правило информационных порталов, дизайнеры часто сталкиваются с проблемой организации главного меню. Список разделов сайта, не умещается в разумном горизонтальном меню из 5-7 пунктов, а, как правило, охватывает все или почти все стороны жизни общества.
Последнее время стал встречаться следующий подход…

Даниель Роуз (Daniel E. Rose) работавший в AltaVista и Yahoo, исследовал цели пользователей которые побуждают их искать в поисковых системах. Совместно с Дэнни Левинсоном (Danny Levinson) в тезисах Understanding User Goals in Web Search он описал процесс исследования и результаты.

Для начала на основе лога поисковых запросов AltaVista была разработана классификация целей пользователей. Все запросы (за исключением специфичных) должны относиться в какую-либо из этих категорий:



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

Под катом краткое описание дальнейшей работы Роуза и Левинсона. Полная версия их тезисов и другие статьи по поведению людей и поиску есть у меня на сайте.

Давно я че-то не заходил на dostavka.ru, а тут вот заглянул. А там год назад сайт переделали. Получилось некий гибрид социальной сети с интернет-магазином. Но сдается мне, что зря это. И вот почему.

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



Биржа ссылок – сервис, который позволяет покупать и продавать ссылки (трафик).
Кто-то может назвать это «оплаченной рекламой» и он окажется прав, так как в таком определении и заключается главная суть сервиса.

Пользуясь биржами ссылок, вы освобождаетесь от очень важной части работы – вам не нужно самостоятельно искать рекламодателей (в случае, если у вас есть свой сайт, и вы хотите заработать на размещении на нем рекламных ссылок) или рекламные площадки (если у вас есть какой-либо проект, требующий продвижения в Интернете).

Существует два основных типа ссылочных бирж.
В первом типе оплата происходит за количество уникальных кликов (с уникального IP раз в 24 часа). Цена клика в данном случае – это разность между ценой рекламодателя и комиссией биржи за предоставление услуг. Как показывает практика, в среднем за один клик она составляет около 50 копеек (цены колеблются в основном от 0,1 до 1,2 рубля).
Во втором типе оплата происходит за время размещения рекламы на вашем ресурсе.

А теперь попробуем рассмотреть некоторые ссылочные биржи более подробно:

Все мы видим, что нынешнее поколение детишек растёт в интернете. В возрасте шести лет они открывают аккаунты в социальных сетях, активно пользуются фликером, твиттером, ютубом, ЖЖ и чувствуют себя как рыба в воде, проводя сутки напролёт в виртуальном пространстве. Прошлое поколение (которым сейчас примерно по 28) выросло на компьютерных видеоиграх, предыдущее — на телевидении. Кажется, вот уже не первый десяток лет технологии определяют, как будет выглядеть человечество. Вопрос в том, чем конкретно подрастающее сейчас поколение Google выделяется из предыдущих, насколько оно чужеродно? Именно этой проблеме было посвящено подробное исследование тинейджеров, результаты которого только что опубликовала Британская библиотека (via globeandmail.com).

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

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

Сейчас системы рекомендаций выходят на новый уровень своего развития, внедряясь уже в человеческие отношения. Вчера в виде бета-версии открылась социальная сеть Redux, участники которой могут получать примерно такие сообщения: «Обнаружен пользователь Tyler. С вероятностью 79% вы захотите установить с ним контакт. Вот его досье и список интересов».

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

Введение

Алгоритмы нечеткого поиска (также известного как поиск по сходству или fuzzy string search) являются основой систем проверки орфографии и полноценных поисковых систем вроде Google или Yandex. Например, такие алгоритмы используются для функций наподобие «Возможно вы имели в виду …» в тех же поисковых системах.

В этой обзорной статье я рассмотрю следующие понятия, методы и алгоритмы:

• Расстояние Левенштейна
• Расстояние Дамерау-Левенштейна
• Алгоритм Bitap с модификациями от Wu и Manber
• Алгоритм расширения выборки
• Метод N-грамм
• Хеширование по сигнатуре
• BK-деревья

А также проведу сравнительное тестирование качества и производительности алгоритмов.

Статья является расширенным сборником CSS-хаков в сравнении с аналогичной статьей.
Под хаком подразумевается метод, позволяющий воспринимать CSS только определенному браузеру.
Хаки могут использоваться не только для исправления багов в верстке, но и в случае использования определенных особенностей браузера для ускорения рендеринга web-страницы в нём (к примеру CSS3-свойства)

Транспортная задача (классическая) — задача об оптимальном плане перевозок товара со складов в пункты потребления на транспортных средствах.

Для классической транспортной задачи выделяют два типа задач: критерий стоимости (достижение минимума затрат на перевозку) или расстояний и критерий времени (затрачивается минимум времени на перевозку).

Под катом очень-очень много текста, т.к. рассказывается один из вариантов решения данной задачи «в картинках» для тех, кто мало знаком с графами. Листинг прилагается.

Задался вопросом о том, как себе облегчить жизнь при работе с Mantis. Так повелось, что исторически работа проходит именно с ним, поэтому далее рецепт для коллег по цеху.

Процесс установки займет около получаса при внимательном выполнении действий.

Установка проходила на:

Mantis 1.1.6
Windows XP

Для тех кто не знаком с продуктом поясню: сам Mantis работает в стреде *nix, а кропалка работает в среде windows. В статье объясняется, как связать два полезных инструмента воедино для продуктивной работы.

Если вы хотите научиться писать многопоточные приложения на PHP или здорово упростить себе жизнь — статья для вас.

Раньше для этих целей я пользовался либо запуском несколько копий скрипта, либо же использовал pcntl на более низком уровне, чем хотелось бы. Это, а от части и Java-идеология работы с потоками, побудили меня к написанию пакета phpThread.

Итак, мы выбрали браузер вместо отдельно стоящего толстого клиента. Пользователь очень хочет вводить данные. Однако, обычные формы плохие. Потому, что:

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

Так как я сижу без работы и становится скучно, решил безвозмездно посодействовать. Что получилось, смотрите под ниже.

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

Простой цифровой термометр с подключением через COM-порт.

В этой статье я рассмотрю метод создания блоков с одноцветным полупрозрачным фоном.
Например, таких:


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

Не секрет, что при составлении бизнес плана, предприниматели уходят в дебри экономических расчетов и описания функциональности частенько теряя главное.
Один из ведущих венчурных фондов Силиконовой Долины в свое время рекомендовал предпринимателям пройти простенький тест. Управляющие партнеры из Секвои считают, что проект достоин рассмотрения, если его идею можно описать на обратной стороны визитной карточки, так, чтобы идея была привлекательна для потенциальных потребителей, инвесторов, партнеров и сотрудников компании. Такое описание должно быть коротким, полным и «sexy» (подразумевается, что оно должно возбудить всех потенциальных участников).