1. Новые покупки

    21.10.2017: Уникальный белый заработок на услуге до 90 т.р. в месяц (2017)

    21.10.2017: Заработок от 100 000 рублей в месяц по стратегии "Шахматный арбитраж" (2017)

    21.10.2017: Уникальный белый доход от 2 тр до 10 тр в день по белой схеме (2017)

    20.10.2017: Взламываем сайты / тестирование на проникновение с нуля - часть 1 из 7

    19.10.2017: Базовый курс по белой монетизации сайтов - F-SEO (2017)

    19.10.2017: Еnvаtо Еlеmеnts - слив подписки 2017 [1,3 Терабайта годноты]

    19.10.2017: Инстакурс 5: Бизнес для всех

    18.10.2017: Базовый марафон для омоложения лица и выпрямления осанки

    18.10.2017: Партнерки CPA. Минимум 750 рублей в день за 10 минут

    18.10.2017: Дрессировка людей для начинающих - Лукин (2017)

    18.10.2017: Практика создания пассивного дохода из 7-ми разных финансовых инструментов

    17.10.2017: Автоматический Комплекс по Работе с Трафиком - Андрей Золотарев (2017)

    16.10.2017: ИП для Интернет Предпринимателя - Авторская (2017)

    16.10.2017: Секреты современного программирования - eXeL@B (2017)

    15.10.2017: Инвестирование от 500 рублей

    14.10.2017: Секреты хакеров! Полный курс по кибербезопасности - Udemy (2017)

    11.10.2017: Вебмани-бизнес, или большие деньги с помощью платежной системы Webmoney

    10.10.2017: От 500$ в месяц без вложений на YouTube + AliExpress (2017)

    09.10.2017: Фотошоп за 7 дней. Дизайн и реклама в малом бизнесе - Степаненко (2015)

    09.10.2017: Контрактные автозапчасти - Гордеев

    08.10.2017: Grava Glass FULL - 10 производственных ноу-хау технологий для малого бизнеса

    06.10.2017: Сервис по лендингу

    04.10.2017: Торговля в стиле Killerwhale. Полный курс v10.17 - Кузьмин

    03.10.2017: Заработок на прокси по модели Фархада Гусейнова - Авторская (2017)

    02.10.2017: Взламываем сайты / тестирование на проникновение с нуля - часть 7 из 7

    30.09.2017: Дебиторка Cold - Вадим Куклин (2017)

    28.09.2017: Как за 8 недель запустить Бизнес на Амазоне с помощью AliExpress - ALI Academy

    28.09.2017: Заработок на Партнёрских Программах до 1000 в день - Максеев (2017)

    27.09.2017: Методика слива трафика. Арбитраж (Бурж и Ру)

    22.09.2017: Торги по банкротству по методу Шерлока Холмса 2016, 2017

    21.09.2017: [CreativeLive] Understanding Light [ENG-RUS]

    17.09.2017: [MographPlus] The Ultimate Introduction to V-Ray for 3ds Max [ENG-RUS]

    16.09.2017: Причинно-следственный анализ. Часть 2. Проверка гипотез и предположений

    16.09.2017: Причинно-следственный анализ в маркетинге. Часть 1. Основы

    16.09.2017: Инвестиции в криптовалюты. Быстрый старт.

    16.09.2017: Взламываем сайты / тестирование на проникновение с нуля - часть 6 из 7

    16.09.2017: Взламываем сайты / тестирование на проникновение с нуля - часть 5 из 7

    16.09.2017: Взламываем сайты / тестирование на проникновение с нуля - часть 4 из 7

    16.09.2017: Взламываем сайты / тестирование на проникновение с нуля - часть 3 из 7

    16.09.2017: Взламываем сайты / тестирование на проникновение с нуля - часть 2 из 7

    13.09.2017: [Специалист] Разработчик С++ (Комплексная программа Qt)

    09.09.2017: Обучающий и интенсивный онлайн курс от ведущей иммиграционной компании Канады

    08.09.2017: Как начать майнить и получать доход (от 1500 до 5000 рублей в месяц) со своей видеокарты

    27.08.2017: Невероятно эффективная работа с VKPRO закрытый онлайн тренинг от Алексея Евстропова

    21.08.2017: Раскрутка сети каналов Telegram на автопилоте + Бонус (Zennoposter)

    21.08.2017: Накрутка лайков и подписчиков Instagram / VK на автомате [zennoposter][повтор]

    21.08.2017: Скрипт для создания "плиточного" лендинга Instagram

    21.08.2017: [Бизнес под ключ]+ [Лотерея] Производство и продажа пасты для шугаринга v.2.0

    18.08.2017: Основы дизайна интерьеров - Highlights (2017)

    17.08.2017: Абсолютно белая тема постоянного заработка от 40к в месяц

    17.08.2017: [Digital Tutors] Sculpting Male and Female Faces in ZBrush [ENG-RUS]

    17.08.2017: Музыка для видео и слайд-шоу + переводы уроков по видео

    17.08.2017: [Lynda]Основы композитинга в After Effects: Ротоскопирование и обработка краев

    17.08.2017: Perfex CRM - мощнейшая crm и erp система на Codecanyon (1.6.2)

    16.08.2017: Отборная Информатика - Computer Science Distilled

    15.08.2017: Видео курс PRO 2.0. Партизанский маркетинг. 2017.

    05.08.2017: Трёхдневный воркшоп по настройке авторассылок ВК - Ходченков (2017)

    01.08.2017: Бизнес форсаж. Н. Закхайм (2015)

    29.07.2017: Самый Легкий И В Тоже Время Самый Сложный Бот Для Понимания Соцсетью Вконтакте Vkontakte Superbot

    25.07.2017: Как уличить жену в измене - Женские секреты

    24.07.2017: Быстрые деньги на Дропшиппинге - Валеев

    14.07.2017: От 130 000 Зарабатывай сидя! (белая схема)

    12.07.2017: [Muse] Доступ на год к сайту шаблонов Qooqee.com

    12.07.2017: Дизайн вконтакте

    08.07.2017: Запасные части. Энциклопедия бизнеса Волгин В.В

    07.07.2017: Подписка на субботние выпуски газеты Коммерсант (с объявлениями о банкротстве) на 1 год

    24.06.2017: [Бизнес Молодость] Выбор ниши 2017

    24.06.2017: Вебинар по инфосайтам

    21.06.2017: Базовый курс по стёбу [Второй Поток] - klinsman96 (2017)

    07.06.2017: Финансовая грамотность - Станислав и Глеб Хрянины (2017)

    28.05.2017: Белая схема. заработок полностью на автомате!

    03.05.2017: Пассивная схема заработка

    09.04.2017: Эффективное бизнес-планирование

    08.04.2017: Виртуальная ШКОЛА СКАЗКОТЕРАПИИ

    14.03.2017: Поток клиентов из Инстаграм: Интенсив - Александра Гуреева (2016)

    06.03.2017: Как полностью раскрыть потенциал растений - Курдюмов

    03.03.2017: Закрытый профкурс кратчайший путь к профессионализму в трейдинге

    25.02.2017: Travelling with Hugh. Курс о путешествиях. Уроки с нейтивом

    21.02.2017: Конструктор адаптивных email сообщений

  2. Получи максимум инфопродуктов, оформи подписку всего за 295 рублей!
    Скрыть объявление

