http://minecraft-romandie.ch/mhtml/
PS: Eviter InternetExplorer.
1
#1
-
- Members
-
- 35 messages
Ceinture Orange
Posté 24 April 2012 - 09:48 AM
Je suis en train de faire un site sur minecraft. Et j'aimerais tout simplement votre avis sur cette base.
http://minecraft-romandie.ch/mhtml/
PS: Eviter InternetExplorer.
http://minecraft-romandie.ch/mhtml/
PS: Eviter InternetExplorer.
#2
-
- Moderateur
-
- 600 messages
Posté 24 April 2012 - 11:03 AM
Bonjour Xiimao,
je trouve que c'est un bon départ. La couleur bleu est sympa. Mais bon j'aimerai bien en voir un peu plus, je ne vois que le header pour le moment.
Pourquoi ne pas occupé toute la largeur avec le bg de ton header ?
J'aurais également ajouté un peu de lumière et de saturation qui donnerait un peu plus de profondeur.
(exemple vite fais ci-dessous)
Pense aussi au lien sur le logo pour retourner à l'accueil.
Ren
je trouve que c'est un bon départ. La couleur bleu est sympa. Mais bon j'aimerai bien en voir un peu plus, je ne vois que le header pour le moment
.Pourquoi ne pas occupé toute la largeur avec le bg de ton header ?
J'aurais également ajouté un peu de lumière et de saturation qui donnerait un peu plus de profondeur.
(exemple vite fais ci-dessous)
Pense aussi au lien sur le logo pour retourner à l'accueil.
Ren
---------- anonymation - Studio de création ----------
www.anonymation.com - blog.anonymation.com
---------------------- Projets internes ---------------------
www.mavoiturealouer.com - www.cosplay-it.com
www.anonymation.com - blog.anonymation.com
---------------------- Projets internes ---------------------
www.mavoiturealouer.com - www.cosplay-it.com
#3
-
- Members
-
- 35 messages
Ceinture Orange
Posté 24 April 2012 - 11:17 AM
C'est vraiment excellent je vais développer tout ça.
et re-poster dans la journée, Merci
et re-poster dans la journée, Merci
#4
-
- Members
-
- 35 messages
Ceinture Orange
Posté 24 April 2012 - 13:39 PM
Voila j'ai actualisé je pense encore changer 2-3 truc mais je vous remercie pour vos conseils, très bénéfiques.
#5
-
- Members
-
- 35 messages
Ceinture Orange
Posté 24 April 2012 - 16:46 PM
J'ai Maintenant un petit défaut. Avec Chrome je vois l'image "MINEMAP" (en haut a droite enfoncé en haut).
Sa vous le fait aussi ?
Sa vous le fait aussi ?
#6
-
- Community Manager
-
- 2532 messages
Posté 24 April 2012 - 16:54 PM
Salut,
Chez moi (mac os + chrome) le positionnement est bon, en revanche, j'aurais laissé le header prendre réellement toute la largeur et la hauteur sans l'effet du bandeau MINEMAP
C'est un détail, le site est trés agréable
Chez moi (mac os + chrome) le positionnement est bon, en revanche, j'aurais laissé le header prendre réellement toute la largeur et la hauteur sans l'effet du bandeau MINEMAP
C'est un détail, le site est trés agréable
"Ce que l'on conçoit bien s'énonce clairement et les mots pour le dire arrivent aisément"
embryon de site
embryon de site
#7
-
- Members
-
- 35 messages
Ceinture Orange
Posté 24 April 2012 - 17:02 PM
Super ca devait être un bug depuis mon post.
Et merci pour la remarque
Et merci pour la remarque
#8
-
- Moderateur
-
- 600 messages
Posté 25 April 2012 - 08:24 AM
Bonjour Xiimao,
tu devrais réinitialiser le margin sur ton body.
D'ailleurs as-tu pensé à utiliser un reset css.
http://meyerweb.com/...ools/css/reset/
Code CSS à coller tout en haut de ta feuille de style.
----------------------------------------------------------------------
Il y a des coins blancs sur link.png, ça fait l'effet d'un bug.
----------------------------------------------------------------------
Les herbes à droite sont différentes, cela donne un coté "amateur" pas homogène. Tu pourrais également y mettre un dégradé subtil de jolies verts histoire de leur donner un peu de relief.
----------------------------------------------------------------------
Attention le lien sur le logo pour revenir à l'acceuil ne doit pas être sur tout le header. Seulement sur le logo.
Privilégie un <a> avec une hauteur et une largeur en display:block; et positionné en absolu à gauche.
Pense à mettre un position: relative; sur le conteneur (en l’occurrence ce serait #page).
----------------------------------------------------------------------
Par contre j'ai regardé le code, c'est pas super niveau sémantique d'autant plus que tu codes en HTML5.
Je vois un div#header_bg qui contient un div#page qui contient lui aussi une balise <header>.
En fait, c'est un peu n'importe quoi.
Voici une construction plus "sémantique" pour le header pour t'inspirer :
<body>
<header>
<div class="wrapper">
<a id="logo" href="#">Bienvenue sur mon site Internet</a>
<nav><ul><li></li></ul></nav>
</div>
</header>
<div id="content">
<div class="wrapper"></div>
</div>
<footer>
<div class="wrapper"></div>
</footer>
</body>
----------------------------------------------------------------------
Dernière chose, je pense que ça manque encore un peu de luminosité. L'ensemble est assez terne alors que la créa laisse pas mal de possibilités en terme d'ambiance.
----------------------------------------------------------------------
Tu tiens le bon bout, continue comme ça
Ren
tu devrais réinitialiser le margin sur ton body.
D'ailleurs as-tu pensé à utiliser un reset css.
http://meyerweb.com/...ools/css/reset/
Code CSS à coller tout en haut de ta feuille de style.
----------------------------------------------------------------------
Il y a des coins blancs sur link.png, ça fait l'effet d'un bug.
----------------------------------------------------------------------
Les herbes à droite sont différentes, cela donne un coté "amateur" pas homogène. Tu pourrais également y mettre un dégradé subtil de jolies verts histoire de leur donner un peu de relief.
----------------------------------------------------------------------
Attention le lien sur le logo pour revenir à l'acceuil ne doit pas être sur tout le header. Seulement sur le logo.
Privilégie un <a> avec une hauteur et une largeur en display:block; et positionné en absolu à gauche.
Pense à mettre un position: relative; sur le conteneur (en l’occurrence ce serait #page).
----------------------------------------------------------------------
Par contre j'ai regardé le code, c'est pas super niveau sémantique d'autant plus que tu codes en HTML5.
Je vois un div#header_bg qui contient un div#page qui contient lui aussi une balise <header>.
En fait, c'est un peu n'importe quoi
.Voici une construction plus "sémantique" pour le header pour t'inspirer :
<body>
<header>
<div class="wrapper">
<a id="logo" href="#">Bienvenue sur mon site Internet</a>
<nav><ul><li></li></ul></nav>
</div>
</header>
<div id="content">
<div class="wrapper"></div>
</div>
<footer>
<div class="wrapper"></div>
</footer>
</body>
----------------------------------------------------------------------
Dernière chose, je pense que ça manque encore un peu de luminosité. L'ensemble est assez terne alors que la créa laisse pas mal de possibilités en terme d'ambiance.
----------------------------------------------------------------------
Tu tiens le bon bout, continue comme ça
Ren
---------- anonymation - Studio de création ----------
www.anonymation.com - blog.anonymation.com
---------------------- Projets internes ---------------------
www.mavoiturealouer.com - www.cosplay-it.com
www.anonymation.com - blog.anonymation.com
---------------------- Projets internes ---------------------
www.mavoiturealouer.com - www.cosplay-it.com
#9
-
- Members
-
- 35 messages
Ceinture Orange
Posté 25 April 2012 - 12:17 PM
Excellent merci pour tout ça et je suis totalement conscient que niveau sémantique c'est pas encore ca ms j'ai commencer l'html il y'a moin de 2 mois, je pense que ça va encore s'améliorer.
et le:
<div class="wrapper">
sert a quoi enfaite ? pcq je connais pas vraiment la différence entre id et class.
et le:
<div class="wrapper">
sert a quoi enfaite ? pcq je connais pas vraiment la différence entre id et class.
#10
-
- Members
-
- 35 messages
Ceinture Orange
Posté 25 April 2012 - 12:43 PM
Mon dieu le reset CSS est un cadeau du seigneur ça résout tout mes problemes passé (plein de margin-left right et autres inutiles)
Merci grandement.
Merci grandement.
#11
-
- Moderateur
-
- 600 messages
Posté 25 April 2012 - 19:32 PM
Bonsoir Xiimao,
<div class="wrapper"></div>
Ce div que j'ajoute personnellement dans mon code vient doubler un div "global"
exemple pour le header :
<header>
<div class="wrapper"></div>
</header>
Cette technique permet d'éviter les problèmes résultant des paddings et margins qui agrandissent la taille fixée au départ.
Par exemple nous voulons un header de 990px avec à l'intérieur un padding de 25px.
L'approche d'un néophyte ressemblerait à cela :
Il en résultera un header d'une largeur de 990px + 25px*2 = 1400px.
Chose que l'on ne souhaite pas puisque nous voulons que le site fassent 990px avec padding et margin compris.
Ceci est dû au fonctionnement logique du modèle de boite ou box model. (Je te laisse faire des recherche éventuellement sur ce sujet)
Afin de pouvoir jouir du padding ou d'un margin sans que cette largeur ne soit affectée, on procède ainsi :
header {width: 990px;}
header .wrapper { padding:25px;}
personnellement je détermine trés souvent tout en haut de ma CSS ce padding pour l'ensemble de mes .wrapper
.wrapper { padding:25px;}
--------------------------------------------------------
Concernant la différence entre un id et une class elle est très simple.
Un id est unique et une class ne l'est pas.
Tu utiliseras donc id et # seulement pour les élément qui ne seront pas répété dans ton code.
Exemple :
<header id="main-header"></header>
#main-header{ width:990px;}
qui pourrait désigner le header principal qui se trouve tout en haut de ta page.
Tu utilisera le . et class pour désigner les éléments qui se répètent.
Exemple :
<header id="main-header">
<div class="wrapper"></div>
</header>
.wrapper{ padding: 20px;}
J'espère que être suffisamment clair
N'hésite pas si tu as d'autres interrogations.
Ren
<div class="wrapper"></div>
Ce div que j'ajoute personnellement dans mon code vient doubler un div "global"
exemple pour le header :
<header>
<div class="wrapper"></div>
</header>
Cette technique permet d'éviter les problèmes résultant des paddings et margins qui agrandissent la taille fixée au départ.
Par exemple nous voulons un header de 990px avec à l'intérieur un padding de 25px.
L'approche d'un néophyte ressemblerait à cela :
header {width: 990px; padding: 25px;}
Il en résultera un header d'une largeur de 990px + 25px*2 = 1400px.
Chose que l'on ne souhaite pas puisque nous voulons que le site fassent 990px avec padding et margin compris.
Ceci est dû au fonctionnement logique du modèle de boite ou box model. (Je te laisse faire des recherche éventuellement sur ce sujet)
Afin de pouvoir jouir du padding ou d'un margin sans que cette largeur ne soit affectée, on procède ainsi :
header {width: 990px;}
header .wrapper { padding:25px;}
personnellement je détermine trés souvent tout en haut de ma CSS ce padding pour l'ensemble de mes .wrapper
.wrapper { padding:25px;}
--------------------------------------------------------
Concernant la différence entre un id et une class elle est très simple.
Un id est unique et une class ne l'est pas.
Tu utiliseras donc id et # seulement pour les élément qui ne seront pas répété dans ton code.
Exemple :
<header id="main-header"></header>
#main-header{ width:990px;}
Tu utilisera le . et class pour désigner les éléments qui se répètent.
Exemple :
<header id="main-header">
<div class="wrapper"></div>
</header>
.wrapper{ padding: 20px;}
J'espère que être suffisamment clair
N'hésite pas si tu as d'autres interrogations.
Ren
---------- anonymation - Studio de création ----------
www.anonymation.com - blog.anonymation.com
---------------------- Projets internes ---------------------
www.mavoiturealouer.com - www.cosplay-it.com
www.anonymation.com - blog.anonymation.com
---------------------- Projets internes ---------------------
www.mavoiturealouer.com - www.cosplay-it.com
#12
-
- Members
-
- 35 messages
Ceinture Orange
Posté 26 April 2012 - 08:02 AM
Vraiment merci pour tout.
au cours de ces 2 derniers jours tu m'as été d'une aide formidable et
je trouve ta façons de faire très expérimenté et explicite.
Et j'aimerais bien te renvoyer l'ascenseur mais je n'es rien à t'apprendre
sur ce forum
au cours de ces 2 derniers jours tu m'as été d'une aide formidable et
je trouve ta façons de faire très expérimenté et explicite.
Et j'aimerais bien te renvoyer l'ascenseur mais je n'es rien à t'apprendre
sur ce forum
#13
-
- Members
-
- 35 messages
Ceinture Orange
Posté 30 October 2012 - 10:26 AM
Voila apres 6 mois j'ai pas trop eu le temps de continuer sur ce site mais je l'ai bientot fini et je voulais vous faire part d'un probleme.
Le souci est que lorsque je redimensionne la page du navigateur le menu se démonte.
Donc si quelqu'un aurais une éventuelle solution j'en serais reconnaissant.
Sinon qu'est ce que vous pensez du rendu ?
http://minecraft-romandie.ch/mhtml/
Le souci est que lorsque je redimensionne la page du navigateur le menu se démonte.
Donc si quelqu'un aurais une éventuelle solution j'en serais reconnaissant.
Sinon qu'est ce que vous pensez du rendu ?
http://minecraft-romandie.ch/mhtml/
1 utilisateur(s) li(sen)t ce sujet
0 membre(s), 1 invité(s), 0 utilisateur(s) anonyme(s)