Top 10 des ressources gratuites pour créer un site web professionnel

Top 10 des ressources gratuites pour créer un site web professionnel

Créer un site internet au look professionnel est aujourd’hui à la portée de tous. Il vous suffit d’avoir les bons outils,ceux qu’utilisent les professionnels. Chez Orson.io, nous avons mené notre petite enquête auprès des designers pour leur demander leurs 10 ressources et sites internet préférés pour créer un site internet digne de ce nom.

Nous vous dévoilons notre sélection d’outils pour faire un site web design et au look professionnel. Ces logiciels sont tous gratuits et entièrement en ligne.

Des images pour un site pro

Les images sont essentielles à la qualité d’un site internet professionnel. Depuis 3 ans, de nombreux sites proposent des photos de qualité HD prises par des photographes amateurs et professionnels. Ces photos sont entièrement gratuites et libres de droit. Le rêve!

Unsplash:

Unsplash : ressource image pour site web
https://unsplash.com/

Le site internet de référence pour trouver l’image de ses rêves. 240 000 photos de qualité professionnelle accessibles à tous, avec une licence qui vous permet de faire vraiment ce que vous souhaitez des photos, sans avoir besoin de payer le photographe.

Dans l’idée, c’est tout de même plus propre et plus juste de créer un lien vers le profil du photographe dans les mentions légales par exemple. Unsplash est le premier site internet à avoir proposé des photos gratuites libres de droit et toutes les photos sont vraiment d’une qualité incroyable.

Conseils du logiciel Orson.io:

Le site internet est entièrement en anglais donc faites vos recherche directement dans la langue de Shakespeare.

Si vous ne trouvez pas de photos en lien avec vos mots clés, faites des recherches avec des mots plus génériques.

Nouveauté: Vous avez accès dorénavant à des collections, des sélections de photos par thématique réalisées par les utilisateurs. Très pratique lorsque vous faites un site internet sur un sujet précis.

Visual Hunt:

Visual Hunt ressources photo pour site web

https://visualhunt.com/

Visual Hunt est le site internet qui agrège l’ensemble des sites de photos libres de droit. Il rassemble en effet près de 354 millions de photographies qui sont 100% gratuites.
Important, vous pourrez trouver des photos pour lesquelles le photographe n’a pas cédé les droits pour un usage commercial.

Il faut donc bien faire attention, lorsque vous sélectionnez une photo, de trouver la mention à droite dans le libellé vert: “Commercial use OK”

Vous allez pouvoir chercher les photos par photographes, ce qui vous permettra d’avoir des photos cohérentes lorsque vous allez construire votre page web.

Conseils du logiciel Orson.io:

Lors du téléchargement de la photo, vous allez pouvoir télécharger la taille de l’image optimale pour votre site internet. La taille de l’image est essentielle pour optimiser le temps de chargement de votre site web et le référencement naturel.

Des icônes pour un site classe

Dans les contenus visuels, vous avez les images mais également les icônes qui vous permettent d’illustrer rapidement votre contenu texte. Nous allons vous proposer 3 ressources qui vous offriront des icônes de pro gratuites par thématique.

Fontawesome:

FontAwesome : Ressources icônes pour site web

http://fontawesome.io/icons/

Font Awesome est le 1er site internet à avoir proposé une collection d'icônes libres de droit sous forme de police, de typographie. Très pratique à intégrer lorsqu’on fait son propre site internet puisque vous allez pouvoir l’intégrer en un ligne de code.

A la clé, près de 675 icônes à votre disposition rangées par catégorie:

  • transports,

  • application Web,

  • interface,

  • sport,

  • réseaux sociaux.



Chaque icône est dessinée par des pro avec le même soin et le même style. C’est un vrai avantage lorsque vous souhaitez créer un site internet professionnel avec une cohérence graphique globale.

Conseils du logiciel Orson.io:

Vous allez pouvoir changer la taille et la couleur des icônes en quelques clics.
La typographie Font Awesome permet également un temps de chargement rapide par rapport à des icônes dans le format image.

IconMonstr:

IconMonstr : Ressources icône pour site internet

https://iconmonstr.com/

3 825 icônes rangées dans près de 262 collections sur IconMonstr. Vous allez trouver votre bonheur sur ce site d'icônes présentées uniquement en noir. Vous allez pouvoir télécharger directement les icônes au format SVG, EPS, PSD ou PNG pour ensuite modifier la couleur, si vous le souhaitez.

Conseils du logiciel Orson.io:

Les icônes sont toutes libres de droit, vous pouvez les utiliser à des fins commerciales sans aucun problème.

 

Tester Orson gratuitement

 

Iconstore:

Iconstore : Ressources icônes

https://iconstore.co/

Pour terminer cette sélection, le meilleur site web pour les icônes: Icon Store. Si vous cherchez des icônes plus détaillées, plus raffinées, vous allez trouver sur Icon Store une sélection d’icônes par catégorie dessinées et élaborées par des designers professionnels. Chaque sélection rassemble entre 10 et 100 icônes sur une thématique très précise: noël, Star War, business, planètes.

