Некоторое время назад писал сайт с бэкендом на Express/Node.JS. Возникла проблема с минификацией ответов. Нашел много готовых пакетов, но у всех была проблема — не минифицировался html после шаблонов. В итоге принял решение написать свой маленький и родной велосипед — библиотеку web-minify, позволяющую встроить хук перед отправкой клиенту и модифицировать ответ.
Читать полностью »
Рубрика «html» - 37
Node.JS: библиотека для модификации http ответов
2018-10-04 в 16:00, admin, рубрики: css, html, javascript, minify, node.jsДоступность интерфейсов. Лекция Яндекса
2018-10-01 в 11:23, admin, рубрики: a11y, accessibility, html, Блог компании Яндекс, доступность, доступность навигации, доступность сайта, интерфейсы, Разработка веб-сайтовМеня зовут Дима, я работаю в офисе Яндекса в Санкт-Петербурге и занимаюсь внутренними сервисами в команде разработки интерфейсов Толоки. В этом году я подготовил лекцию для Школы разработки интерфейсов. Ниже — её расшифровка.
Что такое доступность интерфейсов? Для кого она важна и зачем к ней нужно стремиться? Каковы основные приемы, которые делают интерфейс доступным? Кроме этих вопросов, лекция проясняет принципы, которые лежат в основе ассистивных технологий. Я постарался разобрать теорию и большое количество практических примеров, а также показать процесс работы скринридера.
— Что скрывается под модным нынче термином accessibility? Какие у вас есть варианты? Для слепых, чтение с экрана, с ограниченными возможностями, координация движений… Все верно. Доступность — возможность использования интерфейса всеми, независимо от физических или технических ограничений.Читать полностью »
Дайджест свежих материалов из мира фронтенда за последнюю неделю №332 (24 — 30 сентября 2018)
2018-09-30 в 21:14, admin, рубрики: angular, css, ES6, html, html5, javascript, JS, React, vue, Блог компании Zfort Group, браузеры, дайджест, подкасты, Разработка веб-сайтов, ссылки, фронтендПредлагаем вашему вниманию подборку с ссылками на новые материалы из области фронтенда и около него.
Дайджест свежих материалов из мира фронтенда за последнюю неделю №331 (17 — 23 сентября 2018)
2018-09-23 в 20:23, admin, рубрики: angular, css, ES6, html, html5, javascript, JS, React, vue, Блог компании Zfort Group, браузеры, дайджест, подкасты, Разработка веб-сайтов, ссылки, фронтендПредлагаем вашему вниманию подборку с ссылками на новые материалы из области фронтенда и около него.
CSS Grid — швейцарский армейский нож для макетов сайтов и приложений
2018-09-21 в 9:06, admin, рубрики: css, Grid, html, Блог компании Поиск VPS, веб-дизайн, Разработка веб-сайтовВ течение последних двух месяцев я углубился в изучение CSS Grid. В этой заметке я хочу поделиться своими основными соображениями. Чтобы было более понятно, я объясню все с помощью диаграмм.
Вероятно, вы уже знакомы с блоковой моделью CSS для обычных элементов. Давайте начнем с аналогичного «общего обзора» для CSS Grid:
В основе структуры CSS Grid находится основной контейнер, представляющий собой обычный div
, имеющий margin
, border
и padding
. Для создания CSS grid контейнера добавим свойство display: grid
. Элементы сетки — это потомки, размещенные внутри родительского контейнера. Они обычно определяются как список, описывающий header
, sidebar
, footer
или другие аналогичные элементы макета сайта, зависящие от его дизайна.
Читать полностью »
Еще один способ использования Webpack 4 и разделение кода
2018-09-18 в 20:37, admin, рубрики: html, javascript, webpack4, разделение кодаПредыстория
Ни для кого не секрет, что с выходом Webpack 4 стратегия разделения кода сильно поменялась. Тут даже лучше сказать, что она была заново придумана, т.к. старый подход просто перестал работать, а новый не понятно как использовать.
Для тех, кто все еще не в курсе, плагина webpack.optimize.CommonsChunkPlugin больше нет. Совсем. Вместо этого предлагается в конфиге писать следующее:
module.exports = {
// ...
optimization: {
splitChunks: {
chunks: "all"
}
}
// ...
}
Это должно работать как магия. Т.е. теперь не мы говорим webpack'у что сделать общим чанком, а он сам все сделает, да еще может даже и лучше нас.
И наступит счастье. Шутка. На самом деле нет...
Дайджест свежих материалов из мира фронтенда за последние две недели №330 (3 — 16 сентября 2018)
2018-09-17 в 10:06, admin, рубрики: angular, css, ES6, html, html5, javascript, JS, React, vue, Блог компании Zfort Group, браузеры, дайджест, подкасты, Разработка веб-сайтов, ссылки, фронтендПредлагаем вашему вниманию подборку с ссылками на новые материалы из области фронтенда и около него.
Поле загрузки файлов, которое мы заслужили
2018-09-12 в 10:12, admin, рубрики: css, file upload, html, input[type=file], javascript, веб-дизайн, Разработка веб-сайтовВсе течет, все меняется, но только input[type=file]
как портил нервы всем начинающим веб-разработчикам, так и продолжает это делать до сих пор. Вспомните себя N лет назад, когда вы только начинали постигать азы создания веб-сайтов. Молодой и неопытный, вы искренне удивлялись, когда кнопка выбора файла напрочь отказывалась менять цвет своего фона на ваш любимый персиковый. Именно в тот момент вы впервые столкнулись с этим несокрушимым айсбергом под названием «Загрузка файлов», который и по сей день продолжает «топить» начинающих веб-разработчиков.
На примере создания поля для загрузки файлов я покажу вам, как правильно прятать input[type=file]
, настраивать фокус на объекте, у которого фокуса быть не может, обрабатывать события Drag-and-Drop и отправлять файлы через AJAX. А также я познакомлю вас с парой браузерных багов и путями их обхода. Статья написана для новичков, но в некоторых моментах может быть полезна и занимательна даже для матерых разработчиков.
Читать полностью »
Краткое руководство по переменным в CSS (причины использования, синтаксис и примеры)
2018-09-06 в 12:04, admin, рубрики: css, html, javascript, Блог компании Поиск VPS, веб-дизайнЯ уже достаточно давно экспериментирую с CSS-переменными. Если вы к ним еще не подступались, вы можете воспользоваться этим кратким руководством, чтобы быстро во всем сориентироваться и приступить к работе.
Читать полностью »
Одностраничный сайт на Kotlin и SpringBoot без использования JSP
2018-09-04 в 13:29, admin, рубрики: html, JSP, kotlin, spring, spring bootАвтор не прогер, кодить не умеет
Я не являюсь гуру или крутым специалистом ни в Котлине, ни в Spring, ни в любой другой технологии используемой в данной статье. Я обычный java junior, который решил опробовать kotlin. Все сделано в "Сапсане" на коленке по дороге с techtrain
Для кого
Для java разработчиков, которые только слышали про котлин, но руками его пока не трогали
Для чего
Показать что kotlin отлично работает с spring boot, а в сочетании с DSL в части работы с html быть удобнее классического подхода с jsp.