Créer un site Design

Spécial designer débutant, créez gratuitement votre design et votre site pro sans recourir à une Agence Web. SiteW est l'outil idéal de création de site pour créer votre site à partir de vos designs, aussi facilement que les logiciels d'images que vous utilisez et sans connaissance en programmation Web.

Voici des exemples de sites qui ont été créés en suivant les principes de ce guide :

site design personnalise

1. Créer un site en essai gratuit

La création du site design commence par le choix d'un nom et d'une adresse Internet pour le site Web. Pour créer notre site design, nous allons utiliser un design sobre et sans fond, que vous ne pouvez pas directement choisir depuis l'étape d'inscription. Vous pouvez donc laisser le design choisi automatiquement. Enfin, choisissez la création d'un site en essai Premium ou Pro. Ceci nous permettra de choisir le design Unicolor disponible uniquement pour les sites Pro et Premium.

2. Choisir le design Unicolor

Le design Unicolor est un design qui ne contient pas d'élément graphique et qui vous permet de choisir un fond de couleur parmi les 250 proposés. La couleur choisie sera également reprise dans les styles des textes. 

Pour changer de design, dans l'outil de création de site, cliquez sur l'onglet Design à gauche, puis sur Changer de design.

changer design site internet

3. Intégrer son design au site

Vous disposez maintenant d'un site Internet vierge dans lequel vous pourrez ajouter tous vos éléments graphiques. Ainsi, vous pouvez commencer par créer un design de fond pour votre site. Attention, la résolution de vos images ne doit pas dépasser 1000 pixels x 1000 pixels. Si vous souhaitez utiliser de la transparence enregistrez vos éléments de design au format PNG, sinon vous pouvez utiliser le format JPG. Utilisez le module Image pour insérer vos graphismes.

A la place d'utiliser un menu automatique, vous pouvez créer une image bouton pour chaque page de votre site, sur lesquelles vous mettrez un lien (voir les FAQ). Placez les boutons que vous avez désignés, sur la page Arrière plan, ceux-ci seront ainsi accessibles depuis toutes les pages de votre site Web. 

4. Adapter les styles au design

Le design des textes est défini par la couleur que vous aurez choisie pour le design Unicolor. Vous pouvez adapter la police, couleur, etc... pour chaque module Texte en utilisant les outils du module Texte.

Si vous avez des connaissances dans le langage CSS (feuille de styles), vous pouvez adapter le design des textes pour tout le site. Pour modifier la feuille de style de votre site, rendez-vous sur la page Arrière plan et cliquez dans les propriétés sur Modifier les styles. Vous pouvez alors rentrer des règles CSS pour accorder les couleurs de texte à votre design. 

Voici des exemples de règles CSS adaptées pour modifier le design de votre site. Les couleurs sont encodées au format hexadécimal. Vous pourrez trouver des sélecteurs de couleur hexadécimal ainsi que des guides et tutoriels sur le langage CSS sur Internet.

/*Change le design (couleur et épaisseur) des textes des modules contacts*/

div.UI_Contact { color:orange; font-weight:900; }

/*Change la taille du texte des modules menu*/
.UI_Menu a { font-size:15px; }

/*Change la police par défaut sur le site*/
.body, .uit_cttxt_n, .uit_cttxt_m, .uit_cttxt_t, .uit_ttltxt_m, .uit_cttxt_s, .uit_ttltxt_s { font-family:arial, sans serif; }

/*Change la couleur des liens*/
.body a { color:#254a90; }

/*Changer la couleur des liens au survol*/
.body a:hover { color:#009bd4; }

Dernière mise à jour : 31 mars 2016