Version complète: sur le forum Webmaster Hub : Apprendre (X)HTML/CSS, les références
Webmaster Hub > Création et exploitation de Sites Internet > Les langages du Net > (X)HTML et CSS
slek
Et oui tout grand programmateur a été un jour comme moi c'est a dire un débutant.Je voudrai savoir ou je peu trouver des bases pour le php et html.
Merci d'avance.
Berberber
en tout cas, commence par l'html.... (cherche "w3 html" dans google)
et commence le php quand tu seras tres bon en html...
slek
Ok merci de ton conseil.a+
Denis
Conseil auquel j'ajouterais : oui, définitivement, commence par le HTML mais rends-toi service, apprends le des bonnes sources, la lumière des bons enjeux. B)

Tu as la chance de ne pas avoir d'expérience dans le domaine, ainsi tu n'es pas encore teinté des mauvaises habitudes qui contraignent les développeurs expérimentés à remettre certaines de leurs pratiques en cause Je t'invite fortement à aller lire les artciles d'un site très bien, OpenWeb (http://www.openweb.eu.org/). Dans la francophonie, c'est je crois un des meilleurs points de départ. J'invite les autres à fournir d'autre ressources du même ordre. Autant pour toi d'appliquer les standards Web dès tes premiers pas. Tant qu'à apprendre, fais-le bien ! Ce qui est intéressant avec OpenWeb, c'est que tu y trouveras des articles orientés pour les débutants, mais avec un très bon fond. smile.gif

http://openweb.eu.org/debutant/

Particulièrement, je t'invite à parcourir la section sur le XHTML, qui est la version de HTML que tu devrais sans contredit essayer d'apprendre. C'est la plus récente version, et celle qui te permettra de pousser le plus loin tes connaissances à long terme. Je te suggère évidemment aussi d'associer le Web à ceux qui en recommande la voie, c'est-à-dire le Consortium W3. Pour le moment, ne fais que retenir que le W3C, c'est important. Tes recherches te permettront deconverger éventuelement vers cet oasis de connaissances. wink.gif

Finalement, si tu lis l'anglais, je te propose l'excellentissime bouquin d'un type nommé Jeffrey Zeldman intitulé "Designing with Web Standards", qui te permettra de faire un survol très complet de ce que tu devrais tendre à vouloir connaître. Avec de telles bases, tu partiras vraiment sur le bon pied. thumbup.gif

http://www.eyrolles.com/Informatique/Livre...b-standards.php

Bonne chance et surtout, bonne découverte ! smile.gif
Monique
Bonjour,

Je voudrais d'abord attirer ton attention sur le danger d'une recherche de site personnelle via un moteur de recherche - du moins pour un débutant.
Certains sites, très bons lors de leur mise en ligne, n'ont pas évolué. Ils sont donc à éviter pour un débutant qui n'est forcément pas à même de séparer ce qui est toujours valable de ce qui ne l'est plus... sous peine d'apprendre le HTML comme au siècle dernier wink.gif

En parcourant OpenWeb, tu verras qu'il y est constamment fait appel à l'utilisation des feuilles de style (CSS). Le couple (X)HTML/CSS est indissociable aujourd'hui, il permet de séparer le contenu (et sa structure) de la mise en page.
Tu pourras te faire une idée de cette approche et de son importance en lisant les quelques articles de la partie Publications du Hub et ceux du site pompage.net.

Deux liens indispensables pour démarrer sur de bonnes bases :
- Ecrire une page Web
- CSS débutant

Et puis, au fur et à mesure de ton apprentissage, n'hésite pas à poser des questions précises dans le forum HTML & CSS... où je déplace d'ailleurs ta question en modifiant un peu le titre B)


