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

1. дизайн должен хорошо смотреться на всех экранах, особое внимание уделяется мобильным устройствам,
2. главный контент всегда должен быть в фокусе,
3. создавайте свой дизайн, не зацикливаясь на пикселях, у вас должна быть общая картинка.

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

Представьте, что человек будет скроллить сайт целиком, что он увидит вначале, что в конце. Видно ли основной контент без горизонтального скроллинга.

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

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