Baseline - a designer framework by ProjetUrbain.com “Real” baseline grid on the web When I first started to design Baseline, I wanted to base the grid on the work of Josef Müller-Brockmann, unfortunately some missing CSS attributes — like type leading — kept me from implementing a true grid based approach. I then decided to another look at the basic grid used in print: the baseline grid. Most frameworks and examples of baseline grids simply put the type on a regular line-height, but one problem with this approach is that the text rarely lines up correctly between columns and headlines — H1 through H6. How to use Baseline Baseline can be used in many different ways. Download The .zip file includes the full set of CSS files both for development and deployment, a Photoshop base document and a full set of HTML templates and examples. Going from 0.2 to 0.5 I’ve jumped the version from 0.2 to 0.5 because Baseline is getting closer to be feature complete than what I had anticipated. Known problems and limitations Version history Version 0.5.1
Le référencement Google - Le fichier robots.txt - le .htaccess .htaccess, Meta tags, description, mots clés et robots.txt Date de mise en ligne: 30/04/06 Google ... Un excellent forum sur le référencement des forums phpBB: phpBB-SEO 1)Le fichier robots.txt Si votre site comprend des pages personnelles ou d'anciennes pages sid encore référencées par Google et les autres moteurs de recherches il est possible d'empêcher les spiders de les prendre en compte. Un fichier robots. text vous permet de choisir quels moteurs de recherche seront invités à prendre votre site en considération ou pas. On ne peut pas autoriser les moteurs de recherche un par un, mais on peut autoriser un seul robot à référencer son site ou interdire tel ou tel spider en revanche. 1) Alors un exemple sera plus représentatif qu'un long discours : Je n'autorise que Google à indexer mon site : J'autorise tous les moteurs de recherche sauf Voilà : J'autorise tous les robots : Maintenant prenons l'exemple de Micro-Astuce pour comprendre quelles pages sont indexées ou non Disallow: /
960 Grid System CSS Background Properties Blueprint: A CSS Framework | Spend your time innovating, not replicating Contourner le code CSS avec des hacks - CSS / Firefox, IE6, IE7 Le hack, comme le précise Wikipedia, est un terme employé en informatique pour désigner une analyse de code, parfois une optimisation, pour une meilleure utilisation. Le hack CSS est souvent employé par le webmaster pour s’assurer d’un affichage similaire de son site sur les différents navigateurs. A vrai dire, il s’agit plus de l’utilisation de bugs du navigateur, l’interprétation du code CSS employé, ou de son manque de conformité à la norme CSS. Il ne s’agit pas réellement ici d’une optimisation de code, mais plutôt d’un contournement. Par exemple, quelques lignes de CSS : Affiche le titre (h1) en rouge pour les navigateurs qui respectent au mieux CSS, en vert pour IE6 et en bleu pour IE7. Le seul défaut de cet exemple, c’est qu’il n’est lui aussi pas conforme à CSS. Les erreurs sont signalées ici dans les commentaires respectifs. Dans la même lignée, vous pouvez aussi utiliser : La première ligne définit le titre en noir, la seconde en bleu pour IE6 et IE7, la dernière en vert pour IE6.
Stylish CSS3 progress bars You've seen progress bars everywhere, they are those bars that display the current completion state for a process, such as a download or file transfer. Whether you're building a desktop or a web application, at a certain point, you may need to use this UI element. Having said that, in this article you'll learn how to create stylish and animated progress bars using CSS3. View demo The HTML The markup could not be simpler than that: .progress-bar - defines the general styles for our progress bar..blue - in this case, the blue CSS class add a blue style for the progress bar..stripes - animation type for the current progress bar.span - this will help you filling the progress bar. The CSS General styles for the CSS3 progress bar and filled area: Let's add some color/gradients: Stripes You may have seen this CSS3 technique before, I just adapted it a little for this example: Shine Not sure if this is the best name I could find for this CSS3 animation, but here we go: Glow Hey, what about older browsers?
Le CSS et le HTML Internet est une merveilleuse invention. En apparence simple, elle est pourtant très complexe et aléatoire. Le web, tout comme la majorité des choses sur un ordinateur, est programmé par des suites de caractères qui forment un langage, ou un code. Faisons un exercice simple pour vous aider à comprendre. Dans le cas de Twitter, voici ce que vous verrez apparaître : Vous avez maintenant un aperçu de ce qu'est le codage. Au cours de ce premier module d'apprentissage, vous aurez divers exercices à réaliser pour mettre en œuvre les compétences que vous acquerrez.