Верстка сайтов
-
01 июля 2016Все, что нужно знать о теге script
Как вы, наверное, знаете, тег Script используется для подключения JavaScript, который должен быть запущен на странице. Тег сценария может либо включать непосредственно JavaScript код, либо указывать на URL, откуда сценарий должен быть загружен.
-
15 июня 2016Битва с БЭМ: 10 самых распространенных проблем и способы их решения (часть 2)
Предлагаем вам вторую часть статьи о решении кажущихся сложностей в БЭМ-методике: в прошлой части мы уже разобрались, что делать с глубокой вложенностью элементов, со сложными именами и непростой структурой, как быть с элементами-обертками и кросс-компонентами, и попытались определиться, когда стоит создавать новый компонент. Давайте продолжим.
-
09 июня 2016Битва с БЭМ: 10 самых распространенных проблем и способы их решения (часть 1)
Статья ориентирована на тех, кто уже знаком с БЭМ, и призвана помочь использовать его более эффективно. Надеемся, большинство из вас уже распрощались с иллюзиями о том, что БЭМ - это просто удобный способ именования классов, и смирились с тем, что в вашей разметке появится нагромождение классов, двойных подчеркиваний и тире. Разработчик должен быть прагматичным человеком, и когда вы осознаете все преимущества методики, претензии к ее внешнему виду отойдут на второй план. Итак, начнем.
-
20 мая 20167 инструментов для тестирования кроссбраузерности
Повсеместное распространение концепций адаптивного дизайна и прогрессивного улучшения не избавило нас от проблем с кроссбраузерной версткой. Ручная проверка отображения сайта на всех необходимых браузерах во всех возможных операционных системах занятие утомительное и, по сути, бессмысленное: инструменты для тестирования кроссбраузерности сайта значительно упростят эту задачу.
Сегодня мы подготовили для вас список из 7 инструментов, которые помогут протестировать ваш сайт в разных условиях и гарантировать, что все пользователи увидят именно то, что вы запланировали. Некоторые из инструментов могут быть вам уже знакомы, так как служат разработчикам верой и правдой на протяжении нескольких лет. В списке представлены как платные, так и бесплатные инструменты.
-
29 апреля 2016Универсальный базовый шаблон для HTML5
Если вы работаете с HTML5, вам наверняка понадобиться универсальный шаблон, который вы могли бы использовать для большинства своих проектов. Сегодня мы рассмотрим некоторые элементы, которые используются в большинстве современных реализаций и выделим то, что может стать стартовой точкой для вас.
В этой статье мы рассмотрим возможный вариант и разберемся с некоторыми его элементами. Конечно, не стоит включать все, что вы знаете, во все проекты подряд, поэтому понимание назначения каждого элемента критически важно для адаптации шаблона под конкретный проект.Итак, начнем:
-
11 марта 2016Sass: передача блоков кода с помощью примесей и выбор межу mixin и extend
@mixin прекрасный способ обеспечить возможность повторного использования кода в ваших проектах, кроме того, они обладают возможностью принимать аргументы, что делает их мощным и гибким инструментом. @extend дает вам возможность снова использовать код, указывая селектору необходимость наследовать стили другого селектора. С определенной точки зрения они делают одно и то же. Так когда стоит использовать mixin, а когда extend?
Но для начала, поговорим о том, как вы можете передавать блоки кода с помощью примесей вместо передачи аргументов.
-
20 февраля 2016Советы и техники для манипуляций с DOM элементами
Комплексные веб-приложения со сложной разметкой стали вполне обычным явлением в наше время. Библиотеки наподобие jQuery просты в использовании и основаны на кросс-браузерных решениях. Это эффективное подспорье в манипуляциях с HTML на лету . Поэтому нет ничего удивительного в том, что многие разработчики отдают предпочтение подобным библиотекам, а не нативному DOM API, который обладает рядом исторически сложившихся проблем.
В этой статье мы продемонстрируем некоторые свойства DOM, которые могут быть использованы для манипуляции HTML: в основном речь будет идти об уровнях вложенности и взаимодействии элементов одного уровня.
-
22 января 2016CSS модули - решаем проблему масштабирования стилей
CSS1 был создан в 1996 году, чтобы отделить содержимое документа от его оформления. Главное слово здесь документ . Таблицы стилей были крошечными по современным меркам, и любые сложности поддержки с лихвой компенсировались преимуществами раздельного подхода. Сегодня мы редко задумываемся о контенте в контексте документа. В современном интернете преобладают высокодинамичные страницы с огромным количеством элементов графического оформления. Сегодняшние таблицы стилей имеют тысячи строк и содержат сотни селекторов.
Создание и поддержка масштабируемого CSS довольно серьезный вызов для команды разработчиков. Для выполнения этой задачи необходимо в равной степени хорошо разбираться в спецификации языка, уметь пользоваться современными инструментами и фреймворками, а также четко понимать структуру документа.
-
12 января 2016Выбираем между «min-width» и «max-width»
Довольно часто возникает вопрос, когда стоит использовать min-width, а когда max-width? Тем, для кого отзывчивый дизайн стал привычным делом, такой вопрос может показаться странным. И такие люди знают ответ: все зависит от ситуации . Но анализ исходников сайnов показывает, что многие дизайнеры и разработчики до сих пор не очень в этом уверены. В этой статье мы попробуем разобраться, что значит \"все зависит от ситуации\" в отношении конкретно этого вопроса.
-
18 ноября 2015Использование PostCSS для кросс-браузерной совместимости
В этом уроке мы будем использовать PostCSS для создания таблиц стилей, разработанных для кросс-браузерной совместимости. Мы научимся: Автоматически добавлять префиксы поставщиков; Добавлять серии запасных вариантов для Internet Explorer версий 8, 9 и 10; Добавлять запасные варианты для свойства will-change.