CMS делаем сами

CU3ER - 3D слайдер изображений

2009/10/16 16:25 

CU3ER - это 125 Kb.swf файл, позволяющий манипулировать картинками в 3D, т.е. в 3 измерениях, по сути это многофункциональный слайдер. Управление изображениями осуществляется с помощью подготовленного .xml файла с записанными инструкциями. Слайдер снабжен большим количеством функций, позволяющим произвести большое впечатление на смотрящего, другими словами - это "богато" смотрящийся элемент интерфейса для rich-media сайтов, например для сайтов-визиток, промо-сайтов, создание флеш презентаций или страниц с полноэкранными баннерами-презентациями.

CU3ER interface overview

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

CU3ER direction

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

Бесплатный, легко настраиваемый - CU3ER легко займёт своё место в осмысленном интерфейсе, или на худой конец порадует требовательного бестолкового заказчика, который сам не знает чего хочет, но "чтобы круто, современно и за копейки" :)

Проверка правописания в WYSIWYG-редакторах

2009/9/20 13:23 

Spell-checker

After the Deadline - разработчик нам как бы напоминают, что после торжественной сдачи проекта неплохо бы незаметненько забраться в его недра и довести до ума оставшиеся хвосты, например дописать забытую проверку правописания в админке. Скрипт существует в виде плагинов к TinyMCE, Wordpress, RoundCube Email и PHP List, все желающие могут на его основе написать свой плагин к любимой CMS. Для подключения потребуется получить ключ, для некоммерческого использования продукт бесплатен. Проверяет английский only, довольно удобен в использовании, есть библиотеки для Python и Ruby.

Если нет желания привязываться к стороннему API, то можно встроить скрипт попроще: AJAX Spell Checker. Требует PHP 5 и библиотеки pspell и/или aspell, разумеется проверяет тоже только английский.

Spellify - спеллчекер, работающий на Prototype JavaScript Framework, поддерживает несколько языков, русский пока не вошёл, но вы можете его добавить самостоятельно. Удобный autosuggest.

GoogieSpell - Ajax скрипт, без перезагрузки проверяющий грамматику, используя GoogleSpell API, 27 языков, русский вошёл, работает наверное во всех существующих браузерах, весит 50кБ. Имхо, наиболее универсальное решение на сегодняшний день.
В процессе написания обзора уже обнаружил аналогичную статью полугодовой давности, там еще пара продуктов, для полноты картины.

Напоминаю, что для проверки русской грамматики можно использовать API Яндекс.Спеллера, по ссылке - руководство разработчика по подключению к TinyMCE.

А в постовом сегодня Владимир Забродский повествует: как заработать в интернете и что потом с эдакими деньжищщами делать.

CSS Hover Effect

2009/8/10 12:46 

Вот такой роскошный hower-эффект на одних стилях. Для преодоления кривизны IE впрочем задействована библиотека jQuery, аккуратненько так. Применений можно найти массу, никаких хаков, код валидный и естественный. В rss-читалке скорее всего вы эффекта не увидите, так что если используете rss-reader (по статистике это не менее половины моей аудитории)- перейдите к заметке на сайт

With JQuery-based hover fix for IE

Оригинал - CSS swap hower effect

Скромное обаяние Envato

2009/7/22 11:35 

Когда полтора года назад я писал о бирже flash-скриптов FlashDen, это была небольшая быстро растущая площадка, явно не аффилированная ни с какими инвесторами, однако через год появилась скромная австралийская компания Envato и сделала видимо, предложение, от которого не отказываются. Впрочем, сама Envato пишет, что это они и запустили Flashden еще в 2006-м. Где-то нас дурят, зачем - неясно ... в общем кто-то шифруется с непонятными целями, а сеть сайтов потихоньку растет.

Сейчас в холдинг Envato (которому 3 годика от роду и который до сих пор скромно величает себя стартапом) входит славная плеяда известных туториалописателей:

  • Aetuts+
  • Audiotuts+
  • Nettuts+
  • PSDtuts+
  • Vectortuts+
  • Flashtuts+
  • Cgtuts+

Также, в обойме кроме упомянутой FlashDen присутствуют такие интересные торговые площадки, как AudioJungle - аудиотреки, GraphicRiver - графика и иллюстрации, ThemeForest - темплейты CMS и VideoHive - клипы и видеоролики.

И еще полдюжины разнообразных проектов, которые иначе как инвестициями не назовешь. И да, эта акула бизнеса все это время вполне успешно обходится движком Wordpress в качестве CMS. Вот такое расследование получилось в процессе, хотя изначально я всего лишь хотел сообщить, что на ThemeForest можно недорого прикупить вполне себе приличных скриптов (как java-script, так и php) - ну или продать, если лишние завалялись.

Спонсором расследования, сама не подозревая, была audi.

Оформление ссылок: приёмы CSS

2009/3/17 19:45 

Звучит банально, но именно гиперссылки являются тем средством, которое превратило обычную компьютерную сеть в ныне известный нам Интернет. Тогда будет логично уделить им несколько больше внимания и сделать их более удобными для пользователя? Об этом заметка в designer-daily.com, которую я любительски перевёл.

Отображаем тип файла на иконке

Если ссылка ведет на файл для скачивания, почему бы не дать пользователю информацию о типе файла? Особенно актуально это для файлов, которые ваша ОС открывает автоматически вместо того, чтобы сохранить - часто бывает сюрпризом внезапное открытие Acrobat Reader после загрузки .pdf документа.

Отображаем тип файла на иконке

Указываем язык целевой страницы

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

Выделяем микроформаты

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

Отображаем иконку для внешних ссылок

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

Tooltip

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

Отмечаем просмотренные страницы

Может быть действительно полезным дополнительно визуально отметить уже посещённые ссылки (прим. - это был первый урок css в моей вебмастерской практике).

Ссылки в версии для печати

Гиперссылки ограничены вебом, в напечатанном документе они отобразятся лишь подчеркиванием, что не несёт никакой информации. Распространённой практикой является вставлять URL ссылки в скобочках в тексте после анкора. Это не улучшает читаемость отпечатанного текста, но позволяет сохранить информацию о ссылке.
Более приемлемый вариант - делать в печатной версии сноски, а ссылки печатать внизу отпечатанного текста (upd: усовершенствованный вариант).

Вынужден признать, что почти ни одним приёмом на этом блоге я не пользуюсь, и это наполняет душу радостью - есть куда расти и к чему стремиться!