logo

Только Грузопоиск

Всем привет! Пост будет коротким и вероятно я долго еще не буду писать сюда в последующем.
Многие мои друзья знают о проекте Грузопоиск, которым я занимаюсь уже долгое время. Со следующей недели Грузопоиск станет моим единственным местом работы. Соответственно, больше никакой верстки на другие компании и тем более фриланс я делать не буду (хотя фриланс и так уже давно в стороне от меня). Надеюсь, что в дальнейшем всю верстку я буду делать только для Грузопоиска. Не уверен, что будет время на написание каких-то статей по веб-разработке, поэтому если вы вдруг подписаны на rss-канал — можете отписаться, много не потеряете. Читать далее

pepelsbey

Возвращение ножа и паровоза

Друзья-верстальщики, каждый из вас знает Вадима Макеева и что он делает для развития веба. Лично мое знакомство с ним произошло в 2008 году, когда я только приехал работать в Москву верстальщиком и пошел на первую в своей жизни конференцию РИТ: Клиентские Технологии, на которой Вадим выступал с докладом «С ножом против паровоза».
Развитие темы — мастер-класс «Возвращения ножа и паровоза. Работа с графикой для веба», рекомендую, для начинающих верстальщиков — рекомендую настоятельно 😉 Читать далее

ext

Анимированный баннер на CSS3

Развивая проект Грузопоиск часто приходиться прибегать к нестандартным решениям и придумывать что-нибудь сложное и одновременно с этим интересное. В этот раз встала задача — сделать анимированный баннер для странички расширений extension.gruzopoisk.ru. Т.к. расширения у нас сделаны для «правильных» браузеров, то есть смысл показывать баннер только для них, для остальных можно чуток модифицировать код и перенаправлять посетителей сразу на основной сайт. Из требований вытекают возможности — можно смело использовать CSS3 на полную катушку 😉 Читать далее

chat-mini

Простая верстка адаптивного чата

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

logo

Грузопоиск

Сегодня свершилось то, к чему мы с Алексеем Козловым шли полтора года — запущен наш проект Грузопоиск — биржа грузов и свободного транспорта! Пока что это только бета, но всего через несколько месяцев мы сможем избавиться от этой приставки )
Казалось бы простой внешне проект на самом деле содержит огромное количество кода внутри. За время его работы дважды менялась верстка — я тоже развивался вместе с проектом и постоянно улучшал разметку, стараясь сделать ее работоспособной как на десктопах, так и на мобильных устройствах. Читать далее

gallery

Блик света на картинке

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

ie6

Internet Explorer 6. Прощальный обзор.

Под IE6 я не верстаю уже больше года, впрочем, как и многие мои коллеги. Но вот сегодня я решил посмотреть, как к старичку относятся популярнейшие сайты рунета и не только. Хотелось бы, чтобы поддерживали как можно хуже… и мои ожидания оправдались ) Некоторые сайты сразу говорят юзеру, чтобы он «перезашел» с нормального браузера, другие просто не парятся и вааще никак не реагируют, что хуже. Если ты верстальщик и твой руководитель (клиент) настаивает на поддержжке ослика №6 — можешь показывать данный пост. Читать далее

icons

Иконки и favicon.ico для сайта в несколько кликов (+ конкурс)

Издревле повелось, что нормальный сайт должен иметь favicon. Сейчас у человеков множество различных девайсов, посему придумали еще кучку иконок, чтобы на девайсах этих тоже были красивые фавиконы. В итоге приходится нарезать как минимум 4 квадратика разных размеров. В попытках сэкономить время хотя бы на этом я написал простенький action для Photoshop. Он конечно не избавит верстальщика от всей работы, но сократит ее как минимум в двое. Итак, погнали. Читать далее

navbar

Панель навигации по сверстанным страницам

Когда на верстку приходит несколько PSD-макетов, я стараюсь сделать столько же html-страничек (кроме тех, где показаны различные состояния элементов). Когда этих страниц больше 5, то уже и сам начинаешь путаться, а еще есть заказчики, менеджеры проектов… Короче, устал я каждый раз писать письма со ссылками и сделал небольшой скрипт, который выводит список страниц, для более простой навигации. Читать далее

dom-mini

Зарисовки структуры на бумаге. Надо ли?

