Блог Алексея Черенкевича

Выступление Вадима Скротского на «Деловом интернете» в Гомеле

cherenkevich — Mon, 23 Jan 2012 12:47:23 +0000

Большая концентрация хороших мыслей.

Новый раздел на сайте

cherenkevich — Fri, 20 Jan 2012 01:06:46 +0000

На сайте появился новый раздел с красивыми чужими картинками. Назвается он Snatch.

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

Основные темы: сайты, интерфейсы, простые интерьеры, шрифтовые работы, простые плакаты. Реже — иллюстрации и логотипы.

RSS-лента имеется.

Дизайн для эгоиста

cherenkevich — Thu, 19 Jan 2012 16:58:07 +0000

Мне почему-то показалось, что людям нравится смотреть, как написано их имя. Да, по любому смотреть на свое имя им нравится больше, чем смотреть на чужие имена. И фоточки свои они любят. А уж как свое имущество любят.

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

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

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

Блоки — отдельно, котлеты — отдельно

cherenkevich — Thu, 12 Jan 2012 15:29:56 +0000

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

Однажды я делал проект на Друпале, и в некоторой его области страницы было очень много блоков с текстом, который должен был оставаться редактируемым через админку. Представьте себе футер с десятью такими разными блоками. Самый простой путь — создать десять регионов и запихнуть их в темплейт. Но представьте тогда страницу управления блоками: куча регионов. Фу-фу-фу!

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

Я для себя вывел правило: через регионы оформлять только те блоки, которые относятся к контенту. Все остальные блоки я вывожу напрямую в темплейте средствами АПИ.

$block = module_invoke  ('block', 'block', 'view', 3);
print $block['content'];

Последним параметром я передаю айди блока. Функция возвращает массив. Выводим $block['content‘].

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

$block = module_invoke  ('menu', 'block', 'view', 'primary-links');
print $block['content'];

Или вьюз:

$block = module_invoke  ('menu', 'block', 'view', 'menu-first-footer');
print $block['content'];

Плюсы метода

На странице редактирования блоков только нужные регионы.
Проще создавать редактируемые части сайта: не нужно размечать регион и чистить кэш.

Хорошая функция, блеать!

PS. Если кто еще не видел — вот еще одна моя статья о том, что иногда лучше использовать язык программирования вместо графического интерфейса.

Свобода от Views

cherenkevich — Mon, 09 Jan 2012 10:16:39 +0000

Views — очень классный модуль. Он позволяет сэкономить километр времени, когда нужно сделать простые сборные страницы. Но в нем иногда не хватает гибкости. Например, для темизации. Либо для построения нужной структуры адресов. Либо в случае, когда нужно сделать сложную логику какого-нибудь каталога. Не важно. Суть в том, что зачастую проще написать простой модуль, чем извращаться с Views и темизацией полей. (С таксономией та же ерунда, между прочим.)

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

Скажем, модуль, который мы напишем, будет называется catalog. Создаем папку catalog в sites/all/modules. В нем — два файла: catalog.info и catalog.module.

В файле catalog.info — служебная информация о модуле:

name = "Catalog"
description = "Catalog module"
package = "Custom"
core = 6.x

Открываем файл catalog.module и добавим в реестр меню пока только главную страницу каталога:

/**
 * Implementation of hook_menu  ().
 */

function catalog_menu  () {
  $items['catalog'] = array  (
    'title' => t  ('Catalog'),
    'page callback' => 'catalog_catalog',
    'access callback' => TRUE,
  );
  return $items;
} 

function catalog_catalog  () {
  $output = 'Hello, world!';
  return $output;
}

Русским языком: функция catalog_menu () возвращает массив элементов меню $items. Ключ каждого нового пункта меню есть его адрес. В данном случае, мы добавили страницу с адресом /catalog. У страницы каталог будет заголовок Catalog (либо его перевод, если доступен). Содержимое страницы будет определятся тем, что вернет функция catalog_catalog (), которую мы указали в качестве page callback. У этого хука может быть много параметров. Эта заметка их не освещает. Подробнее об этом хуке вы можете узнать в API Друпала или, например, в книге Pro Drupal Development Джона Вандюка.

Идем на страницу со списком модулей admin/build/modules и включаем наш модуль.

Страница готова. Это основа. Будем усложнять путь аргументами.

Аргументы

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

Итак. Для газеты «Три топора» возможные страницы каталога будут такими:

/catalog
/catalog/tri-topora
/catalog/tri-topora/2012
/catalog/tri-topora/2012/01

Добавляем в catalog_menu () новые элементы массива, заменяя аргументы знаком процента %:

/**
 * Implementation of hook_menu  ().
 */

function catalog_shelves_menu  () {

  $items['magazines'] = array  (
    'title' => t  ('Catalog'),
    'page callback' => 'catalog_catalog',
    'access callback' => TRUE,
  );

  $items['catalog/%/%'] = array  (
    'title' => t  ('Catalog'),
    'page callback' => 'catalog_catalog',
    'access callback' => TRUE,
    'page arguments' => array  (1, 2),
  );

  $items['catalog/%/%/%'] = array  (
    'title' => t  ('Catalog'),
    'page callback' => 'catalog_catalog',
    'access callback' => TRUE,
    'page arguments' => array  (1, 2, 3),
  );    

  return $items;
}

Отмечу, что любые изменения hook_menu () требуют очистки друпаловского кэша.

Все, что в адресе может меняться, мы заменяем % и определяем их как аргументы, которые передаются функции catalog_catalog (). Кстати, она тоже теперь измениться:

function catalog_catalog  ($edition = NULL, $year = NULL, $month = NULL) {

  $output = '';
   
  $edition;
  $year;
  $month;

  if  (is_numeric  ($month)) {

    //страница выпусков за месяц
    //делаем запрос к базе, который вернет все выпуски газеты за месяц                      
    $query = '...‘;    

    } else {

      if  (is_numeric  ($year)) {

        //страница выпусков за год
        //делаем запрос к базе, который вернет все выпуски газеты за год
        $query = '...';    

      } else {

        //страница выпусков всего издания
        //делаем запрос к базе, который вернет все выпуски газеты за все время
        $query = '...‘;    

      }
    }
  }

  while  ($result = db_fetch_object  ($query)) {
    //рендерим по очереди все выпуски
  }

  return $output;    
}

