5568 sujets

Sémantique web et HTML

Débutant html ne s'affiche pas

Bonjour a tous je suis en 2Nde et jai un travail a rendre pour demain en techno
il faut que je fasse un site web
je suis sur mac et je travaille avec text edit (je galere!!!)
je suis totalement débutant et jai fini mon texte mais le probleme cest que quand je louvre dans chrome ou safari ca reste du texte et ya pas les images ni rien juste le code

voila mon code (svp si vous pourriez me dire ce qui cloche ca m aiderait grandement)

<!DOCTYPE html>

<html lang="fr">
  <head>
    <meta charset="utf–8">
        <title>The Ordinary</title>
    
  </head>
  <html> <body> <h1 align="center">THE ORDINARY</h1> </body> </html>

  <body>
   <body> <h3 align="center">Cette marque Canadienne, qui, comme son nom l’indique est tout à fait ordinaire. C’est grâce à cet ordinaire qu’elle se démarque : des flacons en verre, clairs et minimalistes, des formules non-testées sur les animaux et les plus courtes et efficaces possibles. Votre peau n’attend que ça, alors sautez le pas ! Découvrez ici nos produits favoris de cette marque simpliste.</h3>
  <h3 align="center"><img src="https://live.staticflickr.com/1942/44336715695_c24b359356_b.jpg"> </h3>
    <h3 align="center">Si votre peau vous pose problème, où tout simplement que vous souhaitez l’entretenir pour qu’elle reste la plus lisse et éclatante le plus longtemps possible, The Ordinary est une marque faite pour vous. DECIEM Company, l’entreprise qui l’a crée est transparente sur les compositions de chacun de ses produits, et ne souhaite que le bien de ses consommateurs.</h3>
   <h3 align="center"><img src="https://www.nocibe.fr/bibliotheque/contenu_page/2019/the_ordinary/VISUEL_INTRO.jpg?frz-v=2289"> </h3> 
   <h3 align="center »> »Par exemple, vous pourriez opter pour une hydratation intense de votre peau. Quelques gouttes d’Acide Hyaluronique et de Vitamine B5 révèleront l’éclat de votre peau. Si votre peau est sensible, vous pourriez opter pour le sérum uniquement composé de Squalane pur, qui renforcera l’absorption de l’humidité contenue dans l’air par votre peau.</h3>
   <h3 align="center"><img src="https://www.nocibe.fr/bibliotheque/contenu_page/2019/the_ordinary/VISUEL_HYALURONIQUE.jpg?frz-v=2289"> </h3> 
   <h3 align="center">Si votre peau est sujette aux imperfections, telles que les points noirs, les kystes et micro kystes ; le sérum contenant de la Niacinamide et du Zinc pourrait traiter efficacement, et sur le long terme ces problèmes qui peuvent parfois être très complexants. » </h3>
 <h3 align="center"><img src="https://www.nocibe.fr/bibliotheque/contenu_page/2019/the_ordinary/VISUEL_NIACINAMIDE.jpg?frz-v=2289"> </h3>
 <h3 align="center »>’De nos jours, beaucoup de personnes souffrent de tâches d’hyperpigmentation, que ce soit à cause des années qui passent, ou des cicatrices que la dévastatrice acné hormonale laissent sur visage. Si vous en souffrez, je ne pourrais que vous conseiller d’utiliser quotidiennement le sérum naturel à base d’Alpha Arbutine. À cela, vous pouvez ajoutez, une fois par semaine l’exfoliant chimique à base d’AHA et de BHA, à laisser poser seulement 10 minutes.</h3>
 <h1 align="center">Sérum à base d’Alpha Arbutine </h1>
 <h3 align="center"><img src="https://www.nocibe.fr/bibliotheque/contenu_page/2019/the_ordinary/VISUEL_ALPHA.jpg?frz-v=2289" </h3>
 <h3 align="center">Enfin, si vous souhaitez simplement lisser une peau un peu trop granuleuse, nous avons plusieurs produits à base d’acides directs à vous conseiller. Par exemple, l’Acide Glycolique exfoliera votre peau en douceur, ce qui accélérera le renouvellement de votre peau, en luttant contre les imperfections qui voudraient s’y installer. L’Acide lactique (5 ou 10ù, à votre souhait) aidera les couches supérieures de votre peau à se débarrasser des cellules morte, en douceur.</h3>
