Создание готового web-сайта средствами Adobe Muse

Для создания рабочей версии сайта, которую в последующем можно загрузить на хостинг, использовался редактор, ориентированный на создание сайтов — Adobe Muse.

Adobe Muse, разработанный компанией Adobe Systems, стал настоящим подарком для тех, кто только приступает к ознакомлению с аспектами кодировки web-сайтов. Регулярно увеличивающееся число пользователей мировой сети направило компанию к созданию обновляемого и простого в применении редактора для создания web-сайтов. Появление Adobe Muse произвело настоящий фурор в мире цифровых технологий. [13].

Многофункциональный программный продукт существенно упрощает разработку web-сайтов. Различные степени сложности, от визиток и портфолио вплоть до web-сайтов с большим количеством страниц, которые легко и быстро создать, не расходуя время на проработку кода. Главная задача Adobe Muse — это дать возможность разрабатывать высококачественные ресурсы, не обладая при этом многолетним опытом web-программиста. Для работы с редактором достаточно знать в общих чертах процесс создания web-сайта. Доступный и понятный интерфейс не требует особой расшифровки. На странице цифрового продукта располагаются панели с инструментами для работы. Поддержка новейших стандартов кодирования позволяет создавать сложные страницы с анимацией и видео файлами. Для Adobe Muse выбран самый широкий список различных шрифтов и цветовых решений. [13].

Из преимуществ Adobe Muse можно выделить:

• 1. Программа обладает высокой скоростью работы и большим перечнем возможностей.
• 2. В Adobe Muse представлена возможность разрабатывать различные версии сайтов под планшетные устройства и телефоны. И таким способом охватить ещё большее число пользователей.
• 3. Adobe Muse реализовывает поддержку новейших стандартов web-разработки: HTML5 и CSS3. Это означает, что в формируемых страницах имеется возможность располагать разнообразные интерактивные составляющие, такие как анимацию, parallax-эффекты и т. д.
• 4. Допускается бесплатное использование программы в течении 30 дней.
• 5. Обладает собственной CMS-системой, таким образом после того, как вы загрузили сайт в интернет, вы можете по надобности редактировать содержимое через любой браузер, где бы вы не находились, дома или на работе. Для этого понадобится только знать логин и пароль от вашего хостинга.

Из минусов можно отметить:

• 1. Сложности с добавлением сторонних скриптов.
• 2. Сложности при редактировании проекта, в связи с особенностями вёрстки.
• 3. Постоянная привязка к самой программе. Если вы поправили код уже готовой страницы, то в случае редактирования в редакторе придётся править по новой. Как уже описывалось ранее, для создания данного web-сайта использовались: Adobe Photoshop CC 2017 и Adobe Muse CC 2017. В программе Adobe Photoshop CC 2017 был разработан внешний вид сайта, после чего все слои с растровой графикой были сохранены средствами модуля «Save for web», что в переводе означает «Сохранить для сети» .

" Save for web" — это очень мощный модуль управления процессом сохранения растровых документов, который позволяет подобрать оптимальные настройки сохраняемого изображения (оптимизировать изображение). Модуль «Save for Web» поддерживает самые распространённые форматы для сети Интернет — JPG, GIF, PNG.

В большинстве случаев использовался формат JPEG c выставленным 70% качеством для лучшей компрессии изображения и меньшего размера файла, также для сохранения графических изображений с прозрачностью использовался формат PNG-24 со стандартными настройками. На рисунках ниже показан внешний вид модуля «Save for Web» и настройки, использованные для этого модуля.

После экспорта всей графики из Adobe Photoshop начинается этап создания готового web-сайта в Adobe Muse. Процесс создания web-сайта в данном программном обеспечении имеет следующий алгоритм:

• 1. В первую очередь переходим в Файл? Новый сайт. В открывшемся окне выставляем «Максимальное значение ширины сайта» на 1020 пикселей, в списке выше выбираем «Гибкое значение ширины» .
• 2. Далее создается шаблон, который будет использоваться на всех страницах web-сайта. В этом случае мастер-шаблон содержит «шапку» и «подвал» сайта.
• 3. Следующим шагом создаются все основные страницы сайта. В данном случае были созданы страницы: «Главная» или домашняя страница; «О компании»; «Контакты»; «Информация. После создания страниц, карта сайта имеет следующий вид (см. рис. 2.17):
• 4. После этого остается повторить созданный ранее в Adobe Photoshop макет. Сделать кликабельные кнопки, навигационное меню, импортировать сохранённую графику, разместить все элементы в соответствии с макетом, поработать с гиперссылками.
• 5. Завершающим этапом является экспорт HTML документа или загрузка web-сайта на FTP сервер прямиком из Adobe Muse. Экспортированный HTML документ также можно загрузить средствами сторонних FTP-клиентов таких как: FileZilla, FTPRush или WinSCP. Для загрузки файлов на FTP-сервер в Adobe Muse нужно перейти в раздел «Файл» и выбрать соответствующий пункт
• 6. На этом этап разработки уже рабочего web-сайта окончен. В следующей главе будет описан процесс загрузки файлов на FTP-сервер, а также предоставлена теоретическая информация о FTP-протоколе.