Обучающие материалы по вёрстке

  • Автор темы Автор темы aolko
  • Дата начала Дата начала
Мне понравился Youtube канал Фрилансер по жизни. В плане обучения и доступности верстки воспринимается на ура! Как справочник, часто использую htmlbook и css-tricks.
 
Ссылочка ведет не туда (на яндекс диск) в шпаргалке по HTML для начинающих. Там какой-то странный архив.
 
Мне понравился Youtube канал Фрилансер по жизни. В плане обучения и доступности верстки воспринимается на ура! Как справочник, часто использую htmlbook и css-tricks.
Кста да, но он у меня в один момент отбил интерес к програмировани( ибо типа/якобы рассказал о трудностях, но на деле оказалось все чуть проще чем у него в теме)
 
Мне понравился Youtube канал Фрилансер по жизни.
Как верстальщик он так себе. Иногда натыкаюсь на его видео и каждый раз у меня есть претензии к его подходу. Пару раз на тостере спрашивали про БЭМ и указывали источником его видео, мол вот он так делает и ничего, а почему так нельзя, то есть даже новички понимают, что он не всегда прав.
 
Как верстальщик он так себе. Иногда натыкаюсь на его видео и каждый раз у меня есть претензии к его подходу. Пару раз на тостере спрашивали про БЭМ и указывали источником его видео, мол вот он так делает и ничего, а почему так нельзя, то есть даже новички понимают, что он не всегда прав.
А с чего бы он так себе? Дает вполне нормальные объяснения по технологиям (очень доступные). Чувствуется опыт. Тот же БЭМ может не часто использовать в работе, но для этого подхода есть документация. Это совет - не стандарт. Плюс это не профессиональный курс за 5 тысяч долларов в месяц. Это бесплатный контент для начинающих.
 
Это бесплатный контент для начинающих.
Начинающим очень легко привить плохой стиль.
Тот же БЭМ может не часто использовать в работе
В смысле не часто? Он только его и использует
А с чего бы он так себе?
Собственно по этому. Любое видео открываешь и думаешь, а зачем так делать то, чего стоят только названия блоков
 
Платный курс
Фрилансер по жизни, Евгений Андриканич | Курс по верстке (2021)
Для кого этот курс?
Вы новичок и безумно хотите научиться верстать сайты? Вы веб-дизайнер и хотите понимать все процессы этапа верстки? Вы бекэнд разработчик и хотите изучить верстку для продвижения своей карьеры? Тогда этот курс для вас!

Программа Курса:
1. Введение
2. Программы и инструменты
3. HTML Теги. Строительные теги
4. HTML Теги. Теги для работы с текстом
5. CSS Знакомство и синтаксис
6. CSS стили шрифта и текста
7. CSS подключение шрифтов
8. CSS свойства блоков
9. CSS свойства оформления блоков
10. CSS свойство background
11. CSS псевдоклассы
12. CSS псевдоэлементы
13. CSS позиционирование
14. CSS FlexBox
15. CSS переходы
16. SCSS препроцессор
17. Изображения
18. Сборщик Gulp
19. CSS Grid Layout
20. JS Введение и синтаксис
21. JS Переменные и массивы
22. JS работа с DOM (взаимосвязь JS HTML и CSS)
23. JS отправка данных AJAX
24. Тестирование

Скрытое содержимое. Вам нужно войти или зарегистрироваться.
 
Начинающим очень легко привить плохой стиль.

В смысле не часто? Он только его и использует

Собственно по этому. Любое видео открываешь и думаешь, а зачем так делать то, чего стоят только названия блоков
ждем тогда видео от вас. ну а так: все это оговаривается либо (если работаешь как часть большой команды) в общих правилах к верстке, пишется мини дока, а потом подается результат reviewer у на проверку + выбирается даже единая ide, под которую раздаются файлы настроек оформления. либо: если это проект одного человека, кто во что горазд + настройки ide для автоматизации. чего только не встречал: и классы в два символа, и привычку типа наименования как в bootstrap, и camel case/snake case в id, snake case/camel case в именах классов, и многое, многое другое. если это работа одного человека. какая разница? главное: чтобы был соблюден принцип DRY. или в frontend появился свой PSR, который поддерживать требуется? я б почитал/поучился.
 
Последнее редактирование:
ждем тогда видео от вас. ну а так: все это оговаривается либо (если работаешь как часть большой команды) в общих правилах к верстке, пишется мини дока, а потом подается результат reviewer у на проверку/pipeline/auto testing + выбирается даже единая ide, под которую раздаются файлы настроек оформления. либо: если это проект одного человека, кто во что горазд + настройки ide для автоматизации. чего только не встречал: и классы в два символа, и привычку типа наименования как в bootstrap, и camel case/snake case в id, snake case/camel case в именах классов, и многое, многое другое. если это работа одного человека. какая разница? главное: чтобы был соблюден принцип DRY. или в frontend появился свой PSR, который поддерживать требуется? я б почитал/поучился.
из пустого в порожнее, если вы по его урокам БЭМ изучали, тогда понятно.