<h3 align="center"><img src="https://www.nocibe.fr/bibliotheque/contenu_page/2019/the_ordinary/VISUEL_ACIDESDIRECTS.jpg?frz-v=2289" </h3>
 <h3 align="center">The Ordinary, et votre peau vous dira Merci ! </h3>
 <h3 align="center">À bientôt pour de nouvelles revues pour prendre soin de votre corps !
 <body>
</html>

Modifié par _laurent (02 Mar 2020 - 18:50)
Salut
Déjà, <html> et <body> ne s'écrivent qu'une seule fois dans la page.
Ensuite, ne pas mettre des images dans des h1 ou h3, ce n'est pas fait pour ça.
N'oublie pas de fermer tes balises images <img src="" alt="">
Tu utilises trop les h1 et h3 qui ne doivent servir que pour les titres. Pour les textes, utilise plutôt des balises p comme ceci <p> mon texte </p>
@+

<!DOCTYPE html>

<html>
<head>
<meta charset="utf8">
<title>The Ordinary</title>

<body> 
<h1 align="center">THE ORDINARY</h1> 
<h3 align="center">Cette marque Canadienne, qui, comme son nom l’indique est tout à fait ordinaire. C’est grâce à cet ordinaire qu’elle se démarque : des flacons en verre, clairs et minimalistes, des formules non-testées sur les animaux et les plus courtes et efficaces possibles. Votre peau n’attend que ça, alors sautez le pas ! Découvrez ici nos produits favoris de cette marque simpliste.</h3>
<img src="https://live.staticflickr.com/1942/44336715695_c24b359356_b.jpg">
<h3 align="center">Si votre peau vous pose problème, où tout simplement que vous souhaitez l’entretenir pour qu’elle reste la plus lisse et éclatante le plus longtemps possible, The Ordinary est une marque faite pour vous. DECIEM Company, l’entreprise qui l’a crée est transparente sur les compositions de chacun de ses produits, et ne souhaite que le bien de ses consommateurs.</h3>
<img src="https://www.nocibe.fr/bibliotheque/contenu_page/2019/the_ordinary/VISUEL_INTRO.jpg?frz-v=2289">
<h3 align="center"> »Par exemple, vous pourriez opter pour une hydratation intense de votre peau. Quelques gouttes d’Acide Hyaluronique et de Vitamine B5 révèleront l’éclat de votre peau. Si votre peau est sensible, vous pourriez opter pour le sérum uniquement composé de Squalane pur, qui renforcera l’absorption de l’humidité contenue dans l’air par votre peau.</h3>
<img src="https://www.nocibe.fr/bibliotheque/contenu_page/2019/the_ordinary/VISUEL_HYALURONIQUE.jpg?frz-v=2289">
<h3 align="center">Si votre peau est sujette aux imperfections, telles que les points noirs, les kystes et micro kystes ; le sérum contenant de la Niacinamide et du Zinc pourrait traiter efficacement, et sur le long terme ces problèmes qui peuvent parfois être très complexants.</h3>
<img src="https://www.nocibe.fr/bibliotheque/contenu_page/2019/the_ordinary/VISUEL_NIACINAMIDE.jpg?frz-v=2289">
<h3 align="center »>’De nos jours, beaucoup de personnes souffrent de tâches d’hyperpigmentation, que ce soit à cause des années qui passent, ou des cicatrices que la dévastatrice acné hormonale laissent sur visage. Si vous en souffrez, je ne pourrais que vous conseiller d’utiliser quotidiennement le sérum naturel à base d’Alpha Arbutine. À cela, vous pouvez ajoutez, une fois par semaine l’exfoliant chimique à base d’AHA et de BHA, à laisser poser seulement 10 minutes.</h3>
<h1 align="center">Sérum à base d’Alpha Arbutine </h1>
<img src="https://www.nocibe.fr/bibliotheque/contenu_page/2019/the_ordinary/VISUEL_ALPHA.jpg?frz-v=2289">
<h3 align="center">Enfin, si vous souhaitez simplement lisser une peau un peu trop granuleuse, nous avons plusieurs produits à base d’acides directs à vous conseiller. Par exemple, l’Acide Glycolique exfoliera votre peau en douceur, ce qui accélérera le renouvellement de votre peau, en luttant contre les imperfections qui voudraient s’y installer. L’Acide lactique (5 ou 10ù, à votre souhait) aidera les couches supérieures de votre peau à se débarrasser des cellules morte, en douceur.</h3>
<img src="https://www.nocibe.fr/bibliotheque/contenu_page/2019/the_ordinary/VISUEL_ACIDESDIRECTS.jpg?frz-v=2289">
<h3 align="center">The Ordinary, et votre peau vous dira Merci ! </h3>
<h3 align="center">À bientôt pour de nouvelles revues pour prendre soin de votre corps !</h3>
</body>
</html>
Modérateur
Salut,

