15 сентября 2006 в 17:08
Имеет ли смысл переносить данные из файла темы css прямо в page.tpl.php, поскольку иногда сталкиваюсь с тем, что сначала загружается страница, а потом css-файл и видно белый фон сине-фиолетовые ссылки (и тд. вы тоже наверное стаким сталкивались на некоторых сайтах)...
или есть решения более грамотные в техническом плане?
Комментарии
Пусть выскажут свое мнение опытные мастера
Но, ведь если CSS файл размером 12 Кб, то если он отдельным файлом, то он грузится только один раз, а потом уж берется из кэша, а если стили прописаны в самой странице, то размер каждой страницы увеличится на эти 12 Кб.
Ну, а теперь надеюсь услышать мнения экспертов.
У меня CSS больше 20 кб.. если вставить в страницу это также плохо скажется на индексации поисковиком..
Советы... купить хороший хостинг и интернет... а вообще есть способ инклудить этот css но как мне кажется получится тоже самое что и просто вставить этот текст в хеадер.. Мне лично пофигу
ну я смотрел методы вставки css в файл: import, rel... но они именно вставляют с опозданием... как сделать так, чтобы они компановались вместе? через include? css прописать как php, а в page.tpl включить
<?php print include_css(); ?>...В частности подсмотрел как подключается один из моих 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">[user=import]import[/user] "/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 всегда открывается нормально... решил посмотреть как у него там всё записано, оказывается всё просто:
<script type="text/javascript"> </script>
[b]Добавлено:[/b]
попробовал у себя также... не получилось...
хм, странно, почему там работает, а у меня нет?
А у тебя случайно этот CSS не огромный, может дело в этом ?
Просто попробуй те стили, которые необходимо загрузить в первую очередь вынести в отдельный маленький CSS и первым грузить его. Т.е. стили фона и т.д.
хм... может...
а стили по порядку загружаются? интересно...
просто в Друпале ведь все классы и идентификаторы разные... как шрифт прописать? хех... для всего body? цвета ссылок можно, конечно...
но они там тоже разные...
7 килобайт - это огромный?
Ну положим и не огромный, а даже весьма скромный, особенно учитывая что странички с microsoft[.]com тянут порой с собой до 50 Кб CSS + столько же js-скриптов.
Но ведь сам говоришь, что заметно в основном только когда весь канал забит и на загрузку странички остается совсем мало, т.е. остается предположим 1-2 Кб/с и это при 7кб = около 4 секунд + еще сама страница с графикой = а кто его знает еще сколько
Тогда просто вставим одной из первой строчек в "node.tpl.php" загрузку CSS файла, в котором определены только цвет фонов и шрифта основных элементов, т.е. например:
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 таблицы стилей подключать? Как-то не совсем правильным мне это представляется...
[b]"Тогда просто вставим одной из первой строчек в “node.tpl.php” загрузку CSS файла"[/b]
...
почему в node.tpl, а не в page.tpl?
...
[b]"Может не стоит всё же именно в node.tpl.php таблицы стилей подключать?"[/b]
...
я тоже думаю, что лучше в page.tpl
...
только, как сделать так, чтобы ссылки потом различались? а то ведь стили распложенные прямо в файле имеют приоритет над подключаемыми...
ссори, насчет node.tpl.php - действительно опечатался, так как печатал по памяти ( а ночью она у меня плохая
Да но ведь стиль фона и основных шрифтов в дизайне сайта общий ?
а размер ведь разный? или указать размер точно для тех или иных классов? хм... попробую...
Вот, еще в Google Chrome такая проблема: иногда половину CSS грузит...