midler

6 июня 2016, Санкт-Петербург, Россия

# Понедельник 29 твитов

Всем привет! На это неделе с вами @midler, верстальщик в @Molinos_Ru

12:18

На это неделе я подготовил некоторое количество вопросов и дам некоторое количество ответов =)

12:20

Пока я немножко поработаю, а вы ответье на любимые вопросы этого аккаунта: редактор, тема, браузер

12:23

Сам я использую хром Хром, Саблайм и Zenburn. Дальше я затрону эту тему, но в другом ракурсе.

13:18
@cssunderhood Вопрос для теоретиков: что делать когда стоишь перед багом в верстке и не знаешь почему так? Какие методы?

Упрощаем код, удаляем не нужные элементы, тестим в других браузерах, читаем спеки. Постепенно отсекаем лишнее. twitter.com/Copypasting/st…

13:24
@cssunderhood Вопрос для теоретиков: что делать когда стоишь перед багом в верстке и не знаешь почему так? Какие методы?

А вообще поищи как поймать льва(баг) в пустыне(код) =) twitter.com/Copypasting/st…

13:26
После двух недель такого проёба спрашиваем совета у коллег и за 10 минут решаем проблему. twitter.com/cssunderhood/s…
13:28

Расскажу немного кто я.
Учился верстать по "Большой книге css" Девида Макфарленда. Читал её около года, в неспешном режиме.

13:48

Уволившись с работы(инженер) подумал "а почему бы не пойти в вёрстку?"

13:48

В резюме написал что опыта нет, но есть желание. Устроился в компанию где мы делали сайты на потоке(визиточки за 3999 и пр.).
@cssunderhood

13:51

И это здорово прокачало меня. До сих пор считаю такую работу отличным трамплином в профессию. @cssunderhood

13:54

Позже устроился в большую компанию, где делал лендинги. Но задачи были скучноваты,и позже я продолжил поиск
@cssunderhood

13:55

В итоге почти год работаю в Питерской студии Molinos @cssunderhood

13:55

Так же я почти два года являюсь наставником в @htmlacademy_ru. Если интересно то могу о наставничестве в академии @cssunderhood

13:56

Был инженером электросвязи, делал связь между электросчётчиками @c01nd01r @cssunderhood

13:59

До этого жил на севере, в небольшом заполярном городке. После школы поехал учиться в Питер, так тут и остался @c01nd01r @cssunderhood

14:00
@cssunderhood @Copypasting где-то вылез контейнер за viewport. Когда уже отчаился и не понимаешь, что и где - display:none. Поочереди)))
14:00

А когда вы поняли что "верстать это моё", и что чувствовали при этом?

14:03

Я свои первые сайты сделал в 2005 году (2 штуки), но потом начался универ и было не до этого.

15:13

А когда читал Макфарленда, появилось волшебство, когда от одной строчки меняется всё.Я называю это "магия на кончиках пальцев" @cssunderhood

15:15

Под закат рабочего дня давайте поговорим о хранении информации.

19:43

Я складывал всё в разные сервисы. В итоге накопилась пара тысяч с задержками в год. И стало понятно что я делаю что-то не то @cssunderhood

19:43

Но не прочитанная статья остаётся не прочитанной. Каждое не посмотренное видео не станет лучше от того что лежит в закладках @cssunderhood

19:44

В итоге я отписался от всех пабликов и всех рассылок. Читаю только @webstandards_ru и подборку на хабре от @frontender_ua @cssunderhood

19:45

А вы продолжаете закатывать видео в банки и засушивать гроздья ссылок? @cssunderhood

19:45
@cssunderhood ноуп. скачиваю и смотрю.
20:00
@cssunderhood видео смотрю на скорости 2х, если что то интересное, ссылки стараюсь каждый день разгребать накопившиеся, в основном статьи
20:00
@cssunderhood О да, все через это проходили. В итоге, заставляешь себя и читаешь самое интересное. Read It Later = Read It Never.
20:00
@cssunderhood открываю вкладки в мобильной мозилле. Когда накапливается больше 30 начинает тупить, вылетать и садить аккум.
21:08

