Улучшение user experience и повышение юзабилити сервиса posterxxl.ru привело к росту чиcтой прибыли на 133%.


Для большого количества отечественных e-commerce сайтов и интернет-магазинов рост прибыли возможен без дополнительных затрат на рекламу и продвижение, за счёт улучшения пользовательских качеств сайта. О том, как это было сделано на примере сервиса posterxxl.ru вы узнаете из этой статьи.

Вольно-сокращенный перевод статьи 15 Time Saving CSS Tools You Should Be Aware Of
Под катом текст, графика, ссылки

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

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

Наткнулся вчера на этот инструмент и не смог пройти мимо, провел ночь за написанием тестов, а теперь хочу поделиться находкой. QUnit — это библиотека от разработчиков jQuery, позволяющая писать unit-тесты для кода на javascript. Удобна в использовании, ничего лишнего, осваивается за 20 минут, выгода от применения — колоссальная.

Самым нетерпеливым сразу ссылки:
Официальная документация на сайте jquery: docs.jquery.com/QUnit
Реальные примеры тестов (для модулей jquery): view.jquery.com/trunk/jquery/test/unit
Руководство для начинающих (англ): www.swift-lizard.com/2009/11/24/test-driven-development-with-jquery-qunit
Система распределенного тестирования (гениально и просто): testswarm.com

Под катом информация о преимуществах юнит-тестирования применительно к js и разбор возможностей библиотеки на примерах.

Встречаем новую версию (2.4) открытого векторного редактора SVG-edit.



Это действительно быстрый, основанный на веб-технологиях, векторный редактор, использующий только JS, HTML, CSS и SVG.

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

К чему слова, пробуем!

Вступительное слово
Изначально я просто хотел сделать перевод статьи Бернарда Мак Грейна «The Zen TV Experiment», но в процессе я понял что текст, мягко говоря, нуждается в адаптации. В результате перевод соответствует оригиналу процентов на сорок.

В первой половине статьи делается попытка осознать процесс просмотра телевидения, а во второй – как именно сказывается массовое участие людей в этом ТВ-эксперименте.

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

В общем, на этот раз я советую кофе, вас ждёт 10-15 минут довольно увлекательного чтения.

Решил сделать вольно-раздолбайский перевод статьи о SVG с ALA. Это перевод первой части, в ближайшее время постараюсь перевести вторую.

Масштабируемая векторная графика (SVG) состоит из кругов, прямоугольников и путей, представленных в XML и объединенных в изображения на веб-страницах. Вы можете применять сплошную заливку,  градиенты и некоторые фильтры  SVG — не все браузеры поддерживают все типы фильтров. Вы можете включать текст, изображения и можете копировать ваши SVG столько, сколько хотите. Чаще всего SVG используется в графических программах, для создания диаграмм, иллюстраций, анимаций.  Однако, ничто не мешает нам использовать SVG для дизайна сайтов —это дает нам удивительно универсальные возможности в веб-дизайне, занятные в использовании. В этой вводной статье я рассмотрю некоторые важные моменты в работе с SVG, включая поддержку в браузерах. Во второй части мы рассмотрим, как найти и адаптировать SVG, которые вы можете найти в Сети, или как создать SVG-изображения самостоятельно и добавить их на вашу страницу.

Всем хороша компания Actio, вот только в офисе очень холодно. Весь январь мы замерзали, но не сдавались и продолжали работу. И вот — свершилось: 28 января мы выложили для скачивания (требует регистрации) новую версию редактора интерактивного видео iVideo Editor 2.0. Пока в режиме открытого бета-тестирования.

Среди обновлений – новый интерфейс, расширенная библиотека виджетов и многочисленные возможности их кастомизации, плюс — несколько интересных мелочей вроде замены курсора мыши на картинку. Еще одной приятной новостью стало появление web-редактора, в дополнение к desktop-версии.

Сообщения о выловленных багах с горячей благодарностью будут приняты по адресу support@actio.tv.

