Как правильно и быстро верстать любой сайт: 8 проверенных методов ускорения

แชร์
ฝัง
  • เผยแพร่เมื่อ 5 มี.ค. 2020
  • 🔥Канал От 0 до 1 - / @vadymprokopchuk
    Подписывайся, чтобы усилить практику по верстке сайтов
    Сайты из видео:
    Шпаргалка Emmet - kupdf.net/download/emmet-chea...
    Pug to HTML - pughtml.com/
    SCSS документация на русском - sass-scss.ru/
    Все о Gulp - gulpjs.com/
    __
    Frontend Book PDF - tpverstak.ru/frontendbook
    Задать вопрос фронтендеру - frontendhelp.me/ru
    __
    Сайт - tpverstak.ru
    ВК - tpverstak
    Instagram - / annblok и / tpverstak
    Telegram - t.me/tpverstak
    Чат Telegram - t.me/tpverstakchat
    __
    Курсы и марафоны - tpverstak.ru/courses/
    Отзывы - topic-149247708_35960122

ความคิดเห็น • 95

  • @melissasofie7681
    @melissasofie7681 4 ปีที่แล้ว +1

    Спасибо. Номер 8 для меня вообще открытие. Класс👍

  • @anastasiavyaltseva9057
    @anastasiavyaltseva9057 4 ปีที่แล้ว +7

    Спасибо за видео! 8 совет мне особенно к месту, как раз думала что надо где-то решенные задачи на будущее сохранять, чтобы не рыться по проектам и гуглу)

    • @Elkmany
      @Elkmany 2 ปีที่แล้ว

      как прогресс за 2 года? Привет)

  • @srt2046
    @srt2046 4 ปีที่แล้ว +4

    Наткнулся на ваш канал и залип уже на несколько видео. Особенно спасибо за grid и flex.
    Спасибо за столь информативный формат

    • @annblok_webdev
      @annblok_webdev  4 ปีที่แล้ว

      🤗🤗🤗

    • @srt2046
      @srt2046 4 ปีที่แล้ว

      @@annblok_webdev с праздником 🌹

  • @Dreamer_78
    @Dreamer_78 4 ปีที่แล้ว +2

    Спасибо большое! очень полезное видео, успехов вам.

  • @gexgex941
    @gexgex941 3 ปีที่แล้ว

    Спасибо! Однозначно лайк)

  • @annagrigorewa
    @annagrigorewa 4 ปีที่แล้ว +1

    Очень понравилось видео...спасибо!!!!

  • @user-fi7fm9lr8m
    @user-fi7fm9lr8m 4 ปีที่แล้ว +3

    Класс!

  • @user-se7ih9bv6c
    @user-se7ih9bv6c 4 ปีที่แล้ว +2

    Спасибо за видео!
    Если добавите timeline в следующих видео, то очень порадуете ;)

  • @sanjar2475
    @sanjar2475 3 ปีที่แล้ว

    Круто как всегда

  • @user-so8ue9mb7y
    @user-so8ue9mb7y 4 ปีที่แล้ว

    Спасибо!

  • @BOBYR2010
    @BOBYR2010 3 ปีที่แล้ว +4

    Кто заметил в 9-21 "Авокадо" (Avocado)

  • @nikolay-t6497
    @nikolay-t6497 4 ปีที่แล้ว +1

    Спасибо за рекламу Вадима. Он знает своё дело.
    Умеет отлично преподнести инфу.

  • @stainerframe7607
    @stainerframe7607 3 ปีที่แล้ว

    За рекламу лайк!!! Только у Вадима курс закончил, пушка!

  • @sergeydeyneko6179
    @sergeydeyneko6179 4 ปีที่แล้ว +1

    Отличный ролик, одно но - пожалуйста записывай звук громче.

  • @user-pc9ci1uu2s
    @user-pc9ci1uu2s 2 ปีที่แล้ว

    Благодарю

  • @astroDezign
    @astroDezign 10 หลายเดือนก่อน

    Лицо красивое :)
    Подписался

  • @irina-s
    @irina-s 4 ปีที่แล้ว

    Спасибо за видео. Приятно было увидеть, что и галп, м препроцессоры я знаю, хотя изучаю вёрстку 3 месяца. Кстати, узнала об этом на курсе Вадима, канал которого упоминается в этом видео.

    • @stormbraker637
      @stormbraker637 2 ปีที่แล้ว

      Как сейчас успехи ?

    • @irina-s
      @irina-s 2 ปีที่แล้ว

      @@stormbraker637 Пробовала фрилансить, брала небольшие заказы. Потом решила что надо изучать JS. На одной вёрстке далеко не уедешь. Поэтому сейчас прохожу бесплатный курс от RS School JavaScript Front-end. А что дальше будет, посмотрим.

    • @vladfrolov5106
      @vladfrolov5106 ปีที่แล้ว

      @@irina-s Привет, как успех изучения? уже работаете?

    • @irina-s
      @irina-s ปีที่แล้ว

      @@vladfrolov5106 Да, работаю как фрилансер, делаю сайты на ВордПресс.

  • @user-oj8oc8ur4v
    @user-oj8oc8ur4v 2 ปีที่แล้ว

    Музончик в конце топ!
    кто согласен ставим лайк!

  • @user-nb8ex1tq6r
    @user-nb8ex1tq6r 4 ปีที่แล้ว +1

    Спасибо, полезное видео:)

  • @dosxanzada
    @dosxanzada 4 ปีที่แล้ว

    спасибо за советы, можете отправить макет где показываете на 10:05?

  • @Qusbaz-zg2nv
    @Qusbaz-zg2nv 4 ปีที่แล้ว +1

    Анна, еще один вопрос, а важно ли цветовое зрение в верстке? Я дальтоник, иногда сложно различать оттенки зеленого и красного

    • @annblok_webdev
      @annblok_webdev  4 ปีที่แล้ว +2

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

    • @Qusbaz-zg2nv
      @Qusbaz-zg2nv 4 ปีที่แล้ว

      @@annblok_webdev Спасибо! Какой он этот мир? Намного ярче навреное чем я вижу его)

    • @stormbraker637
      @stormbraker637 2 ปีที่แล้ว

      @@Qusbaz-zg2nv такое, в конце зимы оттенки серого

  • @levlubentsov9476
    @levlubentsov9476 4 ปีที่แล้ว

    и если не сложно , ссылку на источник , где можно посмотреть код чьих-то работ или что-то наподобие этого

  • @user-ue1lr8jn8c
    @user-ue1lr8jn8c 4 ปีที่แล้ว

    Т.е. если мне использовать pug то при интеграции на wordpress мне лучше будет юзать vue и axios и минимизировать php?

  • @user-bp8jp3on3r
    @user-bp8jp3on3r 4 ปีที่แล้ว

    У всех не показывается пример с SCSS? Или так и должно быть?

  • @user-fw2ti1cn4w
    @user-fw2ti1cn4w ปีที่แล้ว +1

    Анна такая умница и очень милая девушка

  • @user-kv7xd5yj9q
    @user-kv7xd5yj9q 2 ปีที่แล้ว +1

    Два пальца вверх 👍👍

  • @user-se6nj9qx9g
    @user-se6nj9qx9g 2 ปีที่แล้ว

    то чувство когда находишь ролик по ускорению верскти, в котором рекламят канал на котором сейчас верстаю=Р

  • @levlubentsov9476
    @levlubentsov9476 4 ปีที่แล้ว

    топ методы , а аккаунты в codepen приватные ?

  • @user-wz8jd9ud9f
    @user-wz8jd9ud9f 2 ปีที่แล้ว

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

  • @pogrebnoimaksim
    @pogrebnoimaksim 4 ปีที่แล้ว +5

    Видео должно было называться: 8 инструментов или 8 рекомендаций для верстки, о методах верстки как таковых ни слова...

    • @annblok_webdev
      @annblok_webdev  4 ปีที่แล้ว

      То, что вы имеете в виду есть в другом видео th-cam.com/video/qbIR23K8hGE/w-d-xo.html

    • @pogrebnoimaksim
      @pogrebnoimaksim 4 ปีที่แล้ว +1

      Типичный Верстальщик • Анна Блок вот именно)))

    • @bigkit_kitbig
      @bigkit_kitbig 4 ปีที่แล้ว

      @@annblok_webdev про это другое видео - зачем мне смотреть на вашу дергающуюся морду, или хочется себя попиариться перед богатенькими программистами, в поисках будущего лоха-муженька. Я бы лучше на код посмотрел. Свернитесь в маленькое окошко, как это делают другие блогеры. Дизлайк однозначно.

    • @whoisit2028
      @whoisit2028 4 ปีที่แล้ว

      @@bigkit_kitbig Ты сам понял что за хуйню высрал хД

  • @MrSunchezz
    @MrSunchezz 4 ปีที่แล้ว +5

    Всё пытаюсь "зайти" на препроцессоры, но вот начинаю читать и не понимаю их полезности. Нативный CSS сейчас прекрасно оформляется и переменные там так же есть и вычисления. Вероятно, может быть ощутимо, когда приходится писать CSS правила в объёме "Война и мир" , но не приходилось с таким сталкиваться.
    На мой взгляд, CSS и так довольно выразителен, чтобы делать над ним надстройки вроде тех, что выглядят как, например, поделки Python-разработчиков реализующих компиляторы из Python-кода в JavaScript-код, только от того, что их не устраивает JavaScript-синтаксис.
    По остальному согласен. Хорошо, что есть такие проекты, помогающие верстальщику эффективно преодолевать "боль интерпретации" того, что желает заказчик и без лишних танцев с бубном интегрировать эти решения в реализацию.

    • @yolonaoss2411
      @yolonaoss2411 4 ปีที่แล้ว +2

      Наверное, это личное дело каждого, но по мне препроцессоры это какое-то чудо. Скажем так, я верстал на css чистом и sass, это две разные вещи, sass очень сильно ускоряет верстку,хотя бы эндами по классам и переменными. Да и везде по вакансиям требуются знания препроцессоров,стоит всё-таки выучить, это всё-таки не js, порог вхождения после CSS минимальный)

    • @leem0ne
      @leem0ne 4 ปีที่แล้ว +1

      рано еще переменные в цсс использовать(как и гриды).

    • @pogrebnoimaksim
      @pogrebnoimaksim 4 ปีที่แล้ว +1

      Это прийдет с опытом и со временем))

    • @hekNt
      @hekNt 4 ปีที่แล้ว +1

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

    • @hekNt
      @hekNt 4 ปีที่แล้ว

      Ах, да, про более удобную вложенность правил забыл (&)
      .block {
      color:#000;
      &__element {
      color: #111;
      &_modificator {
      color: #222;
      }
      }
      }
      И это только вершина айсберга

  • @user-nb8ex1tq6r
    @user-nb8ex1tq6r 4 ปีที่แล้ว +3

    А как же Avocode, разве он не популярен? Или вы акцент делаете на работу в компании, а не на фрилансе?

    • @annblok_webdev
      @annblok_webdev  4 ปีที่แล้ว

      Об Avocode в ролике тоже говорю, но мне больше нравится Zeplin

    • @user-nb8ex1tq6r
      @user-nb8ex1tq6r 4 ปีที่แล้ว +1

      @@annblok_webdev и правда) не досмотрела и написала коммент)

    • @flashback8504
      @flashback8504 2 ปีที่แล้ว

      Фигма чем не годится? Она бесплатная на все время

    • @user-ey4xw7pk9h
      @user-ey4xw7pk9h 5 หลายเดือนก่อน

      Avocode - сдох в 2023.

    • @user-nb8ex1tq6r
      @user-nb8ex1tq6r 5 หลายเดือนก่อน

      @@user-ey4xw7pk9h спасибо, я сама уже больше 2 лет на Фигме)

  • @pogrebnoimaksim
    @pogrebnoimaksim 4 ปีที่แล้ว +3

    Avocado?)

  • @GUNTRUP_
    @GUNTRUP_ 2 ปีที่แล้ว

    Я от Вадима пришел по рекомендациям к тебе ....

  • @melissasofie7681
    @melissasofie7681 4 ปีที่แล้ว

    18тыс.просмотров под видео с верской сайта , да у тебя талант)))). Может видео с анимэшкой нам подаришь? Я уверенна ты смОгЁшь лучше всех.

  • @user-cb5xj1lg1l
    @user-cb5xj1lg1l 4 ปีที่แล้ว +4

    Нужно больше скорости

    • @user-fi7fm9lr8m
      @user-fi7fm9lr8m 4 ปีที่แล้ว

      Доктор вы прекрасны

  • @SLSRPPRO
    @SLSRPPRO 3 ปีที่แล้ว

    насколько ускорить ? у меня есть 5 минут

  • @artemnaumov3577
    @artemnaumov3577 4 ปีที่แล้ว +1

    Материал хороший, но звук тихий слишком.

    • @artemnaumov3577
      @artemnaumov3577 4 ปีที่แล้ว

      Оказывается, я глухой) Все хорошо, спасибо)

  • @strongcat844
    @strongcat844 2 ปีที่แล้ว

    по моему своства быстрее писать руками если в низ не юзаеться rgb рукой до мышки дольше тянуться чем они под еметом напишутся

  • @SVolikov
    @SVolikov 4 ปีที่แล้ว +1

    Жаль, что нельзя поставить 3 лайка. За работу, за то что это сделала девушка и за то что это красивая девушка.Спасибо!

  • @yura_8952
    @yura_8952 4 ปีที่แล้ว

    Вы на vue верстаете?

  • @Elkmany
    @Elkmany 2 ปีที่แล้ว

    А галп в 2022 еще норм? вроде уже нафиг не нужен

  • @doopath8737
    @doopath8737 4 ปีที่แล้ว +1

    На моей фриланс бирже в основном psd/figma макеты предлагают. 1/10 бывает xd и еще реже sketch.

    • @annblok_webdev
      @annblok_webdev  4 ปีที่แล้ว

      На какой фриланс бирже сидите?

    • @doopath8737
      @doopath8737 4 ปีที่แล้ว

      @@annblok_webdev freelancehunt

  • @user-pk5wr4yg3c
    @user-pk5wr4yg3c 4 ปีที่แล้ว

    Ничего личного к Вам не имею, но видеАролик чуть чуть режет ухо

  • @dinir1000
    @dinir1000 4 ปีที่แล้ว

    CSS препроцессор это же всё усложняет, нужно заморачиваться отсчитывать эти пробелы, это такой гемор, зачем себе работу усложнять?

  • @mikhails.2830
    @mikhails.2830 3 ปีที่แล้ว

    С pug не соглашусь. Очень не удобен для визуального восприятия

    • @annblok_webdev
      @annblok_webdev  3 ปีที่แล้ว

      Кому как, мне понравилось его использовать на практике

  • @sergey_zatsepin
    @sergey_zatsepin 3 ปีที่แล้ว

    Мдааа с упрощением кода с пом. Pug чёт ты жёстко прикольнулась. Такой бред конечно, ппц.

  • @Drezerak
    @Drezerak 4 ปีที่แล้ว

    Мальвина, уже не первая, кто говорит про PUG - значит надо изучить тему...

  • @zapiski_verstalshika
    @zapiski_verstalshika 4 ปีที่แล้ว

    смотрел от 0 до 1... господи... не дай доже так верстать...

    • @andrei8299
      @andrei8299 4 ปีที่แล้ว

      я сначала тоже смотрел и мне нравилось, какие-то видео неплохие. Но потом стал понимать, что да, косяков много и больше не смотрю

    • @irina-s
      @irina-s 4 ปีที่แล้ว

      Для начинающих у Вадима отличные видео. К тому же у него талант преподавания, а это не у всех профи есть.

    • @zapiski_verstalshika
      @zapiski_verstalshika 4 ปีที่แล้ว

      @@irina-s насмотревшись это, начинающие начинают такую х*** верстать, что их хрен переучишь потом! а страдают все, и вы в том числе

    • @irina-s
      @irina-s 4 ปีที่แล้ว

      @@zapiski_verstalshika А что конкретно не так, приведите пример? Или сами может проведёте многочасовой марафон и покажете мастер класс?

    • @zapiski_verstalshika
      @zapiski_verstalshika 4 ปีที่แล้ว

      @@irina-s ссылки должны быть ссылками, кнопки должны быть кнопками, а не ссылкой в диве, и наоборот... сейчас и заказы все чаще встречаются с условиями без библиотек и jq, он же все подряд пихает... это только то что помню из его видео, но далеко не все что видел! мастер класс не покажу, по тому как не готовлю код перед записью видео, верстаю в живую... и, конечно, бывают ошибки и в моих видео, но далеко не такие!!!

  • @user-py4bp2me9j
    @user-py4bp2me9j 4 ปีที่แล้ว +2

    Анна, почему не используете феминитивы?) Разумнее назвать канал "Типичная верстальщица"

    • @Nick_Wing40000
      @Nick_Wing40000 4 ปีที่แล้ว +1

      уахаха "феминитивы" ору

  • @user-jm4mx7gn2p
    @user-jm4mx7gn2p 4 ปีที่แล้ว

    Капец , блондиночка , только два слова может сказать , а потом надо паузу делать и видео склеивать ахах

  • @khamzagal7928
    @khamzagal7928 4 ปีที่แล้ว

    Отписка