Online Web Tutorials

Aller au contenu
| Aller au menu
| Aller à la recherche

Sliloo.com

sliloo est une communauté dédiée à la conception de sites web de qualité, notamment grâce aux standards W3C, aux feuilles de styles CSS, aux langages HTML et XHTML, PHP,JAVASCRIPT,....et à l'accessibilité...

jeudi, mai 6 2010

Opquast 2010 est en ligne

Après plus d'une année d'effort (et de discussions acharnées lors des appels à commentaires), l'équipe de Temesis vient de mettre en ligne la version 2010 du projet Opquast.
Au centre de cette refonte majeure se trouvent 217 bonnes pratiques triées sur le volet. Elles sont présentées dans un site dédié au style sobre et épuré imaginé par Aurélien Lévy :

mercredi, mai 5 2010

Menu Horizontal multievel Apple en ccs3

Le tutoriel CSS d’aujourd’hui s’intitule « Comment créer un menu horizontal en CSS3 comme Apple« . Depuis que je me suis intéressé au développement de thèmes wordpress, et à la conception de ce thème (ainsi que mon thème gratuit à télécharger), le CSS3 est entré dans ma vie. Sa puissance est incroyable, sa légèreté dépasse tout ce qu’on a pu coder jusqu’à présent, à l’instar de ce menu horizontal imaginé par Web Designer Wall.


lundi, mai 3 2010

Les ombrages en CSS3

Grâce à des propriétés telles que box-shadow, text-shadow  et border-colors, les feuilles de style offrent la possibilité de créer des ombrages sur les différents éléments de votre page sans nécessiter d'image décorative et de découpes intempestives.
Tout n'est pas rose puisque certains navigateurs à la traîne ne reconnaissent pas encore ces différentes propriétés et nécessitent des adaptations personnalisées. Faisons le tour du propriétaire... Box-shadow

Opera propose un émulateur pour Opera Mobile

On connaissait déjà l'émulateur d'Opera Mini. Voici qu'Opera, un mois après la sortie d'Opera Mobile 10 en version finale, vient de mettre à disposition des développeurs et intégrateurs Web un émulateur d'Opera Mobile 10.

samedi, mai 1 2010

HTML5 et CSS3

Après une excitante présentation de ce que nous réserve CSS3 et une introduction à HTML5, les concepteurs web sont de plus en plus curieux de savoir si l'on peut d'ores et déjà créer un site décent à l'aide de ces technologies passionnantes. La question en substance : "peut-on concrètement faire du HTML5 et du CSS3 en 2010 ?", la question subsidiaire - inévitable - "...et que faire des anciens navigateurs ?". Vous l'avez deviné, le but de cet article est de répondre positivement à la première question et de proposer des solutions à la seconde.

samedi, avril 24 2010

les selecteurs à css3

La négation pseudo-classe,:not (X), est une notation fonctionnelle de prendre un [sélecteur simple ...] comme un argument. Il représente un élément qui n'est pas représenté par l'argument.

Ce qu'elle dit ici, est que d'un sélecteur avec un :not () en lui versera tous les éléments qui ne correspondent pas à ce qu'il ya entre les parenthèses.

jeudi, avril 22 2010

Travailler avec les couleurs RGBA

Les objectifs clairs était d'avoir un style graphique sans les lourdes pages avec beaucoup d'images. Quand nous avons lancé, beaucoup de gens ont été surpris que le design n'a pas été construit avec PNG. Au lieu de cela nous avions utilisé les valeurs de couleur RVBA, qui fait partie de la spécification CSS3. Partager

mardi, avril 20 2010

Une «classe conditionnelle» pour IE 6 et 7

Les cancres du Web, Internet Explorer 6 et 7, nous mènent parfois la vie dure. Même quand on s’abaisse à leur niveau, il leur arrive de ne pas comprendre, ou d’y mettre de la mauvaise volonté. C’est qu’en plus d’être limités, ces deux navigateurs ont parfois des réactions bizarres. Heureusement, IE8 corrige largement ces problèmes. Mais comment gérer le cas Internet Explorer 7 quand modifier légèrement les styles appliqués à tous les navigateurs ne suffit pas? Ou pire encore, gérer les multiples bugs d’IE6 (si vous en assurez encore le support)? La solution classique (comprendre: à l’ancienne) est d’utiliser des hacks CSS. Ces derniers sont déconseillés car peu fiables; en effet, on ne sait jamais à l’avance quels seront les navigateurs sur le marché dans deux ou cinq ans, et comment ils comprendront ou pas nos hacks CSS. Une deuxième solution, conseillée par Microsoft et Alsacréations (que du beau monde :)), est d’utiliser les commentaires conditionnels. Nous allons voir dans cette article que l’utilisation habituelle des commentaires conditionnels a quelques désavantages, et proposer une technique qui combine le meilleur des deux mondes: commentaires conditionnels pour cibler Internet Explorer, et quelques hacks CSS pour cibler des versions particulières.

lundi, avril 19 2010

Coverflow construction Avec les CSS Transforms

