История о CSS-сбросах и все, что о них нужно знать. Еще раз об этом

История о CSS-сбросах и все, что о них нужно знать. Еще раз об этом

Небольшое вступление: меня заинтересовали CSS-сбросы по вполне практичной причине. Я инженер-консультант по программному обеспечению, поэтому работаю с разными клиентами и время от времени начинаю новые проекты. В какой-то момент, после создания нескольких веб-проектов с нуля несколько раз подряд и столкнувшись с одними и теми же проблемами в разных браузерах, я выработала определенный "стиль работы", если можно так выразиться, и корректировка моего CSS-кода в разных браузерах способом…

Подробнее
Как мы делаем курсы по вёрстке. Опыт из первых рук

Как мы делаем курсы по вёрстке. Опыт из первых рук

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

Подробнее
HTML страница, встроенная в анимированный GIF

HTML страница, встроенная в анимированный GIF

Началось с того, что я случайно наткнулся на станицу https://lcamtuf.coredump.cx/squirrel/ Это демка представляет собой файл, который будучи сохраненным с расширением .jpg или .jpeg открывается как графический файл, а с расширением .htm или .html как веб-страница. Такого рода трюки для JPEG не новы. Насколько я понял, HTML размещается в секции комментируя .jpeg файла. Браузер проглатывает бинарные данные заголовка как мусор, потом рендерит найденный HTML. Немного CSS хитрости чтобы

Подробнее
Критерии качества вёрстки 2021

Критерии качества вёрстки 2021

6 лет назад мы обсуждали с сообществом критерии качества вёрстки, которые мы используем в обучении, чтобы наши выпускники радовали рынок своими умениями и подходом к работе. С тех пор в разработке интерфейсов произошло море изменений: сначала в продакшн пришли флексы, потом подтянулись гриды, умер IE, все переехали из Фотошопа в Фигму, и много чего ещё. Каждое это изменение влияло на наши критерии, и мы постоянно их дорабатывали. Сейчас пришло время обсудить с сообществом обновлённые…

Подробнее
[Перевод] Как я написал веб-синтезатор без сэмплов и зависимостей

[Перевод] Как я написал веб-синтезатор без сэмплов и зависимостей

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

Подробнее
6 хороших практик по HTML и CSS

6 хороших практик по HTML и CSS

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

Подробнее
Расщепление монолита — пилотный опыт

Расщепление монолита — пилотный опыт

Без году неделя как я одним пятничным утром провел инсайд доклад для группы разработки в компании. Речь шла о довольно занимательном командном опыте ремастера проекта через применение множеств, в наше время, уже не новых практик и подходов, но ранее мне неизвестных. После применения ряда рецептов я сравнил показатели производительности двух версий системы легаси и ремастера и был, мягко скажем, приятно удивлен. Такие подходы, как отделение слоя интерфейса от монолита, SPA и технологии…

Подробнее
Стилизуем слайдер input range для всех популярных браузеров

Стилизуем слайдер input range для всех популярных браузеров

https://toughengineer.github.io/demo/slider-styler (смотреть лучше на десктопе) Работает со всеми популярными браузерами. Читать далее

Подробнее
Счёт может быть красивым и в HTML, а не в PDF

Счёт может быть красивым и в HTML, а не в PDF

В статье “Что должно быть в счёте на оплату, чего быть не должно и что дико бесит” мы разбирали содержимое счёта. По результатам той работы возникло желание оформить счёт стильно ибо стандартный вариант бухгалтерских программ вроде 1С какой-то страшный. В статье разберём плюсы генерации счетов в HTML-формате по сравнению с генерацией PDF и тюнинг версии для печати, добавим 5 копеек про ЭЦП (УКЭП). Итак, погнали...

Подробнее
<img>. Доклад Яндекса

<img>. Доклад Яндекса

«Просто добавь картинку на сайт», — говорили они. А оказалось, что «просто» не значит «правильно». В докладе я постарался разобраться, как эффективно добавлять изображения на страницу, какие форматы графики для каких случаев полезны и как автоматизировать автоматизируемое. — Всем привет. У меня доклад с интригующим названием в виде одного тега. Читать дальше →

Подробнее
Как я сделал свою сборку Gulp для быстрой, лёгкой и приятной вёрстки

Как я сделал свою сборку Gulp для быстрой, лёгкой и приятной вёрстки

Серьёзно и профессионально я начал заниматься вёрсткой в 2019 году, хотя до этого интересовался данной темой как любитель. Поэтому новичком мне себя назвать сложно, но и профессионалом с опытом 5+ лет я тоже не являюсь.Тем не менее, я успел познакомиться со сборщиком Gulp, его плагинами и сделал для себя хорошую, как по мне, сборку для работы. О её возможностях сегодня и расскажу. Читать далее

Подробнее
Создаем приложение для ANDROID быстро и просто

Создаем приложение для ANDROID быстро и просто

Сегодня я хотел бы поделиться с Вами, как быстро и просто можно создать приложение для Android с базовыми знаниями HTML CSS и JS. По данному примеру код на Java для Android будет минимальным. Благодаря платформе XAMARIN приложения для мобильных телефонов можно делать в Visual Studio. Читать дальше →

Подробнее