Уроки по верстке для Евгения

lesson_markup_forge.md

##Результат

####Скачать верстку

##Третий урок

####Ссылка на видео

###План:

1. Веб стандарты
2. Виды отображения (display) элементов: block, inline, table итд, обтекание (clear) и запрет на обтекание элементов, переполнение (overflow) и работа с ним
3. Разбор ошибок в верстке
4. Продолжение верстки (Out team, footer)

###Что мы узнаем:

1. Что такое "вебстандарты"
2. Проверка верстки на соответвие стандартам
3. Фишки CSS

###Задачи

1. Понять действия сделанные на уроке
2. Сверстать код по примеру
3. Задать вопросы

###Ссылки Веб стандарты W3C

Проверка верстки на соответствие стандартам

Познавательная статья: Эволюция CSS

Короткий курс по блочной модели, рекомендую посвятить время

##Второй урок

####Ссылка на видео

###План:

1. Работа со шрифтами в фотошоп
2. Правила оформления кода
3. Немного о селекторах
4. Верстка (Текстовый блок, блок предложений)

###Что мы узнаем:

1. Photoshop: Type tools
2. Code guidlines (Стиль оформления кода)
3. CSS фрэймворки, БЭМ итд.

###Задачи

1. Отформатировать код, переименовать файлы и парки проекта в соотвествии со смыслом
2. Понять действия сделанные на уроке
3. Сверстать код по примеру
4. Сверстать остальные блоки в proposals-block
5. Задать вопросы
6. Первод на русский

##Первый урок

####Ссылка на видео

###План:

1. Знакомство с photoshop
2. Разбор шаблона
3. Окружение разработчика
4. Подготовка к верстке
5. Верстка шапки

###Что мы узнаем

1. Познакомимся с реальным work-flow
2. Поработаем с графическим редактором и шаблонами
3. Познакомимся с окружением разработчика

###Задачи

1. Повторить действия сделанные на уроке
2. Понять действия сделанные на уроке
3. Задать вопросы
4. (Дополнительно) Перевести на русский язык
5. (Дополнительно) Сделать :hover для кнопки "Blog"

###Ссылки Рабочая папка проекта в облаке

Ищем Photoshop CS 6 тут или тут

Текст из рефератов