Тянуть больше некуда: пора выносить ёлку, доедать мандарины и подводить итоги ушедшего года.

Мы подготовили обзор значимых событий и зародившихся тенденций за 2016 год в мире фронтенда.

Какие события индустрии вы бы сами выделили и чего ожидаете от 2017?

https://habrahabr.ru/company/htmlacademy/blog/319458/

Мы не можем это умалчивать — флексбоксы захватывают интенсивы Академии.

На «Базовом HTML и CSS», который стартует уже в понедельник, запланирована бонусная лекция.

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

До старта интенсива осталось три дня, но вы ещё успеваете записаться.

https://htmlacademy.ru/intensive/htmlcss

51-й выпуск «Веб-стандартов»: ES6-модули и global, PhantomJS, веб-манифест, методологии CSS, SVG-иконки и Слава Шебанов про фронтенд ВКонтакте — https://soundcloud.com/web-standards/episode-51

Разработчик и дизайнер Джонатан Су, в рамках редизайна своего сайта, решил уделить особое внимание оптимизации фронтенда.

Теперь он делится своими размышлениями, решениями и инструментами, которые он использовал для повышения производительности проекта.

https://jonsuh.com/blog/need-for-speed-2/

Разбор создания визуального эффекта скрытия баннера при прокрутке.

https://thenewcode.com/1157/Fixed-Scrolling-Disappearing-Banner

Портал в завтрашний день.

https://codepen.io/jasesmith/pen/qqgvZe/

Мы часто публикуем демонстрации создания изображений на CSS разной степени сложности.

Если вы хотите научиться так же, то вот подробное руководство для начинающих.

https://medium.com/dailycssimages/a-beginners-guide-to-pure-css-images-ef9a5d069dd2

Часто гамбургерное меню в мобильных интерфейсах делают по умолчанию.

Но, если это не Amazon с огромным товарным ассортиментом или Uber с понятной основной функцией, то такое решение способно негативно повлиять на удобство использования.

Всегда ли нужно прятать весь функционал под три горизонтальных полоски?

https://uxdesign.cc/death-by-hamburger-2d1db115352a

Радужная анимация на CSS.

https://codepen.io/thebabydino/pen/mOJvyB

Используя шрифты большого размера нужно обращать внимание на:

— Межстрочное расстояние (интерлиньяж).

— Интервал между символами (кернинг).

— Уместность выбранного шрифта.

https://blog.prototypr.io/3-things-youll-need-to-do-when-using-a-large-font-size-47fe241c8111

Вы знали, что эмодзи семьи 👨‍👩‍👦 на самом деле состоит из трёх: папа 👨 + мама 👩 + ребёнок 👦?

Как же это работает? Попробуем разобраться с юникодом, семьёй эмодзи и JavaScript.

https://www.contentful.com/blog/2016/12/06/unicode-javascript-and-the-emoji-family/

Если вы не знаете, с чего начать практиковаться, то всегда можно подключить фантазию и придумать свои проекты. Это станет очень полезным опытом.
 
Пример таких идей в статье Кевина Кононенко «8 креативных идей для создания первого сайта».
 
https://htmlacademy.ru/blog/151-8-crazy-idea-for-site

Бегущая девочка на CSS.

https://codepen.io/renduh/pen/mRraOd