Оцените Html-сайт об обучении в Японии

[oprssi]

Вэлкам - www.gaku.ru
Жду критики, особенно по юзабилити.

Это мой второй сайт, первый был ещё хуже...

 

[deMone]

Получилось замечательно, сложно поверить, что это только второй сайт.

Хотя, конечно, без замечаний я вас не отпущу.

1. На главной странице значок

не должен являться ссылкой, и лучше, если будет серым. То же и с логотипом: на главной странице он не должен быть ссылкой.

2. Номер телефона (+81-80...) в правой верхней ячейке нужно выровнять с другим текстом, сместив значок телефона влево. Вот так:


3. Очень не понравилось то, как свёрстано главное меню, особенно вот такое:

<a href="/news/news.html">Новости</a>&nbsp;&nbsp;&nbsp;&nbsp;|&nbsp;&nbsp;&nbsp;&nbsp;

Вспомните, в CSS есть замечательные свойства margin-left и margin-right. Используйте их.

4. Отступ от заголовка страницы до текста должен быть минимальным (почитайте, вот).

5. В новостях, почему бы не очеловечить даты? Ведь так легко вместо «[06.05.2007]» написать «6 мая 2007 года», а насколько сразу становится приятнее!

6. Ссылки «Подробнее...» оттуда-же лучше убрать, а ссылкой сделать либо заголовок новости, либо ключевую фразу в тексте новости. Посмотрите, как оформлены новости на главной странице Яндекса.

7. Блок «Школы японского языка» лучше сделать таблицей из трёх колонок: Название школы, Тире, Город. Тогда тире будет во всех строках на одном уровне, и будет приятнее читать. Кроме того, вместо тире лучше использовать более короткий знак минуса.

8. На странице «Вопрос-ответ» расстояние между ответами разное. Кроме того, я бы разные вопросы отделил ещё и горизонтальной чертой c цветом #eaeaea и толщиной в 1 пиксель.

9. В меню никак не выделяется «текущая» страница. Это плохо.

10. Ну и я бы уменьшил количество рекламы. Но это, конечно, решать вам.

Поправьте то, что я указал, и всем будет хорошо.

 

[oprssi]

deMone, большое спасибо за объективную критику!
Абсолютно согласен с пп. 1-3, 7-9, уже исправил многое.

По поводу этого:

7. Блок «Школы японского языка» лучше сделать таблицей из трёх колонок: Название школы, Тире, Город. Тогда тире будет во всех строках на одном уровне, и будет приятнее читать. Кроме того, вместо тире лучше использовать более короткий знак минуса.

Согласен, так будет лучше. Однако не могу найти выход для себя - <a> не может включать в себя <table>! Попробовал и <div>, и <span> - все коряво получается. Видимо, надо делать меню по-другому, а так хотелось ограничиться только css и html. Может быть, что-то посоветуете?

 

[deMone]

Согласен, так будет лучше. Однако не могу найти выход для себя - <a> не может включать в себя <table>! Попробовал и <div>, и <span> - все коряво получается. Видимо, надо делать меню по-другому, а так хотелось ограничиться только css и html. Может быть, что-то посоветуете?

Конечно:

…
<tr onclick="location.href='/schools/arcacademy.html';">
<td><a href="/schools/arcacademy.html">«Арк Академия»</a></td>
<td>—</td>
<td><a href="/schools/arcacademy.html">г.Токио, г.Осака</a></td>
</tr>
…

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

Если постараться, то можно ещё и сделать «выделение» строки таблицы при наведении мыши.