Менеджер и дизайнер заставляют везде убирать аутлайн. Расскажите им, что это плохая идея!
Вы совершенно правы, с удовольствием расскажем.
Рубрика «html-верстка» - 2
Как фокус помогает
2017-10-20 в 16:00, admin, рубрики: css, css3, html, html-верстка, html5, Блог компании HTML Academy, верстка, для начинающих, для новичков, доступность, доступность навигации, Разработка веб-сайтовКак правильно вставлять SVG
2017-09-15 в 16:00, admin, рубрики: html, html-верстка, html5, svg, Блог компании HTML Academy, верстка сайтов, графика, для начинающих, Разработка веб-сайтов
Какие нужны фавиконки
2017-08-30 в 14:10, admin, рубрики: html, html-верстка, html5, Блог компании HTML Academy, Разработка веб-сайтов, фавикон, фавиконы
Изоляция css стилей с помощью компонентного подхода
2017-08-13 в 7:00, admin, рубрики: components, css, gulp-plugin, html, html-верстка, javascript, Разработка веб-сайтовКаждый раз, когда приходится создавать какой-то элемент, возникает небольшая проблема с придумыванием имени класса элемента, потому что мы хотим назвать его понятным именем, отражающим смысл и назначение этого элемента. Также, должны учесть то, что имя css-селектора не должно пересекаться с другими стилями.
Читать полностью »
Особенности –webkit-box или как «подружить» flexbox со старыми Safari
2017-06-07 в 8:53, admin, рубрики: css, css3, html, html-верстка, safari, Разработка веб-сайтовУверен, многие Front End Developer-ы постоянно сталкиваются с проблемой поддержки flexbox в старых версиях популярных браузеров. Среди них выделяются два явных фаворита – Internet Explorer (IE) и Safari. С IE всё проще, т.к. flex поддерживается в версиях 10.0+. Версии ниже уже не актуальны, поэтому их часто игнорируют. В Safari же ситуация иная, поскольку поддержка современной спецификации flexbox (по мнению Caniuse.com) начинается с версии IOS Safari 9.2+.
Инструментарий для front-end разработки под Linux
2016-10-13 в 7:08, admin, рубрики: css, Firefox, front-end, front-end разработка, html, html-верстка, html5, javascript, sublime text, Разработка веб-сайтовДоброго времени суток, господа девелоперы! В этой статье я расскажу, как сделать разработку под Linux действительно комфортной и удобной, чтобы она приносила только боль удовольствие.
Чего мы добиваемся:
Просматриваем страницу в браузере и правим в текстовом редакторе HTML и CSS/SASS. Код извлекаем напрямую из PSD, попутно корректируя до PixelPerfect прямо в браузере. При сохранении SASS автоматически преобразуется в CSS и загружается на сервер. Необходимые картинки из PSD шаблона вырезаем в два клика, после чего они так-же автоматически загружаются на сервер. Как этого добиться менее чем за пол часа? Я расскажу вам!
Сразу хочу предупредить вас, если ваш опыт работы более нескольких лет и вы являетесь достаточно опытным front-end'ером, то ничего нового вы в этой статье не найдете. Она предназначена для людей, которые относительно недавно присоединились к GNU/Linux сообществу или только решили к нему примкнуть.
Краткое содержание
Масштабирование текста в блоке с помощью Jquery
2016-09-10 в 21:58, admin, рубрики: html-верстка, javascript, jqueryНедавно получил заказ, где между всего прочего нужно было сделать блок, в котором текст должен масштабироваться внутри блока. Т.е не зависит, сколько текста в блоке – весь текст должен быть видимым! Сначала думал считать символы, строки… Сверстал блок в котором должен находиться контент и при вводе текста заметил, что блок растягивается в зависимости от наполнения. Родилась идея сделать функцию, которая будет подбирать размер шрифта, сравнивая исходную высоту блока и настоящую. Так родилась вот эта функция:
Intermediate CSS3 Hover Effects. Пошаговый туториал. Часть 3
2015-12-25 в 6:42, admin, рубрики: css, css3, CSS3 animation, css3 transform, css3 transition, hover effects, hover-эффект, html, html-верстка, веб-дизайн, Веб-разработкаЭта статья является логическим продолжением моей предыдущей статьи, посвященной основам CSS3 transitions и, если в ней я показывала принципы работы этих основ на простых примерах, сейчас я хотела бы перейти к более сложным, красивым и интересным эффектам.
Из-за большого размера статья разбита на три части. Первая часть. Вторая часть
Демо материалы лежат здесь. Все префиксы проставлены в демо, здесь же я не буду на них акцентировать.
Предупреждение: эффекты работают только в современных браузерах, поддерживающих возможности CSS3.
Intermediate CSS3 Hover Effects. Пошаговый туториал. Часть 2
2015-12-25 в 6:42, admin, рубрики: css, css3, CSS3 animation, css3 transform, css3 transition, hover effects, hover-эффект, html, html-верстка, веб-дизайн, Веб-разработкаЭта статья является логическим продолжением моей предыдущей статьи, посвященной основам CSS3 transitions и, если в ней я показывала принципы работы этих основ на простых примерах, сейчас я хотела бы перейти к более сложным, красивым и интересным эффектам.
Из-за большого размера статья разбита на три части. Первая часть. Третья часть.
Демо материалы лежат здесь. Все префиксы проставлены в демо, здесь же я не буду на них акцентировать.
Предупреждение: эффекты работают только в современных браузерах, поддерживающих возможности CSS3.
Toast-уведомления, теперь и в браузере
2015-03-11 в 8:14, admin, рубрики: html, html-верстка, java script, javascript, toast, Веб-разработка 
Каждый, кто хоть раз пользовался мобильным приложением, думаю, знаком с Toast-уведомлениями. Да, это именно неожиданно всплывающие сообщения, которые привлекают ваше внимание, когда вы увлечены в телефоне какой-то задачей.
В сети вы найдете тысячи готовых решений о том, как сделать Toast уведомления в Аndroid. А вот готового, простого решения из коробки для веб-браузеров, увы, не нашлось. Первой мыслью было взять какой-нибудь BOX-плагин и адаптировать его. Однако подобные плагины явно не способны смоделировать поведение Toast-уведомления.
Учитывая это, была создана небольшая JS-библиотека, эмитирующаю Toast-уведомления в браузере. Надеюсь, кому-то она будет полезной.
Читать полностью »