Jump to content

Оцените верстку


IvanRu08
 Share

Recommended Posts

Доверстал макетик. Прошу оценить верстку с точки зрения качества кода и подходов. Что сверстано неверно и что нужно доработать. Также отдельная рассказать о косяках с отображением, которые заметите. Вот сайт: http://a96362zl.bget.ru/index.html

Link to comment
Share on other sites

1. Это у нас заголовок-ссылка - http://joxi.ru/Q2KxaXps9oQG9A

2. Проще сделать спрайт с белыми значками соц. контактов, а цвет фона задавать через стили. Универсальность - 100% :)http://joxi.ru/eAO4ny7F4oVqjr

3. Скорее top-menu - http://joxi.ru/4AkOk1pcM7DBLA

4. Не ленитесь присвоить им классы - http://joxi.ru/E2pkNJdSB6DJWm

5. Зазор между инлайн-блок элементами - http://joxi.ru/xAeeR31SYnKBXA

6. Что будет с картинкой, если она не по ширине слайдера будет? Стилей для нее нет.

7. Ширину слайдера можно дать в 100%, если мы его используем в другой контейнер не привязываясь к ширине

8. Полоски сделаны хорошо, но это всё-таки заголовок, оберните его в h$ - http://joxi.ru/eAO4ny7F4oVbjr

9. Тут неверно - http://joxi.ru/ZrJqZnXt1o8gdA . В таком случае пишем, то margin: 0 24px; для каждого блока, но у общего контейнера отнимает это же margin: 0 -24px;. В таком случае не нужны :nth-child(3). А идеально было бы задать контейнеру класс, к примеру, .three-column-wrapper, а содержимому просто .column.

Далее

.three-column-wrapper {
  margin: 0 -24px;
  font-size: 0; /*убираем зазоры*/
}

.three-column-wrapper .column {
  width: 33.3333333%;
  margin: 0 24px;
}

10. Зачем дали высоту? http://joxi.ru/Dr8nxw6fk69Wb2

11. Там же - кнопка из-за этого стала position: absolute;

12. Там же - если текста будет больше? Еще, вы проделали лишнюю работу по отступам, продать дали бы родителю padding.

13. Футер не прижат к низу - http://joxi.ru/v29JkwWsGPJwQA

14. Дайте классы инпутам формы

15. Нет стилей ни к одной картинке в превью статьи, когда картинка слева. У вас стоят заглушки одного размера. А теперь поставьте разных размеров и увидите разницу.

16. Видимые заголовки обозначены просто ссылками, а должны быть h2, или h3 ...

Пока всё, дальше сами :)

  • Like 2
Link to comment
Share on other sites

Join the conversation

You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.

Guest
Reply to this topic...

×   Pasted as rich text.   Paste as plain text instead

  Only 75 emoji are allowed.

×   Your link has been automatically embedded.   Display as a link instead

×   Your previous content has been restored.   Clear editor

×   You cannot paste images directly. Upload or insert images from URL.

 Share

×
×
  • Create New...

Important Information

We have placed cookies on your device to help make this website better. You can adjust your cookie settings, otherwise we'll assume you're okay to continue. See more about our Guidelines and Privacy Policy