• 0k
  • 0
Web design \ 19 Mai 2014

5 nouveautés pour dynamiser votre design

Il fut un temps où il nous était impossible de survivre sans ordinateur sur le Web. Aujourd’hui nos chers PC et Mac se voient voler la vedette par les Android et iChoses devenus incontournables pour la génération 2.0, une génération mobile et à l’affut des innovations technologiques.

Résultat, le Web devient progressivement Mobile. Pour prendre un exemple proche de nous ; les prévisions du Mobile en France sont sans équivoque : plus de 50% de nos concitoyens sont d’ores et déjà des mobinautes, sans parler des ventes de smartphones et tablettes qui, d’après les estimations, continueront d’augmenter exponentiellement en 2014 (17,5 et 8 millions respectivement contre 3.7 pour les ordinateurs portables).
En conséquence, les web designers retroussent leurs manches afin de créer des sites « adaptatifs » (ou responsive dans la langue de Mickey) et se plient aux attentes des mobinautes. Ces surfeurs sont habitués à une navigation verticale (voir long scrolling) simplifiée où les textes disparaissent au profit de visuels souvent dynamiques. Qui ouvre un nouvel onglet en 2014 ?

Si créer un site avec Wix est un jeu d’enfants, le propulser sur la Toile n’est pas une mince affaire. Afin de captiver les Internautes, il est nécessaire de rendre votre site toujours plus attractif et dynamique. Les 5 fonctionnalités ci-dessous, ont été conçues pour vous aider à y parvenir :

5 ampoules de couleur

Ancres

Les ancres vous permettent d’intégrer des liens internes de navigation sur certains éléments de vos pages Web. En français maintenant : l’icône  « retour en haut de page » qui permet de remonter en cliquant dessus à l’entête du site, est un bouton qui renvoie vers l’ancre située en haut de la page.
Particulièrement pratique pour les sites utilisant le long scrolling, cet outil permet d’orienter le visiteur plus facilement, de rendre votre design plus dynamique et d’apporter une touche sophistiquée à votre site. Jetez l’ancre et faites cap sur un site dans le vent.

Vous souhaitez en comprendre le fonctionnement ? Cliquez ici.

Exemple : Ignasi Montréal en fait usage sur le menu de son site d’une page :

Ignasi Monreal Illustration

Animations

Les animations ont disparu du Web ces dernières années. Et pour cause, certains web designers trop créatifs les utilisaient sans vergogne et donnaient naissance à des sites survoltés et impraticables – au désespoir des Internautes et pour le plus grand bonheur des opticiens. Ces effets sont revenus sur les écrans avec le parallaxe scrolling. Cette tendance consiste à animer le site à mesure du défilement afin de mettre l’accent sur certains éléments spécifiques. Bien entendu, utilisées judicieusement les animations captivent l’attention de vos visiteurs et donnent un nouveau souffle à votre design.
Cliquez ici pour apprendre les utiliser. Notez que nous ne prenons aucune responsabilité sur les effets secondaires que pourraient provoquer le design atroce du lien précédant.

Exemple : Le créateur du site ci-dessous a su les utiliser à son avantage :

Fionaphotobreizh

Bouton image

Cette nouvelle fonctionnalité vous permet de créer un bouton à partir d’une image (surprenant n’est-ce pas ?). Le petit plus : le bouton change de couleur au passage de la souris et après clic. Cet outil interactif  oriente plus efficacement vos visiteurs sans pour autant détourner leur attention. Un petit changement qui aura un impact majeur sur votre taux de conversion.
Pour en intégrer un, rendez-vous sur l’éditeur, cliquez sur Ajouter → Boutons & Menus → Bouton Image.

Exemple : le site WebKiss – qui est, soit dit en passant, absolument remarquable – utilise le bouton image avec beaucoup de brio.

WebKiss Méthodes et Web Révolutionnaires pour les Entrepreneurs

Galerie diaporama bande

La galerie diaporama bande vous permet d’afficher des images sur toute la largeur de votre site. Idéale pour séparer votre page par catégorie, elle met en valeur vos visuels de façon dynamique et avec beaucoup de charme. En sélectionnant l’effet de transition, vous pouvez animer votre galerie de sorte qu’elle se fonde parfaitement dans votre design. L’option de transition « Zoom » rendra votre site plus attractif visuellement sans affecter son rendu. Difficile de faire plus efficace.
Pour ajouter cette galerie, rendez-vous sur l’éditeur cliquez sur Ajouter → Galerie → Diaporama Bande

Exemple : l’Agence Design + met en valeur ses créations grâce à cette galerie.

Agence Design +

Galerie aléatoire

Ne laissez pas son nom arbitraire vous induire en erreur. Cette galerie permet à vos visiteurs de déplacer vos images comme ils l’entendent et de jouer avec leurs dimensions afin de parcourir votre sélection de façon complètement interactive. Présenter vos produits et travaux avec cet outil vous aidera à vous démarquer visuellement et vous permettra d’offrir une expérience unique à vos visiteurs. Quand on parle business, on ne peut rien laisser au hasard.
Pour ajouter cette galerie, rendez-vous sur l’éditeur cliquez sur Ajouter → Galerie → Aléatoire

Exemple : découvrez cette galerie sur le site du photographe Vincent Cros. Profitez-en pour parcourir ses superbes travaux.

Vincent Cros Photographe


Recevez le
par e-mail !

Rejoignez le blog de Wix Ne manquez rien de notre actu !

Hmmm, that's not a valid email address.

Hmmm, that's not a valid email address. Email already exists

Hmmm, that's not a valid email address. Invalid email

Rejoignez-nous ! \ 

Découvrez nos conseils en web design, en marketing digital,
et suivez toute l'actu Wix ! Pas de spam. Promis.

Hmmm, that's not a valid email address.

Hmmm, that's not a valid email address. Email already exists

Hmmm, that's not a valid email address. Invalid email