Пиксельная графика в Illustrator
30.06.2009
Я уже немного писал про создание макетов сайтов в Adobe® Illustrator. А сегодня случайно набрёл на простой способ создания пиксельной графики.
Что нам собственно нужно?
- Привязка линий строго по пиксельной сетке;
- Отсутствие сглаживания
Решение как всегда пришло конца. У меня на маке не оказалось достойного кириллического пиксельного шрифта. А те, что на скорую руку нашлись в интернете отображались в Illustrator просто отвратительно. Кроме того, в Illustrator, в отличие от Photoshop, никак нельзя управлять сглаживанием шрифта. В результате набрёл на такую настройку: Preferences > General; снимаем галку «Anti-aliased Artwork», далее работаем в режиме Pixel Preview (View > Pixel Preview).

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


Есть и ложка дёгтя. Пока что не удалось получить такой же результат при выполнении команды File > Save for web — картинка растеризуется так, как будто никто и не отключал антиалиасинг у Artboard. При этом при выполнении команды File > Export всё пучком.
Этот неприятный минус, а так «квадратные» края у кривых, не позволяют использовать этот метод как основной в разработке макетов. Однако для создания схем и графиков, а так же черновых набросков — самый сок.
И помни, путь джедая — всегда «прибивать» опорные точки кривых к узлам пиксельной сетки.
P.S.: В статье использована картинка в к учебному пособию по курсу «Профессиональная вёрстка сайтов».
Пройдёмся по мосту
20.06.2009
В далёкой-далёкой древности компания Adobe добавила в пакет Adobe CS2 файловый менеджер-каталогизатор Bridge. Мгногие недоумевали, зачем нужна эта непонятная софтина, которая ещё и регулярно падает? На самом деле — это мега-клёвая программулина.

Bridge позволяет управлять всем вашим графическим хозяйством, он может искать файлы по куче параметров, может фильтровать файлы внутри папки. Можно назначать файлам рейтинг (я это делаю в обязательном порядке прежде чем начать обрабатывать Raw-файлы), а если не полениться и добавить файлам мета-описание — в будущем будет сэкономлена куча времени на поиск нужного кадра.
Да просто просматривать файлы в Bridge — одно удовольствие. Хочу — смотрю большие картинки, хочу - вижу сразу все.
Однако, как и большинство программ от Adobe, Bridge изначально имеет не самые оптимальные настройки и требует доработки напильником.
Открываем настройки (Edit > Preferences или Bridge > Preferences). Слева категории, справа настройки, как и везде %)
Наша цель — сделать так, что бы всё работало быстрее. Заходим в категорию Cashe. В кеше Bridge хранить превью и служебную информацию. Соответственно чем больше превью будет браться из кеша — тем быстрее будут показываться ранее просмотренные картинки.

По умолчанию Bridge располагает кеш в домашнем каталоге пользователя (на Windows — Documents and Settings/%User%, на MacOS — /Users/%User%). Соответственно, если ваши диски размечены так, что диск с самым большим количеством свободного места — это не тот диск, на котором установлена операционка — кеш лучше перенести. Делаем в два этапа: сначала удаляем старый кеш. Для этого нажимаем на кнопке «Purge Cashe».
Теперь указываем в Location специально созданную папку на самом большом разделе на винчестере (если её ещё нет — самое время создать). В группе Manage можем указать максимальный размер папки для кеширования.

Теперь переходим к ускорению запуска программы. Поскольку Bridge стремится интегрироваться со всем подряд — он долго обрабатывает все эти интеграции при запуске. В категории Startup Scripts можно отключить ненужные. Здесь решать вам, я оставляю только Adobe Bridge, Adobe Fireworks, Illustrator и Photoshop.
В качестве бонуса — страшная сказка. После удаления Adobe Photoshop CS4 на домашнем компьютере Bridge CS3 перестал открывать .NEF-файлы в Photoshop. На самом деле всё просто — заходим в категорию File Type Association и устанавливаем нужные соотношения.

Технологическим стандартом де-факто для создания графических макетов сайтов стал Adobe Photoshop. Такой макет будет принят любым верстальщиком, если выполнить минимальный набор требований, да и все входы-выходы давно описаны. Поэтому я не буду их описывать, а дам несколько рекомендаций по созданию графических макетов в Adobe Illustrator.
В своё время я неоднократно вливался в холивары на тему «Приносите нам макеты только в фотошопе» и придерживался непопулярного мнения о том, что макет нужно делать в той программе, которая позволит сделать это максимально быстро и удобно. И верстальщик должен обладать минимальными навыками работы с разными графическими пакетами. Однако я не учёл одного маленького, но важного фактора — дизайнер должен выполнить свою работу качественно и аккуратно. Только в этом случае не возникнет проблем и деформации кармы.
Читать полностью »
Бессмысленно и беспощадно
16.01.2009
С некоторого времени мои сайты, расположенные на одном аккаунте виртуального хостнга стали подвергаться атаке: в код страницы дописывался JavaScript-код, вызывающий загрузку вредного кода с другого сайта. Вариантов кода было несколько — и декодируемый, и просто iFrame.
Периодически я замечал такую пакость и вычищал соответствующую страничку, благо зловредный код располагался либо непосредственно после открывающего тега <body>, либо в конце страницы. Код внедрялся либо на страницу index.htm/index.php, либо в какой-нибудь инклюд (admin_header для wordpress, например).
Наконец, мне всё это поднадоело и я решил что-то с этим сделать. Насколько я понимаю, злоумышленники каким-то образом использовали одну из многочисленных уязвимостей и смогли проникать непосредственно на хостинг, модифицируя страницы. Искать причину проникновения — выше моих познаний, однако, как мне кажется, решение по борьбе с повторением атак найдено.
Поскольку происходила модификация кода от имени моего аккаунта (больше некому), то я просто решил изменить права доступа к файлам. Имея доступ по ssh это очень просто — воспользуемся командой chmod:
chmod 444 *.php *.inc *.html *.htm
В данном случае мы переводим в режим «только для чтения» все файлы, оканчивающиеся на php, inc, html и htm. К сожалению, данную команду пришлось запускать в каждом каталоге отдельно, поскольку рекурсивный обход файловой системы (chmod -R) почему-то не работал.
Однако, прежде чем изменять права доступа, необходимо было удалить вредоносный код. Поскольку я не знал, в каких именно файлах он содержится, то решил просто найти все файлы, которые были изменены за последние три месяца. Для этого я воспользовался следующей командой:
find * -mtime -120
В данном случае, мы ищем все файлы, модифицированные за последние 120 дней (я давненько ничего не менял на этих сайтах). Результатом выполнения команды был список файлов, которые я и отредактировал.
Для того, что бы иметь возможность выполнять команды непосредственно на сервере нам потребуется подключение по протоколу SSH (Secure Shell). Если хостинг не предоставляет возможности подключения по данному протоколу — тысячу раз подумайте перед тем, как переносить к нему свои ресурсы.
Естественно, для того, что полностью закрыть доступ к возможности модификации файлов нужно прежде всего сменить пароль доступа к серверу и проверить компьютеры на наличие вирусов.
С Новым 2oo9 годом!
26.12.2008
Решил (а точнее за меня решили %) вспомнить немного Flash и сваял за ночь вот такую незамысловатую игрушку. Дед Мороз катается на метро и периодически устраивает праздник.
Всех с наступающим! Всяческих удач!
