[Amateur] L'hélium et ses effets sur la voix

Bonsoir,

Dans le cadre de mon année de première, j'ai du faire, en équipe, un TPE (Travaux Personnels Encadrés) dont le sujet portait sur L'Hélium et ses effets sur la voix. Afin de m'exercer dans la pratique de l'HTML et du CSS j'ai donc créer mon premier site comme support de ce TPE.

http://img10.hostingpics.net/pics/564392logo.jpg

Le site est disponible depuis environ deux semaines: Il donne donc accès à toutes nos recherches de l'année qui nous ont permises d'expliquer ce phénomène.

Comme je l'ai dit précédemment, ceci est mon premier site web.
Je suis donc ouvert à toutes critiques aussi bien au niveau du contenu, du code, que du design afin d'améliorer le site et surtout de m'améliorer!

Le seul hic que j'ai rencontré est le référencement: Je cherche désespérément un tutoriel pour débutant... Si quelqu'un en connait un je suis preneur !

Le site est disponible à cette adresse: http://helium.alwaysdata.net

Bonne lecture

Cordialement,
Guillaume
Modifié par Giome (02 Mar 2011 - 14:37)

Il manque h1 dans ta hiérarchie de titres.

Effectivement tu viens de me le rappeler !
J'ai un petit problème avec ce H1... En effet, le seul emploi du h1 qui me semblerait juste serait:
<h1>L'Hélium et ses effets sur la voix</h1>
Le logo du site donne déjà le sujet de mon TPE et j'ai peur de me répéter en rajoutant un H1.
Que me conseilleriez vous?

Rien ne t'interdit d'imbriquer ton image à l'intérieur de ton h1. C'est même recommandé dans les cas de figure comme le tien, où la bannière est le seul élément à porter le nom du site.

Merci de l'astuce IshimaruChiaki!
J'essaye sa aujourd'hui.
Je pensais à scinder la partie TPE en plusieurs parties, accessibles avec un menu déroulant pour faciliter la lecture: Est-ce une bonne idée? Dois-je garder la forme actuelle?


----------
EDIT: Voilà j'ai intégré mon logo dans une balise h1 et c'est valide W3C ( encore merci! )
----------

D'autres avis? conseils? critiques de mon site ?
Bonne journée!
Modifié par Giome (01 Mar 2011 - 11:50)

J'aime bien le jeu de mot formule/mots !
Sinon, niveau design c'est bien. C'est un bon site. Le header est un peu gros par contre..........

Merci Doc mcfly!
Pour le logo je me suis inspiré (on va être réaliste: j'ai complètement pompé l'idée ^^) de celui d'une série "Breaking Bad" ( http://www.julientellouck.com/wp-content/uploads/2010/11/breaking_bad_01.jpg ).
Mais j'en suis tout de même content!

Tu n'es pas le premier à me faire remarquer sa taille un peu trop grande... je vais essayer de trouver une solution plus esthétique!

Bonjour,

Mes quelques remarques sur la page "Réalisation" :

* Le titre de la page (balise <title>) devrait être "Réalisation - Helium et ses effets sur la Voix",
* Mettre un "é" à "Realisation" dans le menu de navigation,
* Apporter un effet à l'activation des liens (survol et prise de focus). Un soulignement par exemple,
* Le fait que le texte soit en gras sur l'ensemble de la page me "dérange",
* Éviter de justifier le texte,
* Penser à accentuer les lettres en majuscules. Exemple : "Étude" à la place de "Etude",
* D'après Colour Contrast Analyser, le bleu turquoise et le gris sur fond blanc posent problèmes,
* Le soulignement sur le Web étant réservé exclusivement aux hyperliens, tu devrais le supprimer sur tes titres de section de niveau 4 (<h4>).
Modifié par mecho (01 Mar 2011 - 12:32)

Quelle est l'adresse de ton site ?
Je ne l'ai vue dans aucun de tes posts.

Merci

C'est corrigé! L'adresse est présente dans mon premier message.
Ps: C'est bizarre j'étais persuadé de l'avoir mise ... D'ailleurs celle de ma signature ne s'affiche plus ^^'

Bonne journée!

