Как я могу улучшить дизайн своего сайта? [закрыто]

Я запускаю компанию и сейчас работаю над сайтом. Вот ссылка: http://goo.gl/HKbIK Поскольку я не профессиональный веб-дизайнер, буду очень рад вашим комментариям/отзывам/предложениям по улучшению!

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

Большое спасибо за вашу помощь,

Для таких вопросов рекомендуется описать свой сайт и любые ваши мысли о том, чего, по вашему мнению, не хватает. Отчасти потому, что мы решаем общую проблему дизайна, которая может возникнуть у других людей и может быть найдена полезной в Google. Я редактирую несколько мыслей, чтобы дать вам представление, не стесняйтесь редактировать их, если я неверно представляю суть вашего вопроса.
Этот вопрос сейчас кажется устаревшим, поскольку кажется, что сайт уже должен был запуститься, судя по обратному отсчету на 0? Нет никаких признаков эффекта паралакса или чего-то еще. Есть ли шанс, что вы могли бы опубликовать ссылку на сайт, обладающий описанными вами качествами, для будущих посетителей?
Привет - на самом деле все еще работаю над этим, поэтому ваши отзывы приветствуются ;-) Обновленный URL: goo.gl/HKbIK
Вопросы не должны трансформироваться из «нужна помощь с версией 0» в «нужна помощь с версией 1» и «нужна помощь с версией 3». Предоставленные ответы могут быть недействительными, поскольку вопрос меняется, и этот вопрос не может быть полезным ресурсом для будущих посетителей. Закрытие как слишком локализованное...
Да, подобные вещи — один из очень немногих случаев, когда длинные, бессвязные ветки форума на самом деле более уместны, чем структура вопросов и ответов, подобная этой. Пожалуйста, возвращайтесь в любое время, когда вы ищете четкие окончательные ответы на четкие фиксированные вопросы, это то, для чего предназначен этот сайт, и он действительно хорош для них.
... или вы можете поместить несколько скриншотов дизайна 1 в этот вопрос и задать этот вопрос о балансировке контента и полужирных фоновых изображений в стиле парралакс, а затем подумать о том, что вас беспокоит в дизайне 2 (если он есть) и задайте отдельный вопрос, посвященный этому, и т. д. Суть в том, что у кого-то с похожей проблемой через 6 месяцев должна быть возможность погуглить, найти этот вопрос и сказать: «Эй, это описывает тот же вид проблемы, как у меня", прочитайте ответы и узнайте что-нибудь полезное. Это не работает, если фокус вопроса меняется.

Ответы (2)

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

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

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

Несколько предложений:

  • Поскольку это веб-сайт, подумайте о порядке загрузки. Сейчас сначала загружается контент, затем после загрузки резко появляется интересное фоновое изображение, отвлекающее от него. Вы не хотите, чтобы пользователи ждали, прежде чем они увидят контент, но вы также не хотите, чтобы они отвлекались. Попробуйте разные вещи, одна бесплатная идея, пришедшая мне в голову, будет чем-то, что обновляет контент с дополнительным содержащим элементом, чтобы $(document).ready()он возвращал внимание зрителей после завершения загрузки страницы и приземления фонового изображения.
  • Подумайте о том, чтобы объединить контент в более дискретную единицу и пространство, которое явно выделяется как предмет, на котором следует сосредоточиться. Некоторые вещи, которые следует учитывать: ввод текста с краев, больше отступов и пробелов на самих элементах, а также полупрозрачные контейнеры для элементов, у которых их нет (например, первый фрагмент). Отступы вокруг ваших текстовых контейнеров очень узкие — пробелы (которые, конечно, не обязательно белые...) — отличный способ придать содержимому заметность .
  • Подумайте о фокусе для каждого фрагмента. Когда появляется каждый фрагмент, вы хотите, чтобы ваш пользователь указывал прямо на точку, чтобы начать чтение. Способов сделать это слишком много, чтобы их перечислять, так что экспериментируйте. Этот вопрос Как привлечь внимание к определенной области дизайна? может помочь вам получить некоторые идеи, но просто обратите внимание на то, что люди используют на веб-страницах, в журналах, в рекламе... везде, где им нужно, чтобы было очевидно, с чего начать чтение.

Ваш сайт не работает, если вы показываете его людям, а они говорят: «Вау, мне нравятся фоновые изображения! Хм… Хорошо, это как-то связано с водой, не так ли?». Это работает, если они читают контент, переваривают его, а затем говорят: «И это выглядит великолепно! Мне нравятся фоновые изображения!»

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

"Название компании было зарегистрировано в мае 2011 года.

Наша миссия состоит в том, чтобы поставлять самую лучшую природную минеральную воду с устойчивостью, поддержкой местного сообщества и отраслевым опытом».

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

Надеюсь, я помог вам. :)

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