HTML *

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

Если помещать блок комплаенса в видимую часть страницы, то это неминуемо приведет к “отказам” - быстрому уходу посетителя с сайта без прохода вглубь. Всё-таки люди приходят на сайт не для того, чтобы выяснить номер лицензии и насладиться чтением закона. Им чаще всего нужна именно услуга: название, что лечим, цена врач, отзывы. Поэтому заказчики сайтов и лендингов часто соглашаются на компромиссное решение, которое предлагают им разработчики: размещать блок комплаенса в футере либо над футером, причем в формате PDF. Это приводит к тому, что ИИ-краулеры просто не видят блок комплаенса либо присваивают ему низкий приоритет для вывода в рекомендациях. Соответственно, в ответ ИИ не попадает та часть сайта, которая должна подтверждать опыт, легальный статус клиники и безопасность процедуры.

Но, как мне кажется, эту проблему несложно решить чисто технически: добавив в дизайн-макет javascript с кнопкой-баннером, которая при клике на ней открывает дополнительный блок комлаенса, закрытый до нажатия кнопки. Этот блок отлично видим и краулеру дата-центров ИИ, и инструментам мониторинга, который применяют регуляторы (Росздравнадзор, ФАС). Такой блок можно разместить в любой части лендинга или главной страницы сайта, даже в самом верху, в виде обычного HTML. В этом случае ему будет присвоен высокий приоритет. К тому же в верхнем блоке можно разместить и разметку медицинского учреждения с адресом, картой, лицензией и каталогом услуг (Shema.org, json).

В середине нулевых в рунете была игра Ксин, браузерный MUD без единой картинки, только текст, HTML‑формы и таблицы характеристик. Через несколько лет проект умер: сервер выключили, исходники потерялись, остался только форум с обсуждениями механик и кэш в Wayback Machine. Мы собираем игру заново, не «игру по мотивам», а максимально точную реконструкцию: те же формулы, те же монстры, те же предметы.

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

В статье описывается, как с помощью возможностей ИИ был модернизирован JavaScript-проект для моделирования физических экспериментов. В созданной программе представлены эксперименты из разделов: механика, механические колебания, гидростатика. При разработке данного проекта использовался только Vanilla JS, без сторонних библиотек.

Это продолжение истории про «Универсальный скачиватель», программу для Windows, которая качает видео и музыку через yt-dlp. В прошлый раз я рассказывал, как упаковывал консольную утилиту так, чтобы ей мог пользоваться любой человек. Сегодня про версию 1.4, а в ней почти нет нового функционала: я переделал внешний вид. Если кратко, то движок остался тем же (Flask на 127.0.0.1, страница в браузере, один файл index.html), а в Python поменялась одна строка с номером версии. Всё остальное — разметка, стили и немного скрипта.

Вступление:

Привет, Хабр! Я всегда любил физику и ретро-эстетику. Однажды мне захотелось сделать научно-популярный проект, который не просто показывает текст с формулами, а позволяет «покрутить» физику руками. Так появился ЦУП-7 — интерактивный пульт с рендерингом черной дыры на WebGL и пятью квантовыми экспериментами. В этой статье я расскажу, как устроен проект под капотом, с какими проблемами я столкнулся и почему решил отказаться от фреймворков.

Проект Android DEX позволяет запускать приложения с Android прямо на ПК. Например, можно открывать мобильные приложения в отдельных окнах, играть в шутеры с помощью мыши и клавиатуры и управлять смартфоном с большого монитора. Решение работает на ПК с Windows, macOS и Linux, а подключение осуществляется по USB или Wi‑Fi.

Мини проект климат контроля температуры, влажности. 

Проект представляет собой автономный модуль климат‑контроля на ESP32‑C3, который считывает данные с AHT10 по I2C и передает их в браузер через WebSocket, работая как собственная точка доступа. Программный код позволяет регулировать по заданным параметрам  как на повышение, так и на понижение (в зависимости от подключаемого оборудования для температуры нагрев или охлаждение, для влажности увлажнение или осушение).

В прошлой статье мы обсуждали, почему меня (дейтинг-аутстаффа) никогда не заменят нейросети. FAQ для погружения в мой лор там тоже есть.

А в этой статье я выкладываю свой интерактивный калькулятор для оценки вашей дейтинг-ликвидности: https://gcodegspot.github.io/dating-calculator-2.0/

Дисклеймер: ваш результат не означает вашу ценность. Это лишь набор цифр, определяющий, насколько вам сложно в онлайн-дейтинге.

Калькулятор создан в увеселительных целях. Реальный дейтинг беспощаден.

После успешного origin trial API HTML-in-Canvas официально вышел в стабильной версии Chrome 157. Он объединяет интерактивность и доступность DOM с производительностью и попиксельным управлением <canvas>. Так возможности браузера можно использовать вместе с графикой canvas, ускоренной на GPU.

Помните игры, где герой с армией бродит по карте, вербует отряды в городах, осаждает замки и собирает по кусочкам карту следующей земли? Мы сделали такую игру заново и запустили её прямо внутри Telegram. Её не нужно ставить и не нужно регистрироваться: нажал кнопку в боте — и через пару секунд ты уже на карте.