Alors que je regardais toutes les belles choses les gens de  WebKit, et une particularité vraiment sa place dans mes pensées, et je jouais avec usecases possible pendant des semaines .. Je parle de la CSS transforms.

samedi, avril 17 2010

Créer des coins arrondis en CSS et sans images

Vous voulez arrondir les angles d'un élément sans déconner avec des images et CSS délicate? Vous pouvez le faire avec CSS pur, mais, bien sûr, cela ne fonctionnera pas dans Internet Explorer. (Ou Opera, pour cette question.) Heureusement, l'effet est dévolue gracieusement. 

vendredi, avril 16 2010

Creations Des onglets de navigation en utilisant CSS3

Bien que je ne comprends pas pourquoi les animations ont été ajoutées dans CSS3, cette norme à venir ne sont quelques fonctionnalités très soignées ajouté à la CSS que nous utilisons aujourd'hui. Je voulais prendre un couple de ces nouvelles choses, et de créer un Sweet onglets de navigation en utilisant CSS3.

Nous voulons faire des éléments 3D sans images

Dans ces tutoriaux, nous avons appris comment réaliser un joli ruban et 3D jouer avec l'ombre portée dans Photoshop pour simuler la profondeur dans une mise en conception de sites Web. Il s'agit d'une tendance généralisée à la conception web récente: la création d'une perception 3D dans un site Web et la simulation d'un «monde» en trois dimensions sont deux excellentes façons pour les concepteurs de jouer avec leurs compétences. 

Merci à utiles logiciels graphiques (2D), on peut facilement créer des éléments 3D, comme des rubans et des ombres, mais nous pouvons aussi reproduire la scène en 3D en utilisant la perspective, l'accent de couleur d'ombrage, et l'opacité. Il ya aussi la possibilité d'utiliser des logiciels 3D, comme Blender, pour créer des objets 3D et des images que nous pouvons utiliser dans nos conceptions. Il ya un article intéressant sur CreativityDen sur les moyens fondamentaux de la profondeur, dans les travaux de conception web, il explique six techniques de base afin de simuler la perception 3D dans nos travaux et je propose une lecture attentive. 

De nombreux sites web  ont un merveilleux équilibre, la perception en trois dimensions et il est clair que ce genre de mises en usage, d'une manière intelligente, les images (en général dans la propriété background), des lignes et des techniques CSS pour créer l'illusion de la profondeur .

Ci-dessous quelques exemples.

jeudi, avril 15 2010

+40 logos d' entreprise

 Comme je l'ai écrit précédemment dans quelques postes sur les logos, les logos sont ce que représente votre entreprise, produit, entreprise ou vous-même. Ils sont le principal moyen de communiquer au monde la personnalité de votre entreprise, l'identité, l'essence, et l'individualité. Il existe deux types de logos: les logos sont logomarks reposant sur des symboles et des logos qui sont constitués de la typographie artiste. Celui-ci est devenue plus en plus populaire avec l'explosion de la conception fonctionnelle, intelligent, simple et graphique. Mais, quel que soit le type de logo, il est, il doit se conformer à certains éléments essentiels qui font un logo exceptionnelle, et ces éléments doivent être pris en compte dans la planification et l'exécution de processus de conception de logo. Un logo réussi doit englober ces éléments afin de bien faire son travail. Il s'agit d'une rafle de la belle et incroyablement maline logos typographiques pour votre inspiration. S'il vous plaît n'hésitez pas à commenter, nous tweet, ajouter vos favoris, ou acheminer cette annonce à vos amis!

mercredi, avril 14 2010

Ajax avec jQuery 1.4 et CSS3

Organiser le contenu d'une page , est un role  de conception web moderne. Un principe qui a été autour depuis un certain temps divise le texte en onglets. Cela vous permet de presser beaucoup plus de contenu dans un espace apparemment limitées et fournir un moyen structuré d'y accéder.
Aujourd'hui nous faisons une page de l'onglet AJAX avec CSS3 et la nouvelle version 1.4 de jQuery libérés, alors n'oubliez pas de télécharger l'archive zip à partir www.jquery.com et passez à l'étape un.

lundi, avril 12 2010

+50 Ressources utiles pour les concepteurs et développeurs Web


Voici une liste de plus de 50 outils et ressources qui peuvent vous être utiles dans votre développement web et de design. Nous savons tous que nous les développeurs Web et les concepteurs sont très occupés et souvent surchargés de travail! Par conséquent, il est important d'utiliser des outils et des ressources pour nous aider à travailler beaucoup mieux et plus efficacement. Ces outils non seulement de rendre notre travail plus facile, mais ils ont  ainsi d'améliorer la qualité de notre travail . Mon espoir est de compiler un répertoire web approfondies avec le plus grand nombre d'outils et de ressources utiles que possible! S'il vous plaît aider  nous à rendre ce répertoire fonctionnelle et globale en partageant vos propres outils et des ressources utiles dans les commentaires à ce poste. Amusez-vous!

page 1 de 2 -