Что такое каркас сайта?

Как использовать простые линейные рисунки, чтобы начать свои проекты

Веб-каркас – это простое визуальное руководство, показывающее, как будет выглядеть веб-страница. Он предлагает структуру страницы, без использования графики или текста. Каркас веб-сайта будет показывать всю структуру сайта, включая ссылки на какие страницы.

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

Что нужно включить в каркас веб-страницы:

  • боксы для первичных графических элементов
  • размещение заголовков и подзаголовков
  • простая структура макета
  • призывы к действию
  • текстовые блоки

Как создать простой веб-каркас

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

  1. Нарисуйте большой прямоугольник – он может представлять либо всю страницу, либо только видимую часть. Начните с видимой части, а затем разверните ее, чтобы включить элементы, которые будут ниже сгиба.
  2. Нарисуйте макет – это 2 колонки, 3 колонки?
  3. Добавьте поле для графического заголовка. Нарисуйте столбцы, если хотите, чтобы они были одним заголовком над столбцами, или просто добавьте его в нужное место.
  4. Напишите «Заголовок», где вы хотите, чтобы ваш заголовок H1 был.
  5. Напишите «Подзаголовок», где вы хотите, чтобы Н2 и нижние заголовки были. Это помогает, если вы сделаете их пропорциональными – h2 меньше, чем h1, h3 меньше, чем h2 и т. Д.
  6. Добавить в коробки для других изображений
  7. Добавьте в навигацию. Если вы планируете вкладки, просто нарисуйте прямоугольники и напишите «навигация» поверх. Или поместите маркированные списки в столбцы, где вы хотите навигации. Не пишите содержание. Просто напишите “навигация” или используйте строку для представления текста.
  8. Добавьте дополнительные элементы на страницу – определите, что они с текстом, но не используйте фактический текст содержимого. Например, если вы хотите, чтобы кнопка «Призыв к действию» находилась в правом нижнем углу, поместите туда поле и назовите его «призыв к действию». Не пишите “Купи сейчас!” в этой коробке.

После того, как вы написали свой простой каркас, и вам не понадобится более 15 минут, чтобы набросать один, показать его кому-то еще. Спросите их, если что-то не хватает, и для других отзывов. Исходя из того, что они говорят, вы можете написать другой каркас или оставить тот, который у вас есть.

Почему бумажные каркасы лучше всего подходят для первых проектов

Хотя можно создавать каркасы с помощью таких программ, как Visio, для начальных сессий мозгового штурма вы должны придерживаться бумаги. Бумага не выглядит такой постоянной, и многие люди подумают, что вы бросили ее вместе за 5 минут, и поэтому не стесняйтесь дать вам хорошую обратную связь. Но когда вы используете программу для создания модных каркасов с идеальными квадратами и цветами, вы рискуете оказаться втянутыми в саму программу и потратить часы на то, чтобы усовершенствовать то, что никогда не будет реализовано.

Бумажные каркасы легко сделать. Если вам это не нравится, вы просто скомкаете бумагу, выбросите ее в мусорную корзину и возьмите новый лист.

Оцените статью
Solutics.ru
Добавить комментарий