Ces sélections sont suffisantes pour faire des sites internet sur une thématique précise. De très belles icônes réalisées par des designers qui permettent de donner une réelle pâte graphique.

Conseils du logiciel Orson.io:

Utilisez de préférence les icônes d’une même sélection et évitez de mélanger des illustrations qui ont des styles graphiques différents.

Des vidéos pour un site web moderne

Pixabay:


Pixabay : Ressources viéos pour site web

https://pixabay.com/en/videos/list/

Après les images et les icônes, le dernier né des contenus visuels à la mode, les vidéos.
Les vidéos sont non seulement plébiscitées par internet et les réseaux sociaux (Facebook) mais également par les utilisateurs.

Pixabay est la référence pour trouver des vidéos libres de droit et gratuites pour créer un site internet professionnel. Toutes les vidéos sont optimisées pour être légères en terme de poids pour un chargement optimal sur votre site web.

Conseils du logiciel Orson.io:

Ne pas mettre plus d’une vidéo qui se lancent automatiquement sur une page web et préférez des vidéos courtes qui bouclent. Elles pèseront moins et ne bloquent pas le chargement de vos pages web.

Sur la version mobile de votre site internet, pensez bien à désactiver les vidéos. Elles sont encore mal supportées sur mobile et vos pages auront du mal à se charger avec une connexion 3G.

Outils de compression pour un site léger

Pourquoi parler d’un outils de compression d'images dans une liste de logiciels pour faire un site internet professionnel ?

Le temps de chargement est un critère majeur dans l'algorithme de Google. Le géant américain souhaite rendre les sites internet du monde entier plus rapides et accessibles au plus grand nombre.
Le temps de chargement, qui doit être inférieur à 2 secondes, devient important lorsque vous avez beaucoup d'images sur votre page web et beaucoup de photos non compressées.

Lorsque vous créez votre site web, pensez bien à compresser vos images avant de les télécharger sur votre site internet.

Tiny PNG, Tiny JPG:

Ressource de compression d'images pour site web

https://tinyjpg.com/ et https://tinypng.com/

Tiny PNG et Tiny JPG vous permettent en deux clics de compresser vos photos avec un rapport qualité poids aux petits oignons.

Le résultat est impressionnant. Il peut diminuer jusqu'à 80% le poids d'une photo en provenance de Photoshop sans dégrader la qualité.

Rien de plus simple: téléchargez vos images une par une ou en masse. Vous pouvez également glisser et déposer directement vos fichiers depuis votre ordinateur ou votre Mac. Cliquez, attendez la fin de la compression et téléchargez vos photos compressées.

Des couleurs pour un site harmonieux

Les images, la typographie ou police et les couleurs sont les trois critères qui rendent un site joli ou non. Concernant les couleurs, nous avons tous tendance à vouloir trop en mettre.
En réalité, le bon nombre de choix de couleurs principales pour créer son site internet est de 2.

Une couleur principale pour vos boutons, vos liens et une couleur secondaire. Restez sobre sur la couleur des textes et des titres pour une meilleure lisibilité pour vos lecteurs.

Les logiciels en ligne qui suivent présentent un intérêt majeur dans le cas où vous n'avez pas encore de charte graphique.

Adobe Color

Abode Color : Ressources couleurs pour site internet

https://color.adobe.com/

Vous vous dites parfois lorsque vous voyez deux couleurs qu'elles vont bien ensemble sur des vêtements ou dans une maison. Ce n'est pas le fruit du hasard. L'outils Adobe Color va vous permettre, à partir d'une couleur principale, de trouver les couleurs complémentaires et ce, de manière scientifique à partir du cercle chromatique des couleurs.

Sélectionnez une première couleur, vous allez pouvoir rentrer le code HEXA si vous en avez un. Et ensuite, vous avez plusieurs filtres à gauche pour vous permettre d’afficher les couleurs secondaires ou tertiaires optimales. Très visuel et fonctionnel.

Conseil du logiciel Orson.io:

1 ou 2 couleurs principales sont suffisantes pour rendre un site joli, moderne et professionnel.

Color Hunt:

Color Hunt : Ressource couleur pour site internet

http://colorhunt.co/popular

Color Hunt est le site internet par excellence pour trouver des inspirations de couleurs et de palettes de couleurs. Les palettes de couleurs sont classées par popularité en fonction du nombre de likes des utilisateurs. C’est un site web collaboratif qui vous permet également, si vous le souhaitez, de créer et de publier votre palette à la communauté.

http://colorhunt.co/create

Avantages: Les palettes de couleurs sont bien présentées et visuelles, ce qui permet de parcourir rapidement les palettes et de faire son choix rapidement.

Des polices pour un site personnalisé

Lorsque vous créez un site internet professionnel, le choix de la police ou de la typographie va déterminer le style et le design de votre site web.

