Простая модульная сетка в дизайне

перейти к комментариям


Easy grid

Про grid

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

Wikipedia говорит:

The purpose of the grid is to help the designer organize the content of the page in a pleasing and easy-to-digest manner for the viewer by imposing structure and cohesion to the layout.

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

О приемах работы с сеткой можно почитать, например в статье Марка Бултона Five simple steps to designing grid systems.

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

Виджет для создания сетки

Grid-виджет Указанный способ мне кажется слишком сложным, к тому же, совсем недавно я обнаружил чудесный инструмент для визуализации сетки без всяких неудобств. Речь идет о виджете easyGRID для самого лучшего браузера — Opera 9.

Почитать про новую Оперу можно здесь. Начиная с этой версии, Опера поддерживает так называемые виджеты — маленькие приложения, которые могут работать и за пределами окна браузера.

Этот простой виджет позволяет создавать сетку, для которой вы можете настроить шаг, цвет и степень прозрачности. Сетку очень легко перемещать на экране, проверяя выравнивание интересующих вас элементов.

В общем, попробуйте — думаю понравится.

P.S. Ушел смотреть футбол. Италия вперед! =)


Комментарии RSS для комментариев

  1. # Владимир Яшников 4339 дн. назад:

    О, просто отличный виджет. Надо будет заходить по чаще на их сайт. Спасибо за инфо!

  2. # Ivan A-R 4338 дн. назад:

    Опа! А я уж думал что виджеты бесполезная вещь =)
    Только вот под линуксом он у меня не заработал =(

  3. # Severus 4338 дн. назад:

    Хм, знакомо...
    Пользуюсь расширением Web Developer для FF. Он тоже предоставляет подобный функционал, а вот до 9 оперы всё не обновлюсь =\

  4. # Александр Шабуневич — 4338 дн. назад:

    Ага, я сначала тоже думал, что виджеты — просто красивые игрушки.

    А насчет web developer для FF — мне их гайды показались не очень удобными в использовании, и к тому же они пропадают после каждого обновления страницы.
    Лучше — этот виджет и WebDevToolbar для Оперы

  5. # Sergey 4332 дн. назад:

    С удачным переездом!

  6. # Александр Шабуневич 4332 дн. назад:

    Спасибо =)

  7. # Александр 4325 дн. назад:

    А я и не знал про такой способ...
    Спасибо.
    буду к вам частенько заглядывать.

  8. # Андрей 4274 дн. назад:

    Спасибо.
    очеь пригодилась ваша информация!

Что вы об этом думаете?


Нестабильная работа сайта Какая CMS лучше? Часть 1