Инструменты и генераторы макетов

• 892 различных способа создать сетку 3 x 4
  
  
  
  
  
  3 × 4 grid генерирует 892 уникальных сетки 3 x 4 используя алгоритм генерации всех возможных вариантов.
  
  http://www.3x4grid.com/poster.html
  
  


• 3×4 Grid Builder
  
  
  
  
  
  Drag & drop. Смотрим код.
  
  http://www.3x4grid.com
  
  


• Tiny Fluid Grid Generator
  
  
  
  
  
  Простой и удивительный способ построения плавающих сеток.
  
  http://www.tinyfluidgrid.com/
  
  


• The 1kb Css Grid
  
  
  
  
  
  Ищете способ проще и легче? Знакомтесь The 1KB CSS Grid.
  
  http://www.1kbgrid.com/
  
  


• Grid calculator and Generator
  
  
  
  
  
  GridCalc простой в использовании калькулятор сетки, который предоставит все возможные варианты в соответствии с выставленными ограничениями.
  
  http://www.problem.se/labs/gridcalc/
  
  


• Grid Pak
  
  
  
  
  
  Gridpak интерактивный инструмент для создания адаптивных макетов.
  
  http://gridpak.com/
  
  

Сетки и расширения Photoshop

• Modular Grid Pattern
  
  
  
  
  
  Приложение для веб дизайнеров, которое поможет легко и быстро создать модульную сетку в Adobe Photoshop.
  
  Скачать
  
  


• Guide Guide
  
  
  
  
  
  Плагин Photoshops для создания набора направляющих.
  
  Скачать
  
  


• Responsive Photoshop Template
  
  
  
  
  
  Лучшая сетка в photoshop для создания адаптивного дизайна.
  
  Скачать
  
  


• 960px Grid Templates
  
  
  
  
  
  960 pixel — множество шаблонов модульных сеток в диапазоне от 3 колонок до 16, для Adobe Photoshop и Fireworks.
  
  Скачать
  
  


• Frameless Template
  
  
  
  
  
  Простой шаблон для сеток с 48 px колонками и 24 px желобами.
  
  http://framelessgrid.com/
  
  


• Responsive Grid PSD
  
  
  
  
  
  Шаблон Джоела Букелмана для отзывчивого дизайна.
  
  http://dribbble.com/shots/410635-Responsive-Grid-PSD
  
  

Фреймворки

• 960grid
  
  
  
  
  
  960 grid является классикой среди CSS фреймворков, очень полезный инструмент в основании которого ширина 960px, с большим числом способов интеграции дизайна в макет.
  
  http://960.gs/
  
  


• YAML
  
  
  
  
  
  Это не просто еще один макет на основе сетки. Yaml — это гибкая адаптивная система модульной сетки, которая сочетает в себе лучшие характеристики большинства известных систем.
  
  http://www.yaml.de/
  
  


• The Golden Grid
  
  
  
  
  
  Модульная система для адаптивного дизайна, включающая в себя складывающиеся колонки, эластичные желоба, масштабируемые направляющие и восхитительный скрипт наложения сетки.
  
  http://goldengridsystem.com/
  
  


• SimpleGrid
  
  
  
  
  
  Адаптивность, бесконечная вложенность, единый класс для всех элементов, простота.
  
  http://simplegrid.info/
  
  


• Frameless
  
  
  
  
  
  Это не фреймворк. Это не масштабируемая сетка для адаптивного дизайна; адаптирует колонку в колонку, но не пиксел в пиксел. Адаптирует дизайн в такое количество колонок, которое только возможно.
  
  http://framelessgrid.com/
  
  


• Columnal
  
  
  
  
  
  Адаптивная CSS модульная сетка, способствующая браузеру ПК и мобильному устройству отображать контент одинаково хорошо. Columnal поддерживает мобильные макеты с помощью запросов.
  
  http://www.columnal.com/
  
  


• 1140 CSS Grid
  
  
  
  
  
  1140 grid прекрасно отображается в 1280 px. На меньших мониторах перестраивается в мобильный вариант.
  
  http://cssgrid.net/
  
  


• Skeleton
  
  
  
  
  
  Еще одни адаптивная модульная сетка. Лучший выбор для быстрого создания сайта для различных устройств.
  
  http://www.getskeleton.com/
  
  

• 
  Оригинальный адаптивный вид материалов ucoz картинка слева
• 
  Оригинальный адаптивный вид материалов ucoz картинка справа
• 
  Как изменить дизайн "формы поиска"?
• 
  Фиксированный плавающий блок при прокрутке