Erreur W3C

mzdiine
Les bases HTML/CSS

Bonjour tout le monde,

c'est avec un désespoire que je viens vous voir.. J'ai fini mon site, j'ai tester les pages sur W3C et me trouver 5 erreurs.. Avec chance c'etait toujours les mêmes erreurs (Footer, img etc..).. mais là, gros problème.. Ma page contact trouve 28 Erreurs.. Cela fais au moins 1h que je suis dessus et au lieu de réglé, je créer des autres problèmes.. S'il vous plait, aidez moi :))

Tenez,

<?php
    if(!empty($_POST)){
        extract($_POST);
        $valid = true;
        if(empty($nom)){
            $valid = false;
            $erreurnom="Veuillez remplir votre nom";
        }

    if(!preg_match("/^[a-z0-9\-_.]+@[a-z0-9\-_.]+\.[a-z]{2,3}$/i",$email)){
        $valid = false;
        $erreuremail ="Votre email n'est pas valide";
    }

    if(empty($email)){
            $valid = false;
            $erreuremail="Veuillez remplir votre email";
        }

    if(empty($sujet)){
            $valid = false;
            $erreursujet="Veuillez remplir votre sujet";
        }

    if(empty($message)){
            $valid = false;
            $erreurmessage="Veuillez saisir votre message";
        }
    if($valid){
        $to = "***@gmail.com";
        $sujet = $nom. " a contacter le site";
        if(mail($to,$sujet,$email,$message)){
            $confirmation="Votre message est bien envoyer";
            unset($nom);
            unset($email);
            unset($sujet);
            unset($message);
        }
        else{
            $erreur="Une erreur est survenue";
        }
    }
}
?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Portfolio de Mzdiine (Mediine Artwork Design) - Graphiste Lillois de 22 ans.</title>

    <meta name="Category" content="graphisme,webdesign,pao" />

    <meta name="Description" content="Portfolio de Mzdiine (Mediine Artwork Design) - Graphiste Lillois de 22 ans. " />

   <meta name="Keywords" content="graphiste,webdesigner,Lille,Nord-pas-de-calais,59,62,creation,communication visuelle,identite visuelle,web,print,multimea,site internet,flyer,logo,graphiste,creation de logo, creation d'affiche, creation de flyer, creation de catalogue, creation d'invitation, creation de carte de visite, 
    creation de rapport annuel, creation de pochette CD, creation de pochette DVD, creation d'animation multimeadia, creation d'animation flash, creation de site internet, creation d'email, creation de newsletter, creation de banniere publicitaire, creation video" />
    <meta http-equiv="content-language" content="fr" />

    <link rel="stylesheet" type="text/css" href="style.css" media="screen" />
    <link rel="stylesheet" type="text/css" href="styles.css" />
    <link rel="stylesheet" href="lightbox.css" type="text/css" media="screen" />

    <script src="js/prototype.js" type="text/javascript"></script>
    <script src="js/scriptaculous.js?load=effects,builder" type="text/javascript"></script>
    <script src="js/lightbox.js" type="text/javascript"></script>
