Можете ли немного оптимизировать этот код?

Question

[Java Script]

Хочу с нуля написать сайт.
Пока что сделал только header и хочу немного оптимизировать этот код чтобы продолжить.
Просто не вижу что делать тут.
Вот код:
https://codepen.io/JS_lover/pen/xxZzJKE

Comments

[Ankhena]

Кусочек

.header {
    display: block;
    margin: 0 auto;
    width: 100%;
    max-width: 100%;
    box-shadow: none;
    background-color: #FC466B;
    position: fixed;
    height: 60px!important;
    overflow: hidden;
    z-index: 10;
}

0. Семантика, если вы даете div'у класс header, то должен возникнуть вопрос, может, это header, а не div?
1. div сам по себе блочный
2. Если у него ширина 100% от родителя, то зачем писать, чтобы он был по центру? 100%-там без разницы по центру они или по левому краю.
3. Зачем максимальная ширина тоже не очень понятно.
4. Зачем убираете тень? Она что есть?
5. !important сразу в верстке говорит о том, что это некачественная верстка.
6. overflow: hidden для body и html. В большинстве случаев можно все сверстать так, чтобы не нужно было вешать overflow сразу на body и html. Так вы как будто говорите "у меня всё криво, я не умею считать размеры, черт знает что и когда где-то выпадет, обрежу ка я это всё заранее".
Т.е. применительно к header он оправдан. А к body и еще и одновременно к html нет.

[WapSter]

Да уж.. Ну что я тебе скажу, чтобы оптимизировать верстку, нужно знать как рендерит браузер. В твоем коде слабые места это transition all и font-size ...-lage нафига вообще пользоваться дробными значениями. Иконочные шрифты это плохо, диватоз тоже плохо ты им страдаешь. Почему что-то плохо можешь почитать в интернете. А вообще за этим на фриланс, а не сюда. И куча не нужных свойств.

[Мухаммад Магомедов]

Ankhena, и плюс у header: margin: 0 auto;
Зачем это, если по умолчанию и так нет отступов сверху и ширина 100%??

[Ankhena]

Мухаммад Магомедов, не поняла комментария
Вроде все расписала в п2.

[Пашенька]

Ankhena,

Зачем убираете тень? Она что, есть?

Когда солнце светит, появляется)