Кастомные свойства - HTML Шорты

- Why variables in CSS are harmful, Берт Бос - www.w3.org/People/Bos/CSS-var...
- Пользовательские свойства CSS. Основы - zmeika.name/2017/03/02/custom-...
- It’s Time To Start Using CSS Custom Properties, Сергей Господарец - www.smashingmagazine.com/2017...
- Гибкая настройка внешнего вида выдачи Яндекса, Руслан Муфтиев - events.yandex.ru/lib/talks/4265/
Ближайшие интенсивы:
- «HTML и CSS, уровень 1» - htmlacademy.ru/intensive/htmlcss
- «HTML и CSS, уровень 2» - htmlacademy.ru/intensive/adap...
- «JavaScript, уровень 1» - htmlacademy.ru/intensive/java...
- «JavaScript, уровень 2» - htmlacademy.ru/intensive/ecma...
- «JavaScript, уровень 3» - htmlacademy.ru/intensive/react
- профессия «Фронтенд разработчик» - htmlacademy.ru/profession/fro...
- профессия «React-разработчик» - htmlacademy.ru/profession/react
- «Node.js, уровень 1» - htmlacademy.ru/intensive/nodejs
- «PHP, уровень 1» - htmlacademy.ru/intensive/php
- «PHP, уровень 2» - htmlacademy.ru/intensive/php2

