tFormer.js — empower your HTML forms

Предисловие:

Вам приходилось верстать формы? Приходилось писать скрипт для валидации этих форм на клиенте? Доводилось ли использовать уже существующие плагины/надстройки для валидации форм?
Мне приходилось, но я не был на 100% удовлетворен ни от подхода решения задачи в лоб (собственный скрипт валидации для каждого проекта под его формы), ни от того, как работают существующие сторонние плагины.

Проблема:

Основными проблемами собственных скриптов и плагинов всегда были — гибкость, удобство и простота.
Большое количество data-attributes, необходимых для конфигурации скриптов (как это в Parsley.js) делают и код менее читабельным, и никогда не помнишь, как все они пишутся. Не просто…
Не все плагины хорошо подходили под желаемые HTML-формы, а постоянно писать свои скрипты под разные формы не всегда удобно и разумно.

Задача:

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

Решение:

Решение вылилось в небольшой опенсорсный плагин, который получил название tFormer.js.

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

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

Для начала определим наши задачи:
— по возможности использовать официальные сервисы определения статуса
— в случае их отсутствия можно прибегнуть к посторонним
— способ должен быть как можно проще, без излишков (всегда можно будет его потом расширить)
— чтобы прорисовка страницы не висла на время запроса, сделаем буфер

Рассмотрим 4 основных способа на примере ICQ, Jabber, Skype и MRA. Остальные можно сделать аналогично.

Данная статья — первая из цикла на тему укрощения CSS. Сегодня мы рассмотрим технологию CSS Reset.

Зачем это нужно?

Каждый браузер устанавливает свои значения стилей по умолчанию для различных HTML-элементов. С помощью CSS Reset мы можем нивелировать эту разницу для обеспечения кроссбраузерности стилей.

Например, вы используете элемент a в вашем документе. Большинство браузеров, как Internet Explorer и Firefox, добавляют ссылке синий цвет и подчёркивание. Однако представьте, что через пять лет кто-то решил создать новый браузер (назовём его UltraBrowser). Разработчикам браузера не нравился синий цвет и раздражало подчёркивание, поэтому они решили выделять ссылки красным цветом и полужирным шрифтом. Именно исходя из этого, если вы установите базовое значение стилей для элемента a, то он гарантированно будет таким, каким вы хотите его видеть, а не как предпочитают его отображать разработчики UltraBrowser.

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

А там где домены, там DNS. А какой самый простой способ сделать DNS-сервер? Поставить вездесущий BIND. Да BIND непростой, а с DLZ патчем, чтобы с MySQL дружил.

Шли годы, система работала, мощности серверов росли. А как водится, пока работает – не трогай. Так бы это все и продолжалось, если бы нагрузка не начала упираться в очередной 8-ми ядерный сервер.

В этот момент пришлось принять волевое решение и построить новую систему DNS-серверов, вместо того чтобы в очередной раз апгрейдить железо для ненасытного BIND+DLZ.

И тут закончилась сказка, и начались суровые будни администратора.

Основная цель DNS — это отображение доменных имен в IP адреса и наоборот — IP в DNS. В статье я рассмотрю работу DNS сервера BIND (Berkeley Internet Name Domain, ранее: Berkeley Internet Name Daemon), как сАмого (не побоюсь этого слова) распространенного. BIND входит в состав любого дистрибутива UNIX. Основу BIND составляет демон named, который для своей работы использует порт UDP/53 и для некоторых запросов TCP/53.

Основные понятия Domain Name System

Исторически, до появления доменной системы имен роль инструмента разрешения символьных имен в IP выполнял файл /etc/hosts, который и в настоящее время играет далеко не последнюю роль в данном деле. Но с ростом количества хостов в глобальной сети, отслеживать и обслуживать базу имен на всех хостах стало нереально затруднительно. В результате придумали DNS, представляющую собой иерархическую, распределенную систему доменных зон. Давайте рассмотрим структуру Системы Доменных Имён на иллюстрации:

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

Кроме явных причин таких, как:
1. Ошибки северной части веб-приложения, которая допускает утечку (индексация директорий).
2. Сами пользователи, публикующие в открытых источниках «секретные ссылки».
3. Системы сбора статистики, (Yandex-метрика), показа баннеров и другой внешний контент.

Причиной может являться ПО, установленное на компьютере пользователя. Одной из таких программ посвящено данное исследование. Это программа Яндекс.Бар.

HTML5 для веб-дизайнеров

1. Краткая история языка разметки
2. Модель HTML5
3. Мультимедиа
4. Формы 2.0
5. Семантика
6. HTML5 и современные условия

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

Эта история постоянно повторяется. Как только определенный шаблон или задача становятся достаточно популярными, они почти непременно в конце концов упрощаются в техническом плане и делаются более доступными. Именно так в CSS3 появилось много функций для создания простых анимаций, для которых прежде требовался JavaScript.

Говоря о формах, тут возможности CSS довольно ограничены. И теперь на сцену снова выходит HTML5. Следуя тому же принципу, он вводит новые функции, которые на самом деле вовсе не новые, но сделаны проще и удобнее.

Нетрудно догадаться, что прежде они были частью отдельной спецификации WHATWG под названием Web Forms 2.0.

HTML5 для веб-дизайнеров

1. Краткая история языка разметки
2. Модель HTML5
3. Мультимедиа
4. Формы 2.0
5. Семантика
6. HTML5 и современные условия

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

Вместе с тем, она была полным провалом. Никто ей не пользовался.

