3246 sujets

Critiques de vos sites: code et design

[Amateur] Site association P@JE

Pages :
(reprise du message précédent)

Justement dans le nouveau design, il y a beaucoup moins de div imbriquées...
Je poste le code principal du nouveau design, comme ça vous pourrez vous en faire une idée. 
<!DOCTYPE html>
<html>
    <head>
        <title>Association P@JE</title>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <link rel="stylesheet" type="text/css" href="css/General.css">
    </head>
    <body>
        <header>
            <img src="images/Logo.png" alt="Logo de l'association P@JE"/>
            <div id="Adresse"> Association Pasteur Avenir Jeunesse<br>3 bis avenue Gautier Roux              06000 Nice<br>04 83 50 33 68
            </div>
        </header>
        <nav id="Menu">
            <a href="#">Accueil</a>
            <a href="AssoPaje.php">Association P@JE</a>
            <a href="#">Médiation</a>
            <a href="#">6 - 12 ans</a>
            <a href="#">12 - 22 ans</a>
            <a href="#">Evenement</a>
            <a href="#">Parentalité</a>
            <a href="#">Galerie Photo</a>
            <a href="#">Emploi</a>
            <a href="#">Contactez-nous</a>
        </nav>
        <div id="MenuVertical">
            <ul>
                <li><a href="#">CLAS</a></li>
                <li><a href="#">PRE</a></li>
                <li><a href="#">Accueil Collectif des Mineurs</a></li>
                <li><a href="#">VVV</a></li>
                <li><a href="#">Café Partage</a></li>
                <li><a href="#">Groupe de Parole</a></li>
            </ul>
        </div>
        <div id="Information">
           Information : <p>Contenu Information</p>
        </div>
        <div id="Contenu">
            <h2>Association Pasteur @venir Jeunesse</h2>
            <h3>Services</h3>
            <p>Contenu</p>
        </div>
        <footer>
            <nav id="Footer">
                <a href="#">Accueil</a>
                <a href="#">A propos de nous</a>
                <a href="#">Contactez-nous</a>
                <a href="#">Evenements</a>
                <a href="#">Médiation</a>
                <a href="#">Partenaires</a>
                <a href="Administration.php">Administration</a>
            </nav>
        </footer>
    </body>
</html>
Ah oui, excuse-moi, j'ai encore fait la même erreur. Pourtant, je sais très bien qu'il faut commencer par h1... Une erreur bête...
Désolé...

Que penser du nouveau design ?? Je trouve qu'il est beaucoup plus simple, mais à la fois, plus lisible.
Salutation encore une fois Smiley smile

Bon d'accord. Je vois Blooheek qu'il te manque un élément essentiel en compréhension CSS. Si tu me le permet, j'aimerais m'arrêter sur les imbrications en CSS. Les imbrications, quoique nécessaires, seront toujours facultatifs. Il sont comparable aux paramètres optionels en programmation.

Ce que tu ne sais pas Blooheek c'est que les background et border en CSS sont effectifs autant en H1 qu'en DIV. Seulement, la différence entre les deux (DIV ou H1), est d'une grande importance.

Si tu utilise le background et/ou border sur H1 plutôt que DIV, tu soustrait inévitablement une imbrication. On commence à purifier l'écriture. C'est sur H1 que nous purifions l'écriture. Un background et/ou un border sur H1 plutôt que DIV nous permet une propreté de l'écriture.

Mais aussi une légerté au niveau de l'exécution du programme, au niveau globale. Un programme exécuter, son premier lancement, est toujours globale.

Je n'ai rien contre les DIV's, seulement ceux-ci devront être utilisés avec intelligence. Nous devons imbriquer avec raisons et logiques.

Voici une façon (selon moi évidemment), qui fait qu'une imbrication est logique, donc a une raison d'être existant : « J'imbrique ici un DIV car celui-ci sera cibler par ' id ' en javascript ». En dehors des raisons justifier, vaut mieux éviter l'imbrication. Surtout lorsque CSS en donne l'occassion, mais surtout HTML. Crois que HTML est le point le plus judicieux.

Il est terminer ce temps où nous avons crû que CSS devais venir en aide à un HTML déficient. À un HTML incapable de rendre la page de façon autonome.

Aujourd'hui je peux confirmer que la compréhension de HTML vient en aide à CSS. Notre HTML, n'a jamais été déficient, il est juste un peu retardé, et avec raison.

Vous vous souvenez de Obélix, qui souvent nous rappellent qu'il n'est pas gros ? suivant un coup de poing sur la gueule il nous rappelle qu'il n'est qu'un peu bas de poitrine ?

Il en est de même de HTML : je ne suis pas déficient, je ne suis que peu retarder (sauf le coup poing sur la gueule). Smiley biggrin
..
Modifié par zardoz (28 Jun 2011 - 00:40)
Ah ! Je crois que je vois enfin ce que tu veux dire ! lol

Enfaite, tu voudrais que je n'utilise pas de div pour placer mon texte mais plutôt des paragraphes identifiés ?

Par exemple, la div Information, je la transformais en un simple <p>aragraphe identifié du style <p id="Information"> et que je placerai ce dernier en css ??

C'est ça que tu voudrais que je fasse ?
Bon d'accord

L'important ici est de reconnaître le rôle de CSS dans les différents éléments HTML.

