После опубликования статьи «Борьба за свои права…» мне написало много айтишников, что, если честно, стало приятной неожиданностью. Но, помимо вдохновляющих слов поддержки и советов, хабраюзеры также делились своими похожими ситуациями, в которых нарушались их трудовые права. Ситуации самые разные: от неуплаты заработной платы до неоформления в штате фирмы. Но все они были схожи в одном: они случались и зачастую заканчивались плачевно из-за низкой юридической грамотности работников в вопросах трудовых прав. Вот лишь один пример такой ситуации:

Andrey: у меня была точно такая же ситуация с банкротством конторы, сейчас я уже вижу, где поступил неправильно. Нас так же кормили «завтраками», или, как мы их называли, «микроплатежами», когда срок переносится на неделю, потом ещё на неделю. В итоге сказали, что банкротят. Также предложили написать заявление на отпуск без содержания на 3 месяца. Это основное условие получения текущей зп. Только нам выплачивали не всю зп. Остаток должны были выплатить по договору с головной американской конторой. Какая у меня была ошибка:

1) я написал заявление на увольнение по собственному желанию
2) я написал заявление на отпуск без сохранения зп
3) поверил, что головная контора выплатит долг

Это всё стало понятно после суда. По договору был срок полгода, когда должны выплатить остатки зп. Когда стало понятно, что я ничего не получу, пошли в суд. Суд посчитал недоказанным, что мы фактически работали во время фиктивного отпуска.

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

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

Пока вы дома, самое время вооружиться фотоаппаратом и поделиться видом своего рабочего места (домашнего).

По возможности, описываем:
1. 7 любимых гаджетов.
2. 7 ежедневных программ.
3. 7 интересных открытий, которыми вы часто пользуетесь.

Приоткройте занавесу тайны в своей обители.

PS: Бонус для владельцев ноутбуков — подключаем 2 монитора.

На днях столкнулся с задачей:

Сделать две одинаковые по высоте -колонки, не зависимо от количества текста в какой либо из них.

Условия:

1. Никаких таблиц;
2. Поддержка IE6+ и т.д;
3. Резиновая верстка;
4. Никакого JavaScript, чистый HTML и CSS.

Дизайн:

В дизайне изображены две колонки с отступом друг от друга. Каждый из них имеет свой фон и border с округленными уголками. На вид все просто.

Поиск решений:

Искал и естественно нашел очень полезный пост, где описаны все самые действенные способы решения данной задачи: http://habrahabr.ru/post/64173/.
Собственно 4-е решение из этого поста было наиболее приемлемым, но с помощью него мне так и не удалось вывести два разных фона для своих колонок.

Решение

С тех пор, как вышли книги «Adaptive Web Design» Аарона Густафсона и «Responsive Web Design» Итана Маркотта (русское издание называется «Отзывчивый веб-дизайн»), в сообществе веб-дизайнеров и разработчиков ведутся споры о том, чем отличаются эти 2 подхода. Одни считают, что эти 2 понятия являются синонимами, а другие, что это совершенно разные понятия. Но, как известно, истина всегда где-то посередине, поэтому предлагаю вашему вниманию перевод статьи финского веб-дизайнера и разработчика Вильями Салминена (Viljami Salminen) «Adaptive vs. Responsive, what’s the difference?»:

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

Такая вот ситуация: дизайнер присылает макет, а у верстальщика открывается какая то лабуда светлая, или темная (если верстальщик испольует МасOS, а дизайнер Win.). Или же верстальщик сохраняет картинку, а там цвета другие стали.

Разберемся почему так и как с этим жить.

Картографический сервис – зачем это? Ну например, я 10 лет жил в нашей маленькой провинции, а потом взял и понаехал в Москву, и всё для меня так ново. А где магазины, боулинг, кафешки, парки отдыха – надо знать же, где тратить московскую зарплату. Но вот беда, как узнать? Раньше был справочник «Желтые страницы» и там была карта и всё по адресам. Чтобы найти что-то уходило масса времени. Сейчас стало всё в разы проще. Вот прекрасный пример: http://www.pushkino.org/. Но это далеко не всё.
Я могу отслеживать погоду, пожары, пробки (кстати!) в реальном времени.
Мой заказчик может не вводить свой адрес, а попросту отметить его на карте и я буду знать куда доставить ему товар – какое классное решение, не надо всего этого – «Проспект маршала Блюхера, 43, г. Санкт-Петербург, Россия».

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

В данной статье я хочу рассказать, о том, как можно сверстать «хорошо» (по крайней мере структурировано ;), а заодно рассказать и о методологии, которая может «упростить жизнь» при верстке. Структура поста будет следующей:

• BEM
• Собственно пример — как сверстать страницу

Уважаемый читатель, этой статьей я открываю цикл статей, посвященных вёрстке.
В первой части будет описано, как это сделать с помощью стандартных средств на чистом HTML и CSS. В последующих частях рассмотрим как сделать тоже самое, но с помощью современных фреймворков и CMS.

Часть 1. Верстка стандартными средствами

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