Note :
Dans les messages qui suivent, le Site du Zero est parfois recommandé par quelques membres.
Malgré la qualité des tutoriels, présentés sur un ton souvent humoristique qui séduit et facilite l'effort à fournir, je ne peux pas cautionner cette recommandation.
En effet, quelques erreurs de base graves déforcent complètement la valeur et l'impact de ces tutoriels (je ne parlent ici que des cours XHTML et CSS, je ne connais pas les autres). C'est dommage.
Une nouvelle version est en préparation... j'espère que je pourrai revoir cet avis.
Denis
Il ne faudrait pas aussi oublier la référence des références pour tout ce qui a trait aux bonnes manières de coder, le site qui en a inspiré des centaines d'autres dont OpenWeb lui-même dans la francophonie, le site qui alimente Pompage.net sur une base quasi mensuelle, j'ai nommé A List Apart. Évidemment, il faut savoir lire l'anglais, mais ce site est de loin la meilleure référence qui soit.

http://www.alistapart.com/

ALA, souvent imité, jamais égalé ! wink.gif
jd_
Bonjour. Il n'est pas toujours facile de démarrer d'un coup, même aidé de site aussi clairs qu'OpenWeb. Il faut un savant mélange de cours et d'exemples pratiques (l'examen du code valide des sites sus-cités est aussi un bon exercice !). Si je puis me permettre de partager deux autres liens intéressants :

http://selfhtml-fr.teamone.de/ | SelfHTML, pas forcément à jour, mais une bonne base de départ, car plutôt exhaustif.
http://web.developpez.com/faq/html/ | FAQ (X)HTML / CSS de developpez.com, toujours pratique !
Denis
Jd ? Pas le nouveau Jd de Pompage ? Bienvenue dans le cl'Hub mon vieux ! Comme le monde est petit. Content de te croiser ici aussi . wink.gif
jd_
Bah vui jd de pompage smile.gif
Je te signale que tu as mis un billet sur <C² /> qui disait de faire *exploser* le trafic de ce forum... v'là qu'il oublie ce qu'il poste wink.gif
(désolé pour la discussion privé ! - quel mauvais exemple sad.gif )
Monique
Bonjour jd,

et bienvenue sur le Hub smile.gif
Merci d'avoir suivi les bons conseils de Denis !
J'espère que tu te plairas ici et que tu restera avec nous...

CITATION(jd_ @ dimanche 02 mai 2004, 22:57)
(désolé pour la discussion privé ! - quel mauvais exemple sad.gif )

hum... c'est bon pour une fois hypocrite.gif
Denis
C'est pardonnable je crois... puisque c'est dans le cadre d'un message de bienvenue à ton endroit. ^_^
Nissone
CITATION(Denis @ lundi 19 avril 2004, 14:38)
Finalement, si tu lis l'anglais, je te propose l'excellentissime bouquin d'un type nommé Jeffrey Zeldman intitulé "Designing with Web Standards", qui te permettra de faire un survol très complet de ce que tu devrais tendre à vouloir connaître. Avec de telles bases, tu partiras vraiment sur le bon pied. thumbup.gif

Dis, Denis ! Dis, Denis ! Et si on préfère apprendre en français ? Quelqu'un connait un "excellentissime" livre en français ?
(Oui, oui ! Je sais ! Il va bien falloir que je m'y mette à apprendre en anglais ! rolleyes.gif )
Denis
Malheureusement ma chère Nissonne, rien de tel n'existe encore en Français. Du moins, je n'ai pas la chance d'en connaître un. Est-ce à dire que nous devrons le faire nous même si nous souhaitons un jour voir le bouquin de Zeldman traduit en français ? Peut-être... dry.gif
Hellway
Sinon, j'ai fait un petit tutorial pour XHTML sans grandes prétentions, mais qui peut peut-être aider :
http://fusa2.free.fr/Webmaster/xhtml.htm
Nissone
Merci pour vos réponses.

CITATION
Est-ce à dire que nous devrons le faire nous même si nous souhaitons un jour voir le bouquin de Zeldman traduit en français ? Peut-être... 

En voilà une idée ! Un livre CSS signé Denis ! :up:
J'achète ! wink.gif
Denis
Si tu veux bien me designer la couverture et faire le mise en page des contenus, je veux bien me lancer ! wink.gif
pierredureau
Je le réserve dès maintenants à Eyrolles !
Le bouquin du cybercodeur.. la classe !
Monique
Et je veux bien me proposer comme relectrice biggrin.gif
Denis
CITATION(Monique @ mardi 29 juin 2004, 16:36)
Et je veux bien me proposer comme relectrice  biggrin.gif

Relectrice ? Monique ! C'est tout ? Et pourquoi pas le co-écrire ? Faut voir grand mon amie. wink.gif
Mado
http://www.udm4.com/manual/development/css/

un petit site pour les css wink.gif
Monique
Bonjour,

Voilà un lien intéressant déniché par ElMoustiko, épinglé par Sibelius dans ce billet Arrêtez d'enseigner le HTML en classe ! (et aussitôt signalé par Thunderbird via mon compte RSS wink.gif ).

Si on peut lui reprocher la (trop) traditionnelle confusion entre HTML et XHTML, l'auteur a le grand mérite de donner un solide coup de pied à l'immobilisme souvent rencontré dans bien des milieux professionnels.

Je vous recommande d'ailleurs de vous attarder sur le site (plus spécialement sa rubrique TICE & SPIP), Biotechno pour les profs, qui recommande
CITATION
Avant toute navigation sur ce site...
Je vous conseille de bien lire l’article "Biotechno pour les profs" aime Mozilla Firefox qui vous permettra de naviguer en toute sérénité sur le site de "Biotechno pour les profs".


<edit>
J'ai compris la raison de l'apparente confusion entre HTML et XHTML en lisant ces propos de l'un des auteurs de Biotechno :
CITATION
Donc, de manière générale, si l’on conseille du HTML à quelqu’un, il ne trouvera pas de conseils judicieux sur l’utilisation des CSS. Alors que si on lui conseille du XHTML l’explication de l’utilité des CSS est imparable.


J'ai souvent été confrontée à ce problème dans mes fonctions d'éditrice pour Dmoz notamment huh.gif
Et au début de cette discussion, je disais
CITATION
Je voudrais d'abord attirer ton attention sur le danger d'une recherche de site personnelle via un moteur de recherche - du moins pour un débutant.
Certains sites, très bons lors de leur mise en ligne, n'ont pas évolué. Ils sont donc à éviter pour un débutant qui n'est forcément pas à même de séparer ce qui est toujours valable de ce qui ne l'est plus... sous peine d'apprendre le HTML comme au siècle dernier  wink.gif
Selsogel
Je suis tout nouveau par ici. J'espère que je choisis le bon endroit pour poser mes quelques questions :
Je viens de découvrir il y a quelques jours les CSS. Je lis le maximum d’informations sur le sujet sur le net. J’ai compris les principes. Je me pose cependant quelques questions et je ne trouve pas les réponses.
Je pense utiliser Nvu pour gérer mon site ? Que faut-il en penser ?
Une fois la feuille CSS définie :
Comment démarrer devant sa page blanche ?
Taper son texte au kilomètre, insérer ses images... Et ensuite s’occuper d’appliquer les styles ?
Faut-il se faire une page modèle ?
Quelle méthode utiliser pour transformer complètement un site (être productif) ?

Merci de m’aider à trouver ses réponses.
Monique
Bonjour,

Même quand on envisage l'utilisation d'un logiciel WYSIWYG, il est bon de comprendre ce que fait le logiciel, d'autant plus qu'il s'avère vite indispensable de devoir parfois intervenir directement dans le code.

Pour un bon démarrage, deux pages débutants indispensables :
- Ecrire une page Web
- CSS débutant

Nvu est effectivement un éditeur WYSIWYG à recommander. Il est en constante évolution, son auteur, Daniel Glazman, y travaille d'arrache pied B)
Sur cette page tu trouveras des liens très utiles dont un tutoriel en français actualisé à chaque nouvelle version de Nvu (N|VU : ZE|N TUTORIEL) et un diaporama (GÉRER UN SITE AVEC NVU 0.41). Tu y trouveras réponse à tes questions sur la manière d'aborder ta première page.

Si tu veux approfondir un peu tes connaissances, va faire un tour dans le Top Sites du Hub... les sites qui y figurent sont tous de qualité.

Bon courage smile.gif
Selsogel
Merci pour toutes les infos. A bientôt
pandrekano
Merci beaucoup Hellway pour ton tutorial excellent !

pandrekano
artxtra
le livre de Zeldmann traduit ici : Zeldmann en FR sur Amazon. Déjà en rupture de stock : y a de la demande !
Editeur : EYROLLES -- prix non communiqué
thick
Je dois beaucoup à Raphaël (Sibelius) qui m'a bien coaché sur un autre forum et je conseille son site http://www.alsacreations.com/
Rosie
Bien, je me permets de proposer un site donnant des "cours" de xHtml, Css, Php :
Le site du zér0.

C'est la où j'ai appris laugh.gif

<modérateur: correction du lien défectueux>
Monique
Bonjour,

Impardonnable... je n'ai pas encore ajouté le livre de Raphael (alias Sibelius) aux références incontournables citées dans ce sujet blush.gif

CSS 2 - Pratique du design web
sharnalk
je voudrais savoir jai bien lu ce que vous avez ecrit. merci
mais on a beau lire et relir des tutoriel pour apprendre a confectionner une page,
on en devient pas webmaster pour autant...
il faut de la pratique (jen viens a ma question) quel editeur de texte faut t-il
utiliser pour débuter ?

(de preference un gratuit qu'on puisse utiliser sans pensé a la "date limite" lol ) laugh.gif
ryuran
Je conseil notepad++ il est conseillé par le site du zero.
Il est pratique grâce a son systeme d'arborecense du code (+ et - comme le xml).
il est entierement gratuit.
color les code:
-php
-sql
-(x)html
-css
-javascript
-etc...

enfin pour coder y'a rien de mieux.
J'aivait essayé EditPlus mais au bout de 30 jours il nous affiche un message comme quoi on a dépasser la date limite d'utilisation mais cela ne nous empèche pas de continuer à l'utiliser.

sur ma clef USB je transporte tout le temps Wamp5 et notepad++ mes 2 outils de travails (j'utilise photoshop aussi mais lui il est pas sur ma clef)
maxx_psy
moi je vous propose un dico des attributs css, avec exemple:

ici

en fr bien sur

voila ++
Diwils
Pour le html et le php je connais site du zéro un site très bien fait et facile d'apprendre avec wink.gif
Free
Bonjour,

Tout nouveau sur le forum, je suis tombé sur ce topic hier.

Je pense que l'altruiste est un site référence quand on souhaite apprendre correctement les bases d'un language.

laltruiste.com

Il aborde bien évidement tout ce qui touche aux normes W3C.

Attention: Ce n'est pas un site de de code source mais belle et bien des cours.

A bientot.
nyl auster
bonjour à tous, j'ai vu qu'une modératrice au début de ce thread a écrit ceci:

CITATION(Monique @ lundi 19 avril 2004, 14h41) *
Dans les messages qui suivent, le Site du Zero est parfois recommandé par quelques membres.
Malgré la qualité des tutoriels, présentés sur un ton souvent humoristique qui séduit et facilite l'effort à fournir, je ne peux pas cautionner cette recommandation.
En effet, quelques erreurs de base graves déforcent complètement la valeur et l'impact de ces tutoriels (je ne parlent ici que des cours XHTML et CSS, je ne connais pas les autres). C'est dommage.
Une nouvelle version est en préparation... j'espère que je pourrai revoir cet avis.[/color]


qu'en est-il aujourd'hui?
Zen-Spirit
Salut tout le monde !
1- J'ai un petit soucis à comprendre un code Css par rapport à son fichier HTML :
Voici le site dont le modèle se trouve :
Ici, la barre de menu simple du site
En fait sur ce site, entre les rubriques du Menu, il y a des petites barres qui les sépares, mais en regardant le code HTML et le code CSS, je ne vois pas comment le webmaster définie ces petites barres afin qu'elles apparaissent.
Pouvez vous m'aidez à comprendre et à trouver dans ce code ce qui fait que ces petites barres apparaissent :

Code HTML :
CITATION
<ul id="navigation">
<li id="navhome"><a href="/">Accueil</a></li>
<li id="nav1"><a href="/articles">Tous les articles</a></li>
<li id="nav2"><a href="/ressources">Ressources</a></li>
<li id="nav3"><a href="/colophon">À propos du site</a></li>
<li id="nav4"><a href="/contact">Contact</a></li>
</ul>



Code CSS :

CITATION

/* ------------------------------------------
/* Navigation
/* ------------------------------------------
*/
#navigation {
width: 700px;
height: 25px;
margin: 0;
padding: 0;
padding-bottom: 15px;
list-style: none;
background: #FFF url(/pompage_v3/nav.gif) no-repeat;
}

#navigation li {
height: 25px;
margin: 0;
padding: 0;
float: left;
text-indent: -9000px;
}

#navigation a {
display: block;
height: 100%;
}

#navigation li a:link, #navigation li a:visited {
color: #FFF;
text-decoration: none;
font-variant: small-caps;
font-weight: bold;
}
#navhome {
width: 80px;
background: url(/pompage_v3/nav_home.gif) no-repeat;
}
#nav1 {
width: 142px;
background: url(/pompage_v3/nav_articles.gif) no-repeat;
}
#nav2 {
width: 101px;
background: url(/pompage_v3/nav_ressources.gif) no-repeat;
}
#nav3 {
width: 85px;
background: url(/pompage_v3/nav_aprop.gif) no-repeat;
}
#nav4 {
width: 78px;
background: url(/pompage_v3/nav_contact.gif) no-repeat;
}


