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

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

Добрый вечер. Я очень люблю музыку. Раньше я пользовался Винапом и был счастлив. Но с развитием интернета, скоростей передачи данных и различных аудио-хостингов стационарная музыка на жестких дисках начала уступать место музыке в веб-формате.
Последнее время я слушаю музыку исключительно из поиска Вконтакте. Найду все песни, например Король и Шут (очень я любил этот ансамбль в детстве) и слушаю целый день. Одна беда — поиск находит все песни всех пользователей и в списке могут стоять 5 одинаковых песен подряд, а некоторые песни меня просто достали, короче постоянно приходится отвлекаться на то, чтобы перепрыгнуть на следующую композицию.

Суть концепта: плеер грабит плейлисты на аудиохостингах. Например, указав адрес vkontakte.ru/audio.php?xxxx, все композиции попадут в плейлист плеера, которые можно удалить, поменять местами и прослушать, не заходя на сайт.


1. Свернутый портативный режим

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

Встречаем Fugue Icons 1.4.1 (лицензия, скачать)

Preloaders.net — новый сервис для генерации прелоадеров, для загрузки данных при помощи ajax.

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

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

Вторая версия статьи, расширенная и дополненая.

Большая часть готовилась для моего выступления на «РИТ: Клиентские технологии», куда я, к сожалению, не доехал.

 



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

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

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

Базы данных иногда пропадают. Человеческий фактор и всё-такое… Если вы не делали бекапов (а надо бы) или они уже устарели, не отчаивайтесь, — есть ещё возможность восстановить утерянную информацию.

Это продолжение, а точнее развитие, статьи написанной ранее.

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

Очень часто приходится видеть варианты элемента управления «аккордеон» на различных сайтах. В этой заметке я хотел бы предложить свой вариант, который кроме того, что обладает некоторыми оригинальными свойствами, еще и весит в minified-виде всего 618 байт. Заодно, я покажу как быстро написать простейший плагин для jQuery.

Забегая в перед скажу, что плагин тестировался в Firefox 3.0.3, Internet Explorer 7 и 8b2, Opera 9.52 и Chrome 0.3.154.9. Во всех других браузерах работоспособность гарантируется настолько насколько в них работает jQuery.

Для любопытных приведу пример того, что будет в итоге (ссылки и кнопки в примере не работают).

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

Время пришло и я рад представить свой вариант реализации написанный в виде JQuery-плагина. Я назвал плагин semaphore, по моему вполне удачное название. Плагин работает с регулярными выражениями для проверки валидности ввода.

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

UPD: Опубликована вторая часть статьи habrahabr.ru/blogs/ui_design_and_usability/45680

Когда вы хотите увеличить доход вашего сервиса вы должны увеличить количество заполнений ваших веб-форм. Даже, если, на первый взгляд, у вас есть какие-то революционные идеи для того чтобы удивить посетителей, недостаточно просто добавить возможность регистрации на вашем сайте. Для того, чтобы сервис достиг максимальных посещений мы, дизайнеры, должны предоставить пользователю хорошие решения (good user experience). Мы должны завлечь их, описать им, как работает сервис, объяснить им, почему стоит заполнить форму и описать выгоду, которую они от этого получат. И, конечно, мы должны сделать их участие максимально простым.

Тем не менее, разработка дизайна веб-форм — это не простое дело. И здесь есть одна простая причина: никто не любит заполнять формы — ни в оффлайне ни в онлайне. Следовательно, как дизайнеры, мы обязаны найти дизайнерские решения, чтобы сделать заполнение форм делом простым, интуитивным и безболезненным.

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

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

Это вторая часть перевода интересного исследования, которое проводили авторы популярного интернет сайта Smashing Magazine. Первую часть вы пожете прочитать здесь. В этот раз авторы затрагивают вопросы капчи, сообщения «Спасибо за регистрацию», кнопки «Отмена» на формах и некоторые другие интересные вопросы.

3. Функциональность форм

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

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

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

HTML 5 — это грядущее обновление гипертекстового языка разметки, основного способа создания контента для размещения его во всемирной паутине. Разработка HTML остановилась в 1999 году, на версии HTML 4.01 и с тех пор web-содержимое изменилось так, что текущие спецификации HTML перестали соответствовать сегодняшним требованиям.

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

Это статья нашего гостя Jacob Gube, web-разработчика и дизайнера, автора Six Revisions — блога о web-разработке и дизайне.

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

Уже сейчас работает уведомление по e-mail, icq.
Но как быть, если администратор в дороге, и не имеет доступа к почте и мессенджеру? Нужно сделать уведомление SMSкой. Это будет полезно как админу, так и пользователю, т.к. последний сможет уведомиться об обработке его проблемы/заявки.

Добрый день, друзья, хочу поведать вам один секрет, который помогает мне быстро и правильно найти цветовую схему для сайта.Прошу строго не судить, возможно, некоторые из вас знают этот прием, но вот мой друг, не знал, а когда я поведал ему, как легко найти цвета для цветовой схемы сайта – он был поражен простотой решения. Я не претендую на уникальность, либо открытие нового метода, просто я это знаю, и мне это помогает.
Для того чтобы нам создать цветовую схему. Нам понадобится такая хорошая программа, как Adobe Photoshop, причем подойдет практически любая версия. Особых знаний работы с фотошопом для этого т.с. трюка не НАТО, все делается буквально в пару кликов.

Как известно, недавно вышла бета версия jQuery 1.3. Пока она сырая, тестируется, и в ней еще есть неприятные баги. Но знакомится с нововведениями стоит и я хотел бы кратко рассказать об одном из них.

Функция «live» представляет собой аналог функции bind, по синтаксису и сути они идентичны, но между ними есть одно огромное различие, которое лучше всего демонcтрирует следующий пример.

Попробовать демо. Пояснения под катом.

Плагин jQuery Alert Dialogs призван заменить основную функциональность стандартных предупреждений JavaScript, alert(), confirm(), и prompt() функций. Они полностью настраиваются с помощью CSS (это позволит выглядеть вашему сайту гораздо более привлекательно). И вы также можете настроить пользовательский заголовок для каждого диалогового окна.

Эти методы моделируют обычные модальные диалоговые окна. Они автоматически изменяют свое положение при изменении окна браузера. Если включить jQuery UI Draggable плагин, то окна можно перемещать, перетаскивая их за заголовки. В отличие от стандартных JavaScript функций, вы можете использовать HTML в сообщении. Например, чтобы задать переход на новую строку, вы можете использовать либо \n, либо < br / >.

Свойство clear со значениями left, right, both действительно очищает поток в отличие от overflow со значеним hidden, которое создаёт отдельный контекст форматирования для выбранного элемента, тем самым локализуя действие свойства float внутри элемента к которому применён.

Ага, вот эти ребята, сейчас я покажу Вам магию ООП.