clb56
-
Compteur de contenus
52 -
Inscrit(e) le
-
Dernière visite
Messages postés par clb56
-
-
Bonjour,
dans tout document html tu vas te retrouver avec un élément conteneur de ce type >>>
div#global ou div#conteneur (au besoin c'est toi qui le créera).
Si ton document a un tant soit peu de consistance cet élément va obligatoirement contenir
un 1er élément (#first_element)
un 2ème (#after_first_element)
un dernier élément (#last_element)
un avant dernier élément (#before_last_element)
Au final tu te retrouves donc avec cinq éléments pour quatre coins (puisque #global ou #conteneur est à prendre en compte)
C'est dire quà priori tu nages dans le bonheur
-
Elles sont donc inopérantes avec les navigateurs respectant les standards comme Firefox, Opera, Safari...
Malheureusement non elle sont opérantes avec opera. Ce qui est bien dommage étant donné la qualité des habillages que ce navigateur propose.
-
Merci pour la réponse,
bon j'ai fait quelques changements :
changé la couleur de fond rouge assez brutal en orange pour avoir un rendu plus doux.
adouci la bande verte en dégradé
réduit la hauteur des bandes du bas.
Par contre flouter le bord inférieur du header et faire un grand dégradé sur le fond me parait un peu difficile à mettre en oeuvre.
Est ce mieux ?
-
bonjour à tous,
suite à la suggestion de dudu je fais un up plutôt que de créer un nouveau sujet.
Voici donc la dernière étape à ce jour de mon travail.
Le design a été pas mal revu ainsi que l'ergonomie.
L'ancienne mise en page est toujours accessible depuis la page d'accueil mais elle est de plus en plus dégradée pendant que la nouvelle évolue (mais bon ça permet de comparer un peu
)donc s'il y a des critiques et des... ... suggestions
j'en redemande
http://www.ecoledemusique.concarneau.fr
Merci
-
Je parlais simplement du fait qu'un travail sur l'accessibilité en général se fait beaucoup mieux si l'on travaille dans une perspective de document bien structuré.
-
En fait le couple contenu/présentation ne rend pas vraiment compte de ce dont il est question et on comprend mieux en parlant de structuration/présentation.
L'enjeu de cette séparation c'est avant tout de bien réaliser ce qui doit être fait au niveau du document html lui même. C'est à dire une structuration aussi aboutie que possible (utilisation des en têtes de section hn, listes quand c'est nécessaire etc...) du contenu.
Il semblerait effectivement que ceci fait il y a un petit plus pour le référencement même si les vrais bébéfices sont ailleurs, du coté de l'accessibilité par exemple.
-
salut,
Si ça peut t'intéresser voici une page que j'ai réalisée et où je traite ce problème :
En tout vingt photos sont visualisables mais il n'y en a que cinq au chargement de la page.
++
-
Pour le problème de plusieurs onload il y a un excellent script et tutoriel à cette adresse
et oui bien sur faire un plan du site c'est ce qu'il y a de mieux.
-
le
qui clôt ton dernier message, clôt en même temps le débat pour ce qui me concerne. -
Une possibilité, mais il y en a sans doute d'autre
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title></title>
<link rel="stylesheet" type="text/css" href="css.css">
<meta name="author" content="" />
<meta http-equiv="Content-Type" content="text/html;charset=ISO-8859-1" />
<meta http-equiv="Content-Language" content="fr" />
<meta name="keywords" lang="fr" content="" />
</head>
<body>
<div id="conterneur_global">
Tout le contenu de ton document.
</div>
</body>
</html>css
#conteneur_global {
background: url(images/barre.gif) repeat-y;/*ne met pas les adresses d'image entre guillemet*/
}comme je l'ai dit il y a sans doute d'autres possibilités mais pour avancer la dessus il faudrait des "vrais" documents html avec du contenu et sa structuration complète.
-
Salut,
Si <div class="barre">
n'a aucun contenu alors sa hauteur est de zéro donc on ne peut pas voir d'image.
-
La réponse est da ta question. Le Javascript sert dans le cas présent à afficher les éléments. Tu fais comment pour les voir s'ils ne sont pas affichés ? ("aller voir dans le code source" est une mauvaise réponse)
<{POST_SNAPBACK}>
Xavier vient de redire la précision pertinent mais j'insiste.
Voilà bien le cas où les commentaires sur la rigueur de conception vont trop loin.
Pourquoi mettre le soupçon sur la question de l'obstructivité d'un javascript si l'auteur dudit script a déjà pris en compte et résolu le problème de manière intelligente et satisfaisante.
Cette question de l'obstructivité du javascript est de manière générale tout à fait fondée et importante. Simplement quand elle ne concerne pas un exemple particulier elle ne le concerne pas et je ne trouve pas bien que l'on y insiste.
Celà donne une image du javascript comme étant définitivement du coté du mal.
C'est ruineux pour la question de l'accessibilité car ça tranche les débats avant qu'ils ne puissent avoir lieu. Le script d'alsa est en fait l'exemple même d'un bon usage controlé du javascript. Même si je reste très réservé sur l'idée même de faire des menu déroulants (queque soit la technique utilisée) dans toutes les pages d'un site.
-
je n'aime pas ce langage ça ne sert qu'à fert qu'a faire des bib bib sur une page.
J'ai tort ?
<{POST_SNAPBACK}>
Oui, le problème n'est javascript mais l'usage qu'on en fait.
Exemple cruel : on peut se poser la question de l'intérêt des menus déroulants avec plein de liens alors qu'une page plan du site rend très aisément toutes les rubriques, sous rubriques et pages accessibles à l'utilisateur sans encombrer toutes les pages du site d'innombrables liens.
Sans l'avoir utilisé moi même il me semble que le tutoriel d'alsa est sans problème et tu devrais donc sans doute le reprendre à tête reposée.
Attention à ne pas avoir d'autres javascript avec onload dans ta page parce que si c'est le cas ça fait tout foirer.
Pour ton onmouseover, ce n'est pas le onload qu'il fallait modifié mais les onclick compris dans les balises <dt>
à Dudu > pourquoi parle tu de problème si le javascript est inactif. Il ne peut pas y en avoir puisque tout le contenu auquel on doit pouvoir accédé est bien en dur dans le document html javascript ne sert dans ce cas qu'à montrer ce qu'il a lui m^me aup
-
bon...pour faire ceci http://maxcreation.freezee.org/rubrique/ac.../actualites.php
c'est des images?ce marche sous IE?firefox....
Ce sont des background-image (propriété css), l'usage qui en est fait est très simple et ne devrait pas poser de problème de compatibilité entre navigateurs.
Le design en question a néanmoins un gros défaut d'accessibilité, c'est que le texte des liens est une image et donc ne peut être agrandi (catégoriquement à éviter).
Pour ce qui te concerne, il est très difficile de trouver des solutions intéressantes en css sans avoir auparavant fait un travail d'élaboration de document(s) html un peu fouillé :
Structuration par titre hn,
mise en liste des menu,
mise en place d'éléments spécifiques concernant l'accessibilité (lien d'accès directs, lien rubrique d'aide à la navigation ...)
etc...
C'est important de commencer par ça et de partir de ça car sinon :
1. la notion de css n'a aucun sens.
2. c'est bien à partir des éléments mis en place <h1>, <h2>... <p>, <ul>, <li>... que tu pourra appliquer les propriétés de style permettant de donner forme à un choix de design. L'introduction de balises <div> ne devrait être faite que dans un deuxième temps si nécessaire. Et ça l'est beaucoup moins que l'on croit.
donc si tu veus des conseils futés envoient nous une page
-
Sache que pour faire les arrondis il y a 3 possibilites
il y en a une quatrième
4. nifty corners (tutoriel en anglais)
fonctionne avec IE6, geckos, opera. Nécessite javascript activé, mais comme il n'y a pas de risque d'obstruction de l'accès au contenu...
++
-
Pour compléter ton marque page voici le tutoriel absolument génial de Laurent Denis qui m'a permis de prendre conscience de ce genre de possibilité pour le positionnement.
L'exemple est plus complexe mais aussi plus ambitieux et intelligent.
-
Salut Yuston,
En fait il y a une solution très bien en css pur, elle repose sur le fait que l'on peut toujours combiner la propriété position:relative; avec la propriété float.
voici ta page après beaucoup de ménage fait dans le code html
j'ai de plus enlevé les bordures des 3 blocs à centrer, mélanger pourcentage et pixel ce n'est vraiment pas génial... non ?
j'ai également remplacé les min-height par des height par souci de compatibilité avec IE (qui n'interprète pas les propriétés min et max.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr" lang="fr">
<head>
<meta http-equiv="Content-type" content="text/html; charset=utf-8" />
<title>TEST</title>
</head>
<body>
<div style="border: 1px solid #000000; height:30em;">
<div style="float: left; background:#ddd; width:20%; height:10em; margin:10em 0 0 0; position:relative; left:14%;"></div>
<div style="float: left; background:red; width:20%; height:10em; margin:10em 0 0 0; position:relative; left:20%;"></div>
<div style="float: right; background:#ddd; width:20%; height:10em; margin:10em 0 0 0; position:relative; right:14%;"></div>
</div>
</body>
</html>voilà ça s'adapte à toutes les résolutions et le résultat est identique avec IE6 Firefox et opera.
++
<edit>
ah oui, j'ai gardé ta notation des propriétés de style dans les tags mais il vaudrait mieux externaliser tout ça au moins du body.
</edit>
-
chaque catégorie étant l'objet d'un élément dt
Ce n'est vraiment pas un bonne idée, mieux vaut utiliser des vrais titre <hn>.
Sinon si ça peut t'aider voici le plan que j'ai moi même réalisé et qui correspond assez bien à ce que tu cherches (le javascript est de moi donc ce n'est pas vraiment la grande classe).
la dernière ligne du fichier pouvant être remplacée par :
window.onload=cache_liste
-
Bonjour à tous
Voici un site que j'ai réalisé pour l'école de musique où je travaille. c'est amateur mais fait avec sérieux.
Voici l'adresse :
http://www.ecoledemusique.concarneau.fr
si vous voulez bien donner quelques avis
merci
-
-
lol...
oui ca a l'air de marché la, MERCI ENCORE !!
Mais ..encore une question surement bete...
Pourquoi en reseau local les lien ne marche tjs pas alors que sur le net ca fonctionne?...
J'utilise EasyPhP pour reseau local..
...haha..
Ben tant que ca marche sur le net je suis deja content,
ca doit surement etre un probleme ou un mauvais reglage de ma part dans le logiciel easyphp...
En tout les cas , MERCI !!!!!!
<{POST_SNAPBACK}>
Si tu veux que ça fonctionne en local :
-> sur ton ordi tu vas dans le dossier easyphp
-> tu ouvres le sous dossier www
-> tu sauvegardes le fichier index.php quelque part et tu le supprimes
-> copier/coller de tous les fichiers et sous dossiers de ton site à cet emplacement
et voilà
-
ben tu n'as pas du bien lire tous les post parce que FrenchFred répond parfaitement à ton problème :
/sousdossier/exemple.php
-
peut etre que demain tu en auras 800.
rien que d'y penser suis mort.bon merci pour les précisions je crois que je vais généralisé ces include (en fait ça concerne environ 60 pages.)
salut
-
bonjour à tous.
je travaille sur un site dont je vous transmet l'exemple du code source d'une page :
page.html
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="fr">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>
L'école municipale de musique de Concarneau - Présentation
</title>
<link href="style2.css" type="text/css" rel="stylesheet" />
<link rel="alternate stylesheet" type="text/css" media="screen" href="nostyle.css" title="nostyle" />
<script type="text/javascript" src="styleswitcher.js"></script>
<script type="text/javascript" src="mepnonIE6.js"></script>
</head>
<body>
<ul id="declaraccess">
<li><a href="plansite.html" title="Consulter le menu complet du site" accesskey="1">Plan du site</a></li>
<li><a href="access.html" title="Rubrique d'aide à la navigation." accesskey="2">Accessibilité</a></li>
</ul>
<p class="evit" id="haut">
<a name="contenu"></a>
<a href="#menu" accesskey="8">Aller aux menus</a> (accesskey = 8)
</p>
<hr />
<h1 id="titresite">Ecole de musique de Concarneau</h1>
<h1 id="rubrique">E.m.m. Concarneau - Actualités</h1>
<hr />
<div id="page">
<p id="ariane">
Vous êtes ici : <a href="index.html" accesskey="3">Accueil</a> >>> <a href="actu.html">Actualités</a> >>> Divers
</p>
<h2>Divers</h2>
<p>
L'association des parents d'élèves de l'école de musique a tenu son assemblée générale le 20 octobre 2004. Vous pouvez en consulter le <a href="reunionAPE.html">compte rendu</a>.
</p>
<p>
Les Prettys 'n Co... ont fait un gros dodo pendant le premier trimestre mais il semble qu'ils se réveillent un peu. Ils seront en concert le 29 janvier au centre des arts pour le repas de soutient aux Restos du coeur.
</p>
</div>
<hr />
<p class="evit">
<a name="menu"></a>
<a href="#contenu" accesskey="9">Aller au contenu</a> (accesskey = 9)
</p>
<h1 id="titremenu">Menus</h1>
<dl id="ssmenu" title="sous menu de la présentation.">
<dt>Menu présentation</dt>
<dd class="lien1"><a href="attente.html" title="" tabindex="201">Calendrier</a></dd>
<dd><a href="attente.html" title="" tabindex="202">Classes</a></dd>
<dd><a href="attente.html" title="" tabindex="203">Projets</a></dd>
<dd><a href="actudivers.html" class="actives" title="" tabindex="204">Divers</a></dd>
<dd id="vide"> </dd>
<dd><a href="realisation.html" title="Allez à la rubrique réalisations (ou utilisez le menu principal)" tabindex="205">Suite</a></dd>
<dd><a href="plansite.html" title="Consulter le menu complet du site" tabindex="206">plan du site</a></dd>
</dl>
<dl id="menuprinc" class="menuprinc">
<dt>Menu général</dt>
<dd id="ligne1"><a href="accueilpresentation.html" title="L'école sous tous ses aspects : historique, projets, instruments, équipe" tabindex="301">Présentation</a></dd>
<dd><a href="accueilorganisation.html" title="Informations relatives au fonctionnement : plannings, tarifs, règlement intérieur, contact" tabindex="302">Organisation</a></dd>
<dd><a href="actu.html" class="activep" title="Commentaire sur le lien" tabindex="303">Actualité</a></dd>
<dd><a href="realisation.html" title="Panorama des prestations de l'école : anciennes, récentes ou en cours" accesskey="4" tabindex="304">Réalisations</a></dd>
<dd><a href="com.html" title="Commentaire sur le lien" tabindex="305">Communication</a></dd>
<dd><a href="accueilliens.html" title="Commentaire sur le lien" tabindex="306">Liens</a></dd>
</dl>
<hr />
<p id="footer">
<a href="attente.html" id="lienville" title="Site officiel de la ville de Concarneau - [url="http://www.concarneau.fr">Ville"]http://www.concarneau.fr">Ville[/url] de concarneau</a> - <a href="mailto:clb56_AT_voila.fr" accesskey="4" title="nous joindre par e-mail">Contact E.M.M.</a>
</p>
<hr />
<p id="validateur">
Validateurs : <a href="http://validator.w3.org/check?uri=referer" title="validation XHTML par le W3C">XHTML</a> | <a href="http://jigsaw.w3.org/css-validator/check/referer" title="validation des feuilles de style par le W3C">CSS</a> | <a href="http://www.acces-pour-tous.net/validateur/validateur.php?logo=valide" title="validation par le site acces pour tous">Accès pour tous</a>
</p>
<hr />
</body>
</html>j'envisage d'utiliser pour cette page (et toutes les autres du site), la fonction include de la manière suivante.
page.php
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="fr">
<head>
<?
{include ('head.inc');}
?>
<title>
L'école municipale de musique de Concarneau - Actualité
</title>
</head>
<body>
<?
{include ('header.inc');}
?>
<h1 id="rubrique">E.m.m. Concarneau - Actualités</h1>
<hr />
<div id="page">
<p id="ariane">
Vous êtes ici : <a href="index.html" accesskey="3">Accueil</a> >>> <a href="actu.html">Actualités</a> >>> Divers
</p>
<h2>Divers</h2>
<p>
L'association des parents d'élèves de l'école de musique a tenu son assemblée générale le 20 octobre 2004. Vous pouvez en consulter le <a href="reunionAPE.html">compte rendu</a>.
</p>
<p>
Les Prettys 'n Co... ont fait un gros dodo pendant le premier trimestre mais il semble qu'ils se réveillent un peu. Ils seront en concert le 29 janvier au centre des arts pour le repas de soutient aux Restos du coeur.
</p>
</div>
<?
{include ('hautfooter.inc');}
?>
<dl id="ssmenu" title="sous menu de la présentation.">
<dt>Menu présentation</dt>
<dd class="lien1"><a href="attente.html" title="" tabindex="201">Calendrier</a></dd>
<dd><a href="attente.html" title="" tabindex="202">Classes</a></dd>
<dd><a href="attente.html" title="" tabindex="203">Projets</a></dd>
<dd><a href="actudivers.html" class="actives" title="" tabindex="204">Divers</a></dd>
<dd id="vide"> </dd>
<dd><a href="realisation.html" title="Allez à la rubrique réalisations (ou utilisez le menu principal)" tabindex="205">Suite</a></dd>
<dd><a href="plansite.html" title="Consulter le menu complet du site" tabindex="206">plan du site</a></dd>
</dl>
<?
{include ('footeractu.inc');}
?>
</body>
</html>note : les 3 premières include concerneraient toutes les pages du site. La quatrième environ 8 pages (par rubrique)
comme c'est la première fois que je fais ce genre de choses je me pose quelque question.
est ce bien ?
est ce utile ? (j'économise 2,6 Ko)
et surtout celà peut-il poser des problèmes par ailleurs ?
si vous voulez bien m'éclairer, merci d'avance.
Cadre arrondi en css
dans (X)HTML et CSS
Posté
J'ai du mal m'exprimer, je ne dit pas qu'il faudrait créer les éléments cités pour faire des coins arrondis je dis au contraire qu'ils existent déjà dans le document html sans aucune considération d'un éventuel stylage css (sauf pour le div#global qui lui anticipe un stylage possible mais non déterminé).
Il suffit donc d'un peu d'habileté pour utiliser le potentiel pré existant sans se mettre à créer des éléments vides dans le document html par exemple.
Et en s'y prenant bien le résultat sera ok quelque soit le navigateur (à condition qu'il implémente les feuilles de styles
) et ce que l'on soit en design à dimension fixe ou fluide.