Вот так он выглядит, наш красавец:



О том, что такое интерактивное видео — в двух словах под катом.

До знакомства с CMS ModX планировалась статья сравнения этих двух систем, особенно после появления темы «Сравнение Drupal, MODx (и других систем) в рабочем проекте» на drupal.ru где предлагалось соревнования что выяснить какая система лучше.
После небольшого знакомства с МодХ все вопросы отпадают сами собой и ни о каком сравнении не может быть и речи.

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

Зато МодХ отлично делает сайты визитки, имеет свой менеджер загрузки файлов, имеет встроенный редактор TinyMCE, многоязычный интерфейс администратора, понятный мастер установки и много чего другого. И в тоже время делать сайты визитки на Друпале немного неправильно, сам факт выделения 64Мб оперативной памяти для сайта визитки на 20 страниц и хостинг для этого «проекта» может вызвать истерический смех у многих веб-разработчиков.

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

     Я иногда сталкивался с тем, когда web-программист не знал CSS или, скорее, не хотел заниматься облагораживанием своего HTML, который являлся результатом работы разрабатываемого им скрипта. Это натолкнуло меня на мысль, что ему (программисту) не помешало бы иметь при себе некоторое средство для создания «красивых» страниц. Средство должно было бы включать в себя некоторый CSS, возможно, картинки, и подключаться к любому HTML (очевидно, созданному по некоторым определённым правилам). При этом смена CSS (и картинок) на альтернативные не должна была бы приводить к семантически некорректному отображению.
     Вышеобозначенные требования очень похожи на требования к составлению скина для какой-либо системы (в частности, CMS). Но, в отличие от скина, который заточен под конкретный HTML, в нашем случае хотелось бы максимально упростить правила написания HTML, чтобы разработчикам не нужно было держать в голове много сложных правил.
     Таким образом, оговаривая некоторые (небольшие) ограничения на HTML, мы с одной стороны гарантируем программисту, что его код, генерируемый с учётом этих правил, будет корректно оформлен любым сделанным для этих целей CSS, а с другой стороны, оговариваем шаблон изготовления самих этих CSS.

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

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

Успех состоит из пути от одной ошибки к другой без потери энтузиазма.
Уинстон Черчиль

Каждый знает, что такое стартап. Разве нет?
Я бы предложим новое объяснение тому, почему появляются стартапы: стартап – это организация, созданная для поиска повторяемой (в англ.оригинале «repeatable» – в значении «не одноразовая модель», а НЕ «бизнес-модель, которую можно повторить») и масштабируемой бизнес-модели.

Бизнес-модель

Хорошо, а что такое бизнес-модель?
Бизнес-модель описывает, каким образом ваша компания создает, достигает и завоевывает ресурсы.
Простым языком, бизнес-модель описывает, как ваша компания зарабатывает деньги (в вашей системе координат это могут быть успех, новые пользователи, прирост трафика и т.п.)
Представьте, что бизнес-модель – это диаграмма, на которой показаны все связи между различными частями вашей организации. Эта диаграмма показывает и то, как ваша продукция попадает к покупателям и как оплата за эти продукты попадает к вам. Также она демонстрирует структуру затрат, как каждый отдел компании взаимодействует с другими, как ваша компания интегрирована в рынок и взаимодействует с партнерами. Слова словами – проще отобразить на схеме.

Схема бизнес-модели

Много людей пытались понять, как лучше отобразить диаграмму или схему бизнес-модели. Мои студенты занимались этим годами, но работа Александра Остерволдера (Alexander Osterwalder) это лучшее, что я увидел за последние десять лет. Его диаграмма – это универсальный образец бизнес-модели. Ваша собственная бизнес-модель будет иметь свойственные только ей нюансы.

Викторина для тех, кто любит JavaScript больше ECMAScript. Главный приз: пирожок на полке.

