Твит

1 сентября ознаменовалось чередой ярких событий, напрямую касающихся глобальной паутины. Во-первых, школьники покинули эти ваши интернеты и отправились на занятия к радости пользователей постарше. Во-вторых, Яндекс начал учить вебмастеров премудростям создания и продвижения сайтов. В третьих, Google провел масштабный редизайн логотипа, вызвав негодование многих пользователей.

В корпоративном блоге поискового гиганта говорится,

Твит

Все вебмастера прекрасно знают данный сервис, но не у всех получалось дойти до отметки хотя бы в 95 баллов, не говоря уже о 100. В данном цикле статей я постепенно расскажу как решить каждую из проблем возникающих при анализе сайта с помощью сервиса PageSpeed Insights.

Нужно ли много говорить о том на что же влияет скорость загрузки сайта? Об этом постоянно пишут те, кто занимается SEO продвижением. И это не случайно, потому что от скорости загрузки зависят поведенческие факторы сайта - сколько человек проведет времени на сайте и не убежит ли в первые 10 секунд. Более подробно об остальных минусах медленной загрузки читайте в статье.

Твит

Существует огромное количество эффектов, которые Вы можете разместить на сайте или лендинге. Это могут быть эффекты при наведении, при прокрутке или просто при клике. Каждый из этих эффектов можно применить только в определенной ситуации и в определенный момент, но многие этого не учитывают.

В данной статье я собрал 10 интерактивных лендингов, которые сделаны профессионалами. На данных лендингах Вы можете наглядно увидеть какие эффекты хорошо смотрятся вместе, а какие из них лучше разместить в разных частях страницы, потому вместе они выглядят нагроможденно.

Твит

Нет ограничений на создание действительно красивой и "емкой" анимации на сайте. Это я продемонстрировал в данной статье. Анимация в начале лендинга - это очень простой способ удержать внимание потенциального клиента и заставить посмотреть страницу дальше.

В статье Вы можете увидеть живую анимацию, которую я создал лишь с помощью CSS3 и небольшой JS библиотеки. Данная анимация имеет ряд преимуществ перед GIF или Flash анимацией:
1) Загружается быстрее
2) Меньше объем загружаемых файлов
3) Относительно легче при создании

Все этапы создания анимации я подробно описал.

Твит

Я создал анимацию на CSS3, повторяя за которой, Вы можете дать отдохнуть своим глазам. Суть данной статьи не только в том, чтобы показать возможности CSS3, а также напомнить о том, что глаза также должны отдыхать время от времени.

В статье находится ссылка на анимацию. В качестве персонажа я выбрал миньона, который также создан на чистом CSS. Вам лишь необходимо перейти по ссылке в статье и повторять действия миньона, то есть его движения глаз.

Твит

Как сделать обратное видео, если вы не умеете работать в видео редакторах? Если у вас есть телефон на андроид, то вы можете скачать и установить специальное приложение, которое поможет вам создавать обратное видео, или реверс.
Обратное видео - это видео, в котором начало - это последний кадр, а конец - первый. Это комичное видео, в котором все происходит наоборот - люди идут назад, разбитые стаканы становятся целыми, брошенные предметы прилетают назад. С помощью обратного видео можно создавать интересные эффекты для своих роликов и показывать фокусы ;)
А еще можно обратить музыку или голос за кадром. получится необычный эффект.
Итак, читайте, как сделать обратное видео >>>

Твит

Чтобы привлечь внимание посетителя отдельным элементам на странице, их необходимо каким-либо образом выделить, а еще лучше анимировать. В этом уроке я хотел показать как можно анимировать статистические данные на странице.

Данный способ широко используется на западных лендингах, и я решил рассказать с помощью чего они создают такой эффект. Ведь при просмотре страницы смотришь до конца на привлекательную анимацию, поэтому на данные элементы посмотрят и прочитают текст рядом.

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

Твит

Данную проблему чаще всего можно встретить на подписных страницах, которые обычно помещаются в один экран (без прокрутки).

Проблема состоит в том, что обычно нижний блок располагается сразу за основным контентом и не прижимается изначально к низу. А на больших экранах остается очень много свободного места снизу. Поэтому нижний блок лучше всего прижать к низу независимо от размера экрана.

В статье я привел готовый пример, где блок правильно прижат к низу страницы и всегда будет там находиться независимо от размера страницы. Также я всё подробно описал, чтобы каждый смог осуществить на своих страницах данные манипуляции.

Твит

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

Суть эффекта состоит в том, что при прокрутке страницы смысловые блоки Вашей продающей или подписной страницы сменяются как слайды. Также анимация идет и в обратном направлении.

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

Твит

UX-дизайнер определяет, как пользователь будет работать с приложением. Имеется в виду проработка различных сценариев. Скажем, если человек за рулём запустил программу, то кнопки интерфейса должны быть крупными, чтобы можно было нажимать их, особо не отвлекаясь от дороги. Когда чаще будут пользоваться приложением — днём или ночью? Казалось бы, это не имеет значения, но нет: если днём да ещё на улице, придётся выбирать определенную цветовую гамму, чтобы информация легко читалась, когда подсветка смартфона не справляется с ярким солнцем.

Твит

Блогер и писатель Николь Бойер собрала для издания Creative Bloq пять трендов в веб-дизайне, которые ей удалось выявить за первые шесть месяцев 2015 года.

1. Разделение экрана

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