• Aller au menu
  • Aller au contenu
  • Aller à la recherche
  • tutoriels
    • Catégories
    • actualités
    • html
    • css
    • javascript
    • responsive
    • design
    • accessibilité
    • développement
    • vue et nuxt
    • formats
    • web
    • Ressources
    • Les plus lues
    • Outils
    • Guidelines
    • Livres
    • Quiz !
    • Concours
    • Par niveau
    • Débutant
    • Confirmé
    • Expert
  • forum
    • Nouveau sujet/question
    • Catégories
    • Dernières réponses
    • Recherche
  • emploi
    • Offres d'emploi
    • Demandes d'emploi
    • Favoris
    • Poster une offre
    • Poster une demande
  • formations
    • CSS3 Expert
    • Flexbox et Grid Layout
    • HTML5
    • Vue 3
    • Nuxt
    • JavaScript
    • Accessibilité
    • Performances web
    • Intégration d'e-mails mobiles
    • Formation sur-mesure
  • S'inscrire
  • Connexion
  • Concours
  • Modalités
  • Concourir
  • Participants
  • Résultats

Cascading Style Summer Refresh 2010

Retour au concours

Guillatique par guilegt

Voir en ligne http://www.guillatique.fr

Voir l'image en taille réelle

Après refresh

Voir l'image en taille réelle

Note obtenue : 3.830/10

Commentaires

guilegt
23 Septembre 2010 à 10h00

Bonjour, Je n'ai plus souvenir d'avoir préciser le fait que la refonte du site était totale et non pas uniquement la page mis en imprim' écran. L'ancienne version du site est encore disponible sur www.guillatique.fr/v4

Shokojjo
27 Septembre 2010 à 21h24

Dans l'ensemble c'est pas mal, d'un point de vue technique pas mal de choses à améliorer quand même:

- Compression Gzip
- Fusion des fichiers JS/CSS
- Quelques erreurs de validation HTML, mais le CSS est bon

Bonne continuation donc et bonne chance pour le concours!
Tom

annso
28 Septembre 2010 à 07h36

Je n'aime pas du tout : les polices choisies s'accordent mal et manquent de sobriété, et dans l'ensemble je trouve que le design manque de subtilité : des gros cadres pour entourer les blocs, des titres en gras ET soulignés, ... Bref, désolé, je n'adhère pas et préférais l'ancien.

Bonne continuation quand même hein ! :)

guilegt
28 Septembre 2010 à 14h58

Bonjour à tous,

Pour ce projet de refonte, j'ai voulu tester de refaire mon site en html5, css3, un peu de php (pour le formulaire de contact), ainsi que du jQuery (pour faire une petite animation, animer la page de création web et contrôler les champs du formulaire de contact).
J'ai utilisé pour cette création très peu d'images car je voulais un site léger. Le site reste accessible sans image et/ou sans script.
J'essaie de coder proprement et j'ai volontairement non compressé mon code le temps du concours.
Mon site n'est pas validé en html à cause de la ligne d' utilisation du moteur de chrome pour les utilisateurs d'internet explorer avec l'outil google chrome frame. Je voulais tester cette propriété mais je ne sais pas si elle y restera.
Pour la compatibilité, j'ai testé ce site sous chrome, safari, firefox et IE (6, 7 et 8).

Riku Asakura
28 Septembre 2010 à 16h25

En laissant mes goûts de côté c'est vraiment très propre.
Plutôt bien aéré, un code léger, cela reste accessible (sauf la outline qui n'est pas toujours très visible).

Sur la navigation principale il aurait été intéressant d'avoir les effets du survol sur le focus (:focus).

Bonne continuation

designer1959
04 Octobre 2010 à 21h00

La version précédente était vraiment un peu aride, et la nouvelle ne me convainc pas non plus, mais elle ouvre des pistes. Penser que le graphisme, le design, ça ne consiste pas nécessairement à utiliser des images, au contraire, se passer de certaines très laides, comme un portable PC à l'écran bleu, etc. serait salutaire.
Le design consiste à avoir une vision globale et à penser aux rapports des choses : typo, couleurs, picto et ordonner le tout avec harmonie. Pour les contenus, à éviter certaines naïvetés qui copient les grands sites marchands et sont inappropriés dans ce cas : Pour plus d'informations, composez dès à présent…
Les fonds en couleur pastel sont souvent moches et particulièrement s'ils sont associés à des bordures noires autour des blocs.

designer1959
04 Octobre 2010 à 21h04

Je ne sais si ça parlera mais me vient soudain une métaphore simple :
penser au graphisme comme on compose un repas, réunir des aliments, chercher quelques recettes, aiguiser l'appétit, de bons et jolis plats qui restent légers pour ne pas avoir d'indigestion.

audrasjb
05 Octobre 2010 à 00h15

Hello,

Je soutiens l'avant-dernière remarque de designer1959 : mieux vaut parfois jouer la simplicité. Ton travail sur les css est indéniablement intéressant, mais le résultat jure un peu, notamment au niveau des illustrations : pc portables, icones de navigateurs, motocrosseurs et bandes ondulées colorées déservent le contenu plus qu'autre chose, àmha évidemment.

Les contenus textuels font aussi assez peu professionnel, alors que ton code est assez propre (et je tiens à le souligner pour finir mon commentaire !).

Nico3333fr
11 Octobre 2010 à 22h04

Tiens, un côté un peu original à ton site !

Qq remarques :
- les perfs, franchement à améliorer, rien que les scripts js peuvent gagner 250 Ko avec la compression,
- je n'aime pas du tout le numéro de téléphone qui s'agrandit un chiffre à la suite... c'est désagréable,
- les titres soulignés, ça induit en erreur, on croit que ce sont des liens.

Sinon un code pas mal, y a des efforts de fournis... et il faudra en fournir d'autres pour parfaire tout cela. Bonne continuation. ;)

Les commentaires sont clos.

 Alsacréations, un site dédié au <body> building  (Jean-Claude Vandamme)

  • plan du site
  • contact
  • formations
  • agence web
  • Retourner en haut de page

Alsacréations est une communauté dédiée à la conception de sites et applications web de qualité, grâce aux standards W3C, aux feuilles de styles CSS, aux langages HTML et JavaScript, et à l'accessibilité. Réalisé par l'agence web Alsacreations.fr · À propos et mentions légales · Données personnelles

https://www.alsacreations.com/