Итак, давайте приступим. В качестве нашего подопытного мы возьмем бесплатный psd шаблон Corporate Blue от студии Pcklaboratory.

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

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

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

Альтернативное название статьи – «почти :child-count(n)». Потому что именно так оно все и работает. На голом CSS и без каких-либо дата-атрибутов или чего-либо еще в верстке.

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

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

В последние несколько лет проектирование интерфейсов начало приобретать немалую популярность. Отечественные компании, чей бизнес так или иначе связан с компьютерами и интернетом стали понимать, что просто «дизайна» в том понимании, в каком он употребляется у нас уже недостаточно, нужно не только красиво, но и удобно. В результате мы видим немалое количество вакансий с такими словами в описании, как UX, UI, UCD, usability и всё в таком духе.

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

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

Я хочу рассказать о том, как мы строили свой собственный, хороший WLAN — Wireless LAN.

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

Юзабилити-специалист нужен всем: большим IT-компаниям и маленьким стартапам. О том, как обычно выстроен процесс работы юзабилиста в больших компаниях, на хабре писалось уже не раз. А тему «как взять и прямо сейчас организовать работу внутри вашей команды» (пусть и небольшой) почему-то все время обходили стороной.

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

Сначала предметная область

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

Ключи/запросы

Это фразы, которые набираются в поиске, для достижения результата (ответа на вопрос, покупки, получения информации…)
По частотностям
НЧ – низкочастотные (величина вычисляется логарифмически относительно самого большого числа запросов по ВЧ запросу из категории), для простоты пусть будет все что ниже 300 запросов (хотя в каждой группе по разному).
СЧ – среднечастотные (величина вычисляется логарифмически относительно самого большого числа запросов по ВЧ запросу из категории), для простоты пусть это будет все что выше 300 и ниже 2000 запросов (хотя в каждой группе по разному).
ВЧ – максимальное значение количества поисков простого запроса, к примеру «Светильник».
По конкуренции
НК – низкоконкурентные запросы, по которым есть шанс двинуться в топ (мало точных вхождений поисковой фразы, мало главных страниц, низкое количество результатов в поисковой выдаче)
СК – средне конкурентные запросы, по которым есть шанс продвинуться в топ, но есть и конкуренция (весь топ занят или главными или точными вхождениями, но показатели ссылочной массы конкурентов низкие)
ВК – высококонкурентные запросы, по которым необходимо из кожи вон вылезти чтоб продвинуться (и топ весь занят, и ссылочная масса ужасающая) при средних бюджетах ВК топ недостижим, но можно долго работать, чтоб кардинально поменять выдачу (закупка сателлитов, ссылочной массы, грамотное внутренне СЕО).

Семантическое ядро

Предполагает, что будет оптимизироваться каждая страница сайта. Это значит, что страница конечно будет давать ответ на запрос пользователя, но при этом на ней должен быть материал, который включает в себя эти ответы. То есть признаки, по которым ПС сможет выдать именно эту страницу на это запрос…
Пока что это сами запросы пользователей – они же «КЛЮЧИ»
Ключевые фразы подбираются для каждой страницы персонально.
Для главной страницы берутся общие запросы (описывающие общую категорию и выделяющие общую тематику сайта).
Для страницы категории выбираются запросы более узкой тематики, выделяющие отдельную категорию в общей всего сайта.
Для страницы товара/услуги – берутся максимально конкретные запросы, отражающие ее суть и позволяющие максимально точно ее/его идентифицировать.

0 Стратегия: Тариф Беззаботный

Минимум затрат, так как трафик тупо покупается у ПС. Других вариантов нет.

1 Стратегия: На халяву

Низкоконкурентный трафик – занимается ниша, где есть спрос, но нет конкурентов – классический «кто первый встал – того и тапки».
Схема до боли проста – ищем свободные ниши, подбираем НК запросы, пишем материал (даем полезное на запрос пользователя) – попадаем в ТОП, для усиления эффекта можно закупить по парочке ссылок.

Проектирование — этот, возможно, ключевой этап создания интернет-сайта, отвечает нам на следующие вопросы:

1. Каковы наши цели — зачем мы делаем сайт? Как мы реализуем поставленные цели?
2. Как сайт будет выглядеть и работать?

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

Сколько уже было сломано копий о задачу выравнивания элементов на странице. Предлагаю вашему вниманию перевод отличной статьи с решением этой проблемы от Стефана Шоу (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, где приводится отличное решение для вертикального центрирования. Вот еще несколько источников на эту тему.

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

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

Поддержку новых функций браузерами можно проверить на сайте caniuse.com:

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

Никогда не планируйте

Проект, как правило, делается сам собой, вырастает, как дерево: главное — вовремя посадить семена и удобрить почву. Разве вы когда-нибудь встречали чудака, который будет прикидывать, насколько вырастет за год дерево, которое он посадил? Правда в том, что планирование никогда еще никому не помогло сделать хороший проект. Точные сроки — это лишняя ответственность и ненужная головная боль. Диаграммы Ганта — для слабаков. Забудьте о них.