Верстка \ HTML&CSS

Жидкая типографика

От автора: с помощью вьюпорт единиц измерения и функции calc() можно настраивать размер font-size и других свойств относительно размера экрана. То есть размер может быть жидким. Шрифт не будет всегда фиксированным или прыгать с размера на размер в медиа запросах.

Продолжить чтение

Верстка \ HTML&CSS

Как мы создали свой frontend фреймворк MarsMan (и зачем)

От автора: для MarsBased 2016 стал годом настоящих испытаний. Весь год мы работали над 16 разными проектами. Я устроился на полный рабочий день только в июне, но сразу был вовлечен в большую часть проектов на этапах дизайна, UX и frontend разработки.

Продолжить чтение

Верстка \ HTML&CSS

Создание доступного вспомогательного тултипа

От автора: сегодня один из тех дней, когда мне пришлось загуглить очередной вопрос по доступности. Я работаю над новым проектом под названием Provata. Передо мной стала задача создать прикольный и, казалось бы, простой вспомогательный тултип, который пояснял бы читателям/пользователям, что такое Framingham calculator.

Продолжить чтение

Верстка \ HTML&CSS

Полный сброс: использование начальных значений CSS

От автора: по своему определению разработка стилей включает в себя установку CSS свойствам новых значений. Сложные стили, в конечном счете, доходят до такой точки, когда необходимо «потереть» CSS значения, т.е. сбросить их на начальные. В отдельных случаях первоначальные значения известны, их легко запомнить. У других же свойств все не так. К счастью, современный CSS дает нам простой способ сброса свойств.

Продолжить чтение

Верстка \ HTML&CSS

Оптимизация изображений

От автора: каждый разработчик знает, что в вопросе веб-производительности и пользовательского опыта важно каждое изображение. Изображения – это низко висящие плоды оптимизации производительности. Сжатие без визуальной потери качества может принести пользу организациям путем снижения веса страниц без ущерба для работы пользователя, что повышает производительность и привлекает все больше аудитории. Существует множество техник, для определения того, какое изображение необходимо загрузить, но эти «правильные изображения» еще необходимо создать. Целью веб-разработчиков и сервисов по повышению производительности должно быть обеспечение всех пользователей на всех типах устройств и во всех браузерах оптимальными изображениями. (Другой целью должна быть доступность, но это тема для отдельной статьи!).

Продолжить чтение

Верстка \ HTML&CSS

Я совсем забыл о стилях для печати

От автора: небольшая коллекция полезных CSS техник и напоминание о том, что печатные стили все еще нужны. Недавно Аарон Густафсон послал твит Indiegogo, в котором сказал, что их страница с деталями о заказе ломается при печати. Когда я увидел твит, меня осенило. Я понял, что уже очень давно не оптимизировал страницы под печать, даже не стал проверять.

Продолжить чтение

Верстка \ HTML&CSS

Семантические имена классов слишком общие?

От автора: процесс именования в HTML и CSS обманчиво сложен, но и очень важен. Краеугольными камнями MaintainableCSS являются предписания о том, КАК и ЗАЧЕМ мы должны именовать модули. Не случайно это одна из первых глав в книге.

Продолжить чтение

Верстка \ HTML&CSS

Изменчивые шрифты в вебе

От автора: в этом году на конференции по типографике ATypI в Варшаве представители из Adobe, Microsoft, Apple и Google представили потрясающую разработку в области веб-шрифтов: поддержка изменчивых шрифтов в OpenType. Чтобы понять, что это такое, лучше показать пример.

Продолжить чтение

Верстка \ HTML&CSS

Введение в UIkit framework

От автора: приветствую Вас дорогой друг. В данном уроке мы с Вами поговорим о UIkit framework, который значительно ускоряет разработку все возможных пользовательских интерфейсов, очень прост в изучении и обладает приличным функционалом.

Продолжить чтение