Несколько вопросов о вёрстке от начинающего.

Привет всем, я начинающий верстальщик. В процессе вёрстки первого макета уже появилось несколько вопросов, если кому-то вдруг будет не сложно на них ответить, буду рад.

Собственно вопросы:

1) Тянущийся background. Проблема: при увеличении размера страницы фон перестает тянуться, и крайний элемент выпадает. Это же происходит при уменьшении размера окна, при условии, что перед выпадающим элементом имеется фиксированный отступ. Проблема решается с помощью background-size. Казалось бы, чего спрашивать, проблема решается просто. Но наткнулся на такое же выпадение на simonenko.su. И возник вопрос: а эта проблема вообще должна решаться? Пока склоняюсь к “да”.

Для наглядности:

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

3) Подсветка полей и кнопок. Хотелось бы увидеть простой (если таковой есть) рабочий способ отключения или видоизменения подсветки. Пока есть мнение, что на стилизацию некоторых нативных элементов форм стоит забить вообще.

4) Проблема с inline-block. Известно, что существуют некие отступы, присущие блочно-строчным элементам. Так вот, решение проблемы с font-size: 0 юзать можно?

5) Убийство лишних отступов. Считал, что это побочный эффект перфекциониста. Пошел искать подобные элементы на популярных сайтах: где-то обнуляется отступ, где-то нет. Считается ли это хорошей практикой?

Пример: 3 иконки, у двух из них отступ справа, обнуляю отступ у последнего, по сути он не мешает.

6) Экономия на тэгах, селекторах и свойствах. Для простого решения задачи нужен лишний тэг, который никак не хочется кидать в код. Ребят, отказываетесь ли вы от декоративной фигни, если она требует мусора в коде? Пока думаю, что все зависит от заказчика.

На начальном этапе просмотрел весь макет на наличие одинаковых элементов. Понимаю, что в дальнейшем это может ускорить процесс работы, но пока было чуть больше времени потрачено. Для примера: на главной есть h3, на другой h2, которые абсолютно одинаковые, объединяю их в один селектор. Также стараюсь использовать каскадность чаще, но в разумных пределах (не нарушаю для себя логики кода). Интересует вопрос: кроме экономии времени при накопленном опыте это как-то оправдано?

7) Несодержательные заголовки в hx. Пошарил по разным сайтам, видел и стилизацию под заголовок и встречались несодержательные в hx. Типа таких: контакты, интересное. Как вообще считается у разработчиков, нормально ли помещать в hx несодержательную инфу? Или это больше к SEOшникам?

8) Блочный элемент в ссылку. По началу думал, что это бред: блочный в строчный. Попалась такая задачка в макете, где меня б выручила такая вложенность. И нашел инфу, что в спецификация позволяет это делать, да и валидатор у меня на такую вложенность не ругался. Ну так что, можно юзать такую вложенность без зазрения совести?

9) Иконочный шрифт. Пока не задумывался о адаптивности сетки, но об адаптивности иконок и вертикальном ритме вполне. На форуме он же (иконочный шрифт) и используется, как я понимаю. Так что, можно юзать иконочный шрифт, или сейчас все переходят на SVG?

В таких случаях помогает задание min-width для body. Или ещё можно применить такой приём dabblet.com.

На данный момент есть возможность указывать только набор префиксованных свойств. Стилизовать можно вполне, есть же возможность.

Лучше не отключать подсветку по умолчанию, т.к. в разных интерфейсах (в том числе в мобильных) она может быть полезна.

C font-size: 0 может быть немного проблем, подробности есть в статье Борьба с пробелами между блочно-строчными элементами — журнал «Доктайп»

В зависимости от ситуации. Если блоки и отступы крупные, то лучше их обнулить, т. к. может повлиять на раскладку.

В более-менее больших проектах каскадноть может сослужить плохую службу, лучше ей не злоупотреблять.

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

Спецификация это допускает. В разумных пределах вполне себе рабочий приём.

Сейчас в тренде свг. Иконочный шрифт скорее ловкий трюк, по возможности лучше пользоваться свг-спрайтами. Но и у свг, и у иконочного шрифта есть свои недостатки на данный момент.

2 лайка

Спасибо за ответы, насчет первого: странно, проверял bacgkround-size: 100% пару недель назад, работал, на данный момент уже не работает. В общем, суть проблемы в расчете bacgrkound относительно окна браузера, и при увеличении размера страницы или при уменьшении размера окна он тянется ровно на ту область, которая изначально видна без использования скролла, я прав?

Да, это так.

1 лайк