Giome a écrit :
Ps: C'est bizarre j'étais persuadé de l'avoir mise ... D'ailleurs celle de ma signature ne s'affiche plus ^^'

Consultes tes messages privés. Tu n'avais pas mis de lien dans le message.

J'ai fait quelques modifications que m'a conseillé mecho:

- Modification des balises <title> pour chaque page
- Ajout des accents aux majuscules
- Soulignement au survol des liens hypertextes du menu
- Plus de soulignement des balises <h4>

Pour ce qui est de la justification du texte, j'ai essayé sans en interne et je suis pas trop convaincu du résultat, je vais donc le laisser ainsi pour l'instant.

a écrit :
Le fait que le texte soit en gras sur l'ensemble de la page me "dérange",

Je n'ai pas mis le texte en gras, seulement:

font-size: large;
font-family:verdana;

En taille normal les caractères sont, je trouve, trop petits pour le confort de la lecture avec la palette de couleur que j'ai choisi.

J'ai aussi effectuer des modifications mineures du contenu: quelques tournures de phrases, etc..

Bonne journée!

Bonjour,

J'ai apporté quelques modifications graphiques:

Comme on me l'a fait remarquer j'ai réduis la taille du logo, que j'ai par la même occasion modifié un petit peu!

J'ai aussi diminué un peu la taille du texte de la page d'accueil ainsi que la taille des guillemets.

- Qu'en dîtes vous?
- Devrais-je diminuer aussi la taille du texte de la partie TPE ?

Bonne journée!

Bonjour,

J'ai fais quelques modifications importantes de mon site web et je souhaiterais avoir vos "nouveaux" avis

Modifications majeures:
- Nouveau menu déroulant (CSS)
- Nouvelle organisation du TPE
- Nouveau Logo

Modifications mineures:
- modifications de la taille du texte
- correction de quelques fautes de frappe

Le site est toujours disponible à la même adresse: (voir premier mon premier message)
J'attends vos avis, conseils, etc !

Ps: Si vous avez des problèmes d'affichages du à votre résolution merci de me le faire savoir
( j'ai visionner mon site sur un écran 27 pouces (mac) et ce n'est pas fameux...)

Bonne journée,
Guillaume

Impossible (mais vraiment impossible) de naviguer au clavier sur ton site : tu as supprimé l'outline (pas bien) sur les liens et le menu ne se déroule qu'au survol Quand on dit qu'un menu déroulant ne doit pas être full CSS mais en JS, ce n'est pas par snobisme...

Comme dirait Cabrel : C'était mieux Avaaang !

Les contrastes sont toujours aussi insufissant. L'argument du choix graphique ne tiens pas vis-à-vis du confort de lecture.

Je viens de remarquer magnifiques titles sur les images... Totalement inutile, gênant et redondant avec les alt (qui ne sont pas assez fournis) et qui n'ont rien à faire sur des images !

Si je mets mon navigateur en full screen (2560x1440) le texte devient peu lisible car il fait 70% de ma fenêtre. Il y a donc un problème avec les retours de lignes
Ton div avec l'id corps devrait avoir une largeur maximum pour éviter ce problème

Bonsoir,

Laurie-Anne: Effectivement j'ai essayer au clavier et impossible.. j'ai donc remis l'outline. Je pensais faire un menu en Javascript une fois que je connaîtrais le langage, c'est pourquoi je m'étais tourné vers du full CSS. Je vais donc devoir m'atteler au JS au plus vite. J'ai aussi virer les titles inutiles.
Je vais assombrir le texte au plus vite, c'est vrai que sa pose problème à la longue.

David Boring: Je vais ajouter des balises <br /> pour les retours à la lignes, merci de me l'avoir fait remarquer.
Par contre pour la largeur maximum comment cela fonctionne il? Mon écran est un 13.3" et il m'est difficile d'avoir une idée d'ensemble pour les plus grandes résolutions...quelle largeur maximale serait la meilleure?

Cordialement,
Guillaume

Idéalement, pas plus que 1100px de largeur pour un max-width. Pour ce qui est d'une largeur fixe (pour IE6 notamment qui ne supporte pas la propriété max-width), pas plus que 980px.
Modifié par IshimaruChiaki (08 Mar 2011 - 20:36)