Le menu du site d’Apple est un exemple en terme de code propre et sémantique allié à un design impeccable. Avec ce tuto, je vous propose de recréer la barre de navigation du site d’Apple et d’étudier les techniques utilisées.
C’est évident, les boutons sont une part très importante d’un site web: Ils sont en effet la façon la plus commune par laquelle vos visiteurs peuvent déclencher une action et interagir avec le site. Malheureusement, de nos jours encore un nombre important de sites continuent d’utiliser des boutons standard. Voici 10 tutos pour donner à vos boutons, liens et submits la beauté qu’ils méritent.
Les css – feuilles de style en cascade – proposent de très nombreuses possibilités pour le rendu visuel de votre site web. Après mes listes sur les meilleurs scripts Javascript pour sublimer votre site, je vous propose les meilleurs codes css trouvés sur le web. Au menu: Graphiques, coins arrondis, galeries photos…
La technique CSS des sliding doors (portes coulissantes en Français) permet de réaliser des onglets sophistiqués pour vos menus de navigation. Malheureusement, les fonctions de Wordpress wp_list_pages() et wp_list_categories() ne permettent pas de rajouter la balise span nécessaire à la mise en place de cette technique. Nous allons voir comment outrepasser cette limitation.
Il ya quelques temps, j’avais publié deux articles sur des menus de navigation déroulants. Aujourd’hui, je vous propose de créer un menu listant les catégories et sous-catégories, le tout présenté horizontalement.
Les feuilles de style CSS offrent de nombreuses possibilités pour mettre en page votre code HTML. Mais quel développeur ne s’est jamais dit « Dommage qu’un tel attribut n’existe pas en CSS! ». C’est ce que propose MoreCSS, une librairie Javascript vous permettant de disposer de propriétés supplémentaires tels que des pop-ups, des valeurs par défaut ou encore des infobulles…
Mon récent article « Menu de catégories style magazine », que j’utilise notamment pour mon thème OpenBook, à intéressé de nombreux bloggeurs. Toutefois, l’un d’entre eux à souhaité en faire une variante, qui afficherait les pages ainsi qu’un élément « catégories » qui afficherait la liste des catégories disponibles au survol. Voici un petit tuto pour la création de ce menu.
De nombreux internautes ont tendance à imprimer les pages web: Même si la plupart du temps, cela s’avère inutile et pas écolo pour un sou, imprimer une page peu néanmoins s’avérer fort utile. Et dans ces cas là, quoi de plus énervant qu’une page qui s’imprime mal, coupée en deux, avec de grands espaces entre les paragraphes, les bannières de pub en couleurs…
Nous allons nous atteler à la création d’une feuille de style totalement dédiée à l’impression: Grâce à elle, le développeur contrôle ce qui doit être imprimé, et comment.
Depuis la mode du web dit 2.0, les dégradés sont parmis les effets visuels les plus répandus sur la toile. Créer ce genre d’effet n’est pas difficile, mais le procédé est assez lourd: Créer une image dans un éditeur graphique, l’uploader sur le serveur, et enfin écrire une classe css pour mettre le tout en place.
Il existe une alternative, en Javascript 100% non-intrusif, qui permettra à n’importe qui de créer de beaux dégradés sans utiliser une seule image.
Développeurs web et intégrateurs le savent: Faire un site parfaitement cross-browser n’est pas un dîner de gala. Si vous êtes reconnus, vous feriez bien de vous intéresser de près à CSSVista, un éditeur de css avec une particularité extrêmement intéréssante par rapport aux éditeurs wysiwyg classiques: Il permet de visualiser, en temps réel, le rendu sous Firefox et sous Internet Explorer.