# Вторник 14 твитов

Сегодня давайте поговорим про организацию CSS. Расскажите какими правилами руководствуетесь при создании структуры CSS и написании кода?

12:04

Поясню. Интересно как организуете структуру файлов, как используете переменные, сброс, миксины, комментарии к стилям и тд

12:59
@cssunderhood BEM, SMACSS, CSSModules. Всё!
13:08
@cssunderhood структура обычно такая. Комментарии очень редко ставятся, в основном TODO. (media legacy) pic.twitter.com/KVUCzIEfOq
13:08
@cssunderhood вот написал, что я хочу от нашего проекта, буду рефакторить потихонечку github.com/PackageFactory…
13:08
@cssunderhood как-то так: goo.gl/jM75Yz. Комментарии пишу в случае магии, когда сложно понять без примера.
13:09

Я никогда не использовал CSSModules. Расскажите в чём плюсы, в чём минусы?

13:35
@cssunderhood минусы в не очень удобной интеграции со сторонними библиотеками (через :global {...}). Плюсы: никакой больше бэм-страхоты.
14:31

Мне очень нравится вот эта статья на тему организации css-кода prgssr.ru/development/pe…

16:16

А какие советы дадите человеку, который только сейчас начинает использовать препроцессоры, со всеми плюшками?

18:35
@cssunderhood
Мне когда-то это помогло
thesassway.com/beginner/how-t…
18:42
@cssunderhood каждому свое, но я бы советовал sass и его правило 7 к 1
18:42
@cssunderhood совет не использовать препроцессоры, а использовать модули @PostCSS

Я включаю @PostCSS в понятие препроцессоров. twitter.com/d_markovskiy/s…

18:45
@cssunderhood если коротко то все стили раскладываются по полочкам и потом компилятся в один main.css sass-guidelin.es

Не знал что этот паттерн так называется. Вот более точная ссылка sass-guidelin.es/#the-7-1-patte… twitter.com/s_martynyuk/st…

18:46

# Среда 26 твитов

@okunev @cssunderhood глобальный импорт в Less доступен в виде плагина less-plugin-glob. Под капотом все прелести Glob.
12:02
@cssunderhood хелп, не могу найти туториал по параллакс эффекту, как здесь 8eight.co.il со всеми этими бургерами. Не подскажете?
12:02
уволившись с работы (учитель), подумала: А почему бы не пойти в верстку. И заверте... twitter.com/cssunderhood/s…
12:03

@cssunderhood @Fabian_Lagrange Ссылка на плагин не та =) github.com/htdt/parallax

12:33

Сегодня давайте поговорим про визуальщину и дизайн.
Дизайнер и верстальщик - друзья, враги, один человек? Ваши варианты

12:37
@cssunderhood должны гармонично дополнять друг друга)
14:01
@cssunderhood с дизайнером нужно дружить, тогда ваша работа будет приятней:) особенно в мелочах это может проявиться сильно
14:01

А должен ли дизайнер уметь верстать? А верстальщик понимать в дизайне?

14:33
@cssunderhood на западе дизайнеры верстают ) понимать верстку нужно, чтобы диснейленд не рисовать. Верстальщик - насмотренность на behance?)
14:36

Да, у нас произошло разделение этих профессий. Сейчас верстальщики больше из технарей ребята @PMarinchenko @cssunderhood

14:42
@cssunderhood Естественно. Это ж одна профессия.
14:42
@cssunderhood Дизайнеру уметь верстать не помешает. Верстальщик обязательно должен понимать в дизайне.
14:42

Как думаете, в будущем, обьъединение професии будет? Или будет полное разделение?

14:43

Да не, ты передёргиваешь. Просто функции вертальщика должны поделить верстальщик и программист @ardshock @GolubevVictor

