Что случилось с причудой дизайна веб-сайта на одну страницу?

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

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

Есть две отдельные тенденции.

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

Другая тенденция заключается в том, что разработчики Flash наконец открыли для себя HTML, jQuery и AJAX и все еще думают о старой модели Flash «один файл = один сайт». Это отличается от первой тенденции в том, что это большой сайт с большим количеством контента, сжатого в одну страницу данных / взаимодействия. Как вы заявляете, этот метод имеет все виды недостатков, хотя их можно преодолеть с помощью правильного кода (убедитесь, что URL-адреса изменяются / становятся закладками, Google может перемещаться по контенту, время загрузки управляется через AJAX и т. Д.).

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

Это демо, изначально созданное для демонстрации IE9, посвящено рассказыванию историй . Почти как книжка с картинками, но с прокруткой вместо перелистывания страниц. И из-за этого это действительно цельно и круто. Не очень практично для создания бизнес-сайта, но это подчеркивает одну причину, почему одностраничная вибрация полезна.

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

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

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

У этого есть один плюс (только один, который я могу придумать!), Который заключается в том, что если вы хотите искать с помощью Ctrl+ F, весь контент находится на одной странице, поэтому вы можете осуществлять поиск по всему веб-сайту сразу (при условии, что контент доступен для поиска). ,

Я думаю, что это отчасти связано с концепцией «Не заставляйте пользователя запрашивать больше контента - просто дайте ему». Как Google, Twitter и т. Д. Автоматически дает больше результатов, чем дальше вы прокручиваете.

Стоит посмотреть выступление Азы Раскина в GoogleTech 2008 года «Не заставляй меня щелкать» .

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

Интересно, было ли это предшественником того, что вы видите сейчас?

Два слова: пользовательский опыт.

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

Или, более конкретно, призыв к действию является единственным. Когда целью сайта является «нанять меня», сайт может быть контрпродуктивным, если его карта сайта излишне сложна.

РЕДАКТИРОВАТЬ: некоторые примеры ниже ...

http://joelglovier.com/

http://pixelightcreative.com/

http://www.tinybigstudio.com/

http://www.charleselena.com.au/

http://joshhemsley.com/

http://www.digitallabs.tv/

С точки зрения SEO, одностраничный дизайн сайта - это увлечение.

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

Мой совет? Попросите специалиста по SEO провести исследование ключевых слов и дать вам общее представление о структуре вашего сайта.

Вы можете прочитать больше на Search Engine Land, эти ребята очень хорошо знают SEO;) https://searchengineland.com/single-page-websites-seo-182506

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

Я не думаю, что это что-то большее, чем кто-то, кто использует новейшие привлекательные трюки, чтобы заставить людей читать сайт.

Взять, к примеру, сайт Nike в связанной статье @ Shauna. Честно говоря, сколько инноваций осталось в дизайне кроссовок и в рекламе тех же кроссовок? Этот контент можно было бы так же легко разместить в брошюре или во Flash, если они хотят параллакса. Вместо этого они могут добавить отличный эффект параллакса в результате новой схемы навигации без бремени Flash.

Я бы даже зашел так далеко, что предположил, что на веб-сайте Smashing Magazine есть учебник по HTML5 / CSS, который показывает, как это сделать, что породило показанные сайты.

Я действительно думаю, что первый элемент (полоса дрейфа), которую вы связали, имеет крутой фактор: он хорошо выглядит в движении.

Это не имело смысла для меня, пока я фактически не нажал одну из ссылок меню, и теперь я вижу, что анимация была единственной движущей силой всей идеи. Это своего рода эффект старой камеры с 3-мя плоскостями, как в старом мультфильме «Попай» или «Дисней».

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

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

Я думаю, что вы в значительной степени ответили на свой вопрос в названии - то есть, это причуда.

Точно так же, как когда Javascript (а затем и AJAX) появился много лет назад, и люди делали с ним всякие причудливые вещи, лучшая поддержка Jquery и CSS 2/3 и лучшая скорость рендеринга в браузерах стимулировали новый виток экспериментов с новыми способами. выкладывать сайты, которые в прошлом могли быть не такими практичными из-за некоторых старых браузеров.

Но, как и в случае с CSS, Javascript и AJAX, это увлечение станет зрелым и мягким, а со временем станет более отточенным, приятным и полезным. Ваш первый пример - простая головная боль с ее сумасшедшей раздельной прокруткой (если вы, скажем, в начале и нажимаете «Галерея»). По моему скромному мнению, это зашло слишком далеко, и это не достаточно гладкий опыт, чтобы оправдать расставание с нормой. Это не значит, что все сайты, использующие подобные методы, будут плохими.

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