Вы, наверное, уже читали интересную статью о том, как можно отключать эффекты :hover при скроле – это позволяет здорово сохранить отзывчивость сайта, но имеет один недостаток – вам приходится опираться на один общий класс, и это плохо.

.hover .element:hover {
  box-shadow: 1px 1px 1px #000;
}

То ли с подачи Бизнес Молодости, то ли по иным причинам, сейчас только ленивый не предлагает разработку Landing Page. И на то есть причины. Согласно глобальной идее, лендинг – эта такая особая страница, которая технично должна превращать посетителей в лиды со значительно большей вероятностью, чем это умеет делать сайт в привычном понимании.


Сатира на большинство «лендинг пейджей»

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

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

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

Сколько уже было сломано копий о задачу выравнивания элементов на странице. Предлагаю вашему вниманию перевод отличной статьи с решением этой проблемы от Стефана Шоу (Stephen Shaw) для Smashing Magazine — Absolute Horizontal And Vertical Centering In CSS.

Все мы знали о margin: 0 auto; для горизонтального центрирования, но margin: auto; не работало для вертикального. Это можно легко исправить, просто задав высоту и применив следующие стили:

.Absolute-Center {
  margin: auto;
  position: absolute;
  top: 0; left: 0; bottom: 0; right: 0;
}

Я не первый, кто предложил это решение, однако такой подход редко применяется при вертикальном выравнивании. В комментариях к статье How to Center Anything With CSS Simon ссылается на пример jsFiddle, где приводится отличное решение для вертикального центрирования. Вот еще несколько источников на эту тему.

Рассмотрим способ поближе.

Многие из нас занимаются изучением английского языка, потому что в сфере ИТ большинство документации, форумов и просто полезной информации изложено на универсальном языке – английском. И каждый находит для себя свой подход к обучению: кто-то идет к своей цели постепенно, планомерно, кто-то более экспрессно и выборочно. В самом деле, в Интернете вы найдете более 9000 методик, о том, как эффективно и быстро выучить язык самому. В языковой школе вам предложат несколько целевых программ: от «разговорных навыков делового человека» до «целенаправленной сдачи TOEFL». Чего же нового хочу я предложить? Мы поговорим о «фоновом» изучении языка. Цель моего поста – поделиться с вами способами изучения языка, которые я использовал. Постараюсь показать концепцию в целом, который каждый из вас сможет интегрировать в свой способ познания языка.

Здравствуйте, уважаемые Хабражители.

Данная статья посвящена фантастическому, на мой взгляд, open-source приложению Prepros, которое может облегчить рабочий процесс многим фронт-энд разработчикам.

Prepros умеет компилировать файлы LESS, Sass, SCSS, Stylus, Jade, Slim, Coffeescript, LiveScript, Haml и Markdown, минифицировать и объединять в один JavaScript-файлы и это еще не все.

Под катом — более подробный обзор приложения.

На сегодняшний день существует немалое количество обзорных статей о PhoneGap, но к сожалению, написаны они или front-end разработчиками, которые решили заняться мобильными платформами, или нативными программистами, которые решили попробовать себя в кроссплатформенной разработке. И именно с этих позиций рассматриваются достоинства и недостатки PhoneGap'а, возникают статьи о том, «насколько крута кроссплатформа», или об «ущербности кроссплатформенных решений».

В качестве затравки — видео демо-приложения, написанного за 6 часов; готовым был взят UI-бутстрап, наверстанный за 3,5 часа; использовались библиотеки iScroll, backbone, underscore, Jquery, и небольшая обертка на backbone (RAD.js — rapid application development, архитектурный фреймворк, берущий на себя часть оптимизации, связанной с мобильной средой выполнения).


Еще 2 часа было потрачено на фикс движка. Но сегодня речь не о том, что что-то тормозит, дергается, или самописный свайп не всегда вовремя отрабатывает на 14000 объектах данных; речь о том, что на PhoneGap можно и нужно писать.

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

Disclaimer:
Данная статья представляет собой вольный художественный пересказ-перевод вступления книги "App Savvy
Turning ideas into ipad and iphone apps customers really want"

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


Вероятно, как и многие, вы тоже очарованы ошеломительным успехом смартфонов и планшетов – этих умных гаджетов, работающих на операционных системах от Apple, Google и Microsoft, которые сейчас есть фактически у каждого. Во многом успех этих устройств обусловлен магазинами приложений – App Store в случае iOS, Google Play на Android и Marketplace на Windows Phone, которые открывают перед пользователями огромное количество возможностей, которое было недоступно владельцам классических мобильных телефонов.

На хабре часто публикуют статьи о самоорганизации — нам всем хочется меньше прокрастинировать, и делать больше полезного. Но что если делать полезное мешает дичайшая усталость? Никакая организация задач усталость не уберет.

Казалось бы, работа у IT-шников несложная — вагоны не разгружаем, землю не роем и уставать физически не должны. Однако о дичайшей усталости людей занятых интеллектуальным трудом приходится слышать чаще, чем хотелось бы. После того как я приехал в Москву 3 года назад — я почему-то начал дичайше уставать на совершенно ровном месте, и ни я, ни врачи не могли найти причину. После 2-х лет поисков тривиальная и легко исправимая причина нашлась, и на мой взгляд — в группе риска находятся практически все люди, занимающиеся интеллектуальным трудом. Ситуация усугубляется двумя народными обычаями.

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

