Что нового в ЦСС: text-box-trim Как изменить стили чужого сайта? 1 • 2 • Генераторы статических сайтов. Видеоразбор и шаблон проекта 2 • Какой движок выбрать для сайта рекламного агентства? 2 • Чеклист публикации сайта 3 • Как объяснять разработчикам архитектуру проекта? Как улучшить сообщение о баге для разработчиков? clip-path — обрезка по фигуре в ЦСС Как проверять соответствие сайта макету в 2024? Какие есть аналоги PixelPerfect? Ошибки вложенности в ХТМЛ 1 • Откуда берётся отступ под картинкой и как его убрать? 1 • Как добавить видео на сайт? А что плохого в нестандартных ХТМЛ-тегах? Я сверстал себе сайт. Как опубликовать его в интернете? 1 • Почему в Школе бюро снижают оценки за использование абсолюта в ХТМЛ-вёрстке? Что дизайнеру стоит знать о редиректах? Фигурное обтекание текстом, shape-outside Рецепт: модуль с прокруткой содержимого и динамическим затенением по краям 1 • Что думаете о задании цвета через его веб-название? Как обрезать текст? Часть 2: умная обрезка с Яваскриптом Как обрезать текст по ширине и по количеству строк? Часть 1: простые и продвинутые способы Типовые решения в вёрстке. Как сверстать гамбургерное меню 1 • Рецепт: бегущая строка на сайте без Яваскрипта 2 • Как правильно работать с начертаниями подключаемого шрифта в ЦСС? Что дизайнеру стоит знать о якорных ссылках? Чем дизайнеру могут помочь инструменты разработчика? Анализ сетевых запросов Чем плоха стилизация по айди? Вредные комментарии: зарубки, тудушки и документашки Типовые решения в вёрстке. Как сверстать визитку Когда нужно писать комментарии в коде? В Сафари появилось распознавание текста на картинках. Иногда текст странно выделяется и копируется. Что поделать? 2 • Это какие‑то другие пиксели? Как они соотносятся? 2 • Как отключить наведение и нажатие на элемент через ЦСС? Типовые решения в вёрстке. Как сверстать простой подвал 1 • Что нового в ЦСС: Range Syntax в медиавыражениях 1 • Что вы думаете о Тайпскрипте? Используете его в продуктах бюро? 3 • Что вы думаете о способе указывать цвету прозрачность в шестнадцатеричном виде вместо более традиционного RGBA? 3 • Ключевые слова min-content, max-content и fit-content в ЦСС Как изменить цвет выделения текста на сайте, ::selection Яваскрипт-приёмы лаконич­ного решения типовых задач 1 • Что такое «доступность» в веб-разработке? 1 • Гриды «на пальцах». Четвёртая часть: ключевое слово auto Что дизайнеру стоит знать о разметке для поисковиков Как сверстать пропорциональный модуль в 2023? Подскажите, пожалуйста, как начать понимать разработчиков? 1 • Как сделать индикатор прохождения задания, как в книгах бюро 1 • Как сделать анимацию на сайте, чтобы она шла параллельно скроллу? 2 • Лайфхак: что делать с широкими модулями на узком экране Расскажите о современных способах и тонкостях вёрстки таблиц Как переключить тему оформления страницы Яваскриптом? 1 • Как отлаживать странное? Вторая часть 1 • Магические числа в коде. Почему это плохо и что с ними делать 1 • Инструменты разработчика на Айфоне и Айпаде Логические свойства в ЦСС Когда в вёрстке неуместен КАПС? 2 • Guard Clause. Избавляемся от вложенных условий в программировании 3 • Что думаешь о ChatGPT? 1 • Как сделать тоненькое подчёркивание ссылок? 1 • Принцип «никто не забыт, ничто не забыто» ЦСС-трюк: увеличиваем область клика 2 • Каким образом вы копите различные знания в виде текста, картинок, видео? 2 • Где использовать гриды, а где флексбоксы 3 • Выпадающие подсказки для полей ввода без программирования ImageOptim — полезная программа для оптимизации картинок на сайте 4 • Расскажите о выравнивании текста в гридах Рецепт вёрстки: эффект подсветки от движения курсора Как в Телеграме показать Опенграф-картинку сайта крупно? Гриды «на пальцах». Третья часть: выравнивание Как на сайте добавить фоновое, а не контентное, изображение через ЦСС, с учетом обычных экранов и ретины? Анимации в ЦСС. Транзишены Гриды «на пальцах». Первая часть: ячейки и направляющие Есть ли смысл учить HTML и CSS без JS? Как лучше всего сверстать листинг на текстовой странице? Зачем верстать самому, если есть Бутстрап? 1 • Флексбокс «на пальцах». Четвёртая часть: автоматические маржины Эммет. Как писать ХТМЛ и ЦСС в десять раз быстрее? Некоторые приложения спрашивают действующий пароль, если я хочу его поменять. Зачем? Мастер-класс по оживлению ХТМЛ-форм 1 • Градиенты для текста в ЦСС Градиенты в ЦСС Нужен ли jQuery в 2022? 2 • Флексбокс «на пальцах». Третья часть: размеры и порядок элементов Трюк с псевдоэлементом. Верстаем таблетку со счётчиком 3 • Что писать в атрибуте alt у картинок? Флексбокс «на пальцах». Вторая часть: перенос элементов Когда правильно padding, а когда margin? Возможно ли делать сайты, где человек остаётся на том месте, где читал Флексбокс «на пальцах». Первая часть: оси и выравнивание Подкаст с техноконтуром Как экспортировать картинки в правильном формате из Фигмы? 1 • Псевдокласс :not 2 • Расскажите о типографике в вёрстке. Часть 5 Как сегодня защитить код проекта от политических диверсий? Расскажите о типографике в вёрстке. Часть 4 Псевдоклассы структуры в ЦСС 1 • Расскажите о типографике в вёрстке. Часть 3 Псевдоклассы взаимодействия в ЦСС Расскажите о типографике в вёрстке. Часть 2 Хитрость с падингом. Верстаем пропорциональный модуль 2 • Расскажите о типографике в вёрстке. Часть 1 2 • Как используют ЦСС-переменные и когда они неуместны? Как лучше задавать отступы в потоке модулей и элементов? 1 • Игорь, добрый день! Как вы учились кодить? Можете посоветовать книги или курсы? Часть 2 1 • Как улучшить процесс модерации 1 • Игорь, добрый день! Как вы учились кодить? Можете посоветовать книги или курсы? Что нового в ЦСС? Селекторы :is и :where Вы говорили о забугорных сервисах конструкторах сайтов, которые не известны у нас Как опубликовать веб-страницу в интернете? Как оформить страницу языком ЦСС? 1 • Как сверстать страницу, если совсем новичок и никогда не верстал? Итоги КУСа «Как сверстать анимированный флаг» КУС. Как сверстать анимированный флаг? 1 • Графические фильтры в ЦСС Принцип «чем меньше изменений, тем лучше» Тестирование мобильной вёрстки. Почему инструментов разработчика в браузере недостаточно? 2 • Менеджер тегов Гугля. Как установить несколько систем сбора статистики на сайт 1 • Как изменять стили сайта в зависимости от пропорций окна браузера? Расскажите, как устроены тесты в Школе бюро 6 • Яндекс-метрика для анализа посещаемости и посетителей сайта 3 • Как быстро и без миганий загружать веб-шрифты. Вторая часть: сабсеты Как разработчики бюро получают задачи от дизайнеров? 4 • Расскажите о каскаде в CSS Как в бюро создают картинки для превью советов? 2 • Как правильно называть цвета в дизайн-системе? Быстрая оценка качества страницы Гугль Лайтхаусом Превью страницы для соцсетей и чатов Какие ступени пройти, чтобы стать лучше, как дизайнер, будучи разработчиком? 1 • Вёрстка слева направо и сверху вниз 3 • Расскажите о горячих клавишах на сайтах 2 • Чем опасны размеры в пикселях в ЦСС? 3 • Как менеджеру продукта учиться разбираться в технологиях разработки? 3 • Советы по вёрстке и фронтенду Не получается разбивать большие эпики или стори на более мелкие таски 2 • Типовые решения в вёрстке. Как сверстать плашку с текстом и фоном 4 • Сколько времени тратите на планирование реализации «фичи» и сколько времени на написание самого кода? Как сбросить дефолтные стили браузера 1 • Как сделать вынос ссылок в отдельную колонку? 4 • Почему не стоит использовать атрибут id для стилизации элементов 2 • А может быть маг полководцем или полководец магом? Как вы оцените с технической точки зрения новый редактор публикаций в «Деле Модульбанка»? 3 • Как переключить тему оформления на сайте в зависимости от настройки ОС Как в аврале уделять время росту? 2 • Что изучать в ЦСС в 2021 году Как вы понимаете, что интерфейс будет хорошо смотреться на «неретинах»? Какие технологии вы бы порекомендовали для создания статичных и не самых сложных сайтов 2 • Как называть классы в ЦСС. Часть вторая Как объяснить значимость фичи разработчику? 1 • Как называть классы в ЦСС. Часть первая Расскажите об обязанностях технического директора в бюро. Вторая часть: встречи один на один Как быть, если твой руководитель некомпетентнее или незаинтересованнее тебя? Насколько уместно использование ЦСС-стилей cursor: default и user-select: none 2 • Как бороться с багами? Часть третья: source maps Как искать баланс между пользой для команды и пользой для себя? 1 • Как бороться с багами? Часть одиннадцатая: не утонуть в багах и глюках Как организовать процесс сдачи задачи и код-ревью в рамках спринта? Типовые решения в вёрстке. Как форматировать ХТМЛ 9 • Что нужно, чтобы сайт на Айфоне выглядел также как на Андроиде, а не в два раза меньше? 1 • Стоит ли менять работу, если уже порядком поднадоело, но есть новые проекты и в целом хоть какой-то прогресс ощутим? Как сделать всю страницу полем для загрузки файла по методике дрэг энд дроп Как бороться с багами? Часть пятая: отслеживать производительность Что такое непрерывная доставка? Специфичность селекторов в ЦСС Как написать аккуратный код? Часть четвёртая: ответственность Расскажите, как автор советов работает с маргиналиями? Отслеживаете ли вы производительность программистов? 1 • Как и когда зарождающийся стартап в процессе своего развития должен подходить к вопросу имплементации билинга? Типовые решения в вёрстке. Простой рецепт колоночной раскладки 2 • Новичок в команде считает, что стандарты качества продуктов низкие, а знания и опыт устарели из-за инертности 3 • Как быть разработчикам, которые хотят получать больше денег, но не хотят разбираться в бизнесе? Что делать, если меня, технического директора, потихоньку отстраняют от дел? 1 • Типовые решения в вёрстке. Почему не стоит использовать float 2 • 3 • Как написать аккуратный код? Часть третья: заменяемость Типовые решения в вёрстке. Обёртка для страницы 1 • Чеклист безопасности в интернете. Что можно сделать прямо сейчас? 3 • Есть СТО, он классный, но при этом редко выходит в свет. Насколько, на твой взгляд, это может быть важно или полезно компании в целом? Типовые решения в вёрстке. Как подключить шрифты 1 • Какую библиотеку вы используете при смещении фона? Как быть, если всё моё время уходит на разработку всё новых и новых фич? 1 • Типовые решения в вёрстке. Как сверстать простую шапку страницы с меню 5 • Как написать аккуратный код? Часть вторая: связность 1 • Адаптивные изображения, тег picture Автотесты «на пальцах» 1 • Как написать аккуратный код? Часть первая: зацепление 3 • Адаптивные изображения, атрибуты srcset и sizes 2 • Автотесты «на пальцах» 2 • Почему лучше разделить фронтенд и бэкенд? 7 • Что показывает уровень развития инженерной культуры? 2 • Как избежать эффекта Упячки при загрузке картинок 5 • Разработчик, который не думает, а просто делает — не нужен? 5 • Что делает тег meta с атрибутом name="viewport"? Зачем его указывать? Автотесты «на пальцах» 1 • Как следить за качеством кода? Часть третья: процессы 4 • Принципы надёжной вёрстки 5 • Автотесты «на пальцах» 1 • Как следить за качеством кода? Часть вторая: метрики Что такое СВГ и как его использовать в ХТМЛ-вёрстке? 1 • Джанго или Рельсы? Как следить за качеством кода? Часть первая: зачем Вы используете Зеплин? 2 • Несколько месяцев назад меня повысили из обычного разработчика до «тимлида» 1 • Как правильно, эффективно и уважительно ставить KPI? Как готовить макеты для технологов? 6 • Как отслеживать и обрабатывать чит-коды 3 • Существует ли способ проверить компетентность веб-разработчика, если сам ничего не понимаешь в этом? ЦСС-переменные: как использовать и для чего могут пригодиться 2 • Принцип «не протыкал — не сделал» 4 • Как менеджеру ставить задачи, чтобы ротация в команде не заставляла пережёвывать все задачи устно по 100 раз? Режимы наложения в ЦСС 2 • Есть ли смысл учить Ruby on Rails в 2019 году? 3 • Где провести границу MVP? 1 • Как дизайнеру стать разработчиком и зачем Как переходить на переписанные с нуля сервисы? Как организовать работу удалённой команды разработчиков? С чего начать вёрстку ХТМЛ‑страницы 2 • Как донести подход HADI до руководства? 4 • Гугль-док, чтобы упорядочить командное обсуждение 1 • Что почитать, чтобы прокачаться в Гите? 3 • С чего начать вёрстку ХТМЛ-страницы Как резать фичи на основе экспериментов? 3 • Расскажите о безголовом Хроме Советы о фронтенде Советы об управлении разработкой 3 • Логотип в вёрстке сильно отличается от логотипа в макете Принцип «в письме всё есть» 1 • Руст, а чем плох br? 3 • Как устроено ограничение максимальной ширины сайта бюро 3 • При клике на кнопку нужно плавно прокрутить страницу к форме 2 • Как в бюро верстают электронные письма и рассылки. Третья часть: рассылки Школы и Издательства бюро 1 • Cтоит задача придумать интересные эффекты и анимации Как в бюро верстают электронные письма и рассылки. Вторая часть: рассылка советов Сайты для слабовидящих 2 • Руст, можно ли сделать такую кнопку без фоновой картинки? 3 • Как оттипографить текст там, куда ручным типографом не добраться Как в бюро верстают электронные письма и рассылки Есть способ заставить такую анимацию работать в зависимости от скролла? Каким способом сделать простую анимацию на спрайтах 2 • Как устроена беспарольная аутентификация почтой 7 • 2 • Как вы проверяете соответствие вёрстки макету 2 • Как спрятать экранную клавиатуру в Айфоне? Расскажите об обязанностях технического директора в бюро EM или REM? Как попросить клиента помочь с дебагом? 1 • 1 • Как бороться с багами? Часть десятая: порефлексировать 6 • Как бороться с багами? Часть девятая: исправить Можно ли достичь эффекта переливания без встраивания видео на сайт? 1 • 6 • Как бороться с багами? Часть восьмая: изолировать 13 • Как бороться с багами? Часть седьмая: повторить Почему вы используете jQuery для хождения по дереву и управления событиями? 2 • Как бороться с багами? Часть шестая: алгоритм Если картинка отвалится или окажется неправильного размера — сломаются блоки. Как быть? Что должен уметь ведущий разработчик в бюро? Что делать с версткой под ИЕ? Как бороться с багами? Часть четвёртая: логи Не преступление использовать Бутстрап? 3 • Как бороться с багами? Часть вторая: отслеживание ошибок 2 • Как бороться с багами? Часть первая: гигиена кода Чем дизайнеру могут помочь инструменты разработчика в браузере (отладка анимаций) Как сменить домен сайта, не теряя пользовательских данных? Можно ли применять вариативные шрифты в вебе Что за font-family? Где его взять? 2 • 1 • Заметил, что сайт бюро перешёл на HTTPS. Расскажите, как переходили? 1 • Как сделана залипающая кнопка на странице книжной полки Расскажите о дизайне REST API 1 • 2 • Как быстро и без миганий загружать веб-шрифты? Как верстать электронные письма? Как отлаживать странное? 3 • Как железобетонно определить, печатный ли символ ввёл пользователь? Зачем дизайнеру Бутстрап? 2 • Что дизайнеру стоит знать об адаптивном дизайне в вёрстке? Чем дизайнеру могут помочь инструменты разработчика в браузере? 1 • Как раскладывать ХТМЛ-элементы на странице. Часть третья: флексбоксы в каталогах и выдаче 1 • Как раскладывать ХТМЛ-элементы на странице. Часть вторая: флексбоксы 1 • Cуществует ли современный способ вывода знака рубля для всех устройств 1 • Как в ХТМЛ верстать картинки, списки и таблицы 3 • Как раскладывать ХТМЛ-элементы на странице. Часть первая: боксы и позиционирование С помощью чего собрать простой прототип на веб-технологиях? 1 • Хочу научиться верстать, но не знаю с чего начать (продолжение) 1 • Зачем дизайнеру прототипирование при помощи веб-технологий? С чего начать? Планируете ли выложить Педанта в открытый доступ? Что писать в комментарии к коммиту? Хочу научиться верстать, но не знаю с чего начать 4 • Вы говорили, что картинки в книге выгружаются из памяти, чтобы повысить производительность. Как это устроено? 2 • Руст, расскажи, где без воды можно найти инфу по гридам, чтобы без боли начать их использовать. 1 • Как устроен сайт бюро изнутри Что думаешь про точки с запятой в Яваскрипте? Зачем их ставить? 1 • В одном из советов про редизайн Михаил упомянул, что раскладка работает без админки Как начать писать тесты в «махровом легаси»? 1 • Как программировать многоязычные сайты 1 • Какую систему именования выбрать для небольшого проекта? (Продолжение) 8 • Как собираются превьюшки в книгах Какую систему именования выбрать для небольшого проекта — БЭМ, SMACSS или что-то другое? Как устроен поиск в книгах Вы кто такие? За какими вещами нужно следить, чтобы при загрузке страница выглядела прилично? 1 • С чего начать изучение ЦСС? 1 • Как сделать, чтобы блок при прокрутке залипал у верхней границы окна браузера? 5 • Можно ли заверстать несколько разноширинных элементов через равные промежутки в резиновом контейнере? 1 • 3 • Как правильно организовать взаимодействие разработчиков фронтенда и бэкенда? 1 • Удачное ли решение на сайте в поле пароля указывать, что нажат капслок, как на Маке? 6 • 8 • Как принудительно включать полную версию на мобильном устройстве? Как сделать такой же клёвый таймлайн, как на главной бюро Расскажите, пожалуйста, как реализованы фотографии участников в Бюросфере 5 • 5 • 2 • 3 • 2 • 4 • Меня интересует вопрос миграции базы данных 1 • Как вы храните данные для многоязычных сайтов? 3 • 4 • 5 • 2 • Как реализовать вёрстку блоков с разной высотой? 6 • Как реализована висячая пунктуация на сайте бюро? Как правильно сделать подчёркивание многострочного текста, чтобы линия была в три пикселя? 1 • 5 • Можно ли оценить кандидата на вакансию верстальщика, попросив его написать несколько ЦСС3-конструкций на бумажке? 5 • 4 • Как правильно сверстать таббар на ХТМЛ5 и ЦСС3? Есть какая-нибудь функция Яваскрипта для масштабирования картинок? 5 • Каким способом можно сделать загрузку кастомных шрифтов приятной? 6 • Артём, объясните, пожалуйста, в чём преимущество div перед table 5 • 5 • 8 • Как размыть объект? 2 • Как выровнять картинку внутри дива по центру, если её ширина больше ширины дива? 4 • Как правильно разделять разряды чисел? 4 • Как вы относитесь к иннициативе Микрософта по выводу ИЕ 6 с рынка? 3 • Как пользоваться mod_rewrite, чтобы получались красивые урлы? Артём, как вы подключаете стили для ИЕ? 3 • Научите, пожалуйста, правильно верстать формы авторизации 2 • Как проработать верстальщиком всю жизнь? 6 • 2 • 7 • Стоит ли наращивать вложенность тегов для структурированности кода? 6 • Хочу сделать смену языка на сайте без перезагрузки страницы (и без аякса) 5 • Как на сайте бюро реализована разрядка у прописных букв? 5 • В чём особенности стандарта XHTML, как его применяют при создании веб-страниц? 4 • Действительно ли необходимо цитаты внутри предложения заключать в тег q? 2 • Когда лучше использовать одинарные, а когда двойные кавычки? 2 • 1 • Хочется, чтобы много красивых картинок на сайте быстро загружались 14 • В каких единицах стоит задавать размеры шрифта? 8 • 1 • Используете ли вы готовые ЦМС? 3 • 1 • Как правильно делать подчёркивание ссылок другим цветом? 6 • 1 • 5 • Как в ЦСС работать с родителями? 3 • 2 • В какой кодировке всё же лучше делать сайт? 5 • Как верстать ссылки вида http://site.ru/#news, чтобы при нажатии на них сайт не загружался заново? 2 • Как вы обходитесь без проверки на робота? 8 • 9 • Проблема в том, что ширина таблиц зависит от контента 5 • 15 • 5 •