Критика

[inono]

http://f0115661.xsph.ru/ (простите за бесплатный хостинг, бомжую )

Просьба рассказать об общем впечатлении о сайте, указать явные ошибки или недоработки в html/css. Для чего и для кого этот сайт - содержится в самом содержании сайта. Учу html/css полтора месяца, судить - строго!

P.S. Кнопки заглушены, пока сделал только главную страницу.

Edited February 18, 2017 by inono

[Tilonorrinco]

1) Откажитесь от использования id, чтобы не было проблем с каскадностью. (заодно не придется так часто использовать !important, что тоже не очень хорошо)

2) Названия для стилей лучше давать осмысленные, связанные с предназначением блока, а не с его оформлением (класс h1_and_picture -- не есть гуд, класс section-title уже лучше).

3) Самое главное: очень много лишней разметки, цель которой -- только оформление страницы. Все оформление лучше вынести в css: вместо пустых дивов можно использовать псевдоэлементы, вместо бессмысленного <hr> на логотипе просто использовать нижнюю границу у тега h1 или псевдоэлемент.

4) С шапкой очень мудрено вышло, что-то вроде браузерного фотошопа  Зачем обрабатывать эту тяжеленную шапку (http://f0115661.xsph.ru/ik_sauna.jpg) в браузере, накладывая дополнительные слои с фильтрами, градиентами и пр., если все это можно сделать в фотошопе и просто вставить одну уже обработанную картинку?

Аналогично в подвале: под логотип студии с прозрачными буквами подкладывается дополнительный слой (дополнительный пустой див в разметке) для того, чтобы сделать эти буквы темнее цветом. 

5) По тегам: тегов <nav>, <header>, <footer> на странице может быть несколько, поэтому на перспективу лучше сразу же присваивать им классы и задавать стили не элементу, а классу.

Edited February 20, 2017 by Tilonorrinco

[inono]

1 час назад, Tilonorrinco сказал:

1) Откажитесь от использования id, чтобы не было проблем с каскадностью. (заодно не придется так часто использовать !important, что тоже не очень хорошо. 

А в какой случае тогда можно использовать id? Для какой - то цели они ведь есть?

1 час назад, Tilonorrinco сказал:

3) Самое главное: очень много лишней разметки, цель которой -- только оформление страницы. Все оформление лучше вынести в css: вместо пустых дивов можно использовать псевдоэлементы, вместо бессмысленного <hr> на логотипе просто использовать нижнюю границу у тега h1 или псевдоэлемент.

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

Насчет шапки - прекрасно понимаю, что все это делается в фш в один - два клика, но это был своеобразный вызов самому себе, а смогу ли я? бросил я его себе, когда понял, что filter к background не применяется. Долго парился с этой картинкой, дня два  . С картинкой снизу так поступил, т.к. не было доступа к своему компьютеру и быстрому интернету, не могу фш скачать соответственно. Пришлось выдумывать)

И можно пару слов по поводу внешнего вида сайта?

Спасибо большое за понятное и подробное разъяснение.

 

[Tilonorrinco]

inono,

1. id используются для идентификации элементов страницы при выполнении скриптов, для создания якорей. 

2. Псевдоэлементы нужны для создания дополнительных сущностей в коде html и последующей их стилизации. Псевдоэлементы я изучал по книге Макфарланда "Большая книга css", но, мне кажется достаточно будет любой статьи по теме и тренировки в песочнице, там все очень просто: https://habrahabr.ru/post/154319/

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

[inono]

5 часов назад, Tilonorrinco сказал:

inono,

1. id используются для идентификации элементов страницы при выполнении скриптов, для создания якорей. 

2. Псевдоэлементы нужны для создания дополнительных сущностей в коде html и последующей их стилизации. Псевдоэлементы я изучал по книге Макфарланда "Большая книга css", но, мне кажется достаточно будет любой статьи по теме и тренировки в песочнице, там все очень просто: https://habrahabr.ru/post/154319/

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

К эмоции "офигенно!" буду стремиться в будущих проекта) спасибо за дополнительные разъяснения, с псевдоэлементами буду разбираться потихоньку.