Tu peux par exemple utilisé le background et ou border au niveau H1 ou P ou autres éléments HTML (mais pas nécessairement un DIV imbriquer). Ce qui devrais éliminés les imbrications (DIV), inutiles. Bref de mieux contrôler tes instructions CSS et HTML. Dans ton cas Blooheek c'est que les imbrications n'ont pas de raison d'être, n'ont pas de raison d'exister. Les instructions que tu place sur un DIV pourrons être placer sur l'élément cibler. N'oublis jamais la notion parent/enfant en pédagogie.

Tous les enfants sont héritier du parent. Seulement tous les enfants ont droit de parole sans influencé le parent (celà est dû au fait que nous sommes unique), en tant qu'enfant. Mon parent peut dire je suis bleu en écriture de texte (dont tout ces héritiers), mais l'enfant peut dire, moi je veux être rouge (le parent s'incline à la demande de l'enfant).

Tu dois particulièrement reconnaître tes besoins ou ceux du clients afin d'écrire une page propre, légerte et fonctionnelle.

Si tu as compris comment engendré une page simple mais totalement fonctionnelle en CSS et en HTML, tu auras donc compris une large part de la web écriture. Cette part, en compréhension, est essentielle.

Non . . . je te demande juste de comprendre qu'il est important de placer des instructions CSS en faveur d'une écriture web propre, et leger. Toi tu as placer des instructions de background et border en CSS en un DIV imbriquer dans un autre DIV. Oubli ça.

Moi je te demande de placer ces instructions de background et ou de border directement à la balise cibler. C'est à dire au H1 pour le titre ou H2 pour le sous-titre, ou tout autre élément que tu auras choisis. Tu auras un meilleur contrôle lorsque tu ciblera correctement l'élément concerner. Dans ton cas il s'agit des éléments titre, sous-titres, (plus tard en PHP, le nom de l'auteur et la date de publication), et le texte etc . . .

Je peut apporter quelques visuelles à la situation Smiley cligne
Je te demande juste de savoir et de reconnaître que les background et tout autres propriétés devront cibler directement l'élément HTML concerner. Mais pas nécessairement son conteneur. Je te le demande.

..
Modifié par zardoz (27 Jun 2011 - 23:57)
Ok, je pense mieux comprendre ce que tu expliques..
J'y ferai donc attention quand je vais remettre le "nouveau" site en ligne...
Je n'ai plus qu'à faire la base de donnée et les connections de lecture/écriture..

Merci zardoz pour tes explications, je pense comprendre d'avantage le rôle du css Smiley smile
C'est vrai que j'ai dit beaucoup de chose et pas toujours facile à suivre. Smiley cligne

Mais j'y tenais bien, surtout lorsque la page entière est de l'auteur, entièrement créer.
Les raisons qui nous poussent à agir ainsi se résume aisément.

1 ) Une écriture propre, une écriture logique (très important) : soustraire dès le départ les éléments superflus. C'est une bonne habitude à prendre.

2 ) Faire en sorte qu'un moindre changement (refonte), ajout ou supression de rubriques, de textes se fasse avec facilité, sans ouvrir le fichier CSS pour un ajustement.

3 ) Si tu dois quitter ton poste pour un autre travail, faire en sorte que celui ou celle qui te remplacera, puisses-être en mesure de comprendre aisément ton travail. C'est même le rôle premier du designer web, de faire simple et compréhensible, de faire en sorte que la moindre modification (pouvant aller jusqu'à une refonte totale), soit fait avec une aisance particulière, par n'importe quel autre auteur.

C'est dans l'expérience je crois, qu'on arrive à faire pro.

Je te souhaite bonne chance et j'espère que tu nous montrera les résultats. Je crois sincèment que tu as le talent et l'intérêt pour continuer, que tu sais comment faire pour ton projet.

J'irai revoir la vidéo que j'ai apprécier : c'est dire que les associations sont intéressant en terme de visibilité. Il y a vraiment du potentiel avec les associations de nos quartiers. Surtout lorsque nous débutons en web design (c'est une bonne base).

..
Modifié par zardoz (28 Jun 2011 - 17:05)
Je te remercie de ton intérêt Smiley smile

Mais je précise que le web design n'est pas ce que je préfère Smiley cligne

Et puis de toute façon, dans ce domaine, on a toujours besoin d'apprendre !! Donc autant commencer avec les bonnes bases !

Le nouveau site sera bientôt en ligne.. Dans deux ou trois jours (ou peut-être moins) Smiley smile
D'accord

Pour ce qui est de tes intérêts (qui ne sont pas nécessairement axé sur le web design), je savais à la lecture de ton premier message. Quoiqu'il en soit c'est une bonne expérience que de faire un site pour une association.

À dire vrai, et vues les facilité d'utilisation des langages de bases, je crois que tous peuvent faire l'expérience du web design.

Si je me suis arrêter longuement à ton topic, c'est possiblement que les associations m'intéresse vraiment (et ce depuis longtemps). J'irai donc vers les associations de mon quartier ici à Québec, prêt à faire le grand saut. J'aurai sûrement des choses à apprendre, mais je n'ai aucun doute de pouvoir leur rendre service, en tant que web designer.

Il y a des avantages aux associations.

Je quitte et bonne chance.
..
Pages :
Sujet clos
Aller à