Google Fonts

Google Fonts : Ressource police pour site web

https://fonts.google.com/

La référence gratuite en matière de polices et de typographies. Google propose près de 821 polices gratuites qui vont vous permettre de personnaliser votre site web en quelques clics.
L’interface est vraiment conçue pour vous aider à comparer simplement les différentes polices.


Vous allez pouvoir appliquer le texte de votre choix pour avoir un rendu avec l’ensemble des typographies présentes sur la page web. Les filtres à droite sont pratiques pour faire des recherches de polices plus avancées. Lors de la sélection de vos polices, vérifiez bien que les polices sont accessibles en Latin, pour les accents notamment.

Conseils du logiciel Orson.io:

Lorsque vous allez choisir une police, vous allez accéder au système de “Pairing” du logiciel qui va vous conseiller sur les polices qui s’accordent bien avec la police que vous avez choisi.

Les conseils sont basés sur les statistiques de Google Fonts concernant l’utilisation de leur police. Un comptage est fait pour toutes les typographies utilisées lors de la création de site internet. Le pairing tombe juste. Vous allez pouvoir cliquer directement sur la police pour prévisualiser le couple de polices associées.

Typefont:

Typefont : Ressource typographie pour site

https://typekit.com/fonts?collection=trial

Typefont est le site internet de polices de l’éditeur de logiciel américain Adobe qui détient en autre Photoshop ou Illustrator. TypeFont propose des typographies différentes et offre près de 950 polices gratuites.

Quelques restrictions, un plafond de 25 000 pages vues / par mois pour un seul site internet et une limite à 2 familles de police par site web.

C’est largement suffisant pour l’usage normal d’un site vitrine ou un site marchand professionnel.

Des fonctionnalités de recherche très proches de celles proposées sur Google Font pour rechercher la typographie de vos rêves par graisse de la police, typologie (Serif, Sans Serif).

Lors de la sélection de vos polices, vérifiez bien que les polices sont accessibles en Latin pour les accents notamment.

Pas de propositions malheureusement de pairing de police avec Type Font mais ne vous inquiétez pas nous avons la solution.

http://typ.io/samples

Voici un site d’inspiration qui recense les plus beaux sites internet qui utilisent des polices TypeFont pour vous aider à sélectionner vos polices. Vous allez pouvoir également filtrer par police pour voir en vrai sur un site internet professionnel, le rendu des polices TypeFont.

De l'inspiration pour un site moderne

Comme disait Pablo Picasso: « les bons artistes copient, les grands artistes volent ». Cette citation s’applique également dans le monde de la création de site internet.

Créer un site internet à partir d’une feuille blanche n’est pas donné à tout le monde, voici des sites web qui vous donneront de l’inspiration en cas de blocage.

Site see:

Sitesee est un site internet de curation de sites internet beaux et modernes.
Vous y trouverez une sélection hebdomadaire de sites internet professionnels au design soigné. Vous pouvez contribuer en proposant des sites web.

https://sitesee.co/

Landingfolio:

Landingfolio est un site internet qui recense une sélection des meilleures landing pages. Les landing pages sont des pages d’arrivées, optimisées pour la conversion donc en principe efficaces.

http://www.landingfolio.com/

Vous venez d’avoir accès à notre liste secrète d’outils en ligne indispensables pour créer un site professionnel digne de ce nom. Vous avez aimé? Partagez au plus grand nombre en cliquant sur les boutons à droite. Ce sera notre plus beau cadeau de remerciement.

J'ai également rédigé un guide complet sur la création d'un site internet professionnel qui devrait vous intéresser. Enjoy !

Nouveau guide gratuit. Votre site est-il efficace ?

Tsi-Fei Chan

Tsi-Fei Chan

Tsi-fei is the Co-Founder of Orson.io and has a passion for digital marketing, GrowthHacking and SEO. You can find him at @tsifeichan

Plus de conseils pour créer un site efficace

Comment avoir plus de visiteurs sur mon site internet ?

Votre site internet semblait vous donner satisfaction. Le design plait, il a été créé par des professionnels du web, ils ont passé du temps à rédiger des contenus, mais voilà, il n’est quasiment pas visité.

Lire la suite

Passer son site web en HTTPS? Pourquoi et comment en 10 étapes [Infographie]

Vous êtes nombreux à vous interroger sur les impacts du passage d'un site internet HTTP en HTTPS.  Nous allons tout vous expliquer et vous livrer les bonnes pratiques et les erreurs à éviter lors de toute migration de votre site web vers le...

Lire la suite

Comparer différents logiciels de création de sites internet

 Vous voulez créer un site internet ou refaire un site web existant.

Lire la suite

Scribing sur la création de site internet

Hier soir, nous animions notre workshop mensuel (gratuit) sur la création de site internet . Nous avons accueilli une cinquantaine d'entrepreneurs surmotivés !

Lire la suite