Update: Пояснение. Для тех кто совсем не в теме. ECMAScript — это стандарт языка, на котором основаны реализации JavaScript в современных браузерах. Именно этот стандарт определяет поведение программ в этой статье. JavaScript является «надстройкой» над ECMAScript.

Пояснение номер 2. Глюки IE не имеют прямого отношения к викторине поскольку это ошибки (ну или «особенности») реализации стандартов.

Обычно я проверяю английскую грамматику, вбивая в Google куски фраз, и смотрю, что получится.
Если найдено много вариантов, то фраза правильная, если не очень много — то неправильная.



Вот, написал сервис, который отсылает запросы в Google, а сам подсвечивает, «правильно», или «неправильно» написаны куски предложения, и местами даже подсказывает — какое слово можно поставить на то, или иное место в предложении.
Еще он показывает в каком именно контексте найдено слово.

Замечательно то, что ему все равно, какой язык вы проверяете.

Привет всем! Очень странно, что я не нашел на Хабре ничего такого, про что расскажу вам далее…
Это мой первый пост, а потому попрошу сильно не ругать =)

Я думаю, кто-то из вас рано или поздно сталкивался с задачей сделать для своего сайта уникальный дизайн, но, увы, это не так просто осуществить, как хотелось бы. Но с помощью DIVINE всё становиться гараздо проще. Дизайнерам теперь не нужно владеть HTML, CSS и понятием о том, как устроены темы для WordPress

Многие задают мне один и тот же вопрос:
«Как дебажить этот $%*!%$! JavaScript?».

Так вот, во-первых JavaScript — не $%*!%$! А как я его дебажу — сейчас расскажу.

(Примечание: наверное эта статья больше для новичков. Так что не судите строго)

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

CMS Drupal часто ругают за однообразность и узнаваемость дизайнов, которые используются на Друпал-сайтах. То что за данным сайтом стоит Друпал можно определить не только URL-адресам специфического вида, узнаваемым путям к папкам модулей и главной странице в виде списка последних опубликованных документов, но и по стандартной двух-трехколоночной структуре сайта, наличии стандартных форм авторизации и поиска, облаков тегов, списков новых документов и других часто используемых блоков.

Однако все эти упреки не оправданы, к Друпалу, при должном умении, можно прикрутить дизайн и верстку любой сложности. До неузнаваемости можно «темизировать», то есть изменить внешний вид, любой html-код, создаваемый Друпалом: все стандартные формы, блоки, документы и списки.

В ноябрьском номере журнала PC Magazine/RE опубликована моя статья о «темизации» Друпала, в ней рассказано о трех этапах темизации, которые покрывают собой практически 100% задач, связанных с изменением внешнего вида сайта:

• разработка общего шаблона для всех страниц сайта и «кастомных» шаблонов для избранных страниц;
• разработка различных шаблонов для разных типов документов и списков;
• изменение внешнего вида форм (поиск, авторизация и любые другие стандартные и создаваемые внешними модулями формы).

Кроме того, в последнем разделе рассказано об основах Forms API Друпала.

Много дней назад на Хабре появился текст 10 полезных выводов и принципов юзабилити и я написал на него отклик с подробным разбором ошибок и искажений. Вчера история повторилась – появился текст Design & Usability. Введение в предмет, основанный на еще одной статье из Smashing Magazine.

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

Сразу скажу, что все претензии направлены в сторону автора оригинальной статьи на SM, а не на пользователя Avart. Линчеваться тоже будет только часть, взятая с SM.

Под катом будет подробный разбор каждого пункта.

Доброго времени суток, %username%.
Довольно давно не обращался к тебе по-имени, но, проснувшись этим приятным и по-зимнему снежным осенним утром, решил снова донести до тебя информацию о разрабатываемой системе управления сайтами cogear.
Итак, чтобы у тебя была информация к размышлению, рекомендую ознакомиться с топиками анонса и релиза движка.
Что изменилось с того времени? Именно об этом мы сегодня поговорим.