16:03

Тьфу! Отвлекли. Дизайнера имел в виду. @ardshock @cssunderhood @GolubevVictor

16:08

Ладно, это всё холивар.
Лучше скажите, как Дизайнер передаёт вам анимации в вёрстку?

16:09
@cssunderhood спрашивает у меня(!) можно ли что-то реализовать,мы советуемся, ищем прототипы или видео,устно составляем тз вместе и делаем:)
16:46
@cssunderhood я пару раз делал их в AE или сам наверстывал в codepen и кидал ссылку
16:54
@cssunderhood рисует в after effects, утверждает с заказчиком, а потом присылает мне *.mov
*убейте меня*
16:55
@ardshock @GolubevVictor @cssunderhood Дизайнеры, как программисты, делятся по классам. Веб-дизайнеры могли бы верстать. Иллюстраторы - нет
16:55
@cssunderhood @napilsya сейчас рисую / верстаю сам, в т.ч. и на фрилансе. Так проще.
20:28
@cssunderhood верстка это навык, а не профессия.
20:42

Меня ещё попросили узнать best practice анимаций и GreenSock. Так что если есть чем поделиться, пишите!

20:48
@cssunderhood по GSAP куча туториолов. На codepen куча примеров, ищи.
22:44
@GolubevVictor @ardshock @cssunderhood Господи, это вёрстка должна основываться на дизайне. Никак не наоборот.
22:44
@cssunderhood будущее — t-shaped skills
22:44

# Четверг 14 твитов

@cssunderhood умею верстать, из веб-мастера переквалифицировалась в дизайнера. До сих пор верстаю рассылки и промо сайт для продукта.
12:05
@cssunderhood мне очень тяжело учиться в обоих направлениях одновременно, в верстке так и осталась на уровне 3хлетней давности.
12:05
.@cssunderhood мы уже затрагивали эту тему, но всё же:

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

12:05

Я не попадаю в свои оценки =)
Делю макет на блоки и оцениваю их. Но всегда что-то всплывает. Может посоветуете что-нибудь?@Copypasting

12:14
@cssunderhood @Copypasting умножай на 2 или 3 — в зависимости от объема работ. На мелких проектах можно добавлять 50% от суммарной оценки
12:54

В последнее время мне очень интересны Веб-компоненты. Но в сообществе это встречается без воодушевления.
Как думаете взлетит или нет?

13:58

Веб-компоненты это набор стандартов по созданию "собственных тегов". @xCubek

14:08

Состоит из 4-ёх спецификаций: шаблоны, пользовательские элементы, теневой DOM и html импорт @xCubek

14:09
@cssunderhood кстати интересно, кто-то использует в работе тот же @polymer, какие впечатления?
16:55
@grim_juz @cssunderhood @polymer @cssunderhood
Я работал с Polymer когда был в версии 0.5, много заморочек были тогда с тем же “vulcanize”.
17:00
@cssunderhood почитайте вакансии дизайнеров на загнивающем западе :-)
18:20

Вопрос от знакомого:
Какие модные технологии вы применяете в команде?
И с какими сложностями сталкиваетесь при внедрении?

19:34

Если за последний час ничего не поменялось, то вроде как @sapegin

19:45
@cssunderhood есть более обобщённое понятие — разработчик интерфейса. Это и дизайн, и вёрстка, и динамика. Кажется, это >> правильный подход
23:05

# Пятница 11 твитов

@cssunderhood трекать время и анализировать. За несколько проектов заметил, что ошибаюсь на 20% — стал умножать сроки на 1.2.
12:13
@cssunderhood кросс-навыки экономят ресурсы. Оставили из дизайна лишь стайлгайды, а компоненты из UX сразу переходят в верстку. Хорошо так.
12:13

А в чём разница и какие обязанности у верстальщика, веб-мастера, веб-разработчика, фронтендера, разработчика интерфейсов, веб-технолог?

