background preloader

Styles & CSS

Facebook Twitter

Responsive Webdesign

Frameworks CSS. Frameworks Sass. Thinkin' Tags. CSS-Tricks. Parallax - Ressources gratuites - tendance webdesign 2014. Vous voulez mettre des effets parallax sur votre site web?

Parallax - Ressources gratuites - tendance webdesign 2014

Voici une liste des meilleures ressources gratuites que vous pouvez utiliser: Tutos, framework,plugins, webdesign, sliders ! Comme vous le savez, cela fait quelques mois que le terme « parallax » a fait son apparition. Le terme Parallax s’applique lorsque divers éléments du site (background, contenu, etc.) bougent avec une vitesse différente, créant ainsi un effet de profondeur ou de décalage. Comme expliqué dans cet article sur les tendances en webdesign en 2014 (et sur plein d’autres sites spécialisés), le parallax design est une des tendances fortes pour le web en ce moment.

Ci dessous vous trouverez une sélection de ressources (frameworks, plugin Jquery, exemples de site et tuto) pour mettre en place un webdesign parallax. Cool Kitten Parallax scrolling Framework J-Invert-Scroll framework Parallax multidirectionnel Slider full page parallax vertical Slider parallax 100% CSS3 – Images Slider parallax – Tout type de contenu. What's The Difference Between Liquid, Elastic, Relative, Fluid, Flexible and Fixed Layouts? And which layout should you choose?

What's The Difference Between Liquid, Elastic, Relative, Fluid, Flexible and Fixed Layouts?

By Christopher Heng, thesitewizard.com One of my visitors recently asked me what the difference between a "liquid" layout, an "elastic" layout and a "fixed" layout was. He happened to be using a web editor that used these terms in its templates list. This article attempts to explain the difference between such words, as well as other terms like "relative", "fluid" and "flexible" often used in articles dealing with web design.

What is a Fixed Layout? A fixed layout in web design is one that uses a unit of measurement that does not depend on other factors, such as the size of the font or the dimensions of the browser window, to determine the width of a web page. An example will hopefully make it clearer. Since the width of the page is fixed, such a layout is called a fixed layout.

What are Relative, Liquid, Fluid, Flexible and Elastic Layouts? A relative layout in web design is one that uses a relative unit of measurement to specify the width of the page. The 30 CSS Selectors you Must Memorize. HTML5 Boilerplate: The web's most popular front-end template. 9 frameworks front end en CSS, SASS et LESS. Aujourd'hui sur le Blog Du Webdesign, découvrez une sélection de 9 frameworks front-end.

9 frameworks front end en CSS, SASS et LESS

Sass Foundation Foundation est sans aucun doute le plus gros Framework front end Sass. A mon goût mieux que Bootstrap, il fournit tout ce dont vous avez besoins : Slide, galerie d'images, formulaires, modals, ... Il est important de noter la possibilité de faire un HTML sémantique, grâces a des mixins qui vont promouvoir vos classes aux rangs des rows et columns que l'on a l'habitude de voir. Cool kitten Cool kitten est un framework responsive pour faire du parallaxe. Inuit Inuit est un framework Sass basé sur la philosophie OOCSS, c'est a dire Object-Oriented CSS. Blueprint Blueprint, peut être le premier "vrais" framework CSS. Stitch Stitch est une bibliothèque de mixins et classes pour Compass géré par la communauté.

Less Bootstrap Bootstrap est peut-être le plus connu des frameworks front-end. Less framework CSS uniquement grumby Un framework CSS léger contruit sur une grille modulable. Maxmertkit. 10 Styles Guides qui donnent des idées pour présenter votre identité visuelle. L'identité visuelle est quelque chose de très important dès que l'on essaye d'imposer une marque.

10 Styles Guides qui donnent des idées pour présenter votre identité visuelle

Graces à quelques couleurs et picots, il sera possible d'évoquer la marque de manière très subtile. Néanmoins, imposer sa marque de cette manière est long et demande de se tenir de manière sans failles au style choisi, ce qui peut être dure, surtout sur un medium evoluant aussi vite que le Web. Dans ces conditions, comment faire en sorte que le style de la marque reste cohérent entre les réalisations des différents acteurs et prestataires ? Grâce à une style Guide très complète ! Le Blog du Webdesign vous propose donc de découvrir 10 Style Guide appartenant à de grands sites web, et en bonus une ressource permettant de générer un Styles guides à partir d'un CSS ! Dropbox SurveyMonkey Disqus. Sizzle JavaScript Selector Library. CSS Frameworks.