Игра называется «Морвейн». Под капотом — один HTML‑файл без фреймворков, отрисовка на canvas, процедурные миры, тактический бой на 80 клетках и сервер на Cloudflare, который пока не стоил нам ни копейки. А всю графику — от травы до драконов — мы сгенерировали нейросетью и научили код собирать её в цельную карту.

В этой статье расскажу, что умеет игра, как она устроена и какие задачи пришлось решать по дороге. Будет про генерацию континентов, сохранения в облаке Telegram с лимитом 4 КБ на значение, честный рейтинг без античита на сервере, вырезание розового фона «по оттенку» и про то, почему преследующий вас слон должен быть опасен.

Я делаю сервис, который пишет статьи и сам публикует их на сайты клиентов. Как устроена публикация в четыре CMS, я уже рассказывал здесь. Сегодня про соседний кусок: редактор в личном кабинете, где человек правит статью перед публикацией.

Как минимум два месяца этот редактор показывал «Сохранено» и не сохранял ни символа. Сама ошибка глупая, на неё хватит одного абзаца. Хуже, что очевидное исправление уничтожило бы статьи. По дороге к правильному нашлись ещё три ловушки. Санитайзер nh3 тратит почти минуту на 320 КБ разметки. Одно правило HTML5 превращает 99 КБ входа в 56 МБ выхода. А SELECT … FOR UPDATE в SQLAlchemy берёт блокировку и при этом отдаёт старые данные.

У каждого HTML-элемента есть всего два псевдоэлемента: before и after — и с помощью них можно сделать крутые элементы.

Разберём, как с помощью обычного CSS превратить два псевдоэлемента в крутые графические штуки. Как создавать сложные формы через clip-path, собирать композиции из нескольких градиентов, работать с масками и режимами смешивания, а также строить анимации и элементы интерфейса без лишней HTML-разметки.

Обычно браузер представляют так: у каждой вкладки свой поток и свой event loop, а промис срабатывает раньше таймера, потому что микрозадачи приоритетнее макрозадач. На практике этого хватает, но в стандарте HTML всё устроено иначе. Вот три примера:

Зависшая вкладка может подвесить соседнюю, например ту, которая открыла её через window.open().

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

Слова «макрозадача», которое звучит на каждом собеседовании, в стандарте нет: то, что им называют, - просто обычная task.

Делал интерактивную открытку на день рождения и хотел, чтобы картинка не просто появлялась, а «рисовалась»: сначала карандашные линии, потом по касанию её заливает акварель, причём с рваным краем, как у краски, которая впитывается в бумагу.

Готовых решений под такое не нашёл. Видео не подходило: нужна была реакция на тап и чёткость на любом экране. В итоге всё собралось на чистом SVG, паре фильтров и небольшом количестве JS. Ниже разбираю по шагам, с кодом и граблями, на которые наступил.

Теперь каталог живёт в HTML и CSS: текст, таблицы и схемы лежат в одном проекте и правятся вместе, PDF получается печатью из браузера. CorelDRAW остаётся только на полиграфическую доводку. Насколько это проще, видно по предыдущему каталогу: 35 страниц, текст и таблицы через Word, схемы через Inkscape, макет в CorelDRAW — и каждая правка означала новый экспорт и повторную ручную доводку. Что дал этот странный подход и чем пришлось заплатить.

Если следить за React только по крупным релизам, легко пропустить момент, когда библиотека тихо меняет направление. React 19.3 — как раз такой случай. Сам релиз вышел 9 сентября 2026 года. И я хочу поделиться парой моментов из этого обновления. Рассмотрим пару хуков это ViewTransition и Fragment Refs. Еще, что я могу выделить, это новые возможности для SSR, Server Components и работы с браузерными API.

В шестой версии SuperSet появилась возможность прописывать HTML код в метриках  и измерениях сводных таблиц, что значительно расширило  приемы для BI-разработчиков по форматированию  таблиц.  Покажу как в SuperSet можно реализовать сводную таблицу со сменой периодов и выводом красивой дельты.

Привет, Хабр!

Я интересуюсь вёрсткой с момента появления первых версий браузера Google Chrome. Конечно, современному фронтендеру тяжело понять то, что я испытывал с коллегами. Мы именно те разработчики, которые знали кучу рецептов, как починить определённый баг в конкретном браузере.

Но тогда были не только плохие моменты. В этом легаси осталось много хороших возможностей. Только они затерялись с течением времени. Мне же от этого грустно.

По этой причине сегодня пришёл к вам исправлять эту ситуацию. Мы рассмотрим старые возможности HTML и CSS, которые сегодня всё так же полезны.

Давайте посмотрим, что я подготовил.

Вышел gomponents 1.4.0 !

Gomponents - фреймворк, который позволяет описывать HTML-компоненты на чистом Go. Он генерирует HTML5 и позволяют легко создавать компоненты многократного использования. Благодаря этому вы можете сосредоточиться на разработке приложения, а не на изучении html.

Основная новика релиза - официальный навык (skill) для агента.

Пример работы с html в gomponents:

Небольшое приложение про «давай ебть английский», где ты не сидишь с учебником, а каждый день коротко отбиваешься от языка: карточки, мемы, озвучка, диалоги с ботом и стрик, который больно бьёт по самолюбию.