Как стать автором
Поиск
Написать публикацию
Обновить
69.36

HTML *

Стандартный язык разметки web-страниц

Сначала показывать
Порог рейтинга
Уровень сложности

TMH: как создать музыкальный хаб на PHP, Telegram и виртуальном хостинге

Уровень сложностиПростой
Время на прочтение4 мин
Количество просмотров951

Telegram Music Hub (TMH) — это open-source решение, которое превращает ваш Telegram-канал в единое цифровое пространство для музыки, блога и сообщества.
И всё это — на самом обычном виртуальном хостинге, без баз данных, без сложных зависимостей, без дорогих серверов.

👉 github.com/tcse/php-TMH

Читать далее

Новости

Масло, вода, ртуть, акварель. Простой тест для LLM… или нет?

Уровень сложностиПростой
Время на прочтение3 мин
Количество просмотров2.5K

Недавно я провёл небольшой эксперимент: проверил, как разные модели от OpenAI справляются с одной и той же задачей — создать красивую симуляцию «жидкостей в стакане» с помощью HTML5 Canvas и JavaScript.

На словах всё звучит просто, но на деле это проверка и кода, и физики, и UX.

Результаты получились очень показательные, а кое-где даже удивительные. Делюсь наблюдениями и видео 👇

https://youtu.be/yvL5P03oUuk

И какие выводы?

HTML и CSS осенью 2025. Эти новые фичи я рекомендую изучить прямо сейчас

Уровень сложностиСредний
Время на прочтение6 мин
Количество просмотров10K

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

Общаясь с фронтендерами, я заметил, что многие не знают новые классные возможности HTML и CSS. Мне от этого грустно. Надо это исправлять!

Я подумал и составил список, состоящий из наиболее рекомендуемых мной новых фишек. Они поддерживаются в большинстве современных браузеров. Решают старые проблемы. Упрощают разработчикам жизнь. В общем суперполезные!

И да, это поверхностный обзор. Я не буду рассказывать все нюансы. Моя цель — проинформировать вас о новых возможностях. Дальше вы уже сами решите, что изучать детальнее.

Больше не буду тянуть. Давайте посмотрим, что я вам подготовил.

Читать далее

Как мы решили проблему хаотичной структуры проекта с Pug и Vite

Время на прочтение4 мин
Количество просмотров760

Привет, я Андрей Беннер, фронтенд-разработчик в Mish. Сейчас я расскажу вам о нашем опыте в оптимизации хаотичных процессов с помощью собственных разработок.

Если вы когда-либо работали с проектами на стеке Vite + Pug + SCSS + TypeScript, то наверняка сталкивались с хаосом в файловой структуре и рутиной, мешающей сосредоточиться на главном — решении задач бизнеса и создании удобного интерфейса для пользователя.

В этом материале мы поделимся тем, как столкнувшись с проблемой, создали решение, которое сделало процесс разработки более эффективным, а структуру проекта — интуитивно понятной. А ещё расскажем, как это решение родилось внутри команды и стало частью нашего вклада в open source.

Читать далее

<details name>: эксклюзивные аккордеоны на чистом HTML (+ стили через :has())

Уровень сложностиПростой
Время на прочтение9 мин
Количество просмотров2.6K

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

За последний год HTML получил деталь, которая меняет привычные «аккордеоны». У <details> появился атрибут name, и этим всё сказано: теперь эксклюзивные аккордеоны можно сделать без строчек JavaScript, а стили и поведение дочистить через :has(). Поддержка стала широкой, а старые практики на дивчиках и ролях можно оставить для случаев, когда действительно нужна сложная логика.

В HTML у нас давно есть пара <details>/<summary>. Браузер сам рисует disclosure-виджет, умеет разворачивать содержимое, бережно обращается с фокусом и клавиатурой. Сейчас поверх этого добавился name, который превращает набор из нескольких <details> в группу, открываешь одно и закрываются остальные из той же группы. Если в группе вы отметили несколько элементов open в исходнике, браузер оставит открытым первый по порядку.

Читать далее

Не просто ещё один органайзер: Как я создал универсальную платформу для управления знаниями и данными

Уровень сложностиПростой
Время на прочтение4 мин
Количество просмотров6.4K

Всем привет!

