Сборник программ, шаблонов, скриптов, документации для создания современного веб-сайта. Подробнее...
Уникальный диск, содержащий более 500 электронных книг компьютерной тематики. Подробнее...
*
< Новые программы >
Template Shaker 1.0
WYSIWYG-редактор для генерации шаблонов XHTML/CSS, позволяющий веб-дизайнерам
быстро создавать и модифицировать внешний вид веб-страниц. Template Shaker
позволяет визуально создавать шаблоны веб-страниц, "на лету" настраивать
элементы веб-страниц с помощью специальных инструментов. После этого нужно
сохранить шаблон, открыть в любом HTML-редакторе, добавить информацию и
использовать на своем сайте. Программа позволяет настраивать и менять цвет и
картинки для фона, настраивать цветовые палитры для текста, ссылок и многие
другие элементы веб-страниц. скачать (1566 КБ, бесплатно)
PHP Expert Editor 4.2
Появилась новая версия редактора кода PHP и других языков программирования. PHP
Expert Editor 4.2 разрабатывался специально для работы с PHP кодом и имеет
встроенный отладчик PHP. А благодаря наличию встроенного HTTP-сервера, PHP
Expert Editor 4.2 позволяет выполнять файлы PHP, Perl, Python и скрипты. Тут
присутствует проверка синтаксиса PHP, настраиваемая подсветка кода, быстрая
вставка всех функций PHP, возможность использования шаблонов и устанавливаемых
пользователем "горячих клавиш", инструмент для быстрой навигации по коду PHP
файла, встроенный браузер и FTP-клиент. PHP Expert Editor 4.2 поддерживает
работу с файлами в кодировке UTF-8 и может сохранять все открытые файлы в один
проектный файл программы. Имеется возможность выбора одного из двух стилей
интерфейса: Classic или Office XP. Жители России могут зарегистрировать
программу бесплатно. скачать (бесплатно)
*
< Статья >
Интеграция Adobe Photoshop и Dreamweaver CS3
Сейчас наверное уже никто не оспаривает
лидерство Photoshop в области растровой графики. Аналогичную лидирующую позицию
в сфере веб-дизайна занимает и продукт Dreamweaver, который не так уж и давно
купила Adobe у Macromedia. Многие веб-мастера готовят графическую составляющую
сайта в Photoshop, а затем уже занимаются версткой в визуальных редакторах, и
перед специалистом всегда встает вопрос, как совместить работу двух программ,
сделать ее более комфортной и удобной. О том, как этого добиться, на примере
Photoshop и Dreamweaver CS3, и пойдет сегодня речь.
Откройте Dreamweaver CS3. Для нормальной работы
Dreamweaver требуется настройка сайта, указать его месторасположение на вашем
компьютере + некоторые дополнительные параметры. Поэтому, если соответствующая
настройка у вас не была проведена ранее, выполним ее сейчас. Для этого заходим в
меню Site >New Site. Вместо Unnamed Site вводим свое название
вашего проекта. Жмем Next.
В следующем окне нам предлагают выбрать
применяемую технологию (PHP, ASP и т.д.), остановимся на классическом html
варианте и выберем пункт No. I don’t want to use a server technology.
Жмем Next.
Указываем месторасположение папки сайта и снова
жмем Next. В следующем окне из списка выбираем None. Жмем на
кнопку Next. В последнем окне нам предлагают проверить указанную
информацию и либо все отменить нажав Cancel, либо подтвердить, нажав
Done. Жмем Done. Будет создан кеш сайта. Нам необходимо создать
главную страницу. Для этого идем в меню File >New. В поле Page type
указываем html, в Layout выбираем None, в Doc Type
устанавливаем None. И сохраняем ее командой File >Save as. В поле
имени файла укажите index.html
Подготовка закончена. Теперь предположим, у вас
есть готовый макет документа в PSD формате, и вы хотите интегрировать его или
его часть в веб-странику. В Dreamweaver идем в меню Image >Insert
и указываем ваш PSD файл макета.
Затем перед вам откроется диалоговое окно
Image Preview, где вы должны указать формат файла, качество картинки. Если
необходимо, то указать область для экспорта (в случае если макет большой, а вам
понадобилось добавить только кнопку или отдельную картинку из него).
Все инструменты интуитивно понятны. Они по сути
выполняют те же функции, что и в Photoshop с незначительными отличиями. Так в
частности, здешний инструмент Export Area очень напоминает обычный Crop,
попробуем применить его тут и вы увидите что он отсекает лишние внешние области.
После того как определились с выходными данными, жмем кнопку Ок. нам предлагают
сохранить изображение в директорию сайта и задать ему имя. Что ж, так и сделаем.
Добавим текста на нашу страницу. И теперь
посмотрим дополнительные возможности по работе.
Щелкните по изображению левой кнопкой мыши и обратите внимание на нижнюю часть
рабочего окна Dreamweaver. Для удобства присмотритесь к скриншоту.
Строка SRC ссылается на источник
изображения, т.е. в данном случае на PSD файл откуда было импортировано
изображение.
Строка Align, отвечает за выравнивание изображения относительно текста.
В строке Edit значок Photoshop CS3 означает ни что иное как
редактирование всего макета в нем.
- данная
кнопка позволяет выставить вручную размер документа, качество будет выбрано
автоматически. Обратите внимание, что изменения производимые данной кнопкой и
другими из этого ряда применяются к импортированному изображению а не к макету.
слева направо:
Crop - выполняет операцию кадрирования,
аналогична кадрированию в Photoshop.
Resample - добавляет или вычитает пикселы из
измененного JPEG или GIF файла, чтобы изображение максимально соответствовало
оригинальному. Данная функция уменьшает размер файла и улучшает скорость
загрузки.
Brightness and Contrast - позволяет изменять
яркость и контрастность изображения.
Sharpen - корректирует резкость изображения.
И последнее, что хочется добавить по поводу
интеграции. Рекомендую вам установить Photoshop в качестве программы для
редактирования изображений, расположенных в Dreamweaver, по умолчанию.
Согласитесь, гораздо удобнее иметь возможность открыть требуемое изображение в
редакторе щелкнув по нему правой кнопкой мыши и выбрав соответствующий пункт,
чем пытаться найти его в возможно сложной структуре директорий изображений из
большого списка. Итак, исправляем положение. Идем в меню Edit >Preferences
>File Types Editor. В поле Extensions (Расширение) выбираем соответствующий
тип файла, к примеру .gif, затем в правой части, где поле Editors, щелкаем по
плюсику и указываем путь до файла, запускающего Photoshop.