Bonjour,
 
Je suis actuellement en BTS SIO option Slam et je dois créée un site internet comme projet.
Au niveau du code je me suis bien amusé et j'ai beaucoup appris, mais on me reproche que le design est très moche et oui, il l'est ^^"
 
Mon problème est que j'ai utiliser Bootstrap pour m'aider et que je  me suis orienté sur une architecture Modèle Vue Contrôleurs.
Alors certes pour coder c'est génial, mais je n'arrive pas à faire quelque chose de propre ou de styler, et quand je regarde les thèmes Bootstrap je n'arrive à rien intégrer.
 
L'url du site www.demailly-kelian.fr
 
Je souhaiterais de l'aide, peut être pas pour faire le design, mais à m'apprendre des petites choses me permettant de le rendre plus jolie.
 
Merci d'avance

Hello,
commence déjà par virer tes énormes (moches) ombres portées. L'arrondi en bas à droite de chaque bloc, pourquoi pas, mais alors beaucoup moins gros, voir un chanfrein "droit" plutôt qu'un arrondi, mais beaucoup plus petit. Essaye aussi de réduire les espace entre chaque bloc, et apporte leur un peu de couleur (tu alternes 1 sur 2), du genre un bleu comme ton bouton connexion, et le suivant la même mais à 50%. Réduit peut être aussi la taille de tes titres.
Tout est très grossier, ça aide déjà pas au départ faudrait amener un peu de légèreté à tout ça  
Voilà mon ptit avis

Voilà les modifications effectué, merci de tes conseils ^^
Si tu à d'autre critique n'hésite pas ^^

J'essaie des trucs ^^"

Non mais y'a des trucs qui sont interdits quand même  

Bah, mon prof nous apprends rien, donc j'apprend seul ^^"

Pour compléter les conseils de Nikos :
- Ajouter le nom du site (ou idéalement un logo) au-dessus du menu
- limiter la largeur du site à environ 1000 px centré (les fonds de couleurs peuvent faire la largeur de l'écran, mais le contenu devrait rester dans cette largeur de 1000 px).  
La raison est simple : sur les grand écrans, un affichage sur toute la largeur "dilue" le contenu et on y prête moins d'attention.
- virer les effets sur tes boutons Inscription et Connexion
- homogénéiser les arrondis : si tu emploies de arrondis de 5 px sur tes boutons, alors tes blocs devraient aussi disposer d'arrondis de 5px (même s'il n'y a qu'un arrondi).
Cela dit, la tendance est plutôt aux arrondis très légers (3 px maxi)
- attention aux nuances de bleu qui différent trop entre le fond de "Blog", le rollover sur les liens du menu, les boutons... Là encore, mieux vaut être cohérent.
- et personnellement, j'ajouterais une couleur vive (orange, rose... ?) pour trancher sur tout ce bleu et gris.

Je vais essayer de me créé un petit logo pour le site, rien de bien compliqué mais bon ^^
Je pense avoir retirer les effets que tu à expliquer.
 
Désolé mais les thèmes blocs etc j'ai beaucoup de mal, mais je pense avoir compris ce que tu voulais dire. Peut tu me confirmer que c'était bien cela?
 
J'ai tout mis de la même couleur niveau bleu .

Oui, c'est bien ça. Ce que j'appelle "bloc" (et je ne suis pas le seul, c'est un peu une convention tacite en webdesign, pour autant que je sache), c'est un ensemble d'éléments qui constituent un "tout" (donc un bloc).
 
Par exemple, le menu (barre de menu + les liens) est un bloc, "Les articles du site/Cette section contient les articles de mon site internet" en est un autre et l'ensemble "titre d'un article + image + date + texte" (alternés en bleu et gris sur ton site) en sont encore un autre.
 
En revanche, Inscription et Connexion sont des boutons, pas des blocs.
Par contre, le formulaire http://www.demailly-kelian.fr/membre/inscription/ est un bloc

Merci de tes explications
 
C'est vrai que je n'est pas appris plus que cela niveau design pensant qu'un design simple irais pour mon BTS car portant sur le code, mais je me suis fait réprimander car le site est moche, sa fait un sacré coup au morale

Bon, en faite sa m'énerve, c'est vraiment super moche --
Je vais d'abord faire la mise en page normale avant de stylisé.
 
Ou trouver quelqu'un qui peux me montrer pour un thème gratuit et mon architecture.
 
Je vais prendre mon bon vieux papier stylo ^^

T'es obliger de coder ton site à la mano?  
 
Installe un wordpress et un thème stylé, ça t'cassera moins les genoux. lol

Oui, le projet du BTS est le code en lui même.
Mais mon profs à eu envie que l'on rajoute du design ^^
 
Donc tout dois être fait à la main

Voilà, j'ai tester de refaire le design à la main, vous en penser quoi?

C'est mieux, mais certaines de mes remarques sont toujours valables
- Ajouter le nom du site (ou idéalement un logo) au-dessus du menu
- limiter la largeur du site à environ 1000 px centré (les fonds de couleurs peuvent faire la largeur de l'écran, mais le contenu devrait rester dans cette largeur de 1000 px).  
La raison est simple : sur les grand écrans, un affichage sur toute la largeur "dilue" le contenu et on y prête moins d'attention.
- et personnellement, j'ajouterais une couleur vive (orange, rose... ?) pour trancher sur tout ce bleu et gris.

J'ai un peu de mal à faire un logo normale ^^ je vais donc juste rajouter le nom du site, et oui au niveau de la couleur, mais je sais pas ou la placer et la qu'elle ^^".
La page est utiliser avec bootstrap, donc il gère en fonction des grands écrans ou des petits écrans.

Nom du site : OK, mais en non souligné et plus gros, avec une police de caractères différente.
Couleur : tu as introduit le vert, ça va plutôt pas mal. Pense par contre, à le décliner sur tous les liens ("voir l'article" est en bleu foncé en rollover, passe en vert ou vert foncé, par exemple. Idem pour les boutons).
 
Quant à la largeur du site, oui, Bootstrap est responsive, mais je persiste à préférer une largeur de la zone de contenu moins grande (1000 px pour les écrans supérieurs ou égaux à 1024px de large).