Хочу поделиться историей создания проекта, над которым я работал последние несколько лет — foxBase (https://fox-base.ru).

Как часто вам приходилось переключаться между десятком приложений для управления разными аспектами вашей работы и жизни? Блокнот для заметок, Excel для финансов, Trello для задач, отдельные инструменты для хранения кода и документации... Знакомая ситуация?

Меня зовут Игорь, я разработчик, и я столкнулся с этой проблемой в полный рост. Мне нужен был один инструмент, который объединил бы всё: от личных заметок до сложных бизнес-форм, от хранения кода до ведения домашнего бюджета. Так родилась идея foxBase.

Что это такое?

foxBase — это веб-приложение для создания универсальных баз знаний и данных. Его ключевая особенность — невероятная гибкость. Это не жёсткий конструктор, а скорее «цифровой конструктор ЛЕГО», где вы сами решаете, как структурировать информацию.

Для кого это?

Читать далее

Освоение Git: от основных основ до эффективной интеграции с Claude Code

Уровень сложностиПростой
Время на прочтение5 мин
Количество просмотров4.7K

Git как краеугольный камень современной разработки программного обеспечения эффективно управляет версиями проектов и особенно хорошо справляется со сложными сценариями совместной работы нескольких разработчиков.

А Claude Code, как передовой инструмент AI-программирования, не только полностью совместим с рабочими процессами Git, но и благодаря глубокой интеграции предоставляет разработчикам беспрецедентную автоматизацию и удобство.

Из этой статьи вы получите следующее:

Читать далее

Вебмастеры и реликтовый веб

Уровень сложностиПростой
Время на прочтение9 мин
Количество просмотров2.8K

"Ты помнишь, как все начиналось,
Все было впервые и вновь..."
Перевернем подзорную трубу и взглянем на маленький интернет конца 1990-х - начала 2000-х годов, где не было регуляторов, не было слежки, не было мошенников, а все ограничения были только техническими.

Читать далее

HTML- и CSS-советы для джуниор фронтенд-разработчиков

Уровень сложностиСредний
Время на прочтение8 мин
Количество просмотров9.8K

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

Я начинал изучать вёрстку в 2010 году. Я не знал английский, поэтому у меня был ограниченный набор материала. Кто помнит видеоуроки Попова?

Хорошо, что сейчас ситуация уже лучше. В целом можно найти очень классные статьи, видео и бесплатные курсы. Но и мне есть что сказать!

Я собрал несколько советов. По моей задумке, если вы обратите внимание на эти аспекты, то ваш код будет лучше.

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

Читать далее

От CSS до Canvas и звука: анимируем что угодно с GSAP

Уровень сложностиПростой
Время на прочтение2 мин
Количество просмотров3.1K

GSAP – одна из самых популярных JavaScript-библиотек для создания анимаций. Её используют как новички, так и опытные front-end-разработчики. В этой статье я хочу рассмотреть несколько примеров ее применения – от самых простых до менее очевидных.

Читать далее

Три гуру веб-дизайна 90-х

Уровень сложностиПростой
Время на прочтение8 мин
Количество просмотров3.3K

С ростом популярности в 1997 году технологий Flash и CSS возникло три философии веб-дизайна. Дэвид Сигел продвигал «хаки», Джейкоб Нильсен стремился к простоте, а Джеффри Зельдман комбинировал элегантность с удобством пользования.

Как и многие из первой волны веб-дизайнеров, Джеффри Зельдман, которому в начале 1997 года исполнилось 42 года, начинал свою карьеру в совершенно другой профессии. Изначально он был автором художественных книг, недолго поработал журналистом, пробовал себя в качестве разъездного музыканта, а потом десять лет посвятил рекламному бизнесу. «Сочинение текстов билбордов с цепляющей графикой — хорошая практика для веба, потому что в нём нужно доносить информацию мгновенно», — рассказывал он позже в интервью.

Творческих людей наподобие Зельдмана привлекло в веб развитие мультимедиа; сам он создал свой первый веб-сайт в 1995 году. «Благодаря гипертексту появился веб, благодаря графике он стал игровой площадкой для потребителей», — писал он на своём личном веб-сайте в конце 1996 года.

Читать далее

Создание шаблона проекта HTML-сайта в Visual Studio

Уровень сложностиСредний
Время на прочтение7 мин
Количество просмотров1.9K

Не помню уже с какой версии, но весьма давно, в Visual Studio пропали типы проектов, создающие шаблон простого html/js/css сайта. Появилось много новых: в разных видах ASP.NET Core, Blazor, Vue, Angular, React etc. А вот шаблона простого классического сайта нет. Но это можно исправить.

У меня периодически возникает необходимость сделать такой сайт, и я для себя сделал шаблон проекта простого html сайта. Этим проектом и методикой его создания хочу с вами поделиться.

Приступим

Скриншоты сайта в адаптивную Tailwind верстку

Время на прочтение2 мин
Количество просмотров3.2K

Я знаю, что существует 100 500 способов перекинуть картинку в готовую вёрстку.
Но когда у меня дошло до дела, результат оказался так себе.
То ли я криворукий, то ли все эти инструменты ещё далеки от совершенства.
В итоге понял, что мне проще накидать свой собственный велосипед — скрипт на Python (~200 строк).

Решил выложить, может, кому‑то пригодится.

Скрипту можно скормить три скриншота сайта:

1) Десктоп‑версия

