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.

LayoutIt

LaoutIt2

#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.

Paletton

#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).

Fontawsome

#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 »).

Code Jquery Pixabay

#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.

Google Webdeisgn

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


21 commentaires

  1. Pingback: 5 sources d’inspiration pour créer...

  2. Pingback: 5 sources d’inspiration pour créer votre site web (Suite) - Linkeol, L'actualité des entreprises en France

  3. Pingback: Marketing News | 5 sources d’inspiration pour créer votre site web (Suite)

  4. Pingback: Foutoir | Pearltrees

  5. 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 ?

  6. Pingback: 5 sources d'inspiration pour créer votre...

  7. Pingback: Web | Pearltrees

  8. Pingback: 5 sources d’inspiration pour créer votre site web (Suite)

  9. Pingback: 5 sources d’inspiration pour créer...

  10. Pingback: Inspirations | Pearltrees

  11. @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 🙂

  12. Pingback: HTML/CSS | Pearltrees

  13. Pingback: 5 sources d’inspiration pour créer votre site web (suite et fin)

  14. Pingback: 5 sources d’inspiration pour créer votre site web (suite et fin)

  15. Pingback: Création Web | Pearltrees

  16. Pingback: Web - COMMUNICATION | Pearltrees

  17. Pingback: Sources d’inspiration pour créer v...

  18. Pingback: Outils | Pearltrees

Commenter

Ce site utilise Akismet pour réduire les indésirables. En savoir plus sur comment les données de vos commentaires sont utilisées.