mozzy's blog | Блог о дизайне, вёрстке и фотографии

Это иконка CSS Edit 2, хотя в статье не будет ни слова о CSS Edit 2.

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

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

Для начала, пара провокационных советов:

1. Пора прекратить поддержку IE6

Возможно, меня закидают камнями, но, сколько можно? Этому браузеру 9… Да, девять лет! Сейчас им пользуется менее 10% пользователей рунета, сама Microsoft этому уже не рада и делает всё возможное для уменьшения этой цифры.
Нет, я не ратую за отказ в доступе к сайтам с устаревших браузеров. Лучшим решением представляется вывод в верхней части страницы информационного сообщения, например: «ваш браузер устарел и не поддерживается — функциональность может быть ограничена» и ниже привести список рекомендуемых современных браузеров. Так уже сделали на YouTube, Google Docs (к концу 2010 года планируют прекратить поддержку в Google Mail и Calendar) и на многих других популярных сайтах. Я думаю, это очень хороший повод для того чтобы начать делать так же. А время, которое было бы потрачено на поддержку IE6, лучше израсходовать на что-нибудь более полезное, например, на разработку новой функциональности.

2. CSS3

Большинство расценивает CSS3 только как возможность сделать закруглённые уголки и добавить тень. Но, на самом деле, возможностей гораздо больше: загружаемые шрифты, outline, CSS3-переходы, flexible box layout, многоколоночная вёрстка, текстуры для контуров, media queries и многие-многие другие чрезвычайно полезные штуки.

Хотя CSS3 ещё в разработке, большинство современных браузеров уже поддерживают основные возможности, зачастую с префиксами (например: -moz-border-radius и -webkit-border-radius для Firefox и Safari/Chrome соотвественно).
Не стоит забывать, что по статистике большая часть пользователей до сих пор пользуется браузерами, не поддерживающими CSS3 (Internet Explorer 7 и 8). Но начинать изучать CSS3 стоит уже сейчас.
Ещё 39 приёмов и советов по CSS →

Не пропустите! В мае, на всех торрентах планеты!

Ну чтож, свершилось — сегодня Adobe официально представила пакет Creative Suite 5 (CS5). С предсказанием иконок я таки облажался, да. У меня, конечно, была мысль, что они могут использовать третье измерение, но… В итоге они сделали нечто параллелепипедо-папкообразное. Передняя плоскость один в один повторяет то, что было в CS3 и CS4, а шрифт теперь обрёл цвет. Мне, конечно, больше нравится мой вариант с белым фоном, но эти тоже вполне ничего:

Не могу дождаться того момента, как они появятся в доке.

Шон Черис, главный дизайнер Adobe’s Desktop Brand, немного рассказал про то как создавался дизайн:

Когда мы начали думать о том, что бы мы хотели сделать для CS5, единственное, c чем мы все согласились, это было то, что мы хотели вернуть бренду чувство радости. Нашей целью было выйти за рамки монолитных образов в CS3 и CS4 и создать более динамичный образ. Мы хотели вернуть вдохновляющие и возвышенные качества системе идентификации, усиливая успешные модели, которые мы использовали в CS3 и CS4. Все скучали по причудливым образам, которые были большей частью наследия Adobe и хотели удивить и вдохновить наших пользователей и дать им что-то новое.

Ладно, хватит уже о дизайне бренда, рассмотрим вкусности нового пакета. Начнём с самого интересного:
Photoshop CS5 →

Споры на тему нужности этого девайса продолжаются. После презентации iPad-а у меня случилось небольшое дежавю… Ах да, презентация iPhone. На этот раз ситуация почти повторяется — Apple опять представила шедевр: тонкий, красивый и стильный корпус, IPS-матрица, 10 часов работы от батарей и «всего» за $499. Не думал, что они модифицируют айфоновскую ось, ожидал увидеть десктопную с какой-либо оболочкой (тут почему-то вдруг вспомнился Стив Баллмер, пытающийся попасть пальцем в полосу прокрутки на планшете от HP).

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

Я пользуюсь айфоном уже более двух лет и заменю его разве что на новый айфон, и мой новый ноутбук/настольный компьютер точно будет от Apple. В первую очередь, дело в интерфейсе, удобстве и эстетической красоте — успех их продукции можно объясняется этим, маркетинг идёт потом. Я бы не стал покупать макбук, будь на нём Windows (за такие деньги, имеется ввиду ). Стыдно вспоминать, но изначально я хотел купить какой-нибудь Asus и поставить туда хакинтош.

Когда смотрел первый видеообзор iPad’а, уже спустя 30 секунд я начал испытывать непреодолимое желание пощупать эту штуковину, а когда досмотрел видео до конца, уже начал думать о внесении данного девайса в бюджет на 2010 год. Примерно тоже самое было когда смотрел первые обзоры айфона.

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

P.S. В итоге iPad в моём бюджете так и не оказался. А вот в подарок с удовольствием бы принял, день рождения уже не за горами.

В принципе, когда появился айфон, я даже не задумывался о его покупке. Но вот у меня сломался мой «Сони Эрикксон», и через пару недель айфон был уже в моих лапах. Хотя сейчас, вроде, и ломаться нечему, но я всё равно не удивлюсь, если айпад вдруг внезапно окажется у меня в руках.

P.P.S. Ну вот, iPad вышел. Спорам конец? Я уверен в одном, что за эту неделю айпад успеет всех зае всем надоесть.

P.P.P.S. Ну вот, и подтверждение последней фразы не заставило себя долго ждать — Обзор сами-знаете-чего от Engadget на Хабре стал постом зла. Я тоже попал под раздачу.

Год назад я делал афишу для первого «Metal Warriors». В этом году сделал плакат для второго:

Не стал придумывать что-то новое, повторил стиль первой афиши. Но на этот раз гораздо больше времени уделил типографике и сетке — применил, так сказать, новые познания. Кстати, тень на фоне я сделал из фотографии с концерта Nightwish.

Ну и, по модным ныне тенденциям, сделал ещё мини-афишку для богомерзкого вконтакта:

При наведении на эту картинку, можно увидеть версию, пожатую вконтактом. Красные цвета поплыли. Отвратительно.

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