Советы по дизайну веб-дизайна от начинающего разработчика

В настоящее время я занимаюсь дизайном веб-приложения.

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

У меня есть следующие настройки: введите описание изображения здесь
(нажмите для оригинала)

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

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

Я также старался максимально соответствовать цветам (красный и зеленый нужны заказчику). Но у меня проблемы с сопоставлением цветов с зеленым..

Не могли бы вы дать мне советы (любые советы ИМХО, которые принесут пользу дизайну)? Я готов загрузить css и html, если потребуется!

Спасибо за помощь :)

ОБНОВЛЕНИЕ: Вот как это выглядит сейчас:
введите описание изображения здесь
(нажмите для оригинала)

Это действительно ужасный зеленый цвет, с которым вам приходится работать. Мои соболезнования.
Согласованный. Есть ли шанс, что вы могли бы поговорить с власть имущими об этом в рамках изменений дизайна?
Не совсем... это часть их стиля, я создаю новый проект (но он должен быть в том же стиле)
Я не думаю, что зеленый является проблемой сам по себе , но я знаю, что красный и зеленый дальтонизм потенциально может быть здесь проблемой: для тех, кто воспринимает зеленый как более серый тон, пункты меню могут стать невидимый. Я думаю, что общий вид здесь респектабельный, и я склонен согласиться с предложением Райана выровнять заголовки меню по правому краю, чтобы они соответствовали остальной части меню.

Ответы (1)

Во-первых, это, очевидно, критика, которую мы допускаем, но в результате мое мнение следующее:

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

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

  3. Кернинг на вашей надписи местами выглядит очень туго. Например, вверху слова «Проект» соприкасаются буквы C и T. В KPI посередине буквы P и I почти соприкасаются. Я действительно позволил бы немного больше места. Компактность хороша, но я думаю, что вы зашли слишком далеко с этим.

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

Я склонен согласиться с пунктами здесь. Для # 4 я прочитал серый цвет как выделение, указывающее на текущий выбранный пункт меню.
Да, серый цвет указывает на активный элемент. В любом случае, я внес коррективы, о которых вы упомянули: см. ( i44.tinypic.com/2pts512.png ). Я согласен, что это выглядит лучше, но все еще не имеет того «приятного» ощущения.
Я думаю, что это выглядит намного лучше. Теперь, когда вы изменили эти вещи, единственное, что мне сейчас бросается в глаза, это то, что логотип IWT, вероятно, выглядел бы лучше, если бы он также был выровнен по правому краю меню, а не как бы по центру с выравниванием по левому краю в этой средней области. В противном случае просто не хватает большего количества контента и прочего, поэтому он выглядит немного пустым, а не красивым. Но если это необходимый контент, то я думаю, что он выглядит нормально.
Посмотрев еще раз, я бы переместил логотип, чтобы он был выровнен с меню, а затем разместил верхний элемент, чтобы он лучше совпадал со средней областью. Заголовок, подзаголовок блога Боба и кнопки, возможно, выровнены по левому краю со средней областью. И тогда вы можете поместить имя пользователя/изображение либо под, либо над оверзихтом с правой стороны.
Ладно, думаю, я сделал почти все, что мог :) i42.tinypic.com/2r5ua8j.png . Я изменил расположение логотипа, изменил отступ между левым и средним содержимым, а приложения-ссылки разместил под аккаунтом, чтобы "выглядело" как будто страница больше! Что вы думаете?
В целом, и опять же, это мнение только одного человека. Другие, безусловно, могут присоединиться к другим мнениям или предложениям, я думаю, что это намного лучше, чем то, с чего вы начали. Единственный недостаток, который я вижу в результате вашего последнего изменения, действительно незначительный - что бы ни было "Hier kun je...", оно может быть выровнено с текстом в меню "Algemene", а не выровнено по его нижней части в "Algemene". ..." по центральной линии. Но в целом отличная работа!
При обсуждении вопроса о том, чтобы элементы, выровненные по правому краю, были согласованы, упущен тот факт, что с точки зрения взаимодействия с пользователем меню, выровненные по правому краю, ужасны, потому что они очень затрудняют сканирование, ваш глаз должен прыгать туда-сюда. Правильное выравнивание делает конец строки более читаемым, чем начало, что не имеет смысла. Это один из тех симпатичных стилей дизайна, который отстойно читать. Почти так же плохо, как серый на сером.