Css для профессионалов?

Question

[Ciscis]

Всем привет! Изучаю веб-программирование 3 месяца, за это время выучил практически все названия html и css тегов, научился создавать сложные сайты по PSD макету, простому изображению jpg/png и по фазе Луны, но чувствую, что мой код перегружен ненужными свойствами и атрибутами, что лучше прочитать связанное с css чтобы избавиться от этого?

Answer 1

[Дима Паутов]

В css нет тегов! 3 месяца? Поверь, ты слишком мало знаешь. Просто верстай верстай и еще раз верстай.

Смотри в свой код. Видишь, что все время один и те же свойства у тебя повторяются, выноси их в отдельный класс. Так коду станет меньше. Со временем создашь для себя свой бутстрап с блекджеком. Изучай CSS фреймворки, бутстрап, фаундейшн, semantic-ui. Пойми, в чем их суть и сила. Читать нужно статьи на хабре и подобных сайтах, а так же подписаться на хабре вот на этот дайджест. Сейчас в этом дайджесте насчитывается 205 выпусков. Там ну просто море инфы! CSS Live очень хороший ресурс на эту тему.

Знаешь английский, на уровне чтения? https://css-tricks.com/almanac/ - в помошь

Comments

[Xas541]

1) Тут зависит от человека, может он сидит по 25 часов в сутки без выходных, спит по несколько часов в день, "страдает" синдромом "саванта" (100% запоминание информации), даже известны ситуации когда люди с этим синдромом изучали новый язык на уровне носителя за неделю
2) помоЩь

[Дима Паутов]

Если 25 часов в сутки, то как он может спать несколько часов в день?))))

[Xas541]

Дима Турков: Оп, ошибка, это разные ситуации, может работать практически без сна или без выходных и т.п.

Answer 2

[Сергей Сунцев]

Надо быть б̶о̶л̶ь̶ш̶и̶м̶ ̶г̶е̶н̶и̶е̶м̶ , довольно смышленым, чтоб так просто за 3 месяца уметь правильно верстать сложные psd макеты(особенно правильные с семантической точки зрения). Я после 3х месяцев неторопливого обучения мог только нормально копипастить и верстать статичные странички.

Конкретно чтоб решить проблему с загруженностью css т̶е̶г̶о̶в̶ стилей можно почитать про css рефакторинг

Answer 3

[Дмитрий]

продолжить верстать и начать изучать:
1 bootstrap
2 sass/less
3 инструменты grunt/gulp, всякие автопрефиксеры и тп
4 bem/любую другую методологию
5 js
в любом порядке

Comments

[Максим Тимофеев]

bem/любую другую методологию - только если планируете работать в крупных компаниях с крупными проектами над которыми работают много людей.

[Дмитрий]

Максим Тимофеев: так вопрос жеж и есть "Css для профессионалов".
Но то, что bem это только для больших проектов, спорно - вижу много небольших сайтов сверстанных так

[Максим Тимофеев]

dimasmagadan: Вижу и оправдано - разные вещи. Почитайте для каких целей яндекс разрабатывал bem. Это удобно для команды, но это лишний код.

[Дмитрий]

Максим Тимофеев: по вашему, если верстальщик знает бэм, то использовать на небольшом проекте такой подход ему категорически не стоит?

[Дмитрий]

Максим Тимофеев: добавлю еще вот эту статью
https://www.smashingmagazine.com/2014/07/bem-metho...

[Максим Тимофеев]

dimasmagadan: 1. Знать о бэм надо обязательно. 2. Использовать бэм или другие технологии стоит только когда они оправданы. Есть понятие оптимально с точки зрения кода и оптимально с точки зрения удобства разработчика. Правильный выбор пожалуй посредине. Надо думать в каждом конкретном случае. Сказать что во всем маленьких проектах бэм не нужен - неправильно, правильнее сказать - чаще всего. Если благодаря бэм Вы написали генератор лендингом и пользуетесь им - тут скорость разработки повысилась в разы и перекрыла избыточные классы, которые появились. Но если Вы пишите одностраничник сам и ручками - использование бэм это шизофрения.

Answer 4

[Alexander Litvinenko]

Дима Турков как раз верстку за 3 месяца очень и реально.

Учи http://getbootstrap.com/, остальное редко используют, можно сразу 4 версию, всеравно на нее вот вот все перейдут. И главное JS.

Comments

[Дима Паутов]

Не поверю! Я могу с легкость найти макет, который вызовет геморой у человека, с опытом от 3х месяцев.

[Alexander Litvinenko]

Дима Турков: давайте, скину своим студентам.