2- D'autres par rapport à ce même site, le webmaster a mis dans son code HTML, au début ceci :


CITATION
<div id="header">
<h1>Pompage</h1>
</div> <!-- fin #header -->

Mais à aucun moment je ne vois le titre Pompage en texte !!!
Le gros titre pompage qu'il y a sur le site en haut à droite est une image !

Merci de m'aider à comprendre, car çà me bloque dans ma progression.



Aussi, sur ce site là : ICI
Dans la partie du cours sur Display : je n'arrive pas à avoir le mêe résulatat que le webmaster à mis comme résultat final :

Donc voici ce que je mets dans mon code HTML :
CITATION
<!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">
<head>
<title>essai3</title>
<meta http–equiv="Content–Type" content="text/html; charset=iso–8859–1"/>
<meta name="Description" content="blabla">
<link rel="stylesheet" media="screen" type="text/css" title="essai3.css" href="essai3.css" />
<link rel="shortcut icon" href="favicon.ico" >

</head> <!–– Fin de la balise Head ––>



<body> <!–– Début de la balise Body ––>

<div id="display">
<p>
<a href="http://www.w3.org/">Le site du W3C</a>
<a href="http://www.w3.org/TR/CSS21/">Recommandations CSS2</a>
<a href="http://www.w3.org/Style/CSS/current-work#CSS3">Recommandations CSS3</a>
</p>
<hr />
<ul>
<li><a href="http://www.w3.org/">Le site du W3C</a></li>
<li><a href="http://www.w3.org/TR/CSS21/">Recommandations CSS2</a></li>
<li><a href="http://www.w3.org/Style/CSS/current-work#CSS3">Recommandations CSS3</a></li>
</ul>
</div>

</body>

</html>


Et dans mon code CSS :
CITATION
#display p.block a {
display:block;
width:180px;
border:1px solid #E8E8E8;
padding:3px 10px;
background-color: #DCDCDC;
}
#display li {
display:inline;
background:url(nav.png) no-repeat 0 50%;
padding-left:10px;
}

Merci !
Ceci est une version "bas débit" de notre forum. Pour voir la version complète avec plus d'information, la mise en page et les images, veuillez cliquer ici.