Содержание
- Расскажи нам больше о том, чем ты занимаешься
- Откуда эта страсть?
- Почему тебе нравится выступать на мероприятиях?
- В 2016 году вы начали работать в Mud на полную ставку. Не могли бы вы рассказать нам о вашей работе для Warner Bros?
- Насколько важна CSS Grid для будущего веб-дизайна?
- Что еще интересного в мире CSS?
- Каким вы видите эволюцию роли фронтенд-разработчика в 2020-х годах?
- О чем вы будете говорить при создании CSS?
- Узнайте больше о CSS Grid на странице «Создание CSS».
CSS Grid - это просто самая большая история в веб-дизайне прямо сейчас. Предоставляя разработчикам инструменты для создания сложных макетов с относительно небольшим количеством кода, он представляет собой революционный шаг вперед в обеспечении контроля над поведением макета в адаптивном мире (см. Наши руководства по адаптивному веб-дизайну, и стоит убедиться, что ваш веб-хостинг соответствует вашим требованиям. потребности сайта).
Конечно, это требует обучения. Вот почему нам пришлось пригласить Мишель Баркер в качестве одного из ключевых докладчиков на нашей предстоящей конференции Generate CSS (26 сентября в Шордич, Лондон). Нет ноу-хау или времени? Используйте конструктор сайтов.
Спикер Mozilla Tech, автор блога CSS {In Real Life} и страстный сторонник CSS Grid, в своем выступлении Баркер определит наиболее распространенные проблемы, с которыми сталкиваются дизайнеры при его внедрении, и способы их решения. (Столкнулись с проблемой с хранилищем? Ознакомьтесь с нашими лучшими вариантами облачного хранилища).
Читайте дальше, поскольку она рассказывает, как она влюбилась в CSS, обсуждает свою работу в Mud and Ordoo и делится своими прогнозами относительно того, как будет развиваться веб-дизайн в 2020-х годах.
Расскажи нам больше о том, чем ты занимаешься
Я креативный фронтенд-разработчик с сильной склонностью к UX и опытом в области дизайна и иллюстраций, который влияет на большую часть моей работы. По моей повседневной работе я являюсь фронтенд-разработчиком в Ordoo, стартапе по размещению заказов на мобильных устройствах.
Моя главная страсть - это CSS, и я люблю экспериментировать и писать статьи для своего блога CSS {In Real Life}. Я всегда любил писать, и мой блог дает мне прекрасный повод объединить все мои увлечения в одном месте.
Откуда эта страсть?
С тех пор, как я изучал веб-разработку, меня интересовал макет CSS - он так отличался от печати. Несколько лет назад я посетил семинар Рэйчел Эндрю, и именно там я впервые узнал о CSS Grid. С тех пор меня зацепило, и я поставил перед собой задачу заставить других людей так же увлечься этим, как и я.
Я действительно взволнован тем, насколько быстро развивается CSS в настоящий момент - с каждым днем он становится все мощнее, а еще больше интересных спецификаций не за горами!
Почему тебе нравится выступать на мероприятиях?
Я спикер Mozilla Tech и говорю о CSS Grid на конференциях и встречах. Посещение встреч - отличный способ познакомиться с новыми друзьями, наладить контакты и принять участие в веб-сообществе.
Я действительно рекомендую выступать на митапах, поскольку, по моему опыту, сообщество теплое, гостеприимное и отлично умеет давать конструктивные отзывы. Набраться смелости, чтобы сделать это в первый раз, довольно утомительно, но оно того стоит на 100 процентов. Речь открыла для меня столько дверей.
В 2016 году вы начали работать в Mud на полную ставку. Не могли бы вы рассказать нам о вашей работе для Warner Bros?
Веб-сайт Warner Bros Studios Leavesden был одним из самых масштабных проектов, над которыми я работал в Mud. Дизайн был разработан Blast, и мы в Mud отвечали за разработку. Моя роль заключалась в написании большей части HTML и CSS.
Дизайн представлял некоторые интересные проблемы с макетом и был прекрасной возможностью впервые использовать CSS Grid. Многие из макетов были бы невозможны без Grid, или было бы чрезвычайно сложно реализовать адаптивную реализацию способами, которые давали бы создателям контента достаточную свободу. Нам нужно было разрешить контент неопределенной длины, изображения с любым соотношением сторон и при этом иметь хороший макет.
В то время было не так много учебных пособий и примеров CSS Grid, кроме отличного сайта Рэйчел Эндрю Grid By Example. Одной из ключевых проблем было создание гибкой сетки, которая позволяла бы некоторым элементам выровняться по центральной сетке из 24 столбцов, а также позволяла бы другим выходить за край окна просмотра.
Путем экспериментов и проб и ошибок мне удалось найти способы решения этих проблем. Несколько статей о CSS {In Real Life} напрямую связаны с тем, что я обнаружил в этом проекте.
Насколько важна CSS Grid для будущего веб-дизайна?
Существует заблуждение, что некоторые функции CSS не следует использовать до тех пор, пока поддержка браузером не станет 100-процентной. Скорее всего, этого никогда не произойдет - всегда будут использоваться старые браузеры, и мы должны убедиться, что эти пользователи получают приемлемый опыт. Прогрессивное улучшение - ваш друг! Существуют разные стратегии поддержки (или не поддержки) Grid в старых браузерах: IE10 и IE11 фактически поддерживают старый синтаксис Grid, так что это одно из возможных решений.
Предполагаемое время и стоимость обучения также могут быть препятствием для некоторых. Как и в случае с любой новой технологией, здесь требуется много обучения, и, к сожалению, я не вижу, чтобы слишком много компаний кричали о том, как они любят вкладывать средства в навыки CSS. Он часто играет второстепенную роль по сравнению с JavaScript.
Сказав это, я считаю, что Grid станет неотъемлемой частью будущего веб-дизайна. Джен Симмонс придумала термин «внутренний веб-дизайн» для описания следующей эволюционной эры веб-макетов, в которую мы вступаем, и мы только начинаем видеть, как появляются некоторые из творческих возможностей.
Я надеюсь, что скоро наступит поворотный момент, когда достаточное количество людей перестанут думать о веб-дизайне как о продолжении печати и начнут принимать его как собственное средство массовой информации. Через несколько лет Grid станет естественным инструментом для создания веб-макетов.
Что еще интересного в мире CSS?
Так много всего! Пользовательские свойства довольно удивительны и начинают захватывать воображение людей. Поддержка подсеток, часть спецификации CSS Grid Level 2, недавно появилась в Firefox Nightly и запланирована для следующего общего выпуска Firefox. Я не могу дождаться, чтобы поиграть с ним еще немного и выяснить творческие возможности! Я также с нетерпением жду возможности поэкспериментировать с вариативными шрифтами. Мэнди Майкл и Джейсон Папенталь проделывают отличную работу, создавая демонстрации и обсуждая их.
Каким вы видите эволюцию роли фронтенд-разработчика в 2020-х годах?
Роль фронтенд-разработчика выросла до такой степени, что редко можно найти кого-то одинаково сильного во всех аспектах. Я думаю, что мы неизбежно увидим разделение ролей между разработчиками пользовательского интерфейса, которые пишут HTML, CSS и JavaScript для взаимодействия, и теми, кто больше относится к категории «инженеров».
Это интересно: я чувствую, что «дизайнеры должны писать код?» В наши дни вопрос задают гораздо реже, потому что код внешнего интерфейса стал намного сложнее. Просто начать проект может показаться огромной проблемой, ведь вам нужно настроить целый набор инструментов сборки еще до того, как вы сможете начать.
Вот почему я решил попробовать создать свой личный сайт, используя только HTML, CSS и ничего больше - чтобы посмотреть, не было ли это слишком нереалистичным в 2019 году. Но это вполне действенный способ создать простой сайт. Поскольку CSS сейчас развивается, эти навыки скоро станут чрезвычайно ценными.
О чем вы будете говорить при создании CSS?
Если вас интересует CSS Grid, но вы еще не начали использовать его в производственной среде, этот вариант для вас. Я помог достаточному количеству людей начать работу с Grid, чтобы выявить некоторые общие проблемы, с которыми многие из них сталкиваются. Мой доклад поможет людям определить, что может вызывать у них проблемы с макетом и как их отлаживать. Я надеюсь, вам будет чему поучиться, независимо от вашего уровня опыта в Grid.
Мне нравится, что теперь мы видим всплывающие события, связанные с CSS, такие как Generate CSS. Часто CSS смешивают с внешним интерфейсом в целом, и вы можете пойти на конференцию по интерфейсу, но увидеть только один доклад о CSS!
Эта статья изначально была опубликована в 324-м номере журнала net, самого популярного в мире журнала для веб-дизайнеров и разработчиков. Купить выпуск 324 или же подписаться на сеть.
Узнайте больше о CSS Grid на странице «Создание CSS».
В своем выступлении на Generate CSS, специализированной конференции по CSS для веб-дизайнеров, которая состоится 26 сентября 2019 года в Rich Mix, Лондон, Мишель Баркер рассмотрит, как Grid работает в гармонии (а не против!) С другими методами макета для создания надежных гибкая сеть будущего.
Если вы хотите поймать эту и другие интересные беседы, убедитесь, что вы купи свой билет сейчас!
Статьи по Теме:
- Полное руководство по использованию CSS Grid
- Создайте адаптивный макет с помощью CSS Grid
- 5 классных генераторов CSS-сеток