То же самое можно сказать и про XHTML 2. W3C только лишний раз доказал то, чему нас научил урок послереволюционной Франции: изменить привычки людей по приказу очень-очень трудно.

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

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

«Нужно определить, какими устройствами могут пользоваться ваши посетители, проработать и создать для этих устройств представление вашего сайта, определить устройство посредством проверки заголовков браузеров, и отправить наиболее подходящее представление.»

Почему это глупо

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



Это скриншот из презентации «Beyond the mobile web by yiibu» (очень рекомендую).

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

Как сделать один сайт для всех устройств

В unity очень удобные линзы, в ВКонтакте много видео, а flash в новой ubuntu превращает все фильмы в аватар. Поэтому я сделал линзу для поиска видео в ВКонтакте, открывающую их в totem.

phpBBex — это расширенная версия phpBB 3, которая была анонсирована ранее на Хабре. Проект постепенно развивается, появляются новые полезные возможности. Сегодня у нас появился официальный форум и вышла новая версия нашего форка.

Как известно, код phpBB 3 был заложен в далёком 2002 году. Здесь всё по-старому. Нет никаких сложных абстракций, код простой и линейный. Для небольших проектов это не проблема. Но движок оброс функциональностью, и огромную массу кода сейчас не всегда просто изменить для достижения необходимого результата. Игнорирование современных паттернов мешает дальнейшему развитию. Понятно, что разработчикам phpBB важно следить за совместимостью кода со старыми модами, поэтому никаких серьёзных архитектурных улучшений ожидать не приходится. Выходом из ситуации должен быть phpBB 4 на основе Symfony 2, но за его разработку ещё не взялись. Очевидно, переписать такого монстра не так просто, так что в ближайшее время чуда не будет.

Поскольку в phpBBex планируется множество изменений, связанных с переводом интерфейса на AJAX, логичным было бы реализовать удобный механизм для добавления новых обработчиков AJAX запросов. Стандартным способом для phpBB сегодня является создание php файла в корне со своей логикой для каждой модификации. Это не дело. Мы попробовали добавить нечто вроде контроллеров. Обработчики сгруппированы в «классы-контроллеры», имеется единая точка входа, которая создаёт экземпляр необходимого «контроллера» и вызывает соответствующий обработчик. На основе этого мы создали систему анонимной оценки комментариев (почти как на Хабре).

Продолжая свои «css-раскопки» возникла новая идея, разобрать по косточкам ещё одну актуальную тему, которая касается равномерного выравнивания блоков по ширине. В принципе мои доскональные исследования я уже запостил у себя в блоге, но так как прошлая моя работа очень понравились Хабра-сообществу, то я решил сделать здесь небольшой краткий обзорчик этой статьи, чтобы ни одна хабра-душа не пропустили её наверняка. Так что, как говорил Гагарин: «Поехали».

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

После закрытия Гуглом своих API для перевода проблема поиска онлайн-сервис для машинного перевода стала особенно актуальной.
В Интернете много сервисов перевода с громкими именами: Промт, Прагма и пр. Нет никакой проблемы в PHP смоделировать обращения к страницам сервисов и получить результаты перевода. Но есть проблема: почти все сервисы в ответ на простой GET или POST запрос отдают не результат перевода, а целиком страницу во всей красе, начиная с DTD. Как говорят у нас на Украине, “дурных нэма”.
После анализа было выяснено, что есть только два сервиса, которые отдают в ответ на запрос только результат перевода: Яндекс и Bing от Microsoft.

Аннотация

В статье я попробую рассказать о том, как на базе Twitter Bootstrap можно очень легко реализовать приятный пользовательский интерфейс небольшого (одностраничного) web-приложения, владея лишь базовыми знаниями html. Сразу предупреждаю, специалистам будет не интересно, речь пойдет о базовом стандартном функционале.

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

Февраль 2008: началась разработка Drupal 7.

Октябрь 2008: 285 незакрытых багов для Drupal 7.

Март 2009: Пришёл специалист по переделке интерфейса Drupal 7 (D7UX).

Июнь 2009: 3120 незакрытых багов (13 763 в общей сложности).

Сентябрь 2009: Первоначально предполагалось заморозить код на этом этапе, но решили разработать (с нуля) ещё 10 новых фич и включить их в состав Drupal 7.

Предыстория: в преддверии 23 февраля вызвался для класса своего старшего сына (3 класс) прочитать коротенькую «страшилку» про интернет и опасности, таящиеся в нем.

Собственно, презентация (читал около часа с вопросам и живым участием детей) лежит здесь http://www.anticisco.ru/pubs/Internet_IB_v1.pdf

Однажды мой друг, молодой предприниматель Котенков Н.А., полностью оставил свой бизнес на доверительное управление партнёров, чтобы отвлечься, посмотреть мир и освободить голову для новых идей. В итоге это привело к созданию сервиса запланированных посланий под названием DecWill.

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

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

Навеяно вот этим.

Я решил вспомнить некоторые особенности PHP, связанные с производительностью.

Отмечу, что включил в свой небольшой список лишь то, что обычно вызывает удивление у junior developers, с которыми мне приходилось работать.
О банальных вещах, вроде «одинарные кавычки вместо двойных», думаю, знают все, поэтому постараюсь кого-нибудь удивить.

Результаты и выводы, сделаны на основании нескольких версий PHP, который крутятся на знакомых мне серверах, а именно 5.2.6 из Debian Lenny, 5.3.2 из Ubuntu, и 5.2.14 из dotdeb. Возможно, на других платформах, есть отличия.