Иногда меня спрашивают почему я выбираю ту или иную структур верстки, почему строю структуру именно так… А я в общем-то и не знаю что ответить. Когда только начинал верстать, до делал по большей части методом проб и ошибок, по много раз переписываю один и тот же участок, пока не находил какого-то верного решения. Потом, в какой-то момент, глядя на новый макет я научился прорисовывать будущую структуру в голове, просто смотрел на картинку и думал как должен быть построен HTML. Сейчас для простого макета хватает 1-2 минуты, чтобы я уже точно знал, как будет выглядеть структура, нужно просто сесть и написать ее. Читать далее

iphone-2

Проект Web-наблюдатель

Так уж получилось, что благодаря Алексею Поимцеву я оказался в составе команды разработчиков проекта Веб-наблюдатель — это сайт и приложения для iPhone и Android для официальных наблюдателей за ходом выборов и для простых людей, которые пойдут 4 марта на выборы. Зачем я влился в команду? Да просто интересно поработать в большой команде, члены которой являются профессионалами и удалены друг от друга, почти как в 37signals — компании, которая на мой взгляд является примером для подражания, в такой я хотел бы работать! Читать далее

widescreen-m

ЭЛЕКТРОНИКА ИМ 02 на CSS3

Новогодние праздники дали возможность отдохнуть от компа, от работы, уделить больше времени семье… но к концу выходных руки уже зачесались, захотелось чего-нибудь эдакого, чего раньше не делал. Решил поэкспериментировать с CSS3, давно собирался, да как-то ни до того было. Захотелось что-то изобразить в коде без применения графики, выбор пал на игровой девайс школьных лет — электронную игру «Ну, погоди!» (в последствии переименовал в Микки Мауса). Для себя решил, что никакого копипаста делать не буду, всё буду писать сам (за исключением градиентов, тут уж лучше генератором). Читать далее

balcon

Рабочее место 2 месяца спустя

За 2 месяца я достаточно не плохо обжился на балконе и научился бороться с небольшими минусами, такими как жара в солнечную погоду (решилось навешивание шторки). Мне не хватало места на столе под всякую хренотень, постоянно какие-то провода, коробки, откуда-то появляющиеся детские игрушки… Посему назрела необходимость внести небольшие коррективы. Читать далее

html5

Почему я верстаю в HTML5?

Где-то на стыке 2010-2011 года я понемногу начал верстать в HTML5, вдохновившись докладом Вадима Макеева Доктайп. Точка. Хотя… не совсем по немногу ) Текущий на тот момент проект я хотел сверстать только подставив вместо общепринятого strict xhtml доктайпа новый, только начинающий пользоваться популярностью короткий и красивый Doctype HTML5 — <!DOCTYPE HTML> (кстати, я думаю, что именно последоклада Вадима его популярность в России резко возросла). Но как-то увлёкшись я сделал всю разметку на HTML5. Сейчас я чаще верстаю в новой разметке, исключение оставляют сайты, заказчики которых боятся нововведений, для таких сайтов из HTML5 остается только новый доктайп.

Так почему же я всё-таки сделал выбор в пользу нового стандарта?

Читать далее

balcon

Новый рабочий кабинет — на балконе

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

semantic

ARIA Roles в HTML5 — семантическая разметка

Большинство сайтов имеют одинаковую структуру блоков, и чаще всего эти блоки имеют общепринятые имена классов или ID. Обычно сайт представляет из себя шапку (header), навигацию (nav), контент (content), сайтбар (sidebar, leftbar, rightbar) и подвал (footer).
В HTML5 появились атрибуты, которые позволяют четче указать что есть что. Атрибуты role назначают роли для блоков, обозначая их важность и назначение. Вы можете ознакомиться со спецификацией ARIA Role — WIA-ARIA specification. Я же приведу наиболее актуальные роли (возможно буду пополнять со временем). Читать далее

preview

Обработка скриншота под фото с экрана

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

Идем по порядку: Читать далее

shpora

Шпаргалка по jQuery: часто используемые небольшие скрипты

В моей работе иногда требуется быстро вставить небольшой скрипт jQuery, который я уже неоднократно вставлял на предыдущих проектах. И вот тогда я начинаю вспоминать тот проект, конечно-же вспоминаю далеко не с первого раза, рою архивы… Вот и решил сделать для себя некую шпаргалку, может еще кому-то пригодиться. Шпаргалка будет пополняться постоянно. Принимаются советы и ваши мини-скриптики :) Читать далее

Page 1 of 3
1
2
3