1) Летом все ок, а зимой — апатия, ничего не хочется делать. Это любят называть сезонной «депрессией».
2) Утром все ок, а к вечеру на работе — мозги «не варят», ничего не хочется делать — только хабр и reddit листать. Приходите домой — и с дичайшей усталостью падаете в кресло. Сил хватает только лазить в интернете до ночи. Этот пункт — касается и работодателей, есть шанс, что люди вечером перестают работать не из-за своей лени.
3) Даже если вы просыпаетесь без будильника — вы не высыпаетесь.
4) Кофе и прочие стимуляторы — не дают бодрости, лишь делают вас злее.
5) Даже если вы спите «сколько влезет» — сны короткие и не запоминающиеся, или их нет вообще.
6) Вы замечаете, что даже 1 вещь вам иногда трудно удержать в голове. Мы можете забыть что вы сейчас хотели сделать.
7) Вы просыпаетесь уже с дичайшей усталостью
8) Вам кажется, что в комнате темно и все несколько не резкое.

Новые полезные инструменты, сервисы, статьи, бесплатности для веб-дизайнеров за июль 2013. Остальные подборки доступны по тегу "новое для веб-дизайнера".

Сервисы

I Want To Use — на сайте можно выбрать CSS-фичи, которые хотите использовать, и будет показан процент пользователей, которые смогут их использовать.

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

Скрывать контент

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

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

Одним из таких порталов владею я. Его название — «АЙК Обнинск» (г. Обнинск, Калужская область, население — 105,200 человек).

Я начал разрабатывать его в 2010 году, на CMS WordPress. Основная идея — сделать нечто особенное, яркое, нужное жителям города каждый день.

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

Первый шаг — установка CMS. Так получилось, что мой портал стоит не на одном WordPress, а сразу на двух. Один для ленты новостей и другой для всего остального. Это сделано для удобства, поскольку новости требуют особой структуры, которая не подходит для контента из других разделов.

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

Поскольку разработка сайта — это командная, многоэтапная работа, то для достижения качественного результата на этапе дизайн-верстка, необходимо проработать не только визуальную часть дизайна, но и продумать интерактивные элементы. То есть те, которые изменяют свое состояние от действий пользователя. Это сразу откинет много вопросов верстальщика типа: «а как эта кнопка будет подсвечиваться?».

_{Фото Chrіs Martіn.}

Возможно ли при неизменном уровне качества работы, при всех других одинаковых показателях начать зарабатывать больше прямо сейчас? Не через год обучения, не через месяц попыток, а уже завтра получить «лишние» деньги? Мой ответ – всем без исключения фрилансерам и многим «студийщикам» – да, это вполне возможно!

Вряд ли существует дизайнер, который не хотел бы зарабатывать больше, выполняя одну и ту же работу. Ну а вы бы отказались от «лишних» денег? Если да – завидую вашему «дзен» и можете закрыть эту страничку, а мы же сосредоточимся на бумажках с мертвыми президентами :)

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

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

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

Данная статья продолжает цикл статей о жизни после закрытия Google Reader и будет рассказывать об опыте настройки Tiny Tiny RSS на hostinger.ru, препятствиях с которыми пришлось столкнуться и, конечно, способах их преодоления. Вас ждёт подробная пошаговая инструкция с картинками, исходным кодом и комментариями.

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

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

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

2. Если письмо не требует ответа или какой-то реакции, отправляйте его в архив. Пустая папка «Входящие» — это прекрасно. Используйте inbox в качестве списка To Do.

3. Не используйте одновременно несколько программ/приложений. Закончили с соцсетями — закройте окно. Проверили почту — закройте ее. Не нужно серфить в интернете — закройте браузер. Даже фоном ничего не оставляйте. Несколько задач одновременно отвлекают и мешают сконцентрироваться на чем-то одном.

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

Заполучив что-то вроде нового супермасштабируемого молотка, горячо обсуждаемого на Hacker News, вы лупите им по всему, что попадается на вашем пути, пока каждая ваша вещь не превратится в пыль, а все, кого вы любите, не скончаются от тяжелых черепно-мозговых травм.

Переведено в Alconost.

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

Инструменты

Colour Lovers — старый и функциональный инструмент для подбора цветовых схем. Аналоги — Colourcode, Color Scheme Designer и конечно Kuler. Подобных сайтов великое множество, но эти, на мой взгляд, самые удобные.

Вот ждёте вы важное письмо от коллеги. 5 минут, 10, 20 — а нет его! Блин, а проверю-ка я спам. И точно — есть, 19 минут назад пришло. Чёрт, я же вроде уже добавлял этого человека в whitelist — почему письмо в спаме? Надо разобраться, проверить правила… Но сейчас нет времени, это мелочь, письмо срочное, а в эти правила как закопаешься, так на полчаса, еще и админов может быть придётся дёргать. Нет, потом…
А завтра письмо от коллеги опять в спаме.

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

О, вот библиотека, которая делает то, что мне надо. Хм, на Python, а мне надо на С++. А на С++ такой нет. Ну ок, почитаю питоновский код, пойму общую идею и перепишу на С++. Ух ты, у моего редактора нет подсветки кода на Python! Может быть есть какой-то плагин? Или поискать другие редакторы? Ай, ну ладно, это ведь одноразовая задача, не буду тратить время — сейчас полдня потрачу на сравнение десятка IDE и редакторов кода на Python, а у меня ведь задача совсем другая, плюну, это ведь мелочь…
А завтра к библиотеке на Python выходит обновление и его снова приходится читать.

Почему бы не перестать страдать по мелочам?