Технология CSS Grid
Давно это было. Свой первый сайт я создал на “народе”. Кто так же стар, как я, тот поймёт ))) С тех пор много воды утекло. И технологии создания сайтов сильно, очень сильно поменялись. И, тем не менее, в основе сайтостроения по прежнему лежат HTML (появился в 1986…1991 году) и CSS (появилась в 1996 году).
Конечно, и то и другое с тех времён претерпели множество изменений, добавились новые возможности и парадигмы. Например,
Чем было вызвано её появление?
А всё дело в том, что сегодня большая часть людей заходит в Интернет не через компьютер, а через другие устройства. В основном, через смартфоны. И у этих устройств могут быть разные размеры и разрешения экранов. И если с разрешением справлялся обычный HTML (точнее, аппаратная часть и браузеры), то с появление разных размеров и форматов экранов всё усложнилось. Особенно если учесть, что экран смартфона в большинстве случаев расположен вертикально.
Всё это привело к тому, что обычные сайты, созданные по старым технологиям и прекрасно отображавшиеся на экранах компьютеров, на смартфонах стали смотреться криво и убого. Это, разумеется, нельзя было оставить без внимания, и стали появляться технологии адаптивной вёрстки сайтов.
Что значит адаптивная?
Это значит, что сайт правильно отображается на любых экранах, независимо от их размеров и форматов. И одной из таких адаптивных технологий является
CSS Grid позволяет создавать более надежные и гибкие макеты, чем предыдущие варианты, такие как CSS Floats. Это также позволяет использовать более стандартизированный код, который одинаково хорошо воспринимается разными браузерами.
Слово “grid” можно перевести как “сетка” или “таблица”. В этом суть технологии. Вы создаёте некий макет - сетку-таблицу, где каждая ячейка является блоком сайта (меню, заголовок, подвал и т.п.), и определяете пропорциональные размеры этих блоков. Ну и всё. А дальше уже технология позаботится о том, чтобы эта сетка сжималась и растягивалась таким образом, чтобы ваш сайт выглядел красиво на любых устройствах.
Разумеется, надо ещё чтобы браузер, который установлен на устройстве пользователя, поддерживал эту технологию. Но хорошая новость в том, что почти все современные браузеры это делают, то есть могут работать с CSS Grid.
Так что для того, чтобы начать создавать красивые адаптивные сайты, вам остаётся совсем немного:
Не скажу, что это будет очень просто и очень быстро. Но результат, без сомнения, того стоит. Так что переходите по ссылкам в статье, смотрите, читайте подробности, и решайте - надо вам это или нет.
Реклама. Информация о рекламодателе по ссылкам в статье