</head>
<body>
    <div id="main">
        <ul id="navigationMenu">
            <li>
                <a class="home" href="index.html">
                    <span>Accueil</span>
                </a>
            </li>

            <li>
                <a class="about" href="portfolio.html">
                    <span>Portfolio</span>
                </a>
            </li>

            <li>
                 <a class="services" href="videos.html">
                    <span>Videos</span>
                 </a>
            </li>

            <li>
                <a class="portfolio" href="#">
                    <span>Photographie</span>
                </a>
            </li>

            <li>
                <a class="contact" href="contact.php">
                    <span>Contact</span>
                </a>
            </li>
        </ul>

        </div>
    <div id="portfolio">
        <div id="link">
                <ul>
                    <li><a href="https://twitter.com/mzdiined"><img src="images/twitter.png" alt="Rejoindre mon Twitter" /></a></li>
                    <li><a href="http://www.facebook.com/pages/Mediine-Artwork-Design/123108461093234"><img src="images/facebook.png" alt="Rejoindre ma page Facebook" /></a></li>
                    <li><a href="http://www.youtube.com/user/MzDiine"><img src="images/youtube.png" alt="Rejoindre ma chaine Youtube" /></a></li>
                    <li><a href="http://mediine-x3.deviantart.com"><img src="images/deviantart.png" alt="Visitez mon DVA" /></a></li>
                </ul>
        </div>

        <div id="head">
            <img src="images/LogoWeb.png" alt="MzDiiNe Logo" width="819" height="218" />
        </div>

        <div id="contener">
            <div id="title">
                <img src="images/contact.png" alt="" width="1176" height="34" />
            </div>
                <div id="contactus">
                    <h3>Contactez moi</h3>
                    <h4>N'hésitez pas à me contactez</h4>
                    <hr/>
                    <div id="formulaire">
                        <form method="post" action="#">

                        <label for="nom"><p>Nom :</p></label> <input type="text" name="nom" value="<?php if(isset($nom)) echo $nom; ?>"/><span class="error"> <?php if(isset($erreurnom)) echo $erreurnom; ?></span> </br></br>

                        <label for="email"><p>Email :</p></label> <input type="text" name="email" id="email" value="<?php if(isset($email)) echo $email; ?>"/> <span class="error"> <?php if(isset($erreuremail)) echo $erreuremail; ?></span> </br></br>

                        <label for="sujet"><p>Sujet :</p></label> <input type="text" name="sujet" id="sujet" value="<?php if(isset($sujet)) echo $sujet; ?>"/> <span class="error"> <?php if(isset($erreursujet)) echo $erreursujet; ?></span>

                        </br></br><label for="message"><p>Message :</p></label> <?php if(isset($confirmation)){ echo "<p>$confirmation</p>"; } ?> <span class="error"> <?php if(isset($erreurmessage)) echo $erreurmessage; ?></span>
                        <textarea name="message" cols="70" rows="10" id="message"/><?php if(isset($message)) echo $message; ?></textarea>

                        <input type="submit" value="" />
                    </div>
                </div>
                <div id="portfolio_bottom"></div>               
            </div>
        <div id="bottom">
            <img width="1175" height="43" src="images/bottom.png" alt=""/>
        </div>
        </div>
    </div>
</body>
</html>

Et voila le lien pour coller le code source: http://validator.w3.org/#validate\_by\_input

3 réponses

hachbe

Hello,

Je ne vais pas tout expliquer, mais je vais déjà dire ce que je vois comme erreur à première vue.

Quand tu as un formulaire, je te recommande vivement de mettre tes éléments dans la balise fieldset.
exemple:

<form>
    <fieldset>
        <label for="nom">Votre Nom</label>
        <input type="text" value="blabla" id="nom" name="nom" />
    </fieldset>
</form>

La balise auto-fermante br s'écrit 

<br />

et non 

</br>

Ça vaut de même pour toute autre balise auto-fermante tel que l'input (qui sont correctes dans ton code).

Par contre pour le textarea, tu l'auto-ferme alors qu'elle a du contenu et que tu ferme la base textarea.
exemple: 

<textarea name="message">Indiquez votre texte ici</textarea>

Évites les paragraphes (p) dans tes label. Si c'est juste pour styliser, je te recommande dès lors de te servir de ta balise label qui englobe ton élément et dont tu peux styliser via le CSS.

N'oublies pas de fermer ta balise form

Si tu corriges déjà ces éléments je pense que ça va réduire quelque peut tes erreurs de code.

Sinon, via le validateur tu as les explications ou recommandation du W3C qui t'aiderons à mieux comprendre tes erreurs :)

Bonne continuation ;)

hachbé

mzdiine
Auteur

Merci beaucoup pour ton aide :)

Titi

Les éléments d'un formulaire comme input textarea ... doivent obligatoirement être dans des balises de type block comme div, p ...