12:45
Создатель CSS Хокон Виум Ли из Opera расскажет зачем изобрели CSS на PiterCSS №5 17 июня — pitercss.timepad.ru/event/340787/ pic.twitter.com/blIOQnTIQ8
13:09

Как различать джуна, мидла и сеньора?

16:04
@cssunderhood джун: новое? узнаю! Мидл - ну да слышал, но... сеньёр - работает-не трогай
16:21
@cssunderhood мне нравится метод Лебедева, правда он про дизайнеров artlebedev.ru/kovodstvo/sect…
16:21
@dcromster @cssunderhood работает, не трогай - это джун.
16:21
@cssunderhood по раздутым от самомнения щекам 🐹
16:21

Что работадатель хочет от верстальщика? А что от фронтендера? По каким критериям отбирают людей?

18:17
@cssunderhood мидл это человек способный делать типичные проекты без подсказок.
18:29

# Суббота 14 твитов

@cssunderhood тут статья на эту тему недавно вышла krekotun.ru/ui-developer-s…
12:33

Давайте про "рисование на CSS"(и на SVG). На codepen.io много демок "нарисованных" кодом на CSS или SVG. Как вы к этому относитесь?

12:46

Среди нас наверняка есть люди которые это делают.
Расскажите о том как вы это делаете? Придумываете идею заранее или делаете сразу?

12:47

С какими трудностями сталкиваетесь? И что чувствуете в процессе?

12:47
@cssunderhood svg няшно, я рисовал, больше того, яндекс индексит svg, ну карты по крайней мере и наливает траф
12:59

И покидайте примеры крутых демок.

13:01
@cssunderhood о, во время! делаю for fun анимированный x-wing из star wars на svg. будет пулять из пушек и мб летать codepen.io/kenzoki/pen/ox…
15:22
@cssunderhood было бы хорошо, если сообщество плюнуло ссылочками на толковые статьи по анимации svg (можно на инглише).
15:22
Рендеринг всех шрифтов в #chrome 51.0.27. Подскажите, как пофиксить? RT, пожалуйста @cssunderhood @iamspacegray pic.twitter.com/4vRUkMzd35
15:24
@cssunderhood джуниор – нет опыта, есть теоретические знания и желание разваиваться; мидл – джун с опытом; сениор – мидл без желания :)
17:57
@petrthepig @cssunderhood ссылками ща кинуть не могу, но очень рекомендую полистать твитты @vlh
17:57
@petrthepig @cssunderhood можно тут почитать css.yoksel.ru
19:02
@cssunderhood а кто-нибудь нашел хак, как использовать css для внешних файлов svg, подгружаемых через <use/> в Chrome?
19:18

Вспомнил, есть же вот такая книга cssanimationspocketguide.com
@petrthepig

19:20

# Воскресенье 7 твитов

• Джуниор — ты пользуешься опенсорсным решениями;
• Мидл — создаёшь опенсорные решения;
• Сеньор – твоими продуктами пользуются остальные.

Не все люди пишут опенсорс. twitter.com/Realetive/stat…

12:35
@cssunderhood возник вопрос по поводу разных тем для сайта. Поделитесь опытом? Как лучше через класс или отдельный файл и т.п. (sass)
13:32

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

15:59

Я не думал что вести твиттер так сложно. В голове всё было совсем не так =)
Перед началом я подготовил 27 тем, но не написал даже половины.

16:00

Спасибо за обсуждения.
Кушайте кашу, слушайтесь маму и верстайте с удовольствием.
С вами был Серёдкин Андрей aka @midler. Пока!

16:00
На лето @cssunderhood переходит в свободный режим: новый автор будет не каждую неделю, а как придётся. Хотите быть автором — пишите мне.
21:32
Обещанные эксперименты с форматом @cssunderhood будут с осени, так как сейчас многие усердно трудятся или отдыхают.
21:32

other