Перенос css в файл page.tpl.php

Пусть выскажут свое мнение опытные мастера

Но, ведь если CSS файл размером 12 Кб, то если он отдельным файлом, то он грузится только один раз, а потом уж берется из кэша, а если стили прописаны в самой странице, то размер каждой страницы увеличится на эти 12 Кб.

Ну, а теперь надеюсь услышать мнения экспертов.

У меня CSS больше 20 кб.. если вставить в страницу это также плохо скажется на индексации поисковиком..

Советы... купить хороший хостинг и интернет... а вообще есть способ инклудить этот css но как мне кажется получится тоже самое что и просто вставить этот текст в хеадер.. Мне лично пофигу :)

ну я смотрел методы вставки css в файл: import, rel... но они именно вставляют с опозданием... как сделать так, чтобы они компановались вместе? через include? css прописать как php, а в page.tpl включить <?php print include_css(); ?>...

В частности подсмотрел как подключается один из моих css-файлов в шаблон страницы.

@import url(<?php print $base_path . $directory .'/style2.css'; ?>);

А описанная проблемма, с загрузкой CSS файла только после загрузки страницы, встречалась только в Opere, в остальных браузерах все по порядку грузится.


А так как пытаюсь сделать сайт "всеядным", то скорее всего надо просто разобраться как заставить Opera грузить этот CSS файл одним из первых, и так есть эксперты по Опере ?

так я Оперой и пользуюсь... да, про import url я знаю... но как его включать, например через php include, чтобы уж работало стопроцентно и везде?
надо наверное в сам css-файл вставить код функции, а в page.tpl эту функцию вызвать... тогда будет стопроцентный include, а не импорт...

http://www.bluerobot.com/web/css/fouc.asp

Да весьма полезная информация, никогда не задумывался о таком эффекте, но это все равно не решит эту проблему, так как и так все стандартные CSS в друпале подключаются так как и рекомендуется в этой статье, т.е. вот выдержка из моего стиля:

<style type="text/css" media="all">@import "/modules/quote/quote.css";</style>
<style type="text/css" media="all">@import "/themes/luna/style.css";</style>  <script type="text/javascript"> </script>
</head>

Проверил на других браузерах (т.е. специально ограничил скорость загрузки, чтоб видеть как и что грузится), у них тоже загрузка идет очень похоже, но только Опера сначала грузит саму страницу, а затем все остальное, а остальные браузеры, как мне кажется, пытаются загружать в несколько потоков все сразу.

Т.е. как результат, я понимаю единственный выход - маленькие странички, чтобы пользователь просто не замечал эту страницу к которой еще не применен CSS. т.е. чтоб не успевал заметить.

в page.tpl.php нужно вставить любой линк типа <link ...>
я вставил
<link rel="icon" href="/favicon.ico" type="image/x-icon">
и будет вас счастье

мне помог второй вариант: <script type="text/javascript"> </script>
первый вариант: link rel - не помог...
спасибо за ссылку... теперь в page.tpl ничего менять не надо...

Браузеры грузят страницы приблизительно одинаково. HTML в любом случае грузится первым (ссылка-то сначала есть только на него!), а затем анализируется, ищутся ссылки, прописанные внутри страницы и идет подгрузка остальных файлов (CSS, скрипты, графика...)

В Опере можно видеть страницу без стилей, оттого, что она [Опера] старается отрисовывать сразу по мере того, как грузит HTML (как-никак, "самый быстрый браузер в мире!" ;-)), а стили применяет потом - как загрузит их. Остальные же сначала предпочитают загрузить, посчитать всё, потом выводить.

Лис, вот, кажется грузит сначала HEAD у HTML-ля, выкусывает из него линки на стили, а потом, действительно, грузит паралельно (или что-то в том духе...) и, соответственно, пытается рисовать всё сразу так, как задумывалось.

По-поводу "отделять или не отделять" правильно было замечено выше: одним из основных плюсов отделения является уменьшение трафика и увеличение скорости отрисовки следующей страницы (CSS-то грузить уже не надо).

если стоит php_flag zlib.output_compression On
то файлы css и так сжимаются и уже не важно где они находятся, в отдельном файле или нет...
а как было указано по ссылке, такое случается не только у Оперы...

хм... после нескольких дней тестирования понял, что проблема остаётся, при падении скорости (если что-то закачиваю параллельно, например) сразу становится видно при загрузке сайта то же самое: белый фон, синие ссылки и тд...
как же это убрать? неужели всё-таки придётся в page.tpl добавлять весь css? или может не весь, а часть? хм... надо погуглить...

забей

