О CSS!
Приветствую вас в уроке о CSS.
Где вы узнаете – что такое CSS и, собственно, нафига его вам так необходимо знать.
Ну что, начинаем покорять мое авторское чтиво?
Вы когда-нибудь слышали про каскадный таблицы стилей? А про блочную верстку?
Так вот, это все одно и тоже – это CSS.
Когда для создания сайтов использовался только HTML, структуру сайта создавали при помощи таблиц. То есть, создавалась таблица, в ней создавались поля и столбцы. Точнее ячейки. И каждая ячейка отвечала за определенную область сайта.
Одна за шапку, другая за контент, третья за боковой сайдбар, за подвал сайта и так далее.
Отсюда и название – табличная верстка.
Но с приходом CSS все значительно поменялось, стало проще и удобнее.
Сейчас СSS используется на 99% сайтов в интернете.
Давайте так. Рассказывать про CSS и переубеждать в его выгодности я вас не буду.
Я назову вам всего лишь 7 причин, таких, знаете, незначительных.
Естественно они будут взяты не с потолка, а из моей практики.
А вы уж сами думайте – нужны вам эти знания или да.
Ну что, погнали что ли?
Причина №1. Существенное сокращение кода.
Если вы уже хорошо поработали с HTML, то вы должны представлять – сколько однообразной возни вызывает оформление дизайна.
Глобус лопнуть может
Возьмем, к примеру, ссылки .
Допустим, у вас есть сайт в 100 страниц, и на каждой странице по 10 ссылок. И вы решили поменять их цвет. Что будет? Тысячу повторений одного и того же кода.
Причем глубоко пофиг, что оформление везде абсолютно одинаковое, на каждой странице, вам придется прописывать одно и тоже.
Это куча убитого вами времени, а если еще и нервишки шалят, не факт что ваша клава или мышка выдержит очередной удар вашего могучего кулака .
А теперь прикиньте, если вы решите полностью поменять дизайн?
В CSS – достаточно прописать для каждого элемента свойство один раз, и оно начнет работать для всех элементов сайта.
Причина 2. Простота работы с кодом.
Если при табличной верстке весь код сбит в кучу, то при CSS – все оформление выносится в отдельный файл! Т.е. в самой странице сайта содержится ТОЛЬКО структура документа, а уже в файле стилей все свойства прописанных блоков на сайте – размеры, цвет, заливка, фон и т.д.
Плюс вместо одинаковых тегов таблиц, строк и ячеек, будут использоваться блоки, которые мы можем назвать так, как нам угодно!
Как думаете, где легче разобраться в коде? Там где сто одинаковых тегов таблицы , или там где десять блоков с уникальными именами? Ведь для создания блока нам нужен всего один тег!
Причина 3. Ускорение загрузки сайта в интернете.
[sbox id="info" big="true"]
Неоспоримый факт – сайты на основе CSS грузятся гораздо быстрее, чем HTML сайты.
[/sbox]
И это достигается не только за счет сокращения кода.
Дело в том, что когда пользователь заходит на сайт, созданный при помощи CSS – браузер автоматически начинает грузить файл стилей (см. Причину 2).
А так как в файле стилей расположен весь дизайн и картинки сайта, то получается, что при переходе на следующую страницу – браузеру не надо грузить дизайн снова, ведь страницы сайта оформлены идентично! У них только разное наполнение.
В HTML сайте, вы хоть разместите две абсолютно одинаковые страницы, при переходе с одной на другую – все будет грузиться заново!
Причина 4. Легкое управление дизайном.
Это достигается за счет того, что весь дизайн содержится в отдельном файле.
Но самая вкусная "плюшка" заключается в том, что к этому файлу могут быть прикреплены все страницы сайта.
А это означает одно, что изменяя параметры дизайна в одном маленьком файле, вы изменяете дизайн всего сайта автоматически.
При HTML вам придется ковыряться на каждой странице.
Причина 5. Качество дизайна!
Посмотрите внимательно на мой сайт, здесь много всяких фишек. Я не про функциональность, а про дизайн говорю.
Так вот, создать такую же “ляпоту” при помощи HTML будет невозможно!
В CSS можно реализовать очень много интересных фишек – смена картинки при наведении, выпадающее меню, отступы, высоту строки… Не буду писать “Войну и Мир”, и так уже много “накалякал”.
Но, думаю, Вам моя мысль понятна –
в HTML нету и половины фишек, которые может представить вам CSS.
Причина 6. Быстрота и удобство.
Сайты на блочной верстке - намного легче создавать, чем на табличной!
Так как кода получается намного меньше. Разобраться в нем намного проще. И управлять таким кодом намного удобнее.
Я это говорю Вам - как истинный практик!
Причина 7. Это современно!
В CSS вместо таблиц используются блоки (блочная верстка), к которым можно применить различные свойства. Как только он был разработан – его начали широко применять, и сейчас на CSS основывается дизайн практически всех сайтов в интернете.
А это означает одно:
[sbox id="warning" big="true"]
Если вы не знаете CSS – вы не сможете не то что создать, а даже переделать дизайн и структуру современного шаблона сайта.
[/sbox]
От себя добавлю - CSS очень легко поддается изучению. Поверьте, я тоже когда то был полнейшей зеленкой, и об одном упоминании слова CSS – впадал в ступор.
Но однажды сел, и начал разбираться. И самое замечательное, что на практике все оказалось очень легко и интересно.
Я понял, что можно создать классный дизайн с меньшими трудозатратами и в кратчайшие сроки
В общем, не теряйтесь. Если вы выучите HTML и CSS – создать современный сайт с офигительным дизайном для вас не составит труда!
На связи с вами был Серега! Удачи и до завтра.
2010-12-19 в 19:36:58
2010-12-20 в 18:03:43
Что так
2010-12-20 в 23:00:31
Серёжа,ОГРОМНЕЙШЕЕ спасибо!
Я уже столько юзю и наконец-то просветление только с твоей рассылкой пришло.Ещё раз спасибо!
2010-12-24 в 15:18:46
Сергей, спасибо!
Всё очень доходчиво, как раз для начинающих!
2010-12-24 в 19:00:22
2010-12-25 в 02:54:11
Сергей, большое спасибо. Интересно, а самое главное понятно и вразумительно, рассчитано на таких чайников, как я. Пока что все понятно. Будут вопросы - буду доставать. Но работа у меня такая, что могу уехать на 2- 3 недели и поэтому не вовремя буду отвечать и работать с уроками. Но мне очень хочется все это освоить и применять. Интересно и хочется идти в ногу с сыновьями. Еще раз спасибки!!!
2010-12-25 в 11:23:13
Спасибо за приятные отзывы в мою сторону.
2010-12-26 в 19:19:43
Спасибо! Пока все понятно и доступно.
2010-12-26 в 19:24:31
Пожалуйста
2011-01-16 в 14:20:37
Спасибо, Сергей, за Ваши уроки! Мне очень импонирует Ваше чувство юмора. Надеюсь, так же легко будет проходить и мое обучение по вашим урокам.
2011-01-26 в 18:19:09
2011-03-05 в 01:37:30
Сережа, я немного отстала, так хорошо начинала. Просто приболела. Тимпература39,9 уже три дня, этобы ещё ничего, так таблетками Эриспал отравили. Плохо соображаю.Вся семья гриппует. Я же не отстану? Вы же никуда не денетесь?)) Завтра или послезавтра дальше начну учить. Если будут вопросы, смогу задавать?
2011-03-09 в 18:54:27
ХМ CSS как то не прет но остальные вещь
2011-03-27 в 19:48:59
Для меня очень полезный урок,спасибо!!!
2011-04-07 в 10:42:02
Здравствуйте, Сергей! У меня почему-то нет изображения в уроках. Звук есть. Подскажите, что можно сделать. Проигрывать пробовала в winamp,LA, проигрывателе WIN. Опер.система win7.
2011-04-07 в 10:45:23
Попробуйте KMPlayer
А также поставьте на свой компьютер последние версии кодеков.
2011-04-07 в 10:49:29
Не подскажете ссылки?
2011-04-07 в 11:47:19
Спасибо, изображение появилось после установки кодеков