Рекомендации по CSS для новичков
Сейчас я приняли решение написать немного, с моей точки зрения, полезные советы для молодого верстальщика. Пока же эти рекомендации будут только того, что касается CSS, вероятно чуть позже я создам что-нибудь похожее и по HTML верстки сайта.
Рекомендации по CSS для новичков
Сейчас я принял решение написать немного, с моей точки зрения, полезные советы для молодого верстальщика. Пока же эти рекомендации будут только того, что касается CSS, вероятно чуть позже я создам что-нибудь похожее и по HTML верстки сайта.
Я думаю, что данные рекомендации станут полезны не только новичкам, но и тем, кто давным-давно работает с CSS стилями. Так как нет предела совершенству!
Примите на вооружение масштабные сбросы
Думаю, вы понимаете, что все браузеры имеют немного различные специфики по умолчанию для того, что бы правильно отображать составляющие. Масштабные сбросы как раз борются с этимими проблемами.
Четко распознавайте id и class у элементов
Указывает атрибут id на то, что данный элемент всего 1-он в документе, он попросту уникален (скажем, у вас практически постоянно всего 1-на шапка на страничке). Класс же соединяет несколько деталей с совпадающими стилевыми и семантическими качествами.
Используйте краткие свойства
Использование кратких свойств гораздо удобнее, помимо всего этого, этим вы можете сбавить объем ваших файлов стилей.
Организуйте собственные CSS файлы
Кроме разделения файлов, вы аналогично сможете ставить комментарии лично внутри файлов css. Это делает ваш код наиболее читабельным и его легче редактировать.
Применяйте CSS фреймворки и тулбоксы.
Это может помочь сберечь ваше время. У вас есть возможность применять как готовый фреймворк (дополнив или же изменив его), но и прописать собственный. Это же правильно относится и к тулбоксам, не забывайте про это.
Опасайтесь избыточности
Я думаю, что многие верстальщики понимают, что тег td (tbody/thead/tr) согласно законам HTML возможен лишь внутри тега table. Также относится к li и ul.
Вместо этого кода:
table td { … } ul li { … }
Свободно пишите этот:
td { … } li { … }
Это, естественно, самый простой вариант, хотя, думаю, идею вы взяли в толк.
Не увлекайтесь !important
Данный «флаг» увеличивает ценность описываемого свойства, другими словами если в дальнейшем будет противоречие, то эти свойства с !important станет намного главнее.
Некие молодые верстальщики злоупотребляют !important, желая его постоянно возможно заменить наиболее взыскательным наследованием. И еще одна интересная информация, он еще не всегда корректно работает в IE.
Распознавайте медиатипы
Медиатипы при включении CSS файлов позволяют вам рулить внешним видом вашего веб-сайта на различных устойствах вывода (монитор, принтер, телефон и так далее). Применение медиатипов плотно переплетается с разделением CSS файлов, их внедрение устроить ваш веб-сайт наиболее легкодоступным для различных платформ.
Указывайте несколько шрифтов
Лишь немногие шрифты существуют во всех системах и платформах, потому при объявлении рода шрифтов нужно было предписывать другие шрифты. Скажем, у нас на веб-сайте вначале употребляется Geneva, а после этого Verdana и Helvetica:
font-family: Geneva, Verdana, Helvetica, Arial, Helvetica, sans-serif;
Кстати, большая часть хороших редакторов CSS имеет именно такие внедренные комплекты семейств шрифтов. И хватит уже верстать в стандартном блокноте.
Активно используйте инструменты для проверки CSS в браузере
Эти инструменты устроят вашу жизнь легче, а работу быстрее.
Надеюсь, что новичкам (или же даже уже бывалым) верстальщикам данные скромные рекомендации станут полезны и, предполагаю, что впоследствии чтения вы будете писать хоты бы чуть-чуть, но все-же более правильный код.
Автор Iancovski Александр (пишу статьи для блога о HTML).