ждем тогда видео от вас.
Я пишу статьи на волнующие меня темы, это лучше чем 2 часа лить воду на вопрос, который в текстовом виде объясняется на одной странице.
 
из пустого в порожнее, если вы по его урокам БЭМ изучали, тогда понятно.


Я пишу статьи на волнующие меня темы, это лучше чем 2 часа лить воду на вопрос, который в текстовом виде объясняется на одной странице.
я изучал на практике, и изучаю, и продолжаю изучать/практиковать лет 20ть как, поэтому и написал (как и комментатор выше): есть code style, о котором договариваются в команде, вплоть до ide и до раздачи файлов с настройками форматирования (стандартов еще нет). а если сам по себе проект очень большой, еще подключают code reviewer а и автотесты, которые проверяют стандарт качества и оформления. А для поисковиков: чем меньше css, js, class, inline style, тем лучше. А можно статьи почитать? Интересно.
 
Я не понимаю при чем тут code style к видео по которому учатся новички. Когда он задает блоку margin, он не говорит, что по методологии так делать не рекомендуется и надо использовать модификаторы, он просто берет и делает, а потом на тостер залетают люди с тупыми вопросами. Я открыл первое попавшееся видео на 7 часов рандомно понажимал в тамлайне и постоянно натыкают на какой-то бред, например он делает блок products-new в начале видео и я нажимаю в середину, а там он уже делает new-products, конечно можно и так, но когда в проекте такие схожие названия, это вызывает путаницу в голове. Берем еще для примера такую конструкцию, он так делает постоянно:
2.jpg
1.jpg
Что мы видим, у нас есть footer и в нем body-footer идет как отдельный блок, то что он сделал отдельный блок, это похвально и правильно, но то что он назвал его body-footer это противоречит методологии, блок не должен отвечать на вопросы, какой и где, так как основная концепция блока это переиспользование, что будет если этот блок окажется в header? Ничего плохого, кроме каши в названиях, тут блок косвенно привязан к footer, так же как и item-footer и spoiler-item-footer, по сути все это зависимые друг от друга блоки, в то время как можно было, либо разделить их и сделать независимыми, либо объединить в один, если переиспользования не планируется. Именно такие нюансы новичок проглотит и не задумается и будет плодить тысячи строк неправильного кода.

Я не хочу никого обидеть и не говорю, что Евгений такой уж и плохой, я смотрел его видео и даже для себя почерпнул пару интересных моментов, но я то уже знаю основы и могу отфильтровать плохой контент, а новички нет, поэтому к его видео новичку надо подходить крайне аккуратно и как минимум посмотреть альтернативные уроки. К примеру Vadim Makeev он действительно мастер своего дела, работает в html academy и идет в ногу со временем, он тоже не идеален, но плохих советов от него практически нет.

А можно статьи почитать? Интересно.
По большей части это готовые решения, которых в определенный момент как мне кажется не хватало
Немного на хабре https://habr.com/ru/users/Get-Web/posts/
Немного в моем блоге https://get-web.site/blog/
Остальное на тематических форумах вроде этого
 
В своё время именно Лаврик мне зашёл больше всего, очень толково объясняет. Хотя возможно к настоящему моменту ещё появился кто толковый.
 
Спасибо большое за полезные ссылки.
С недавнего времени изучаю код, и полезная информация лишней не будет))
 
Платный курс
Фрилансер по жизни, Евгений Андриканич | Курс по верстке (2021)
Для кого этот курс?
Вы новичок и безумно хотите научиться верстать сайты? Вы веб-дизайнер и хотите понимать все процессы этапа верстки? Вы бекэнд разработчик и хотите изучить верстку для продвижения своей карьеры? Тогда этот курс для вас!

Программа Курса:
1. Введение
2. Программы и инструменты
3. HTML Теги. Строительные теги
4. HTML Теги. Теги для работы с текстом
5. CSS Знакомство и синтаксис
6. CSS стили шрифта и текста
7. CSS подключение шрифтов
8. CSS свойства блоков
9. CSS свойства оформления блоков
10. CSS свойство background
11. CSS псевдоклассы
12. CSS псевдоэлементы
13. CSS позиционирование
14. CSS FlexBox
15. CSS переходы
16. SCSS препроцессор
17. Изображения
18. Сборщик Gulp
19. CSS Grid Layout
20. JS Введение и синтаксис
21. JS Переменные и массивы
22. JS работа с DOM (взаимосвязь JS HTML и CSS)
23. JS отправка данных AJAX
24. Тестирование

***Скрытое содержимое***
Тоже с него начинал обучение, плохо, что сейчас неудобно слушать
 
Назад
Верх