39 votes

html / css framework, que ne dois-je absolument pas rater?

Je suis en train de travailler sur un peu de html/css framework que je peux utiliser pour la plupart de mes sites web, à moins d'avoir une base pour construire sur. Voici ce que j'ai utilisé jusqu'à présent:

Framework CSS

  • Réinitialiser.css - je utiliser l'un par Eric Meyer, www.meyerweb.com.
  • La typographie.css - Tous les principaux styles de typographie pour le site (à partir de blueprintcss.org)
  • Les formulaires.css - forme de base des styles (de blueprintcss.org)
  • Fil de fer.css - Ici, j'ai mis en place le fil de fer pour un, deux et trois colonnes, plus un en-tête et pied de page. J'ai utilisé le Saint Graal de la technique, et mis en œuvre de sorte que par la définition d'une classe de "onecolumn', 'twocolumns" ou "threecolumns" à la div conteneur je peux passer entre les trois.

Techniques de base

Certaines techniques que j'ai pré-fab exemples de pour moi de ré-utiliser dans un site web:

  • Suckerfish dropdown menus - Horizontale et verticale dans les différentes versions
  • Portes coulissantes onglets - même si j'essaie d'utiliser CSS3 si possible

Script

  • jQuery - j'essaie de les utiliser aussi peu que possible (c'est à dire, si il y a css solutions à portée de main, comme le Suckerfish dropdown menu vs jQ menus)

Les Plugins

Aucun, pourtant. J'ai regardé dans css3pie hier et il avait l'air réel prometteurs.

Pourtant, à regarder dans

Ce que je n'ai pas utilisé jusqu'à présent, mais peut-être intéressant, c'est le css et le js minifiers. Aussi, actuellement, je comprennent le 5 css fichiers mentionnés ci-dessus dans la main.css avec @import, je devrais peut-être fusionner automatiquement avant que je le télécharger?

Il y a également CSS systèmes de grille de cours. Je n'ai jamais eu le coup de le faire, mais je devrais peut-être donner une autre chance. Je sais que la 960 de la grille est très populaire, mais je ne suis pas sûr si je veux utiliser des classes purement pour le balisage (grid_4, column_5, etc.) Pour moi, c'est un peu comme <span class="red"> de faire un texte en rouge, c'est tout aussi mauvais que l'utilisation de style en ligne.

De toute façon, c'est juste un réglage de base, et il y a beaucoup de problèmes dans les sites web qui ne sont pas encore intégrés dans le présent cadre. Alors, que dois-je vraiment vérifier pour améliorer mon cadre? (HTML5 et CSS3 sont les bienvenus, pas de flash s'il vous plait :P)

Suggestions

Je vais faire ci-dessous une liste de suggestions ci-dessous que je vais vérifier.

11voto

damusnet Points 944

Je recommande fortement le HTML5 Boilerplate

HTML5 Boilerplate est le professionnel badass de base du HTML/CSS/JS modèle pour un rapide, robuste et à l'épreuve du site.

Après plus de deux ans dans itératif développement, vous bénéficiez du meilleur de la les meilleures pratiques de boulangerie en: cross-browser la normalisation, de la performance les optimisations, même en option caractéristiques comme inter-domaine ajax et flash. Un starter apache .htaccess fichier de config crochets vous le fep avec la mise en cache les règles et les préparatifs de votre site pour les La vidéo HTML5, utiliser @font-face, et d'obtenir votre gzip zipple sur.

Passe-partout n'est pas un cadre, ni ne prévoit de philosophie de le développement, c'est juste que certains trucs pour obtenir votre projet rapidement et à droite du pied.

10voto

Alex Points 5999

La meilleure chose que vous pouvez faire est de l'utiliser. C'est la seule façon que vous allez jamais vraiment l'intention de construire un cadre qui est tout ce que vous allez avoir besoin. Après tout, vous ne savez pas tout, il faudra jusqu'à ce que vous avez réellement besoin.

Où je travaille, nous avons notre propre Framework PHP et c'est un contsantly modification de l'entité où les bits sont ajoutés lorsqu'ils sont nécessaires parce qu'ils n'étaient pas à l'origine de besoin dans la spec.

Tant que vous avez quelque chose qui fonctionne pour votre premier projet que vous avez en cours. Il suffit de l'essayer, ajoutez-y lorsque vous besoin de quelque chose, et d'optimiser où et quand vous le pouvez!

4voto

Dagg Nabbit Points 23918

Si vous êtes à la recherche dans minifiers, vous êtes probablement prêt à exécuter votre code à travers une sorte de script de construction avant les tests et le déploiement. Si c'est le cas, je vous suggère de regarder dans MOINS de votre css: http://lesscss.org/docs

MOINS est de la pure awesomeness.

Je ne sais pas combien de script côté client vos projets nécessitent, mais si c'est quelque chose de vaste, vous voudrez peut-être regarder dans l'aide de quelque chose comme le M4 ou le C++ préprocesseur pour ajouter le support comprend, ifdefs, etc... cela peut aider à garder votre code organisé et vous permet de garder le code de débogage, qui n'apparaît pas dans la production de construire. Ce post sorte de prend cette idée à l'extrême, mais il pourrait vous donner quelques idées.

Par curiosité, quel langage côté serveur que vous utilisez?

4voto

TuomasR Points 1548

Drop Suckerfish.

Avec le nombre croissant d'appareils tactiles (téléphones mobiles, tablettes), l'utilisation d'éléments d'interface utilisateur basés sur le survol va faire chier les utilisateurs.

2voto

Stephan Muller Points 8432

Je ne peux pas croire que j'ai oublié (et personne n'a mentionné) fontsquirrel . Je l'ai utilisé pour intégrer quelques polices maintenant et cela fonctionne vraiment comme un charme.

Prograide.com

Prograide est une communauté de développeurs qui cherche à élargir la connaissance de la programmation au-delà de l'anglais.
Pour cela nous avons les plus grands doutes résolus en français et vous pouvez aussi poser vos propres questions ou résoudre celles des autres.

Powered by:

X