Que pensez-vous de mon site? http://www.huiledoliveextravierge.com/
3246 sujets
Critiques de vos sites: code et design
Bonjour JPOl,
En toute honnêteté, même si tu es "amateur" et pas forcément pro du web, je me demande quand même en quelle année le site à été fait. Au vu du design je dirais qu'il y a pas mal de temps, et vu le code, je dirais 1999 ?
Tu n'as pas de doctype, le site est en tableaux et il y a pleins de trucs et de machins étranges pas du tout standard dans ton code, du CSS inline et pas une feuille de style externe : whooooo. Tu l'as généré avec quel logiciel du coup je suis curieuse ? (je doute fort que tu ai écrit tout ça, ça fait trop propriétaire et code généré automatiquement ^^)
C'est en tout cas un joli vestige du temps passé, d'une époque lointaine et révolue que seul ceux qui font du web depuis plus de 10 ans connaissent, merci pour l'instant nostalgie
Modifié par Stéphanie W. (07 Aug 2014 - 10:12)
En toute honnêteté, même si tu es "amateur" et pas forcément pro du web, je me demande quand même en quelle année le site à été fait. Au vu du design je dirais qu'il y a pas mal de temps, et vu le code, je dirais 1999 ?
Tu n'as pas de doctype, le site est en tableaux et il y a pleins de trucs et de machins étranges pas du tout standard dans ton code, du CSS inline et pas une feuille de style externe : whooooo. Tu l'as généré avec quel logiciel du coup je suis curieuse ? (je doute fort que tu ai écrit tout ça, ça fait trop propriétaire et code généré automatiquement ^^)
C'est en tout cas un joli vestige du temps passé, d'une époque lointaine et révolue que seul ceux qui font du web depuis plus de 10 ans connaissent, merci pour l'instant nostalgie
Modifié par Stéphanie W. (07 Aug 2014 - 10:12)
je ne m'exprimerais pas sur le contenu (comme si on demandait à un italien ce qu'il pense de la mozzarella de vache 
), par contre sur la réalisation du site ... comme dit Stephanie, bienvenue au moyen-age
je ne suis même pas sur que tu aies utilisé un outil pour faire çà, c'est du fait main, pas centré, pas de background, des liens qui se promènent un peu partout, des couleurs et des boutons bizarres ... désolé pour les critiques un peu directes mais on ne peut pas te dire que c'est génial si c'est pas bon
va falloir lire un peu les tutos sur Alsacreations et si vraiment tu veux faire un truc rapide utilises twitter bootstrap ou un truc dans le genre.
Modifié par Zebrou (06 Aug 2014 - 22:17)
), par contre sur la réalisation du site ... comme dit Stephanie, bienvenue au moyen-ageje ne suis même pas sur que tu aies utilisé un outil pour faire çà, c'est du fait main, pas centré, pas de background, des liens qui se promènent un peu partout, des couleurs et des boutons bizarres ... désolé pour les critiques un peu directes mais on ne peut pas te dire que c'est génial si c'est pas bon
va falloir lire un peu les tutos sur Alsacreations et si vraiment tu veux faire un truc rapide utilises twitter bootstrap ou un truc dans le genre.
Modifié par Zebrou (06 Aug 2014 - 22:17)
Bonjour et merci pour vos réponses
Je ne connais pas grand chose en programmation html ou CSS.
Néanmoins, je connais les bases et la logique de la programmation.
Je comprends comment cela fonctionne, même si je ne connais pas la syntaxe.
J'ai de bonnes bases sur powerpoint et les logiciels de traitement des photos et des graphismes.
J'ai fait le site avec Microsoft Publisher 2007.
Je suis bien conscient que le code n'est pas top (très lourd, répétitif et trop abondant)... mais il faut reconnaître que le rendu correspond exactement à ce que l'on voit sur l'interface graphique.
Compte tenu de ma nécessité de travailler sur une interface graphique qui génère du code, quel logiciel me conseilleriez vous? Idéalement, il faudrait que le programme génère au moins des feuilles CSS pour simplifier la structure.
Sinon, quelles seraient tes 10 recommandations d'améliorations simples et rapides à mettre en place sur mon site?
Merci d'avance
Je ne connais pas grand chose en programmation html ou CSS.
Néanmoins, je connais les bases et la logique de la programmation.
Je comprends comment cela fonctionne, même si je ne connais pas la syntaxe.
J'ai de bonnes bases sur powerpoint et les logiciels de traitement des photos et des graphismes.
J'ai fait le site avec Microsoft Publisher 2007.
Je suis bien conscient que le code n'est pas top (très lourd, répétitif et trop abondant)... mais il faut reconnaître que le rendu correspond exactement à ce que l'on voit sur l'interface graphique.
Compte tenu de ma nécessité de travailler sur une interface graphique qui génère du code, quel logiciel me conseilleriez vous? Idéalement, il faudrait que le programme génère au moins des feuilles CSS pour simplifier la structure.
Sinon, quelles seraient tes 10 recommandations d'améliorations simples et rapides à mettre en place sur mon site?
Merci d'avance
Huhu tu n'y connais pas grand chose, ça tombe bien, tu es tombé au bon endroit, il a pleins d'articles et de tutos sur la section apprendre
Il n'existe aucun logiciel fiable qui génère du code propre à partir d'une interface visuelle (sinon pas mal de collègues seraient au chômage). La seule façon de faire ça proprement c'est de faire appel à un professionnel (ou d'apprendre à coder, cf lien plus haut).
Si ce n'est pas possible pour des raisons budgétaires, tu peux te tourner vers les systèmes de gestion de contenu comme WordPress et récupérer ce qu'on appelle un "template" tout fait, pour ensuite y mettre ton contenu. Mais là du coup tu n'auras pas un design sur mesure, mais tu pourra choisir dans une large sélection de templates (gratuites ou non, en général les payants vont entre 20 et 70€)
Une autre solution serait de passer par des frameworks genre Bootstrap ou Foundation, mais ça demande pas mal de connaissances niveau code.
Enfin si vraiment tu souhaites "faire le design toi même et pas coder" il existe d'autres outils qui génèrent un code moins sale que les outils Microsoft. En vrac :
- -https://webflow.com/ (gratuit si tu veux pas une url personnalisée)
- -http://macaw.co/ payant aussi
- -http://www.adobe.com/fr/products/muse.html tout aussi payant mais inclus dans la suite Adobe si jamais tu as déjà un abo CC
- -https://www.google.com/webdesigner/ gratuit (il me semble)
Je précise quand même que le code produit par les 4 outils ici ne sera jamais aussi "bon" que celui d'un pro, mais c'est un début acceptable.
Il n'existe aucun logiciel fiable qui génère du code propre à partir d'une interface visuelle (sinon pas mal de collègues seraient au chômage). La seule façon de faire ça proprement c'est de faire appel à un professionnel (ou d'apprendre à coder, cf lien plus haut).
Si ce n'est pas possible pour des raisons budgétaires, tu peux te tourner vers les systèmes de gestion de contenu comme WordPress et récupérer ce qu'on appelle un "template" tout fait, pour ensuite y mettre ton contenu. Mais là du coup tu n'auras pas un design sur mesure, mais tu pourra choisir dans une large sélection de templates (gratuites ou non, en général les payants vont entre 20 et 70€)
Une autre solution serait de passer par des frameworks genre Bootstrap ou Foundation, mais ça demande pas mal de connaissances niveau code.
Enfin si vraiment tu souhaites "faire le design toi même et pas coder" il existe d'autres outils qui génèrent un code moins sale que les outils Microsoft. En vrac :
- -https://webflow.com/ (gratuit si tu veux pas une url personnalisée)
- -http://macaw.co/ payant aussi
- -http://www.adobe.com/fr/products/muse.html tout aussi payant mais inclus dans la suite Adobe si jamais tu as déjà un abo CC
- -https://www.google.com/webdesigner/ gratuit (il me semble)
Je précise quand même que le code produit par les 4 outils ici ne sera jamais aussi "bon" que celui d'un pro, mais c'est un début acceptable.
Bonjour,
Suivant vos conseils, je me suis mis au travail et j'ai refait la trame globale.
Voici ce que cela donne sur lepaysdusoleil.com
Mais, j'ai beau chercher, il y a 3 choses que je n'arrive pas à résoudre:
1) Une case du menu déborde
Les cases sont en relatif (14em chaque case).
La barre de menu mesure au total 4x14=56em.
Mais avec 56em cela déborde en bas et avec 57em il y a un peu de vert qui déborde à droite.
Comment faire pour que cela rentre?
2) Comment faire pour que le menu déroulant fonctionne sur ipad et les smartphones?
(pourquoi cela ne marche pas? mon site préhistorique était assez laid avec un code horrible mais il marchait sur tout)
3) Mes icones langues ne s'affichent pas sur internet, alors que en utilisant les navigateurs IE, chrome, mozilla sur mon ordinateur ils s'affichent sans problème. Pourtant ce sont exactement les mêmes photos et les mêmes chemins qui sont utilisés sur le serveur.
Pourquoi?
Dernière question: comment puis-je faire sur mon espace personnel alsacréations pour consulter les mails que j'ai envoyés (je vois les mails reçus, mais pas ceux que j'ai envoyé). Comment faire pour les consulter?
Merci d'avance
Suivant vos conseils, je me suis mis au travail et j'ai refait la trame globale.
Voici ce que cela donne sur lepaysdusoleil.com
Mais, j'ai beau chercher, il y a 3 choses que je n'arrive pas à résoudre:
1) Une case du menu déborde
Les cases sont en relatif (14em chaque case).
La barre de menu mesure au total 4x14=56em.
Mais avec 56em cela déborde en bas et avec 57em il y a un peu de vert qui déborde à droite.
Comment faire pour que cela rentre?
2) Comment faire pour que le menu déroulant fonctionne sur ipad et les smartphones?
(pourquoi cela ne marche pas? mon site préhistorique était assez laid avec un code horrible mais il marchait sur tout)
3) Mes icones langues ne s'affichent pas sur internet, alors que en utilisant les navigateurs IE, chrome, mozilla sur mon ordinateur ils s'affichent sans problème. Pourtant ce sont exactement les mêmes photos et les mêmes chemins qui sont utilisés sur le serveur.
Pourquoi?
Dernière question: comment puis-je faire sur mon espace personnel alsacréations pour consulter les mails que j'ai envoyés (je vois les mails reçus, mais pas ceux que j'ai envoyé). Comment faire pour les consulter?
Merci d'avance
Bonjour,
Il y a enfin un doctype et les CSS sont externalisés. Les commentaires de Stéphanie ont porté leurs fruits. Il n'y a qu'une police de caractère, ce qui est plus propre.
Sur ce nouveau site, les menus et sous menus déroulants sont inactifs sur mac (chrome) et des images ne s'affichent pas (vérifiez les liens ? Les CSS ?) qui se placent en plein sur le titre.
On a un bloc inclus avec un scroll, en 2014 c'est à éviter surtout qu'il y a largement la place. Le fond transparent gêne la lecture.
Le menu ne tient pas sur une ligne, même sur grand écran.
Pour le style, il y a un coup de frais comparé à l'ancienne version, la photo est jolie. Vu que je ne peux afficher les autres pages, mon commentaire s'arrêtera là.
Une capture pour illustrer mon propos :
http://images.jupload.fr/1409590316.png
Vous avez aussi la possibilité d'utiliser des outils prêts à l'emploi avec parfois aucune ligne de code à saisir :
Pour les thèmes : http://themeforest.net/
Pour adapter votre site aux différents supports : http://www.alsacreations.com/article/lire/930-css3-media-queries.html
Pour les tendances ergonomie et design : http://obsedo.com/portfolio/webDesignTendances2015.pdf
Pour créer un site web moderne sans toucher une ligne de code : http://fr.wix.com/
En attendant la suite ?
Modifié par spongebrain (01 Sep 2014 - 18:58)
Il y a enfin un doctype et les CSS sont externalisés. Les commentaires de Stéphanie ont porté leurs fruits. Il n'y a qu'une police de caractère, ce qui est plus propre.
Sur ce nouveau site, les menus et sous menus déroulants sont inactifs sur mac (chrome) et des images ne s'affichent pas (vérifiez les liens ? Les CSS ?) qui se placent en plein sur le titre.
On a un bloc inclus avec un scroll, en 2014 c'est à éviter surtout qu'il y a largement la place. Le fond transparent gêne la lecture.
Le menu ne tient pas sur une ligne, même sur grand écran.
Pour le style, il y a un coup de frais comparé à l'ancienne version, la photo est jolie. Vu que je ne peux afficher les autres pages, mon commentaire s'arrêtera là.
Une capture pour illustrer mon propos :
http://images.jupload.fr/1409590316.png
Vous avez aussi la possibilité d'utiliser des outils prêts à l'emploi avec parfois aucune ligne de code à saisir :
Pour les thèmes : http://themeforest.net/
Pour adapter votre site aux différents supports : http://www.alsacreations.com/article/lire/930-css3-media-queries.html
Pour les tendances ergonomie et design : http://obsedo.com/portfolio/webDesignTendances2015.pdf
Pour créer un site web moderne sans toucher une ligne de code : http://fr.wix.com/
En attendant la suite ?
Modifié par spongebrain (01 Sep 2014 - 18:58)
merci pour ces commentaires très utiles
pour le menu, je l'ai défini en em donc variable
ce que je ne comprends pas c'est que chaque rectangle fait 14em et le menu total 56em (4x14em) mais cela ne marche pas. Et si je mets 57em, cela déborde à droite cette fois.
Comment faire pour éviter le renvoi du 4e rectangle en bas à gauche sans passer par des width fixes en px?
pour le menu, je l'ai défini en em donc variable
ce que je ne comprends pas c'est que chaque rectangle fait 14em et le menu total 56em (4x14em) mais cela ne marche pas. Et si je mets 57em, cela déborde à droite cette fois.
Comment faire pour éviter le renvoi du 4e rectangle en bas à gauche sans passer par des width fixes en px?
Concernant le scroll:
"On a un bloc inclus avec un scroll, en 2014 c'est à éviter surtout qu'il y a largement la place. Le fond transparent gêne la lecture."
Pourquoi c'est à éviter spécialement en 2014? Si cela avait été en 2012, non?
Pour que les questions apparaissent à l'écran quand on entre sur le site, il faut que le cadre se place au-dessus de la photo de fond et donc la masque à 60% et cela donne quelque chose de plutôt laid, non?
Mon idée était, par la transparence (qui d'ailleurs ne se voit que sur les navigateurs récents), que cela fasse plus beau.
Le gros titre en blanc, par contre, je ne sais pas si c'est heureux...?
Le scrolling permet de rester sur l'écran et donc une focalisation. Par contre, c'est peut-être "has been"?
"On a un bloc inclus avec un scroll, en 2014 c'est à éviter surtout qu'il y a largement la place. Le fond transparent gêne la lecture."
Pourquoi c'est à éviter spécialement en 2014? Si cela avait été en 2012, non?
Pour que les questions apparaissent à l'écran quand on entre sur le site, il faut que le cadre se place au-dessus de la photo de fond et donc la masque à 60% et cela donne quelque chose de plutôt laid, non?
Mon idée était, par la transparence (qui d'ailleurs ne se voit que sur les navigateurs récents), que cela fasse plus beau.
Le gros titre en blanc, par contre, je ne sais pas si c'est heureux...?
Le scrolling permet de rester sur l'écran et donc une focalisation. Par contre, c'est peut-être "has been"?