Commit
This commit does not belong to any branch on this repository, and may belong to a fork outside of the repository.
- Loading branch information
0 parents
commit 71ae62f
Showing
2 changed files
with
66 additions
and
0 deletions.
There are no files selected for viewing
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,5 @@ | ||
node_modules/ | ||
*.log | ||
.DS_Store | ||
temp/ | ||
*.sublime-* |
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Original file line number | Diff line number | Diff line change |
---|---|---|
@@ -0,0 +1,61 @@ | ||
# О чём должен помнить веб-дизайнер | ||
|
||
От технологов и программистов — веб-дизанейрам. О чём нужно помнить, чтобы называть себя веб-дизайнером. | ||
|
||
Сверстать можно всё, что можно придумать и воплотить в макете. Вопрос только во времени, деньгах и удобстве (времени и стоимости) расширения. | ||
|
||
|
||
|
||
## Общее | ||
|
||
**Веб-дизайнер — это инженер**. Веб-дизайнер — это не рисовальщик, он не придумывает «как будет выглядеть», он придумывает «как сделать, чтобы проект лучше всего решал поставленные задачи». На западе нет разделения на дизайнеров и верстальщиков. Если Вы совсем не умеете верстать (не представляете как это работает), Вы — не веб-дизайнер. | ||
|
||
**Технически недоработанный макет осложняет работу технолога**. Для студий — это увеличение сроков разработки. Для фриланса — ухудшение кармы дизайнера в момент, когда технолог описывает клиенту список технических недоработок и/или неучтённых дизайнером ограничений. | ||
|
||
|
||
|
||
## Макеты | ||
|
||
**Макет нужно делать в sRGB**. Критично, обязательно. Иначе цвета в вёрстке могут отличаться от макетных. | ||
|
||
**Макет должен иметь тот размер, в котором его нужно сверстать**. Размер(ы) выбирается, исходя из специфики проекта и целевой аудитории. | ||
|
||
|
||
|
||
### Стайлгайд | ||
|
||
**Должен быть стайлгайд***, в котором видны все необходимые состояния всех интерактивных элементов. | ||
|
||
**Стайлгайд — это отдельный макет**. Это не текстовая инструкция как включать/выключать видимость слоёв, варианты композиции слоёв. Это не артборд, включённый в какой-либо макет. | ||
|
||
**Для ссылок и кнопок нужны состояния: «покой», «наведение», «клик» (последние два могут совпадать)**. Для навигационных ссылок нужно состояние «находимся на этой странице». Для контентных ссылок желательно состояние «ссылка посещалась». | ||
|
||
**Для кнопок нужны состояния: «покой», «наведение», «клик», «блокирована»**. Иногда ещё нужно состояние «идёт процесс». | ||
|
||
**Для текстовых полей форм нужны состояния: «покой», «получен фокус», «блокировано»**. | ||
|
||
|
||
|
||
## Модульные сетки | ||
|
||
|
||
|
||
## Блоки | ||
|
||
|
||
|
||
## Текст, Шрифты | ||
|
||
|
||
|
||
## Анимация | ||
|
||
|
||
|
||
## Адаптивность | ||
|
||
|
||
|
||
# Об авторах | ||
|
||
- [Николай Громов](http://nicothin.ru/contact). Преподаватель [EpicSkills](http://epixx.ru/) и [HTML Academy](https://htmlacademy.ru/). Первый сайт сделал в 2000 г. |