некрасиво же... почему на других сайтах такого нет, а вот Друпал этим страдает?

это проблема браузера а не друпала. в друпале вообще к этому (к проблемам браузеров) относяться индеферентно как я понял. помоему там все на FF сидят и делают вид что ишака в принципе в природе не сужествует. по крайней мере у меня такое впечатление сложилось

Это похоже на правду. Даже на официальном сайте имеются несколько довольно известных глюков в IE, которые за пару лет никто не исправил
---
---
All content management systems suck, Drupal just happens to suck less. -- Boris Mann at DrupalCON Amsterdam, August 2005.

так в том-то и дело, что у меня Опера... и только в ней такие проблемы с отображением Друпала (не только на моём сайте)...

у друпала относительно большой .css файл.. но скажу тебе, как знающий человек другие движки страдают этим не меньше.. да и не в движках дело..

а в чём? в том как файл подключается? или что?
или в технологии? хех, так может в шаблонах всё хранить? и проще и наверняка?

заметил, что Drupal.org всегда открывается нормально... решил посмотреть как у него там всё записано, оказывается всё просто:

<link rel="stylesheet" href="/themes/bluebeach/print.css" media="print" />
  <script type="text/javascript"> </script>

Добавлено:
попробовал у себя также... не получилось...
хм, странно, почему там работает, а у меня нет?

А у тебя случайно этот CSS не огромный, может дело в этом ?

Просто попробуй те стили, которые необходимо загрузить в первую очередь вынести в отдельный маленький CSS и первым грузить его. Т.е. стили фона и т.д.

хм... может...
а стили по порядку загружаются? интересно...
просто в Друпале ведь все классы и идентификаторы разные... как шрифт прописать? хех... для всего body? цвета ссылок можно, конечно...
но они там тоже разные...
7 килобайт - это огромный?

Ну положим и не огромный, а даже весьма скромный, особенно учитывая что странички с microsoft[.]com тянут порой с собой до 50 Кб CSS + столько же js-скриптов.


Но ведь сам говоришь, что заметно в основном только когда весь канал забит и на загрузку странички остается совсем мало, т.е. остается предположим 1-2 Кб/с и это при 7кб = около 4 секунд + еще сама страница с графикой = а кто его знает еще сколько

Тогда просто вставим одной из первой строчек в "node.tpl.php" загрузку CSS файла, в котором определены только цвет фонов и шрифта основных элементов, т.е. например:

body { margin: 10px 0px 10px 0px; color: #000000; background: #FFFFFF; font: 11px 'Lucida Grande', Verdana, LucidaGrande, Lucida, Helvetica, Arial, sans-serif; }
a:link { color: #006600; text-decoration: none; }
a:visited { color: #228F3D; text-decoration: none; }
a:hover, a:active { color: #006600; text-decoration: underline; }
td { font: 11px 'Lucida Grande', LucidaGrande, Lucida, Helvetica, Arial, sans-serif; } 

И пусть этот кусок грузится первым отдельным CSS, а остальные уже потом. Сейчас глянул в свою тему и насчитал там 5 основных css (сайта, форума, коментариев, цитат, служебных страниц) + несколько которые используются оочень редко на некоторых страницах, замерил общий объем = 25 Кб неслабо, но ведь это все грузится только на тех страницах, где они нужны.

На страницах форума через "node-forum.tpl.php" подгружаю forum.css, для коментариев через comment.tpl.php - comments.css, quote.css - подключает сам модуль цитат, когда в ноде можно создавать их и т.д.


А в самом node.tpl.php подлючен cамый мелкий из них style2.css - где только 2 Кб.

Может не стоит всё же именно в node.tpl.php таблицы стилей подключать? Как-то не совсем правильным мне это представляется...

"Тогда просто вставим одной из первой строчек в “node.tpl.php” загрузку CSS файла"
...
почему в node.tpl, а не в page.tpl?
...
"Может не стоит всё же именно в node.tpl.php таблицы стилей подключать?"
...
я тоже думаю, что лучше в page.tpl
...
только, как сделать так, чтобы ссылки потом различались? а то ведь стили распложенные прямо в файле имеют приоритет над подключаемыми...

ссори, насчет node.tpl.php - действительно опечатался, так как печатал по памяти ( а ночью она у меня плохая :-) )

только, как сделать так, чтобы ссылки потом различались? а то ведь стили распложенные прямо в файле имеют приоритет над подключаемыми…

Да но ведь стиль фона и основных шрифтов в дизайне сайта общий ?

а размер ведь разный? или указать размер точно для тех или иных классов? хм... попробую...

Вот, еще в Google Chrome такая проблема: иногда половину CSS грузит...