— Привет, меня зовут Максим Покровский. Вы находитесь в моем рабочем кабинете. Поскольку я фрилансер, будем считать, что именно так он и выглядит. Здесь я пишу много интересных вещей, и если вы почувствовали, что я именно тот человек, который вам нужен, то я всегда открыт для контакта.
Сделал за последнее время:
| Заказать мне работу |
| 24.08 | Когда Photoshop отображает совсем не то, что надо |
Такая вот ситуация: дизайнер присылает макет, а у верстальщика открывается какая то лабуда светлая, или темная (если верстальщик испольует МасOS, а дизайнер Win.). Или же верстальщик сохраняет картинку, а там цвета другие стали.
Разберемся почему так и как с этим жить.
Небольшой экскурс в теорию. Для отображения цвета на наших мониторах используется цветовая модель RGB, но поскольку но, поскольку, мониторы разных моделей и производителей различаются, были предложены несколько альтернативных цветовых пространств, соответствующих «усредненному» монитору. Нам интересно пространство sRGB.
sRGB – это цветовая модель использование которой будет одинаково отображать графику как на навороченном так и на допотопном ноутбуке.
sRGB это пространство используемое по умолчанию для отображение графики в интернете.
Различие в профилях.
У правильного верстальщика профиль стоит North America Web/Internet. Проследите чтобы в Working Spaces было именно sRGB.
У правильного дизайнера тоже должен стоять такой профиль при создание макета сайта. Тогда ни у кого не будет проблем.
Помимо этого ваш Photoshop должен не только работать с нужным профилем, но и отображать вам истинный вид макета. А поскольку навороченные мониторы вряд ли используют усредненный sRGB, то необходимо чтобы стояла галочка на Proof Colors. Этим вы заставляете Photoshop отображать изображения согласно профилю.
Различия в OS
В Win по умолчанию на картинки накладывается профиль sRGB, то есть даже если вы не выбрали вышеуказанный профиль, у вас все равно будет sRGB. Однако в MacOs на картинки по умолчанию накладывается профиль монитора, что плохо. Однако решающее значение будет играть тот факт, какой профиль вы используете в граф. редакторе.
Есть еще одно различие: в Win гамма по умолчанию 2.2, а в Мас 1.8 (по крайней мере в последней ОС). Из за этого картинки с Мака выглядят темнее в Винде, и наоборот. Если дизайнер хочет постичь Дао, то нужно на Маке поднять гамму до 2.2 (кто скажет как это сделать, тому спасибо и ссылка Настройки -> Мониторы -> Цвет -> Калибровать -> Продолжить -> 2.2 Телевизионная гамма… Прокликать дальше, как-нибудь назвать и использовать.
Спасибо Вадиму Макееву). Почему поднять на Маке, а не опустить на Вин? Потому что в Linux тоже 2.2, да и новая версия МаcOS выйдет с гаммой 2.2 (слухи ходят).
Мне прислали макет в профиле отличном от sRGB
Это самое интересное.
Так бывает. Стоит у дизайнера какой-нибудь “Cinema HD_BQB01072007” и дизайнер знать об этом не знает. Мол, наше дело нарисовать, художника всякий обидеть может и тэдэ.
Вряд ли сможете убедить дизайнера перевести макет в sRGB и перерисовать все цвета. Разве что при совсем уж отчаянной харизме (впрочем топор тоже может помочь). Не страшно.
Для начала необходимо убедится, что у нас стоят вот эти галки.
Теперь при получении некошерного профиля нам будет выдаваться вот такое окошко.
Что мы тут можем сделать.
- Мы можем применить профиль который идет с изображение
- Мы можем конвертировать профиль в наше рабочее пространство.
- Мы можем продолжить использовать свой профиль.
Многие начинающие верстальщики перебирают все три способа, пока картинка не будет идентична той что отображается в просмотрщик(ACDSee или Irfan и примеру). И останавливаются на третем. Это НЕ ПРАВИЛЬНО, потому что вас просмотрщик тоже отображает не правильно.
И так допустим вы выбрали первый вариант. В этом случае при сохранении картинок нужно обязательно при сохранении картинки через Save for Web & Devices… убрать галку с Convert sRGB. Иначе у нас сохранится совсем не то что нам надо.
Внимание. В Photoshop CS3 она прячется здесь.
Я же настоятельно рекомендую выбирать второй пункт — конвертацию. Но перед этим зайдите в Convert to Profile и снимите вот эту галочку
Потому что в случае если в присланном вам профиле используется большее кол-во цветов чем в sRGB, то Photoshop будет пытаться заменить отсутствующие цвета комбинацией своих. Правда я не знаю как это будет выглядеть, ибо не сталкивался никогда. Скорее всего будет частичное цветовое несоответствие.
На этом все. Жду ваших вопросов.
| 08.07 | Горизонтали в дизайне и верстке |
Макет выверенный не только по вертикальной, но и горизонтальной сетке смотрится строже и солиднее. Но у веба есть свои законы и ограничения.
Взглянем на пример. Так по мнению дизайнера должен выглядеть макет.
А вот так он будет выглядеть по желанию копирайтеров, сеошников и других недизайнеров.
Что вызывает негодование в дизайнерской душе. Однако у сеошников и других “противников эстетики” своя работа, а у вас своя. И жертвовать кол-вом текста, высотой картинки и лишним баннером они не будут.
Посему выход для вас один — не привязывать горизонтали к динамическому контенту. Это как правило перечни товаров, менюшки, всевозможные текста. Другой вариант — это посветить в ваши сомнения верстальщика, возможно в ходе беседы вы сможете найти компромисс между возможностями браузеров и изысками дизайна.
Разумеется если вы хорошо верстаете или верстали когда-то, подобные проблемы отпадают за несостоятельностью.
| 05.10 | Внимательность к деталям |
Всегда уделяйте внимание несущественным на первый взгляд деталям.
Во-первых, так мало кто делает, что автоматом дает вам бонусную изюминку.
Во-вторых, взгляду свойственно затираться и он пропускает привычные нам мелочи. И когда мы показываем на них, то люди обычно восклицают:
— Точно! На скотче остается отпечаток пальца!
Наше мнение совпадает с мнением наблюдателя, и это очень круто.
В-третьих, следователь дал бы вам краба, за этот отпечаток, ведь спецы точно знают, что он там есть. Учитовать взгляд специалистов, очень помогает в тематических рисунках. Попробуйте, как-нибудь, для сайта клана по Quake, вместо от**доренной клавы, поместить клаву с затертыми буквами “W”‘, “S”, “A”, “D”.
Деталь не обязательно должна быть овеществленной. Человеческие чувства, пороки, привычки то же важные мелочи.
Как по вашему, почему это лист смят?
| 28.09 | Размещать рекламу надо с умом |
Есть три способа размещения баненной рекламы:
Разработать баннер под дизайн площадки (сайт, где висит баннер)
Это очень круто. Процесс сводится к использованию в баннере цветовой гаммы сайта, типографических элементов и отступов. Встречает редко, ибо дорого, сложно и как правило один баннер висит на нескольких сайтах, а под все сразу не нарисуешь.
Использование подложки.
Отличный способ сделать из самого уродского банера гармоничный элемент сайта.
Наиболее распространенные варианты подложек: стикеры, листочки с кнопками, и всякие другие штучки на которых в офлайне можно написать напоминание.
Более сложный (но изысканней) вариант с использованием изображений сайта. Например, если у вас нарисовано дерево на сайте, то на листьях можно разместить рекламу (ну или на коре вырезать). Тут вообще вариантов масса и все зависит от воображения, но стикеры влезут везде.
Как есть.
Самый распространенный вариант. Дитя лени и кривых рук. Берется любой банер и просто пихается в свободное место. Гармонии никакой, сайту носителю один только вред.
Думайте башкой, в общем, когда ставите баннер. И не ленитесь, чтобы не превращать свой сайт в кусок говна. Самую простую подложку сделать — дело одной минуты, а стикеров везде готовых полно.
| 30.08 | Нужна ли нам возможность выбора? |
Я начну с небольшой метафоры…
Представьте, что абсолютно типичный покупатель зашел в Евросеть купить телефон. Он подзывает типичного продавца и сумбурно объясняет, что хотел бы телефон в пределах такой-то суммы.
Знакомая картина? Продавец начинает суетится, он предлагает одну модель и смотрит на посетителя пытаясь угадать его желания, предлагает другую и снова пытливо заглядывает ему в рот. Предлагает подороже, подешевле, понавороченее, попроще, резиновый, имиджевый…. И при этом постоянно посматривает на покупателя, ожидая, что он, наконец, скажет, что это именно то, что он хотел
Что происходит? Происходит конфликт желаний. Продавец хочет, чтобы покупатель высказал ему свое желание, а покупатель, зайди в магазин, ждет, что ему скажут, покажут и дадут понять, что ему нужна именно эта модель.
| 27.08 | Сделать лучше |
Чтобы сделать хороший стартап, нужно взять какой-нибудь похожий на ваш проект и просто его улучшить. Так, по крайней мере думает большинство. И это же самое большинство думает, что “сделать лучше” — это довернуть сервисов, модулей и рюшечек.
Нет. Сделать лучше – это просто выкинуть то что сейчас плохо. И все. А, заливая в испорченный дегтем мед, еще меда, ты его не исправишь.
| 17.08 | Цветастая несправедливость |
Человек, фигня несовершенная. Подвержен слухо-глухо и другим люцинациям. Например, один и тот же цвет на разном фоне мы видим по разному.
Вывод — надо делать, так, как кажется правильным, а не так как нам говорят всякие пипетки
| 28.07 | Пиксельмания. Ату его, ату! |
По рунету ураганом пронеслась новость о новом дополнении к FireBag Pixel Perfect. Оное дополнение позволяет накладывать для сравнения полупрозрачный макет на верстку прямо в окне браузера, неся всем нам счастье и радость соответствия макета верстке. Ага, щаз…
| 17.05 | Веб-дизайнер. Кто такой? |
Миром правят недоразумения и шаблоны. Люди, например, хрен его знает, сколько лет считали, что солнце вращается вокруг земли, потому что всякие важные личности говорили, что так правильно, а остальным было лень разбираться.
Многие пали жертвой шаблона. Например, устоявшееся понятие «веб-дизайнер» — особь (как правило, мужская) делающая HTML-странички. Уныло как-то.
Порой дизайнеры даже стесняются назвать свою профессию — знают ведь, что не поймут их. Вернее поймут, но так, что хоть в морду давай.
Кстати, шаблон веб-дизайна, именно тот редкий случай, когда обратная сторона медали выглядит еще хуже. Любая особь (как правило, мужская) сделавшая пару страничек и выложившая их в сеть, считает себя веб-дизайнером (некоторые, к счастью начинающими). Совсем недавно моя знакомая гордо заявила, что ее мама тоже (!!!) делает сайты. А ведь еще вчера не умела. Вона какой талант!
А ведь в моем понимании это такая профессия, освоив которую человек уже может не опасаться за кусок хлеба. Ну, сами посудите.
— Графика. Я не веду речь о таких гуру как феррарист или фригер. Они иллюстраторы – люди умеющие рисовать красивые картинки. Однако веб-дизайнер рисовать тоже должен уметь в рамках способностей любого человека. Должен уметь видеть баланс композиции, чувствовать пространственные отношения, и понимать, что типографика тоже может быть красивой.
— Верстка. Она неотрывно связана, с веб-дизайном. Кто из моих читателей верстальшиков не мечтает, чтобы их следующий макет был бы создан, человеком, пусть не специалистом, но хотя бы близко знакомым с версткой? А сколько дизайнов было загублено только потому, что их создатель не учел очевидных для любого верстальщика истин. Я уж и не говорю, что соблюсти семантику в таких макетах, порой попросту невозможно.
— Юзабилити. Ты можешь совершенно не знать, как рисовать тени и отражения, но знать, где лучше расположить форму регистрации просто обязан. К сожалению, многие подходят к вопросу юзабилити, основываясь на обычном житейском опыте и интуиции. А ведь за этой наукой стоит огромное кол-во исследований и опытов. Тем не менее, это неотъемлемая характеристика дизайнера. Если у нас, в рунете, люди готовы пускать слюни на сайт с красивой картинкой, то в стране «забугряндии», человек не нашедший в течение 20 секунд кнопку «оплатить» или «регистрация», уходит и больше не возвращается.
— Кодинг. Не, я не призываю засесть всем за учебники по php. Просто таже самая верстка, сильно связана с программированием. Если вы работали в офисе, то не раз и не два слышали матюки программистов в сторону верстальщика. То есть веб-дизайнер может и не уметь кодировать, но уж точно программинг для него не пустой звук.
Итого неслабый наборчик скилов выходит. Согласитесь, что, потратив на освоение всего этого добра не один год, обидно услышать, что вас сравнивают, с человеком только что научившемся создавать home-pages.
Весьма примечателен комментарий моего знакомого ролевика:
— Мегамачкинский персонаж получается — играть сложно, развивать долго, но уж если раскачаешь…
| 10.05 | Заметка фрилансера #1 |
Старайтесь избегать демонстрировать заказчику неготовый к показу продукт. Даже если клиент настаивает на демонстрации текущей стадии, попросите немного времени чтобы привести вашу работу в прилежный вид. Вероятность того, что вам попадется заказчик хорошо сведущий в вашем деле, низка, а способность разглядеть на листе чистом листе красивый дизайн или новую социальную сеть и вовсе присуща только избранным.
| ! | Самое обсуждаемое |
- 16 признаков крутого верстальщика - 52
- Bundles для e-texeditor - 37
- Переходим на em - 33
- Семантика или как же лучше - 28
- Веб-дизайнер. Кто такой? - 26
- Контейнер для float - блоков - 23
- Убираем отступ у последнего элемента списка. - 21
- Меняем лицо - 20
- Как сделать upload в комментариях - 20
- Пиксельмания. Ату его, ату! - 19
— XP была бы отличной ОС,если бы с ней не поставлялся браузер.
Максим Покровский
Они читают меня, я читаю их