Passer au contenu

5 sources d’inspiration pour créer votre site web (Suite)

D’autres astuces pour vous aider dans la création d’un site web, d’un blog ou de votre portfolio.

#1 Utilisez-vous Bootstrap ?

Certains n’aiment pas trop l’utilisation du framework Bootstrap. Cependant, il est indéniable que si vous souhaitez créer un site rapidement et qu’il soit « responsive », Bootstrap fait partie des outils qu’il vous faut.

Lorsqu’on développe un site, on part souvent d’une esquisse de la disposition des grilles du site. Bien entendu, vous pouvez utiliser un crayon et une feuille de papier. Sinon, vous avez aussi LayoutIt, qui permet de placer (imaginer) ces grilles en quelques glisser-déposer et même de récupérer le code correspondant.

#2 Les couleurs

Si comme moi, vous êtes plus codeur que designer, vous avez peut-être aussi du mal à choisir des couleurs qui vont ensemble. Pour vous aider, vous pouvez essayer Paletton (ou « Color Scheme Designer ») qui permet de trouver des combinaisons de couleurs qui peuvent aller ensemble, via une interface assez intuitive.

#3 Les icones

Dans le précédent article, j’avais évoqué la bibliothèque d’icônes du Material Design (Google). Mais si ceux-ci ne vous ont pas convaincu, vous avez également les Glyphicons de Bootstrap ainsi que les icônes disponibles sur fontawesome.io. Bien entendu, il ne s’agit pas des seules sources d’icônes (si vous en connaissez d’autres, n’hésitez pas à les évoquer dans les commentaires).

#4 Des animations

Lorsque vous avez imaginé (par exemple) votre portfolio, vous n’avez peut-être pas songé à y inclure des animations (Javascript, JQuery, etc.). Mais après avoir jeté un œil sur l’incroyable liste d’animations (150 en tout) qui a été créée par nos amis de bypeople.com, vous serez peut-être tenté d’en insérer une ou deux. Et mieux encore, il y a des liens pour récupérer du code ou voir des tutos (si cela ne vous tente pas de « réinventer la roue »).

#5 Web Fundamentals by Google

Pourquoi parle-t-on de ça ici ? Comme vous le savez peut-être déjà, Google a récemment annoncé que l’algo de son moteur de recherche tiendra bientôt compte du label « Mobile-Friendly ». Pour faire simple, si votre site n’est pas adapté aux écrans de smartphones, vous risquez d’être rétrogradé sur les résultats de recherche. Et justement, sur Web Fundamentals, la firme de Mountain View énonce quelques « bonnes pratiques pour le développement web moderne ». Vous y trouverez également un lien vers l’outil Web Starter Kit, un genre de Bootstrap signé Google.

Cet article est la suite de 5 sources d’inspiration pour créer votre site web.

📍 Pour ne manquer aucune actualité de Presse-citron, suivez-nous sur Google Actualités et WhatsApp.

Opera One - Navigateur web boosté à l’IA
Opera One - Navigateur web boosté à l’IA
Par : Opera
21 commentaires
21 commentaires
  1. J’aurais aimé comprendre la phrase : “Certains n’aiment pas trop l’utilisation du framework Bootstrap”.
    On peut savoir ce que les gens reprochent à Bootstrap ? Il est rapide et l’approche CSS me semble pertinente. Des arguments inverses ?

  2. Des adresse bien utiles quand on a des trous en pleine création…

    Pour ma part j’utilise beaucoup “fontawesome.io”… 🙂

    Si ça peut aider, je travaille beaucoup avec “http://codepen.io/” très complet

  3. @Arnaud je trouve personnellement que Bootstrap implique d ajouter pas mal de code html, ce qui dégrade le ratio texte/code d une page web, et donc peux avoir des conséquences négatives sur le referencement.
    Je trouve également qu’il manque un ou plusieus points de rupture, au niveau du responsive, sur les basses résolutions.
    Après, j’utilise quand même pas mal Bootstrap. Pour développer rapidement des pages web responsives et sympas ergonomiquement parlant, il est tout de même bien pratique 🙂

  4. “Certains n’aiment pas trop l’utilisation du framework Bootstrap” : certains ou seulement l’auteur de ce billet par ailleurs bien utile ?

Laisser un commentaire

Votre adresse e-mail ne sera pas publiée. Les champs obligatoires sont indiqués avec *