Не знаю - есть ли у этой техники обработки портрета официальное название, но прижилось в народе "стиль Esquire". Есть как сторонники этой техники, так и ярые противники, однако надобно признать, что стиль получился вполне узнаваемым и весьма эффектным.
Сразу скажу - попробовал и я с фотошопом повыделываться - фигня получилась редкостная: наполовину из-за кривизны рук, ясен пень, а еще из-за низкого качества исходного материала. Фотографию для обработки желательно брать высокого качества, с приемлемой резкостью (с заблюренной и смазанной картинкой 100% ничего толкового не выйдет), очень желательно в высоком разрешении.
So, numero uno - от illustrateddesigns, он же в русском переводе в ЖЖ-сообществе ru_photoshop, и альтернативный мануал от Ирины Асковой, чью картинку я позаимствовал без спросу.
Собственно, всё: строчи гламур - коси бабло, младодизайнер!
хотя некоторых учить - только время тратить. Но я не теряю надежды - это я о себе, поэтому пишу в блокнотик впечатлениям вдогонку о том, что в течение года планирую перечитать еще раз-другой:
Концепция проекта - сжатый мануал по описанию любого начинания: идея, цели, УТП, аудитория, конкуренты, бизнес-модель, развитие... универсальный паттерн описания для стартапа.
Факторы ранжирования в СЕО - для самых маленьких, или для студентов, учащихся по Болонской системе - плюсики, минусики - всё просто и наглядно. Можно показывать совету директоров - некоторые, возможно, даже поймут, о чём речь.
Microsoft Windows EULA на русском с разъяснениями - расшифровка того, что на самом деле написано в пользовательском соглашении. Вот например, вы знаете, что проинсталлировав Windows,
Вы соглашаетесь с тем, что в любой момент, по просьбе “поставщиков защищённого контента” Microsoft может деактивировать некоторые функции вашего компьютера, например, возможность проигрывать музыку или фильмы. Вы так же соглашаетесь, что Microsoft может принудительно загружать в ваш компьютер список отзываемых у вас прав на использование функций вашего компьютера по просьбе “поставщиков защищённого контента”.
25 Excellent Photoshop Texture Tutorials - давно не брал я в руки шашку, в смысле - не запускал пробную версию Adobe Photoshop. Однако уроки знатные, подобраны с любовью и со смыслом, руки так и тянутся повторить что-нибудь из представленного.
Прокрутка и внимание - перевод статьи Якоба Нильсена на хабре, самым нетерпеливым спойлер: не размещайте баннеры на частях страницы, не помещающихся на первый экран - не кликнут! Некому кликать, многабукав нынче не в моде.
Некоторые вещи, которые детям не рассказывают в школе. Набор банальностей, которые можно распечатать и заказать доставить вашим молодым наследникам в случае чего, если вам самим сказать нечего. Банально, но толково, неплохая энциклопедия молодых сурков, очень сжато, по Нильсену =)
Как перестать беспокоиться и начать работать в Gimp без ностальгии по Фотошопу? Собственно, 2 пути есть у настоящего джедая - настроить интерфейс Гимп по образу и подобию Adobe Photoshop, или заставить себя привыкнуть к неудобному новому интерфейсу. Сразу признаемся, что подавляющее большинство приверженцев фотошопа (НЕ профессиональных графических дизайнеров)
Вот для этой многочисленной аудитории и правда нет смысла платить 600 и более долларов (а пиратские версии мы не используем, ведь правда?), чтобы получить функционал, вполне доступный в бесплатных и легальных инструментах, среди которых Gimp явно занимает лидирующие позиции.
Итак, замена интерфейса на привычный. Есть только один способ (но его никто не знает) - плагин Gimpshop. Имеется Windows-версия, есть source, есть deb-пакет (неофициальный и только для 32-битных OS), для пользователей Ubuntu остается сборка из исходников - до первого обновления самого Гимпа, а потом - пересобирать плагин или откатываться назад, увы. Функционал плагина довольно скромный - заключается в основном в компоновке так пугающих новичков разбросанных по рабочему столу окошек в одно с более-менее привычными панелями. Мне такое удобство кажется сомнительным, так что я даже не стал экспериментировать.
А раз так - то важнейшим из искусств для нас остаются кино и цирк, упс, цитаты попутал - будем учиться и еще раз учиться. Туториалов по Гимпу на русском языке становится всё больше, надо только уметь их искать. Полуофициальный Gimp.ru находится в перманентной коме, смотрим - что еще полезного есть в рунете:
Таким образом жаловаться на отсутствие информации о GIMP может только ленивый, осталось только отвыкнуть от Photoshop, это легко - почти как бросить курить :)
Спонсором этого выпуска был тоже мануал: как купить мобильный телефон, вдруг кто не знает?
SimplePie - это класс php, позволяющий делать много разнообразных операций с rss-потоками. RSS можно объединять, выводить на своей странице заголовки, текст, можно создавать свои способы выводы для различных лент, в общем, SimplePie - это полноценный инструмент для управления этим замечательным форматом вывода данных.
Ребята из CSS-Tricks создали простое демо, показывающее, как легко можно сделать вывод нескольких синдицированных потоков на одной странице, и подготовили скринкаст - получасовое видео, иллюстрирующее весь процесс создания проекта. Докладчик не гундосит, не заикается, что редкость по нынешним временам, всё изложено доступным и понятным английским языком, даже если вас выгнали из 7-го класса школы за прогулы английского, но с php вы дружите, то проблем с пониманием не возникнет.
Кстати, видео не обязательно смотреть прямо на их странице - можно скачать в хорошем качестве (82 Мб) и изучать локально.
upd: ребята из NetTuts быстро просекли фишку и недолго думая, наваяли свой скринкаст и туториал, с примерами и образцами на ту же тему SimplePie - как всегда добротно и увлекательно. Также рекомендуется к ознакомлению.
Когда посетитель заходит на созданный вами сайт, он не обязательно обращает особенное внимание на графику, звук, цвет - он сразу смотрит на текст.Не особенно важно, сколько красивых графических прибабмасов вам удалось наворотить, первое впечатление о полезности сайта посетитель получает от увиденного текста. Это само по себе должно сделать типографику (искусство оформления текстов) одним из приоритетных моментов в разработке сайта. В этой статье мы рассмотрим 10 простых правил, про которые нежелательно забывать, проектируя очередной проект.
Разрабатывая сайт типа JonesingFor, дизайнер, не понимающий, о чем идет речь на сайте, попал бы в затруднительное положение, пытаясь использовать приемы типографики, которые бы реально заработали (от себя - очень интересный пример, кстати). Решая вопросы типографики, дизайнер естественно не должен писать собственные тексты, но он должен хотя бы прочитать предоставленные заказчиком. Некоторые дизайнеры думают, что их основная обязанность (работы с текстом - прим.) - скопировать полученный текст и вставить его в сверстанный макет. Но прочтение предлагаемого текста как минимум подскажет, как можно органично интегрировать текст в дизайн, избегая диссонанса между смыслом содержимого и его отображением.
Как вы думаете, удалось бы вам создать сайт Jesus Rodriguez Velasco, не имея представления о чём он? Дизайн находится в сильной зависимости от текста, в том числе и от специфических слов, используемых в тексте: Представьте этот дизайн, в котором все заголовки и абзацы начинаются с Lorem Ipsum. Представили? Если в тексте Вашего сайта на самом деле Lorem Ipsum, ваш шаблон не будет иметь никого сходства с реальным. Это означает, что будут невозможны никакие осмысленные настройки шрифта, или дизайна - придется подождать, пока вы не получите реальный текст. Требуйте (и получайте) текст от своего клиента как можно раньше в процессе разработки, это даст вам возможность раньше продумать наиболее подходящий дизайн и детали типографики.
Когда вы зайдете на сайт Rik Cat Industries, у вас не возникает вопросов, откуда начать чтение. Хотя в наличии есть несколько ссылок в верхней части страницы, заголовок документа бросается в глаза в первую очередь. Это очень важно: установить четкую иерархию, используя типографику. Каждый сайт нуждается в хорошо реализованной информационной иерархии: необходимы маячки - с чего начать чтение и как действовать дальше. Ваша типографика может предоставлять все возможности для отображения иерархии в навигации - так же, как на сайте Рика. Достаточно подумать о размерах и типах шрифтов, выделить фрагмент текста как заголовок и подчеркнуть его значение таким образом, как никакой графический дизайн просто не может это обеспечить. Отображение информационной структуры и иерархии в ней конечно выходит за рамки просто типографики, но, поскольку пользователи почти всегда в первую очередь обращают внимание на текст, имеет смысл для дизайнеров обратить на это внимание.
Дизайн сайта Crowley Webb and Associate’s был разработан, опираясь на 2 приёма: макро-и микро-типографику. Макро-типографика: это общая структура вашего текста, как она представляется в контексте вашего дизайна и его эстетики, если вы воспринимаете блок текста как объект дизайна сам по себе. Микротипографика решает вопросы оформления мелочей: интервалы между словами, строками, использование шрифтов - все эти мелкие детали, благодаря которым текст легко читать. Совершенно необходимо уделить ей особенное внимание, ведь если текст неразборчив - какой смысл публиковать то, что никто не прочтет? А макро-типографика предоставляет вам возможность сделать ваш текст более чем просто хорошо отформатированным: это шанс сделать его привлекательным, сделать его органичной частью всего дизайна. Правильный выбор цвета и подбор шрифтов на сайте делает текстовый блок жизнеспособным и цельным. Игнорирование же тех или иных аспектов типографики может уничтожить весь замысел дизайнера.
Было бы так легко потерять текст на сайте ArtofElan, особенно ярко-красный на темно-красном в сочетании цветов, используемых дизайнером. Когда веб-дизайнер работает с цветным текстом, то нет гарантии того, что не сольются сочетания красное на красном, или даже комбинация желтого с красным будет видна. Можно запросто вывихнуть глаза на таком сайте. Самым простым решением этой ситуации заключается в том, чтобы убедиться в том, что цвет вашего шрифта существенно отличается от фона. Сочетание черного и белого работает настолько хорошо и используется так часто потому, что они резко контрастируют, но есть и другие комбинации цветов, которые позволяют получить отличный результат: что-то из сочетаний темно-синего цвета на светло-розовом тоже будет смотреться неплохо. В то же время обратная комбинация, светло-розовый текст на синем фоне скорее всего приведет к потоку жалоб.
Если используете CSS только в коде страниц и не умеете проектировать единый стиль, то переход между страницами сайта будет похож на переключение стилей на сайте Hutchouse.com. Даже если разница между стилями страниц будет не такая существенная, использование единого стиля CSS может помочь устранить любительские ляпы типографики, такие как неуказанные шрифты (и используемый принятые пользователем по умолчанию), их размеры, цвета и так далее... CSS может легко обеспечить согласованность типографики на всем сайте. Даже если вы последовательны в том, как вы используете шрифты, однако даже небольшое отклонение от стиля может создать неблагоприятное впечатление о верстке в целом. (от себя - учите CSS и не верстайте шаблоны без общей стилевой таблицы, вот и весь смысл абзаца)
... в текстовых блоках. Если необходимо как-то выделить текстовый блок - выберите альтернативный способ, как в DesignCanChange.org - текст, выровненный по центру часто трудно воспринимается зрительно из-за неровных краёв по бокам. Если ваши читатели читают текст слева направо - достаточно выровнять текст по левому краю. (от себя - выравнивание текста по ширине(justify) также способно зрительно угробить текстовый блок, особенно если он небольшой по ширине)
Сайт Luigi Ottani демонстрирует, что особое внимание к кавычкам приносит свои приятные плоды - нет никаких проблем при их отображении, хотя часто с ними происходит настоящая катастрофа - некоторые символы браузеры просто не в состоянии корректно отобразить. Это наследие того, что большая часть текста с которым работает веб-дизайнер, как правило, набрана в Microsoft Word или переносится в код методом copy-paste. Просто не забываем - есть кавычки разные, отображение каждой из них должно быть оправдано, и должны быть подготовлены соответствующие программные средства (да, кавычкер - наше всё!).
Часто бывает, что часами вылизываешь дизайн, шрифты, несёшь его, гордый заказчику, а он, поправив очки, 2 раза нажимает в браузере Ctrl+. И появившиеся на экране гигантские буквы разрывают в клочки все дизайнерские задумки! Молодые дизайнеры прекрасно различают любой шрифт, набранный 10-12 кеглем, но не стоит забывать, что население планеты стремительно стареет, а сидение за компьютером остроты зрения не добавляло ещё никому, так что использование пользователем шрифта увеличенного до 14-16, да и до 18 кегля - это уже практически рядовой случай. Просто учитывайте это.
Если вы глянете на сайт A List Apart, то заметите, что почти каждый блок текста отображен в sans serif font (шрифт без засечек), благодаря чему этот текст гораздо легче читать. Заголовки и мелкие подзаголовки используют шрифт с засечками, подчеркивая дополнительное визуальное отличие. Когда речь заходит выводе текста на экран, Sans Serif шрифты почти всегда - лучшее решение, например шрифт Verdana, который был разработан для показа на экране компьютера. Шрифты с засечками имеют более высокую вероятность пикселизации, они отображаются с искажениями и замедляют зрительное восприятие текста.
***
Это был вольный перевод статьи 10 Web Typography Rules Every Designer Should Know, сходите на страницу оригинала - там ещё много картинок, которые я решил не вставлять все в свой перевод, чтобы окончательно не добить свой многострадальный дизайн.