Скачать Как научиться верстать адаптивную страницу из psd-макета за 7 дней

Тема в разделе "Графика, дизайн", создана пользователем Gustav, 23 фев 2016.

Метки:
  1. Gustav

    Gustav Команда форума Администратор

    Сообщения:
    5.910
    Симпатии:
    17.091
    Как научиться верстать адаптивную страницу из psd-макета за 7 дней

    HA3QH8E.jpg

    Описание курса:

    Ты уже сверстал пару страниц, но чувствуешь что твоих знаний недостаточно? Ты ищешь проверенные практикой приемы, но поиск в интернете дает лишь обрывки информации? Тогда этот воркшоп для тебя! «Ускоряй работу без потери качества!» — именно под таким девизом будет проходить воркшоп. За 7 уроков ты получишь представление о том, как верстается современная адаптивная HTML-страница из графического макета в формате PSD. Мы разберем, как это делать быстро и эффективно.



    День 1

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

    Краткое содержание:
    • На какой операционной системе работать?
    • Разнообразие веб-браузеров.
    • Краткий обзор сервиса BrowserStack.com для кросс-браузерного тестирования и немного про виртуальные машины.
    • Коротко о графических редакторах.
    • Коротко о редакторах кода.
    • Браузер Google Chrome и установка плагинов. Обзор плагинов PerfectPixel и HTML5 Outline.
    • Другие браузеры и их отличия.
    • Обзор LiveReload 2 и демонстрация силы командной строки и автоматизации работы.
    • Разбираемся с «Инструментами разработчика» в Google Chrome (правка DOM-дерева и CSS-стилей, доступ к ресурсам страницы, эмуляция различных устройств для тестирования адаптивности и др.)
    • Какую версию Photoshop поставить для воркшопа?
    • Редактор кода Sublime Text 3, как устанавливать плагины и как максимально ускорить свою работу в ST.
    • Список плагинов, которые нам понадобятся для работы в воркшопе.
    • Методология познания. Как учиться веб-разработке?
    День 2



    Анализ макета. На этом этапе мы коснемся того, как оценивать объем работ глядя на имеющийся макет, а также как в уме или на бумаге готовиться к верстке.

    Краткое содержание:
    • Введение в проблематику вопроса.
    • Общие аспекты анализа макета.
    • Технические аспекты анализа макета.
    • Пример плохого PSD-макета.
    • Пример хорошего PSD-макета.
    • Чем еще отличается хороший макет от плохого?
    • Анализ PSD-макета Jetro, который верстается в процессе воркшопа.
    • Немного об особенностях работы на фрилансе.
    День 3

    Работа с макетом в среде Adobe Photoshop и извлечение графики для будущей веб-страницы.

    Краткое содержание:
    • Типы графических форматов. Растровые изображения.
    • Типы графических форматов. Векторные изображения.
    • Немного о формате SVG.
    • Способы перевода растрового изображения в векторное (трассировка).
    • Извлечение графики из макета Jetro. Старый способ.
    • Извлечение графики из макета Jetro. Новый способ.
    День 4

    Подготовительные действия и начало верстки HTML-каркаса. Мы будем использовать популярный фреймворк Bootstrap. Многие хотели бы узнать как его применить на практике, чем мы и займемся с тобой на реальном примере.

    Краткое содержание:
    • Введение и немного истории: от табличной верстки к блочной.
    • Семантика HTML и алгоритм HTML Outline.
    • Старый алгоритм: HTML 4 Outline.
    • Новый алгоритм: HTML5 Outline.
    • Подключение Bootstrap и верстка HTML-каркаса макета Jetro.
    День 5

    Настройка фреймворка Bootstrap и стилизация страницы через CSS. В нашей работе мы применим препроцессор Less. Если до этого ты с ним не сталкивался, то будешь поражён насколько это ускоряет работу!

    Краткое содержание:
    • Обзор возможностей официального сайта Bootstrap.
    • Разбираем сборщик Bootstrap’a.
    • Настройка, компиляция и замена стандартного стилевого файла Bootstrap на файл с настроенными переменными под макет Jetro. Брейкпоинты (breakpoints), медиа-запросы (media queries) и ширина макета.
    • Начинаем стилизацию. Настройка Less и LiveReload.
    • Переменные в Less. Задаем цветовые переменные для макета.
    • Кросс-браузерное подключение шрифтов и их конвертация через сервис FontSquirrel.com.
    • Пишем общие стили.
    • Стилизация навигационной панели с логотипом.
    • Стилизация слайдера.
    День 6

    Продолжаем стилизацию нашей страницы и подгоняем все детали.

    Краткое содержание:
    • Что такое Flexbox’ы и как с ними работать.
    • Продолжаем стилизацию макета Jetro:
      • Секция INTRO ARTICLES.
      • Секция RECENT WORKS.
      • Секция FOOTER.
      • Дорабатываем слайдер.
    День 7

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

    Краткое содержание:
    • Адаптивность и отзывчивость. Что к чему?
    • Прикручиваем адаптивность к макету Jetro:
      • Секции LOGO и NAVBAR.
      • Секция SLIDER.
      • Секция INTRO ARTICLES.
      • Секция RECENT WORKS.
      • Секция FOOTER.
    • ЗАКОНЧЕННЫЙ ВИД МАКЕТА JETRO!
    День 8

    Будут рассмотрены методы максимальной оптимизации веб-страницы.

    Краткое содержание:
    • Анализ скорости загрузки через Инструменты Разработчика в Google Chrome:
      • Детальный обзор вкладки Network и её возможностей.
      • Последовательность загрузки файлов веб-страницы, как правильно подключать CSS, JS и остальные ресурсы.
      • Как извлекать информацию из временной диаграммы загрузки (Timeline) Инструментов Разработчика в Chrome.
      • Устранение ошибок 404 (если ресурс не найден).
    • Уменьшение размеров HTML,CSS и JS-файлов:
      • Что такое минификация и офускация.
      • Убираем все лишнее из файлов Bootstrap с помощью сборщика на официальном сайте Please login or register to view links.
      • CDN-сервисы, что это, зачем нужно и как с них подключать ресурсы.
      • Оптимизация и минификация нашего стилевого файла style.css. Как писать CSS-селекторы так, чтобы все работало максимально быстро.
      • Оптимизация и минификация HTML-страниц.
    • Графика и шрифты:
      • Оптимизация графики. JPG, PNG, SVG и кодирование в base64 — когда что лучше использовать?
      • Оптимизация шрифтов и практическое использование SVG.
    • Удаление лишних файлов.



    Продажник:

    Скачать:
     
    Последнее редактирование модератором: 24 ноя 2016
    1hjpjfy, Rawual, idenkuda и ещё 1-му нравится это.
  2. mohamed

    mohamed Пользователь

    Сообщения:
    4
    Симпатии:
    0
    не плохой курс !
     
  3. Миша1980

    Миша1980 PRO Unlimited

    Сообщения:
    132
    Симпатии:
    18
    Перезалейте пожалуйста!
     
  4. Gustav

    Gustav Команда форума Администратор

    Сообщения:
    5.910
    Симпатии:
    17.091
    ссылка обновлена
     
    1hjpjfy нравится это.