Все страницы каталога у нас обращаются к одной и той же функции — catalog_catalog (). Определяем типа страницы исходя из аргументов. Делаем нужный запрос к базе. Рендерим в HTML результаты запроса.

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

Рендеринг

Хорошо будет, если мы не будем мешать логику приложения с отображением. Через hook_theme () создадим новый элемент темизации issue и воспользуемся им в теле цикла while функции catalog_catalog ():

while  ($result = db_fetch_object  ($query)) {
  //рендерим по очереди все выпуски
  $output .= theme  ('issue', $result);
}

Для этого нужно зарегистрировать в реестре элемент issue:

function catalog_theme  () {
  return array  (
    'issue' => array  (
      'arguments' => array  ('form' => NULL),
    ),
  );
}

И, наконец, определить функцию, которая и будет отвечать за рендеринг issue:

function theme_issue  ($issue) {
  $output = '<div class="b-issue">' . l  ($issue->title, 'node/' . $issue->nid) . '</div>';    
  return $output;
}

Чистим кэш. Обновляем страницу.

Манипулирование заголовком

Заголовки можно изменять прямо в теле функции-колбэка. Так, в зависимости от типа страницы, мы можем определять заголовок страницы через функцию drupal_set_title ();.

Страница издания. Почему ее нет в хуке меню

Внимательный читатель мог заметить, что в hook_menu () мы не зарегистрировали путь страницы издания — catalog/%.

Давайте для интереса рассмотрим случай, если бы мы определили издание как самостоятельный тип контента Edition. Делаем у Edition алиас catalog/[title]. Тогда нужный нам адрес catalog/% — это страница ноды типа Edition.

Создаем файл node-edition.tpl.php. В файле пишем:

if  ($page) {
  echo catalog_catalog  ($issue_title);
}

$issue_title — это аргумент пути. Не путать с $node->title.

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

Каталог изданий готов. Это простейший случай. Но у вас в руках есть очень гибкий инструмент — непосредственно язык программирования, а не ограниченный в возможностях графический интерфейс. Я считаю, что это здорово!

Успехов!

Пять шотов всё

cherenkevich — Thu, 22 Dec 2011 12:30:12 +0000

Сайт «Пять шотов» больше обновляться не будет.

Причины две. Во-первых, у меня это отнимало слишком много времени. Во-вторых, ответы на вопросы стали схожими. Как правило, у всех лучшие проекты впереди, а читать нужно Огилви :)

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

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

Зопа. Анонс

cherenkevich — Sat, 17 Dec 2011 17:06:20 +0000

Мне очень нравится Бэйскемп. И я с удовольствием веду проекты в нем.

Еще мне очень нравится Друпал. И мне на глаза попались пару презентаций, где ребята рассказывают, как просто на Друпале собрать аналог Бэйскемпа. Разумеется, без хорошего «напильника» получается дешевая подъебка.

Таким образом, я однажды сел и собрал каркас Бэйскемпа на Друпале за вечер. Потом я нарисовал простой интерфейс к этому всему, помозговал и начал «допиливать» то, что дали на выходе CCK + Views + OG + Calendar. Мне нравится то, что получается. Сегодня я решил, что это занятие, которое я начал из спортивного интереса, уже переросло в нормальное веб-приложение.

После Нового года я собираюсь опробовать эту штуку внутри студии, потестить, пофиксить баги и в итоге опубликовать этот проект в Сети. Бесплатно, конечно же.

Рабочее название проекта — Зопа. «Где ТЗ?» — «В Зопе». «Я тебе в Зопе таски оставил». «Все проекты у нас в Зопе». И так далее. Перед публикацией в Сеть, думаю, название сменится на что-нибудь по-серьезнее :)

Сайт «Перемотки»

cherenkevich — Mon, 05 Dec 2011 08:54:51 +0000

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

В «Перемотке» редакторы настолько крутые, что не обламываются каждый пост оформить с уникальной версткой. Я не удивлюсь, если эти ребята каждый пост сначала верстают в Ин Дизайне. На сайте все так и дышит любовью к делу и профессионализмом.

Фичи

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

В результате все выглядит так.

Для CK Editor было сделано пару фич, которые сделали из него еще более удобный визуальный редактор.

Что учесть на будущее

Если в CSS Reset Эрика Мейера убрать строку vertical-align: baseline, то можно сэкономить около двух часов времени при верстке : )

Главная страница

cherenkevich — Mon, 28 Nov 2011 11:17:53 +0000

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

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

Я начинаю делать сайт с проектирования самых сложных страниц. Простите, если эта заметка очевидна.

Логотип и сайт студии

cherenkevich — Fri, 25 Nov 2011 12:08:14 +0000

Денис Серебряков нарисовал нам логотип.

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

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

Для меня очень важно, чтобы мои клиенты перестали воспринимать меня как фрилансера-одиночку, поэтому я убрал все личное в раздел «Каша, мед, говно и пчелы» — подальше от всего, что связано с работой.

Преобразилась страница о процессе и портфолио.

Всех с пятницей!