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

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

  11. Pingback: Inspirations | Pearltrees

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

  13. Pingback: HTML/CSS | Pearltrees

  14. Patos le fourbe on

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

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

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

  17. Pingback: Création Web | Pearltrees

  18. Pingback: Web - COMMUNICATION | Pearltrees

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

  20. Je confirme les propos d’Arnaud, Bootstrap à des conséquences négatives sur le référencement de site Web !

  21. Pingback: Outils | Pearltrees

Send this to friend

Lire les articles précédents :
fbbaisse
Attention : possible chute des Likes sur les pages Facebook à partir du 12 mars !

Le nombre de Likes sur vos pages Facebook risque de chuter à partir du 12 mars. Voici pourquoi...

Fermer