Пікірлер: 59

  • @HTMLAcademyTV
    @HTMLAcademyTV4 жыл бұрын

    По промокоду «YouMeow» скидка 900 рублей на интенсив или программу профессии в Академии - tml.io/mbf87

  • @shtirlizc1024
    @shtirlizc10247 жыл бұрын

    HTML Шорты - отличная рубрика. Спасибо!

  • @evilblackheart
    @evilblackheart7 жыл бұрын

    Спасибо,за очередное интересное и познавательное видео.Есть стимул погружаться всё глубже в изучение html и css)Жду новых выпусков!)

  • @The00tori00
    @The00tori007 жыл бұрын

    было бы очень интересно услышать ответ на вопрос в одном из следующих выпусков: как правильно и рационально использовать блоки-врапперы в HTML-файлах. часто просматриваю код сайтов (особенно это касается CMS), и недоумеваю: зачем так много лишних блоков. официальная документация html довольно сложна, и найти ответ на этот вопрос мне очень сложно.

  • @HTMLAcademyTV

    @HTMLAcademyTV

    7 жыл бұрын

    Спасибо за вопрос, разберём

  • @RealDeilan

    @RealDeilan

    7 жыл бұрын

    Да, это очень актуальный вопрос для начинающих. На интенсивах и курсах Академии всевозможные обёртки используются повсеместно, но какие базовые принципы лежат за этим прямо не объясняется, а новичку сходу понять и разобраться в этом непросто.

  • @artemberesnev3789
    @artemberesnev37896 жыл бұрын

    Спасибо! Теперь буду чуть больше понимать подкаст)

  • @frontendmaster2704
    @frontendmaster27047 жыл бұрын

    Вижу новое виде - ставлю лайк

  • @sarlevdiz
    @sarlevdiz6 жыл бұрын

    Молодчина! И даже не поленился приатачить ссылки.

  • @offeecode7074
    @offeecode70746 жыл бұрын

    За этот шорт огромное спасибо!

  • @KsuCielly
    @KsuCielly7 жыл бұрын

    "Но уже пришло время пробовать и уметь." - Спасибо! Будем пробовать.:)))

  • @viacheslavshevchenko5639
    @viacheslavshevchenko56397 жыл бұрын

    Спасибо. Очень интересно!!!

  • @Ekaterina-tu7ou
    @Ekaterina-tu7ou3 жыл бұрын

    Спасибо!

  • @romkanejdan
    @romkanejdan7 жыл бұрын

    Расскажите пожалуйста про заголовки - . Можно ли использовать несколько на странице? В примерах спецификации много, но меня не покидает сомнения, что я где-то читал о том, что может быть только один.

  • @HTMLAcademyTV

    @HTMLAcademyTV

    7 жыл бұрын

    Расскажем и очень скоро 👀

  • @user-dx4cp2gv4z
    @user-dx4cp2gv4z7 жыл бұрын

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

  • @Jerry-ho8le
    @Jerry-ho8le7 жыл бұрын

    Классная футболка в каждом выпуске)))

  • @pepelsbey

    @pepelsbey

    7 жыл бұрын

    Скоро футболки начнут кончаться! Но пока есть запас.

  • @artemijeka
    @artemijeka4 жыл бұрын

    Пока не понял о чем это, но спасибо.

  • @RealDeilan
    @RealDeilan7 жыл бұрын

    При создании меню в виде списка ссылок (`ul>li>a`) часто возникает неоднозначность: какие классы вешать на элементы списка `li`, а какие - на ссылки `a`? Расскажите про это, пожалуйста. :)

  • @4esnog

    @4esnog

    7 жыл бұрын

    Всё зависит от задачи и ситуации) Если, например, этот список - действительно текстовый список (и ссылки в нём тоже inline-), можно ограничиться только `a`. В общем случае, думаю, расположение и позиционирование - на `li`, украшательства - на `a`. Но опять же, цели могут быть очень разные

  • @HTMLAcademyTV

    @HTMLAcademyTV

    7 жыл бұрын

    Спасибо за вопрос

  • @RealDeilan
    @RealDeilan7 жыл бұрын

    При создании отступов между родительским элементом и его дочерними элементами в каких случаях надо использовать padding'и у родителя, а в каких - margin'ы у его дочерних элементов? При расположении двух элементов относительно друг друга какому из них выставлять margin: левому/верхнему или правому/нижнему?

  • @HTMLAcademyTV

    @HTMLAcademyTV

    7 жыл бұрын

    Попробуем разобрать этот вопрос в будущих выпусках, спасибо

  • @Gurylyov
    @Gurylyov7 жыл бұрын

    В случае, если я хочу хранить все переменные в одном файле, а использовать в другом (склеивая их после иди просто импортируя), то как узнать, что кастомное свойство «почему-то не было объявлено» заранее? Никак? Получается, нужно всё равно препроцессить по прежним правилам, чтобы они подставлялись сами в виде фолбэков?

  • @pepelsbey

    @pepelsbey

    7 жыл бұрын

    Андрей Гурылёв нужно просто писать компоненты (как и функции в программировании) с дефолтным значениями.

  • @slogic10
    @slogic106 жыл бұрын

    Чем больше будет динамики в CSS, тем больше он будет похож на язык программирования. Т.е. уходя от JS приходим к извращенному JS. Это общая проблема концепции универсализации.

  • @TARAKANhoy
    @TARAKANhoy7 жыл бұрын

    Накопил сразу несколько вопросов: 1) В чем семантическое отличие тегов menu и nav и как их правильно применять? 2) Часто встраиваю контентные изображения бэкграундом в инлайновые стили из-за очень удобных свойств background-size: cover/contain. Насколько правильно с точки зрения семантики использовать такой метод учитывая что нельзя прописать атрибут alt

  • @HTMLAcademyTV

    @HTMLAcademyTV

    7 жыл бұрын

    Спасибо за вопросы, расскажем

  • @alexeylivadniy6707

    @alexeylivadniy6707

    7 жыл бұрын

    nav - только для основного блока навигации должен применяться (www.w3schools.com/tags/tag_nav.asp). А menu - это кастомные менюхи в веб-приложениях, возможное переопределение контекстного меню, наборы кастомных команд и все такое (www.w3schools.com/tags/tag_menu.asp)

  • @xahtep26
    @xahtep267 жыл бұрын

    Расскажите про необязательные HTML-теги, которые гугл (в своем styleguide) рекомендует не использовать. Думаю многие даже не знают точно какие теги являются необязательными, но лично меня больше интересует какие плюсы это дает и стоит ли слушать умельцев из гугла?

  • @HTMLAcademyTV

    @HTMLAcademyTV

    7 жыл бұрын

    Спасибо за интересный вопрос, расскажем

  • @shama3720

    @shama3720

    7 жыл бұрын

    HTML Academy мне тоже интересно!

  • @Andrew-strong
    @Andrew-strong7 жыл бұрын

    Вещь хорошая, но увы, IE, их не поддерживает. И Edge до 15й версии тоже а в 15 указан частичный саппорт с багами. Что делать? Забить на совместимость с IE, или делать 2 версии сайта?

  • @pepelsbey

    @pepelsbey

    7 жыл бұрын

    Андрей Францев об этом в самом конце ролика: полной поддержки пока нет, но знать и уметь уже вполне можно. В видео по ссылке в описании рассказано, как их уже использует Яндекс.

  • @artempolukarov6155

    @artempolukarov6155

    7 жыл бұрын

    Забить. Я забил. ))

  • @pepelsbey

    @pepelsbey

    7 жыл бұрын

    Все мои эксперименты с Edge 15 и кастомными свойствами прошли гладко, а я делал сложные штуки.

  • @artem_r

    @artem_r

    7 жыл бұрын

    можно использовать полифилы - файлы стилей будут взяты из кеша и на них применить маппинг переменных из js. будет фликеринг, но пользователям ИЕ не привыкать к странному интернету

  • @artempolukarov6155

    @artempolukarov6155

    7 жыл бұрын

    Artem Riasnianskyi они и не вкурсе, что интернет вообще нормальный. :D

  • @RagazzoKZ
    @RagazzoKZ5 жыл бұрын

    Я не использую препроцессоры. Попробывал - уж слишком много мусора генерируют

  • @user-hs3vn2pl8f
    @user-hs3vn2pl8f7 жыл бұрын

    Предположу, что и препроцессоры не будут стоять на месте, будут появляться всё новые, с новыми классными плюшками. При таком раскладе препроцессоры все равно будут находиться на один шаг впереди перед нативным CSS. Как вы считаете?

  • @dmitrysemigradsky764

    @dmitrysemigradsky764

    7 жыл бұрын

    Никто не мешает комбинировать. Например, использовать PostCSS, чтобы использовать необходимые плюшки от препроцессоров, но при этом не сильно завязываться на их синтаксис.

  • @PaulNekrasov

    @PaulNekrasov

    7 жыл бұрын

    Мне кажется вы не внимательно смотрели, ПРЕпроцессоры на то и ПРЕ, что после того как стили собрали, о них можно забыть. О какой шаге впереди идет речь? Только нативная поддержка дает динамику изменений "после сборки"

  • @almazmusic
    @almazmusic7 жыл бұрын

    Почему, если речь идёт о крупных проектах, то само собой полагается, что в них должен присутствовать препроцессор стилей? В чём удобства препроцессоров для типичной средней команды разработки (когда рефактор никто не оплачивает, когда никто особо не пишет доку, и так далее)?

  • @pepelsbey

    @pepelsbey

    7 жыл бұрын

    Dmitry Anderson главным образом, переменные с цветами и организация модульности.

  • @almazmusic

    @almazmusic

    7 жыл бұрын

    сколько не видел таких проектов - цвета были в сплошном бардаке, т.к. и по оттенку разбросаны (хорошо хоть в одном файле были), и называл кто как мог, и ещё ряд проблем. А про модульность что конкретно имелось в виду? Я лично в таких проектах видел только проблемы, т.к. люди писали вложенностями и часто глядя в середину или конец большого компонента не очень понятно что такое: .item { display: block }. И чтобы в голове отрезолвить такое, приходилось подыматься вверх на уровней 4-5 точно и компилировать в уме. В общем то честно, никогда не видел преимуществ в использовании препроцессоров в больших проектах. Возможно дело в текучке людей на тех проектах, возможно ещё в чём-то, но определённо хотелось услышать мнение кого-то, кто работал в команде на стилевых препроцессорах. Спасибо.

  • @KocaHocTpa

    @KocaHocTpa

    7 жыл бұрын

    Активно используем у себя препроцессоры. Если писать придерживаясь какой либо методологии то все просто замечательно. Например у нас БЭМ. Стили разбиты по файлам по имени Блоков (компоненты), отдельно вынесены цвета, отдельно типографика. Стили для мобильных так же отделены от десктопных. Но что бы все было так радужно нам пришлось: 1. Согласовать для всех верстальщиков структуру папок и файлов при разработке. 2. Стайлгайд написания стилей ( элементарные вещи типа максимальной глубины вложенности, именования переменных и тд и тп )

  • @almazmusic

    @almazmusic

    7 жыл бұрын

    Ну вот на то, что вам "пришлось" не везде есть время к сожалению :(

  • @KocaHocTpa

    @KocaHocTpa

    7 жыл бұрын

    Dmitry Anderson ну не сказал бы что много времени надо. Сначало обсудили базовые вещи + решили использовать БЭМ. Я за пару вечеров написал простой набор тасков для галпа. А потом от проекта к проекту стайлгайд обрастал подробностями + появилось много нюансов уже прописанных заранее.

  • @AlexSanPGR
    @AlexSanPGR6 жыл бұрын

    На принте Мохнатая гора IE, не иначе)

  • @phoenixtf
    @phoenixtf7 жыл бұрын

    Ребята, есть такое пожелание - разделяйте как-то новые с пылу с жару фичи от тех, которые уже сейчас можно широко использовать. Иначе получается каша "обо всём интересном на свете", и это реально путает.

  • @pepelsbey

    @pepelsbey

    7 жыл бұрын

    Мы явно говорим, что можно использовать, а что пока нет. Но всё очень зависит от проекта: для каких-нибудь админок внутри компании, где все на Safari и Chrome - почему бы и нет. Если будем рассказывать про фичи со 100% поддержкой в IE9, то будет очень скучно.

  • @mykolatrolizmaslom7767
    @mykolatrolizmaslom77677 жыл бұрын

    гриды!!! о гридах давайте

  • @pavelkiselev_youtube
    @pavelkiselev_youtube2 жыл бұрын

    Трудно понимать видео с обилием этих терминов, особенно новичку. Желательно сделать какую-нибудь статью или список с кратким пояснением всех терминов которые будут встречать в процессе обучения. А также лучше адаптировать шорты под письменный язык когда выкладываете их на сайт как статьи. Ещё труднее понимать когда читаешь разговорный язык.

  • @artem_r
    @artem_r7 жыл бұрын

    Очень жаль, что нельзя использовать переменные в медиа квери

  • @pepelsbey

    @pepelsbey

    7 жыл бұрын

    Есть уже черновик, который позволяет писать специальный переменные для медиавыражений.

  • @user-ty6fq9os9k
    @user-ty6fq9os9k4 жыл бұрын

    Не кастомные, а пользовательские свойства. Язык свой не стоит забывать.

  • @aau8
    @aau82 жыл бұрын

    кАстомный

  • @user-ry8yh6ht2k
    @user-ry8yh6ht2k Жыл бұрын

    Сколько реально зарабатывает программист kzread.info/dash/bejne/aXh_u9uRXc-8lpc.html

Келесі