Добавление текста и текстовых фреймов в Adobe Muse

Добавление текста и текстовых фреймов в Adobe Muse

Узнайте все о работе с текстом в Adobe Muse. Изменение форматирования текста, добавление отступов, установка значений отступа и другие возможности панели «Текст».

Во время создания сайта текст можно добавить с помощью Adobe Muse одним из следующих способов:

  • Добавьте текстовое поле, а затем начните вводить содержимое в текстовом поле.
  • Сохраните текст в текстовом файле и импортируйте этот файл на страницу Adobe Muse.
  • Для компоновки текста используйте подходящее приложение, например InDesign. Скопируйте этот предварительно отформатированный текст в буфер обмена и вставьте его в Adobe Muse.

В адаптивном макете текст можно форматировать в соответствии с особенностями устройства, на котором пользователи будут просматривать веб-сайт. Например, для смартфонов текст можно сделать крупнее и с более высоким значением заполнения, чем в версии для настольных компьютеров. Кроме того, возможности веб-дизайна в Adobe Muse также позволяют форматировать текст для каждой точки остановки. Для каждой точки остановки можно изменить стиль, цвет, интерлиньяж, заполнение и размер текста. Дополнительную информацию о форматировании текста при создании веб-сайта для различных типов устройств в одном файле см. в разделе Форматирование текста в адаптивном веб-дизайне.

Создание и оформление текстовых фреймов

Для заполнения меню необходимо скопировать текст меню из внешних текстовых файлов и вставить одержимое в текстовые фреймы. Кроме того, для оформления текста нужно создать и применить стили абзаца. Выполните следующие действия.

Редактируя страницу в представлении «Дизайн», создайте текстовый фрейм с помощью инструмента «Текст». Если требуется скопировать текст из другого исходного файла, скопируйте текст и нажмите внутри текстового фрейма Adobe Muse инструментом «Текст». Вставьте скопированное содержимое в текстовый фрейм.

С помощью инструмента «Текст» выделите любую строку текста.

На панели «Текст» выберите одну из следующих настроек для форматирования текста:

  • Шрифт: Droid Serif Bold (или другой шрифт семейства serif)
  • Размер шрифта: 14
  • Стиль: полужирный
  • Цвет: #A6342A (красный)
  • Выравнивание: слева
  • Интерлиньяж: 120%

Форматирование текста с использованием следующих дополнительных параметров форматирования текста:

  • Надстрочный индекс
  • Подстрочный индекс
  • Верхний регистр
  • Нижний регистр

Не снимая выделения с текста, нажмите кнопку «Новый стиль» в нижней части панели «Стили абзаца» («Окно» > «Стили абзаца»). Дважды нажмите новый стиль абзаца и переименуйте его в «food-header».

Это упростит повторное применение данного форматирования к другим заголовкам меню.

Выберите следующий пункт меню завтрака с помощью инструмента «Текст»: Croissants $3.

Нажмите стиль абзаца с именем «food-header», чтобы применить ко второму пункту меню завтрака такое же форматирование.

Повторите шаги 7 и 8, чтобы применить стиль абзаца «food-header» к остальным пунктам меню завтрака в текстовом фрейме (все строки со знаком доллара).

Начиная сверху, выберите с помощью инструмента «Текст» описание первого пункта меню завтрака: Bananas, mandarin oranges, red delicious apples, mixed berry cup.

Нажмите стиль абзаца «body» на панели «Стили абзаца», чтобы применить форматирование к строке текста.

По очереди выделите оставшиеся описания пунктов меню завтрака и примените к ним стиль абзаца «body».

Вы можете посетить действующую версию образца сайта и использовать его в качестве наглядного пособия.

Дополнительную информацию по работе с текстом см. в статье Шрифтовое оформление в Adobe Muse.

Использование встроенного средства проверки орфографии

Adobe Muse содержит средство проверки орфографии, которое упрощает поиск и исправление типографских ошибок в текстовых фреймах. Средство проверки орфографии всегда включено. Оно подчеркивает красной волнистой линией все слова, которые отсутствуют в его словаре.

Если одно из предлагаемых слов подходит, то выделите его с помощью мыши или клавиши со стрелкой вниз и нажмите клавишу Return/Enter, чтобы вставить его. Если вы ошиблись и выбрали не то слово, просто отмените изменение (меню «Редактировать» > «Отменить») и выберите другое слово из списка или отредактируйте слово с помощью инструмента «Текст».

Если слово, помеченное как ошибка, используется только один раз (например, имя человека или название места) и вы уверены в его правильном написании, исправлять его не требуется. Красные линии подчеркивания, видимые в представлении «Дизайн», не отображаются при предварительном просмотре, публикации или экспорте сайта.

Часто используемые слова, такие как названия предприятий и адреса, можно добавить в словарь средства проверки орфографии, чтобы они не помечались как ошибка каждый раз.

Используя инструмент «Текст», нажмите правой кнопкой мыши слово, которое необходимо добавить в словарь, и выберите в контекстном меню пункт «Добавить в словарь».

Вы можете настроить предпочитаемый язык (который в свою очередь задает язык словаря средства проверки орфографии) для всего сайта и для каждого отдельного текстового фрейма.

Чтобы настроить словарь средства проверки орфографии для всего сайта, выберите «Файл» > «Свойства сайта». Откройте вкладку «Текст», выберите необходимый язык в меню «Язык» и нажмите кнопку «ОК».

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

Чтобы настроить словарь средства проверки орфографии для текстового фрейма, выделите текстовый фрейм с помощью инструмента «Выделение». Нажмите правой кнопкой мыши и выберите в контекстном меню пункт «Язык» > (необходимый язык).

Далее перейдем к оформлению внешнего вида текстовых фреймов. Текстовые фреймы можно оформлять так же, как прямоугольники и фреймы изображений, настраивая для них обводку, заливку и фоновые изображения.

Изменение оформления текстовых фреймов

В этом разделе вы узнаете, как изменять атрибуты текстовых фреймов, чтобы они выделялись на фоновом изображении страницы.

Выделите текстовый фрейм с меню завтрака с помощью инструмента «Выделение».

На панели элементов управления установите ширину обводки на 5 и выберите для нее черный цвет.

В меню «Заливка» выберите для цвета заливки образец, переименованный в «cream-menu» (или введите значение цвета: #E9916F). Нажмите значок папки рядом с разделом «Изображение» и выберите в папке с файлами образцов файл «bg-texture.png». Нажмите кнопку «ОК», чтобы закрыть диалоговое окно «Импорт». Для параметра «Подгонка» установите значение «Мозаика» и нажмите в другом месте страницы, чтобы закрыть меню «Заливка».

При необходимости измените размер текстового фрейма, перетащив его манипуляторы с помощью инструмента «Выделение», чтобы уместить в нем весь текст. Размеры меню завтрака на опубликованном образце сайта приблизительно составляют 800 пикселей в ширину и 440 пикселей в высоту.

Мозаичное фоновое изображение с заливкой бежевого цвета придает текстовому фрейму эффект пергамента, а темная обводка делает его заметным на фоновом изображении.

Теперь над меню для завтрака необходимо добавить заголовок, чтобы обозначить его для посетителей.

С помощью инструмента «Текст» создайте текстовый фрейм прямо над меню «Breakfast», выровняв его по левой стороне.

📎📎📎📎📎📎📎📎📎📎