Для оформления веб-страниц часто нужна тень. В CSS есть тень, которую назвали почему-то «box-shadow», которая создаёт тень как от плоского прямоугольника, которая выглядит как его размытая исходная форма, а, не как ожидается из названия, как тень от коробки (box).

При этом достаточно часто нужна псевдотрехмерная тень, которая имела бы имитацию высоты предмета — когда в близи от объекта тень имеет небольшое размытие, а на расстоянии уже размывается. Например, для кнопок или карточек, или для изображений, которым надо сделать тень, чтобы она выглядела не как тень от открытки, а как тень от книги, которая имеет высоту. Такая псевдотрехмерная тень сильно бы спасла дизайнеров и фронтенд-разработчиков, сейчас такой эффект или имитируется картинкой или набором из теней «размытых форм», что приемлемо выглядит только при имитации теней от объекта небольшой высоты. 

И, соответственно, стоило бы назвать такие тени по их объёмности: тень, которая создается от плоского прямоугольника назвать «rectangle-shadow», а тень которая имитирует выдавливание прямоугольного параллелепипеда — «box-shadow».

Сайт http://www.kayodeok.btinternet.co.uk/favorites/webdesign.htm перестал быть доступен, а там хранилось много ссылок о веб-разработке на английском. Если что-то из этого и пропало, всегда есть archive.org. Сохраню для себя тот список:

(далее…)

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

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

Нашёл удобный ответ на этот вопрос: cssarrowplease.com.

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

Автоматический создаётся код для всех браузеров.