Html/css framework, что я определенно не пропущу?

Я работаю над небольшой структурой html/css, которую я могу использовать для большинства своих веб-сайтов, по крайней мере, для того, чтобы основываться на ней. Вот что я использовал до сих пор:

CSS framework

Reset.css - Я использую один из них Эрик Мейер, www.meyerweb.com.
Typography.css - Все основные стили типографии для сайта (от blueprintcss.org)
Forms.css - основные стили формы (от blueprintcss.org)
Wireframe.css - Здесь я установил каркас для одного, двух и трех столбцов плюс верхний и нижний колонтитулы. Я использовал метод Holy Grail и реализовал его так, чтобы, установив класс контейнера 'onecolumn', 'twocolumns' или 'threecolumns' в контейнер div Я могу переключаться между тремя.

Основные методы

Некоторые методы У меня есть некоторые предварительные примеры для повторного использования на любом веб-сайте:

Выпадающие меню Suckerfish - Горизонтальные и вертикальные в различных версиях
вкладки "Скользящие двери" - хотя я стараюсь использовать CSS3, где это возможно.

Сценарии

jQuery - я стараюсь использовать его как можно меньше (то есть, если есть css-решения под рукой, например, выпадающее меню Suckerfish и jQ-меню)

Плагины

Пока нет. Вчера я просмотрел css3pie, и это выглядело действительно многообещающим.

Еще посмотреть

То, что я до сих пор не использовал, но может быть интересно, это css и js minifiers. Кроме того, в настоящее время я включаю 5 css файлов, упомянутых выше в main.css с @import, возможно, я должен их автоматически слить, прежде чем загружать?

Также есть CSS-сетчатые системы, конечно. Я никогда их не видел, но, может быть, мне придется попробовать еще раз. Я знаю, что сетка 960 очень популярна, но я не уверен, хочу ли я использовать классы исключительно для разметки (grid_4, column_5 и т.д.). Мне немного нравится <span class="red">, чтобы сделать текст красным, что так же, как плохой, используя встроенный стиль.

Во всяком случае, это всего лишь базовая настройка, и на веб-сайтах, которые еще не включены в эту структуру, много проблем. Итак, , что я должен проверить, чтобы улучшить мои рамки? (Приветствие HTML5 и CSS3, без флэш-памяти: P)

Предложения

Я сделаю список здесь предложений, приведенных ниже, которые я проверю.

Ответ 1

Я настоятельно рекомендую HTML5 Boilerplate

HTML5 Boilerplate является профессиональным Базовый шаблон HTML/CSS/JS для быстрый, надежный и надежный сайт.

После более чем двух лет в итеративном развития, вы получаете лучшее из лучшие практики, запеченные в: кросс-браузер нормализация, производительность оптимизация, даже дополнительные функции как междоменные ajax и flash. стартовый файл apache.htaccess перехватывает вас с кешированием правила и приготовьте свой сайт для обслуживания HTML5, используйте шрифт @font-face и получите ваш zipple gzip включен.

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

Ответ 2

Лучшее, что вы можете сделать, это использовать его. Это единственный способ, которым вы когда-либо собирались создать фреймворк, который сделает все, что вам понадобится. В конце концов, вы не знаете всего, что вам понадобится, пока вам это не понадобится.

Где я работаю, у нас есть наша собственная PHP-платформа, и она была постоянно меняющейся сущностью, где бит добавляется, когда они требуются, потому что они изначально не нужны в спецификации.

Пока у вас есть что-то, что работает для вашего первого проекта, в котором вы находитесь. Просто попробуйте, добавьте к нему, когда вам что-то нужно, и оптимизируйте, где и когда вы можете!

Ответ 3

Если вы просматриваете minifiers, вы, вероятно, захотите запустить свой код через какой-то сборщик script перед тестированием и развертыванием. Если это случай, я бы предложил заглянуть в LESS для вашего css: http://lesscss.org/docs

МЕНЬШЕ - чистая удивительность.

Я не знаю, сколько клиентских сценариев требуется для ваших проектов, но если это что-то обширное, вам может понадобиться использовать что-то вроде M4 или препроцессора С++, чтобы добавить поддержку для include, ifdefs и т.д.... может помочь сохранить ваш код организованным и позволяет поддерживать код отладки, который не отображается в сборке. Этот пост отнимает эту идею до крайности, но может дать вам некоторые идеи.

Из любопытства, какой серверный язык вы используете?

Ответ 4

Капля Сукерфиша.

С ростом числа сенсорных устройств (мобильных телефонов, планшетов) с использованием пользовательских интерфейсов на основе зависания пользователей пользователи просто теряют смысл.

Ответ 5

Не могу поверить, что я забыл (и никто не упомянул) fontsquirrel. Я использовал его для встраивания нескольких шрифтов, и он действительно работает как шарм.

Ответ 6

С точки зрения производительности я бы использовал Compass и SASS со встроенной инфраструктурой BlueprintCSS, в основном она заботится обо всех reset, необходимо отобразить один и тот же крест браузера, вы можете использовать mixins вместо встроенных классов для вашей сетки. И больше всего вы получаете один крошечный файл css, который быстро загружается. Я также использую modernizr, html5boilerplate, селектор CSS-браузера только с serveride php, более быстрый рендеринг. Если ваш разрывается между SASS и LESS, интеграция с Compass + SASS впечатляет. Надеюсь, это поможет!

Ответ 7

зачем создавать еще один, когда их уже так много. Я бы предпочел предложить вам внести вклад в рамки, на которые вы ссылаетесь, если вы чувствуете, что что-то не так или нет. Таким образом, вы также поможете всем, кто уже использует его.

Ответ 8

Я согласен с Алексом здесь, вы должны начать с его использования, это будет гарантировать, что у него есть все, что вы хотите,

и сообщите мне, когда он будет готов к использованию;)

Ответ 9

Технология grid-схемы Blueprint лучше, чем 960gs, на мой взгляд. То, что мне не нравится около 960, состоит в том, что желоба между колоннами образованы двумя "половинными желобами" слева и справа от каждого столбца. Это странно; вы заканчиваете с половинными желобами слева и справа от вашего макета.

Ответ 10

Также существует селектор браузера CSS плагин jQuery. Это использует несколько простых селекторов в вашем CSS, чтобы указать, какой браузер делать:

.ie .myClass
{
   background-color: #f00;
}

.ff .myClass
{
   background-color: #00f;
}

Я использую его на своем веб-сайте, и это гораздо лучшее решение, чем CSS-хаки или Условные комментарии.