2) Планшет

3) Мобильная версия

На выходе получим одну HTML‑адаптивную вёрстку (десктоп, планшет, мобила) с использованием Tailwind CSS.

Читать далее

Ближайшие события

Делаем фронтенд-сборку для верстки HTML-писем на MJML

Уровень сложностиСредний
Время на прочтение8 мин
Количество просмотров1.1K

Меня зовут Дима. Я Frontend разработчик в компании fuse8. В одном из проектов мы столкнулись с необходимостью упростить процесс верстки и тестирования HTML-писем. В итоге решили вынести шаблоны в отдельный репозиторий и собирать их с помощью MJML.

В статье разберём два ключевых этапа: сначала создадим репозиторий для верстки писем, а затем настроим локальную тестовую отправку через SMTP.

Читать далее

Как экспортировать HTML-таблицы в Excel с помощью Python

Время на прочтение11 мин
Количество просмотров2.5K

Экспорт HTML-таблиц в Excel — это распространенная задача в обработке данных, отчетности и автоматизации. Независимо от того, работаете ли вы с данными, полученными с веб-страниц, панелями управления или отчетами на основе HTML, преобразование таблиц в формат Excel может облегчить анализ данных и их обмен.

В этом блоге мы рассмотрим...

Читать далее

Замена YouTube Kids

Уровень сложностиПростой
Время на прочтение5 мин
Количество просмотров3.1K

Что делать, когда твой ребёнок признает только это приложение? Вот не хочет пользоваться аналогами, и всё тут! Как убрать недостатки в такой ситуации и добавить достоинств? Об этом и поговорим.

Читать далее

LLM в кармане: запускаю локальные модели на Samsung S24 Ultra через PocketPal — бенчмарки, настройки и туториал

Уровень сложностиПростой
Время на прочтение8 мин
Количество просмотров8.6K

Последние материалы мы посвятили графическим пайплайнам: как собирать сцены и стили в WebUI Forge, где помогает Flux, и как добиваться управляемости через ControlNet. Логичный следующий шаг - добавить текстовый слой, который формирует смысл: брифы, описания, сценарии, заголовки и итоговые тексты под публикацию. Именно его мы переносим в карман - в формате локальной LLM на смартфоне.

В этой статье мы разберём PocketPal на Samsung S24 Ultra: как поставить модели в GGUF, какие кванты выбирать под 12 ГБ RAM, как оценить требуемую память (модель + KV-кэш), какие скорости генерации ждать и как настроить параметры, чтобы телефон оставался шустрее и не «уходил в троттлинг».

Почему смартфон? Две причины: приватность (данные не покидают устройство), офлайн-режим (работает в дороге и на выезде). Для креативных задач это означает: черновики текстов, сводки брифов, подписи к визуалу и техзадания для графического пайплайна - там, где нет Wi-Fi и интернета.

Читать далее

GPT 5 сделал мне 100 игр, 13 даже не запустились

Уровень сложностиПростой
Время на прочтение1 мин
Количество просмотров57K

Я потратил 6 часов на этот эксперимент и спешу обрадовать, новая модель от chatgpt не готова заменить программистов и сейчас я коротко напишу почему (бонус: короткое видео).

Читать далее

Как гуманитарий создал сайт с нуля при помощи DeepSeek. Примеры рабочих промптов

Уровень сложностиПростой
Время на прочтение16 мин
Количество просмотров22K

История о том, как гуманитарий себе сайт навайбкодил. Внутри - примеры промптов, код и размышления на тему RLHF.

Читать далее

Когда if-else не нужен: знакомство с тернарным оператором и switch в JS

Уровень сложностиПростой
Время на прочтение5 мин
Количество просмотров7.4K

Привет! Я — Александр Дудукало, автор базового курса по JavaScript. Если вы читаете эту статью, значит, вероятно, уже знакомы с одной из основных логических конструкций в JavaScript — if-else. Если нет, рекомендую сначала прочитать предыдущий материал, где я подробно разобрал эту тему.

В этой же статье мы поговорим о других способах управления логикой в коде — тернарном операторе и конструкции switch. Да, звучит сложно и, возможно, пугающе. Но я уверяю, все очень просто. В итоге вы узнаете, когда их стоит использовать и чем они могут быть полезнее привычного if-else. Поехали?

Поехали!
1
23 ...