Верстка \ Адаптивная верстка

Адаптивная верстка сайта

От автора: в будущем в мире интернета ожидается постоянный прирост мобильного трафика. Значит, уже сейчас нужно уметь верстать так, чтобы ваш проект хорошо выглядел на всех устройствах. Решение давно найдено – адаптивная верстка сайта! О ней мы и поговорим.

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

Верстка \ Адаптивная верстка

Знакомство с sGrid: Flexbox Grid система на основе препроцессора  Stylus

От автора: прочитав заголовок, вы можете задаться вопросом: Почему еще одна сеточная система? И это хороший вопрос. По существу, существует множество grid систем, и все они на основе flexbox. Так почему же я решил построить еще один похожий инструмент? Ответ будет коротким – данная система полностью адаптивна для построения семантических сеток с использованием только лишь препроцессора Stylus.

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

Верстка \ Адаптивная верстка

Новый адаптивный шрифт для сайта

От автора: в ноябре этого года Nick Sherman выступил с докладом для сайта Ampersand. Выступление в основном было построено по его статье «изменяющиеся шрифты в адаптивном дизайне». И в статье и в своем выступлении автор предлагает новый адаптивный шрифт для сайта для решения сложных проблем адаптивного дизайна:.

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

Верстка \ Адаптивная верстка

Адаптивные изображения на сайте: создание с помощью атрибута srcset

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

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

Javascript & Ajax \ Javascript

Простые адаптивные вкладки (табы) для сайта на JavaScript и CSS

От автора: в данной статье мы рассмотрим, как сделать макет из нескольких адаптивных вкладок (табов) для сайта на JavaScript и CSS 3, который просто отлично подходит в тех случаях, когда необходимо вместить много связанного контента в маленькой и компактной области.

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

Фреймворки \ Bootstrap

Создание темы для WordPress с помощью Bootstrap: когда применять?

От автора: Введите в поисковике «cоздание темы для WordPress с помощью Bootstrap» или «как сделать тему для WordPress с Bootstrap» и получите сотни ссылок. Среди них будут руководства о том, как с помощью Bootstrap состряпать свою платную или бесплатную тему.

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

Фреймворки \ Bootstrap

Новые возможности в Bootstrap 4 Alpha

От автора: 19 августа на свет божий вышла альфа версия Bootstrap 4, ровно спустя четыре года после первого официального релиза Bootstrap v1 (Совпадение, не правда ли?). Вечно популярный front-end фреймворк обрел законченные черты, и я, как большой поклонник Bootstrap, очень взволнован и жду не дождусь приложить руки к новым возможностям!

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

Верстка \ Адаптивная верстка

Методы и приемы по улучшению фоновых изображений на Retina дисплеях

От автора: хотя в спецификации HTML5 и присутствуют Retina/HiDPI экраны в сочетании с медиа запросами и srcset, изображения, загруженные через CSS, не считаются достижением: не существует полного эквивалента srcset или sizes на CSS, чтобы поместить на фон страницы изображение с оптимальным разрешением.

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

Фреймворки \ Bootstrap

Создание Bootstrap контактной формы с помощью PHP и AJAX

От автора: в этом уроке я шаг за шагом расскажу, как создать рабочую контактную форму с помощью всегда популярного front-end фреймворка Bootstrap в сочетании с AJAX и PHP. Мы изучим пару дополнительных возможностей, таких как анимация animate.css, валидация на JavaScript и улучшение пользовательского опыта при работе с асинхронным контентом.

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