Et n'oublie pas de le sauvegarder en ".html" et pas en ".txt"... je dis ça au cas où... Smiley cligne
salut c est sauvegardé en html
j ai supprime le <html> et le <body> qui se situaient en bas de la page et ai remplacé tous les h1 et h3 par des <P> pour le texte
tjrs pareil

et pr les images si je ne peux mettre h1 et h3 je mets quoi comme balises svp

merci davance Smiley smile
Modérateur
raphvvl a écrit :
pr les images si je ne peux mettre h1 et h3 je mets quoi comme balises svp

Tu peux utiliser des <div> ou des <p> pour tes images.

Tu peux nous montrer le code que tu as maintenant ? Vraiment étrange que ça n'affiche rien
hey bien sur le voici :

<!DOCTYPE html>

<html>

<head>

<meta charset="utf\'e2\'80\'938">

<title>The Ordinary</title>

</head>

<body>

{\rtf1\ansi\ansicpg1252\cocoartf1671\cocoasubrtf500 {\fonttbl\f0\fmodern\fcharset0 Courier;\f1\froman\fcharset0 Times-Roman;}

{\colortbl;\red255\green255\blue255;\red0\green0\blue0;\red244\green244\blue244;} {\*\expandedcolortbl;;\cssrgb\c0\c0\c0;\cssrgb\c96471\c96471\c96471;}

\paperw11900\paperh16840\margl1440\margr1440\vieww10800\viewh8400\viewkind0 \deftab720 \pard\pardeftab720\sl280\partightenfactor0 \f0\fs24 \cf2 \expnd0\expndtw0\kerning0 \ \ \ \ \ \ \ \

<h1 align="center">THE ORDINARY</h1>

\ \ \

<p> align="center">Cette marque Canadienne, qui, comme son nom l\'92indique est tout \'e0 fait ordinaire. C\'92est grace \'e0 cet ordinaire qu\'92elle se demarque : des flacons en verre, clairs et

minimalistes, des formules non-testees sur les animaux et les plus courtes et efficaces possibles. Votre peau n\'92attend que \'e7a, alors sautez le pas ! Decouvrez ici nos produits favoris de cette

marque simpliste \f1\fs32 \cb3 . \f0\fs24 \cb1</p>

\

<div> align="center"><img src="https://live.staticflickr.com/1942/44336715695_c24b359356_b.jpg" alt=""></div>

\

<p> align="center">Si votre peau vous pose probleme, ou tout simplement que vous souhaitez l\'92entretenir pour qu\'92elle reste la plus lisse et eclatante le plus longtemps possible, The Ordinary

est une marque faite pour vous. DECIEM Company, l\'92entreprise qui l\'92a cree est transparente sur les compositions de chacun de ses produits, et ne souhaite que le bien de ses consommateurs.</p>

\

<div> align="center"><img src="https://www.nocibe.fr/bibliotheque/contenu_page/2019/the_ordinary/VISUEL_INTRO.jpg?frz-v=2289" alt=""></div>

\

<p> align=

"center\'a0\'bb&gt;\'a0\'bbpar exemple, vous pourriez opter pour une hydratation intense de votre peau. quelques gouttes d\'92acide hyaluronique et de vitamine b5 reveleront l\'92eclat de votre peau. si votre peau est sensible, vous pourriez opter pour le serum uniquement compose de squalane pur, qui renforcera l\'92absorption de l\'92humidite contenue dans l\'92air par votre peau.&lt;/h3&gt; &lt;h3 align=">

<img src="https://www.nocibe.fr/bibliotheque/contenu_page/2019/the_ordinary/VISUEL_HYALURONIQUE.jpg?frz-v=2289" alt=""><div>

\

<p> align="center">Si votre peau est sujette aux imperfections, comme les points noirs, les kystes et micro kystes ; le serum contenant de la Niacinamide et du Zinc pourrait traiter efficacement, et

sur le long terme ces problemes qui peuvent parfois etre tres complexants.\'a0\'bb</p>

\

<div> align="center"><img src="https://www.nocibe.fr/bibliotheque/contenu_page/2019/the_ordinary/VISUEL_NIACINAMIDE.jpg?frz-v=2289" alt=""></div>

\

<p> align=

"center\'a0\'bb&gt;\'92de nos jours, beaucoup de personnes souffrent de taches d\'92hyperpigmentation, que ce soit \'e0 cause des annees qui passent, ou des cicatrices que la devastatrice acne hormonale ont laisse sur votre visage. si vous en souffrez, je ne pourrais que vous conseiller d\'92utiliser quotidiennement le s\'e9rum naturel \'e0 base d\'92alpha arbutine. a cela, vous pouvez ajoutez, une fois par semaine l\'92exfoliant chimique \'e0 base d\'92aha et de bha, a laisser poser seulement 10 minutes.&lt;/h3&gt; &lt;h1 align=">

Serum \'e0 base d\'92Alpha Arbutine</p>

\

<div> align="center"><img src="https://www.nocibe.fr/bibliotheque/contenu_page/2019/the_ordinary/VISUEL_ALPHA.jpg?frz-v=2289" alt=""></div>

\

<p> align="center">Enfin, si vous souhaitez simplement lisser une peau un peu trop granuleuse, nous avons plusieurs produits \'e0 base d\'92acides directs \'e0 vous conseiller. Par exemple,

l\'92Acide Glycolique exfoliera votre peau en douceur, ce qui accelerera le renouvellement de votre peau, en luttant contre les imperfections qui voudraient s\'92y installer. L\'92Acide Lactique (5

ou 10%, \'e0 votre souhait) aidera les couches superieures de votre peau a se debarrasser des cellules morte, en douceur.</p>

\

<div> align="center"><img src="https://www.nocibe.fr/bibliotheque/contenu_page/2019/the_ordinary/VISUEL_ACIDESDIRECTS.jpg?frz-v=2289" alt=""></div>

\

<p> align="center">The Ordinary, et votre peau vous dira Merci !</p>

\

<p> align="center">A bientot pour de nouvelles revues pour prendre soin de votre corps !\</p>

Modifié par _laurent (02 Mar 2020 - 18:50)
Modérateur
Je t'ai mis ton code dans la balise code. Ça a pour effet de faire une coloration syntaxique de ton code. C’est une chose très (très très très) utile pour coder. C'est une fonction de base des éditeurs de code (c'est pour ça qu'il ne faut pas coder avec un bloc-note).
Tu peux utiliser Visual studio code ou Sublim text par exemple, ils sont simples et gratuits.

Revenons à nos moutons :

Qu'est-ce que c'est que ça :
{\rtf1\ansi\ansicpg1252\cocoartf1671\cocoasubrtf500 {\fonttbl\f0\fmodern\fcharset0 Courier;\f1\froman\fcharset0 Times-Roman;}

{\colortbl;\red255\green255\blue255;\red0\green0\blue0;\red244\green244\blue244;} {\*\expandedcolortbl;;\cssrgb\c0\c0\c0;\cssrgb\c96471\c96471\c96471;}

\paperw11900\paperh16840\margl1440\margr1440\vieww10800\viewh8400\viewkind0 \deftab720 \pard\pardeftab720\sl280\partightenfactor0 \f0\fs24 \cf2 \expnd0\expndtw0\kerning0 \ \ \ \ \ \ \ \

Ca ne correspond pas du tout a du html ni du CSS. Normal qu'il apparaisse ainsi si tu l'ouvre dans un navigateur, il prend ca pour du texte.


C'est quoi tout ces "\" partout ?

et enfin : 
<p> align="center">The Ordinary, et votre peau vous dira Merci !</p>

Tu referme ton <p> avant d'y avoir mis tes paramètres, il faut écrire ça comme ça :
<p align="center">The Ordinary, et votre peau vous dira Merci !</p>



Sinon une fois enregistré en html tout s'affiche bien chez moi
Smiley smile
Modifié par _laurent (02 Mar 2020 - 18:59)
Re donc j ai bien fait les balises, supprimé les //////// et ce qu il prenait pour du texte mais c est tjrs du texte Smiley decu ((((
et sinon des fois y a plein de caractères bizarres là ou y ' a des apostrophes ou des accents Smiley decu ( désolé d etre aussi nul...
svp si quelqun pourrait corriger mon code ca me serait vraiment utile merci beaucoup à tous j ai bcp appris ici Smiley smile Smiley lol
Modérateur
Salut,

Pour tester ton code tu pourrais tout coller dans https://jsfiddle.net/ (dans le bloc HTML) ? ensuite tu clique sur "Save" en haut a gauche et tu nous donne le lien ici. On aura un version à jour de ton code et on pourra voir le même rendu.
Modifié par _laurent (03 Mar 2020 - 09:27)
Sujet clos
Aller à