Tutoriel pour créer un site

pépère · Le 04/08/2006, à 15:28

Bonjour !

Dans la série "je veux faire un site et je vous embête pour y arriver", après qu'on m'ait conseillé joomla et spip, je reviens à l'attaque...

Avec spip, je me suis vite rendu compte qu'il fallait apprendre bcp de choses pour structurer ses squelettes... Bref, pour changer l'apparence du site, il faut connaitre l'HTML, le langage propre à SPIP (les boucles) et le CSS.

Je ne connais rien de tout ça, mais je crois avoir compris que, pour publier des pages web, on a besoin de connaitre le HTML (pour la structure et le texte) et le CSS (pour faire du "jolie"). Du coup, si je dois apprendre ça, autant laisser tomber SPIP : je ne créé pas de site collaboratif, et la structure de mon site est normalemet très simple.

J'ai trouvé ces pages : http://www.tuteurs.ens.fr/internet/web/ … .html#s8_3
Elles expliquent plutôt bien tout ça... J'ai fait un peu de LateX, il n'y a en gros que les balises qui changent dans le XHTML. Pour le CSS, ça ne semble pas trop compliqué... (je crois les doigts).

Mais... voilà, je vois bien dans tout ça comment créer une page web... Mais pas comment créer un site entier, structuré, avec des rubriques contenant plusieurs pages... Ni comment créer une colonne qui s'affiche sur toutes les pages donnant accès à toutes les rubriques.. Ni comment faire pour relier les différentes parties du site entre elles à partir d'une page d'accueil... Ni comment mettre un logo...

Bref, écrire une page, ok, mais structurer un site, je ne vois pas.

DONC, j'en viens enfin à ma demande : connaitriez vous un livre, un site, un tutoriel, expliquant comment on créé tout cela ? Avec quel support avez vous appris à faire vos site web ? Existe-t-il un document de référence et simple d'accès ?

PS : je le redis, je ne cherche pas un CMS, j'aimerai me mettre au développement web "à la dure"...:cool:

isaboubou · Le 04/08/2006, à 15:34

ouaip, je sais pas si ça peut t'intéresser ça !

regarde toujours, ça coûte rien !

http://doc.ubuntu-fr.org/applications/nvu

et là, un petit tutorial qui peut aider pas à pas

http://www.salemioche.net/

Dernière modification par isaboubou (Le 04/08/2006, à 15:40)

bergi · Le 04/08/2006, à 15:40

http://www.siteduzero.com/tuto-3-6-0-apprenez-a-creer-votre-site-web.html

Fanof · Le 04/08/2006, à 16:16

Pour le menu qui se répète à l 'indentique sur chaque page, en fait c'est une suite de liens mais rajoutés en PHP ^^ le site que bergi a donné est génial, après avoir lu le cours Site Web lis le cours PHP

ponsfrilus · Le 04/08/2006, à 16:32

pépère a écrit :

Avec spip, je me suis vite rendu compte qu'il fallait apprendre bcp de choses pour structurer ses squelettes... Bref, pour changer l'apparence du site, il faut connaitre l'HTML, le langage propre à SPIP (les boucles) et le CSS.

-> Avec Joomla tu t'y collera aussi, mais l'avantage c'est que tu pourra éventuellement trouver un templates déjà tout fait et l'installer facilement...

pépère a écrit :

Je ne connais rien de tout ça, mais je crois avoir compris que, pour publier des pages web, on a besoin de connaitre le HTML (pour la structure et le texte) et le CSS (pour faire du "jolie"). Du coup, si je dois apprendre ça, autant laisser tomber SPIP : je ne créé pas de site collaboratif, et la structure de mon site est normalemet très simple.

C'est clair que le HTML tu n'y coupera pas... mais en fin de compte c'est pas si compliquer et il y a vraiment plein de site qui explique le HTML simplement... Google est ton ami ;-)

Pour ce qui est du CSS, ce n'est pas obligatoire mais vivement conseillé... Ca correspond + ou - au style dans OpenOffice ou dans Word...

pépère a écrit :

Mais... voilà, je vois bien dans tout ça comment créer une page web... Mais pas comment créer un site entier, structuré, avec des rubriques contenant plusieurs pages... Ni comment créer une colonne qui s'affiche sur toutes les pages donnant accès à toutes les rubriques.. Ni comment faire pour relier les différentes parties du site entre elles à partir d'une page d'accueil... Ni comment mettre un logo...

You got the point! Vu que tu connais pas le HTML j'en déduis que tu ne connais pas non plus le php, ou les langages dynamique pour le web. Par conséquent c'est très bien vu de vouloir utiliser un CMS (Système de Gestion de Contenu) qui gère la structure du site a ta place... Joomla par exemple organise tout en SECTION qui contiennent des CATEGORIES qui contiennent des ARTICLES. Les menus sont créés automatiquement etc...
Pour joomla regarde par la: http://www.joomla.fr/ et cherche le tutorial Joomla pour les nuls qui te permettra de te faire une idée...

pépère a écrit :

DONC, j'en viens enfin à ma demande : connaitriez vous un livre, un site, un tutoriel, expliquant comment on créé tout cela ? Avec quel support avez vous appris à faire vos site web ? Existe-t-il un document de référence et simple d'accès ?

Il n'y a pas de recette magique, tu dois passer du temps... Des sites, des forums il en existe des milliers mais c'est quand même plus faciel de s'y retrouver avec un question précise...

pépère a écrit :

PS : je le redis, je ne cherche pas un CMS, j'aimerai me mettre au développement web "à la dure"...:cool:

Ca existe encore ça? Honnêtement cela sert a rien de réinventer la roue, si tu as un petit site a faire (5-20 pages) passe encore mais après...

ponsfrilus · Le 04/08/2006, à 16:36

Et au cas ou tu changerais d'avis au sujet des CMS, le site http://opensourcecms.com/ en regoupe vraiment beaucoup, il sont classé selon les utilisations, on peut tous les tester en démo et ils sont tous opensource!!!

pépère · Le 04/08/2006, à 17:03

Ouai, je suis un peu maso... J'aimerais bien me passer de CMS !
Mon site ne devrait pas être une grosse usine à gaz, donc je me dis que c'est le moment d'apprendre les langages web !:P

Il est donc impossible d'avoir une colonne de lien vers mes rubriques sans passer par une base de données php ? On peut pas le faire juste en XHTML et CSS ?

Ca me saoule un peu de devoir passer par une base de données pour quelques pages web pas vraiment compliquées... Surtout que de temps en temps, chez free en tout cas, la base de données est indisponible...

Merci pour le lien bergi ! Je vais regarder ça, ça a l'air pas mal !!

Je sais, google est là pour moi, mais parfois, c'est sympa d'avoir l'avis des "gens qui savent" pour pouvoir commencer avec un tuto bien fait !

bergi · Le 04/08/2006, à 17:09

tu peut te passer de php mais tioon site est dit statique. Pour toutes modification/ajout il faut modifier/créer tes pages à la mimine.

David45 · Le 04/08/2006, à 17:42

quand j'ai voulu créer mon premier site, j'allais là :

allhtml.com

alsacreations

très complet avec des exemples et des squelettes ...

@ + David

Fanof · Le 04/08/2006, à 17:46

Pour le menu, la technique est que tu crée un fichier menu.html qui ne contient que le menu, et grâce à la fonction include(); de PHP son code est inclu dans celui d'une autre page, où tu veux. Ca à l'air compliqué comme ça mais c'est très simple . Tu l'inclus sur toutes les pages de ton site et quand tu rajoute une page, tu édite juste menu.html .

bergi · Le 04/08/2006, à 20:17

avant d'attaquer le php, il serait quand même bien de faire que du html/css pour une meilleur comprehension.
Ne mettons pas la charrue avant les boeufs !

Dernière modification par bergi (Le 04/08/2006, à 20:18)

ponsfrilus · Le 04/08/2006, à 20:30

pépère a écrit :

Il est donc impossible d'avoir une colonne de lien vers mes rubriques sans passer par une base de données php ? On peut pas le faire juste en XHTML et CSS ?

Bon aller je te le dit même au risque de me faire hurler dessus: ca s'appelle des frames

Mais c'est a proscrire normalement... tout comme les présentations en tableaux...

Par contre tu peux faire un menu flottant avec les CSS qui se retrouve sur tout les pages... Sinon le seul moyen en HTML simple c'est de dupliquer ton menu sur toutes tes pages, et la, le jour ou tu en rajoute une c'est la galère... C'est vrai qu'avec php c'est super simple:

<?php //début des balises php
include "./tonfichier.html"; //inclut ton fichier
?> <!-- fermeture des balises -->

Et ton seul et unique fichier se retrouve sur toutes les pages dans lesquelles tu l'appel

EDIT:
Pour te faire une idée des menus en CSS: http://css.alsacreations.com/Galeries-de-menus-en-CSS
Pour les mise en page: http://css.alsacreations.com/Modeles-de-mise-en-page-en-CSS

Dernière modification par ponsfrilus (Le 04/08/2006, à 20:33)

mika · Le 04/08/2006, à 20:46

pépère a écrit :

Il est donc impossible d'avoir une colonne de lien vers mes rubriques sans passer par une base de données php ? On peut pas le faire juste en XHTML et CSS ?

Ou en HTML/CSS

ponsfrilus a écrit :

Bon aller je te le dit même au risque de me faire hurler dessus: ca s'appelle des frames

Arghhhhhhhhh (il en fallait un qui hurle, non ?).

ponsfrilus a écrit :

Mais c'est a proscrire normalement... tout comme les présentations en tableaux...

Les présentations en tableaux sont pas proscrites, c'est la mise en page via les tableaux surtout

Pour tout le reste il y a javascript auquel j'était refractaire mais qui permet maintenant de faire de très jolies choses.
J'utilise en particulier moo.fx pour sa simplicité, mais de nombreuses libs plus complexes et fournies existent.

luron · Le 04/08/2006, à 20:55

Voici deux très bons petits tutoriels pour apprendre rapidement à créer une structure d'un site Internet avec un menu sur toutes les pages, et ce en respectant les standards:
Construire un site sans tableaux
Inclure un fichier dans un autre, grâce à CSS et PHP

pépère a écrit :

DONC, j'en viens enfin à ma demande : connaitriez vous un livre, un site, un tutoriel, expliquant comment on créé tout cela ?

Le livre CSS 2 - Pratique du design web reprend plein de tutoriels du site alsacreations.com et propose des exercices pour consolider la matière apprise durant la lecture.

Aussi, le site fr.selfhtml.org est une des plus importantes références sur le HTML.

ponsfrilus · Le 04/08/2006, à 23:20

mika a écrit :

Arghhhhhhhhh (il en fallait un qui hurle, non ?).

Ouais merci

mika a écrit :

ponsfrilus a écrit :
Mais c'est a proscrire normalement... tout comme les présentations en tableaux...
Les présentations en tableaux sont pas proscrites, c'est la mise en page via les tableaux surtout

Oui c'est ce que je voulais dire, les mises en page....

mika a écrit :

J'utilise en particulier moo.fx pour sa simplicité, mais de nombreuses libs plus complexes et fournies existent.

Marche pas trop chez moi (Firefox 1.5.0.5)

Noé · Le 05/08/2006, à 13:17

Remarque que tu n'es pas obligé de faire du PHP: Tu peux tout à fait générer des pages Web dans le langage que tu veux (Ruby par exemple )

mika · Le 05/08/2006, à 14:40

Noé a écrit :

Remarque que tu n'es pas obligé de faire du PHP: Tu peux tout à fait générer des pages Web dans le langage que tu veux (Ruby par exemple )

Ruby (que j'aime bcp au passage) qui est d'ailleurs très présent chez les hebergeurs, c'est bien connu !

pépère · Le 05/08/2006, à 17:32

Merci à tous pour tous ces conseils !!!

J'ai juste un dernier pb : avec bluefish !

Je l'ai installé via synaptic (version 1.04)... Quand je le lance, à chaque fois que je clique sur "démarrage rapide", j'obtiens ce message :

L'application « bluefish » a quitté inopinément.

Vous pouvez informer les développeurs de ce qui vient d'arriver pour les aider à résoudre le problème. Ou vous pouvez redémarrer l'application maintenant.

Evidemment, je pourrais utiliser un autre éditeur, mais j'ai l'esprit de contradiction : c'est celui là que je veux maintenant...

Bizarre ce bug, non ? Vous utilisez bluefish vous aussi ?

Edit : j'ai fais un rapport de bug.
edit bis : j'ai réglé mon pb en installant la dernière version (1.05)... Merci gdebi !

Dernière modification par pépère (Le 05/08/2006, à 17:55)

pépère · Le 10/08/2006, à 11:51

Alors...

J'ai fait pls essais, mais j'ai un pb.

Voici mon fichier html (éditer avec bluefish)

<?xml version="1.0" encoding="UTF-8"?>
<!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="en">
<head>
<title>Un peu d'R</title>
<meta name="generator" content="Bluefish 1.0.5"/>
<meta name="author" content="pépère"/>
<meta name="date" content="2006-08-10T08:18:10+0200"/>
<meta name="copyright" content=""/>
<meta name="keywords" content=""/>
<meta name="description" content=""/>
<meta name="ROBOTS" content="NOINDEX, NOFOLLOW"/>
<meta http-equiv="content-type" content="text/html; charset=UTF-8"/>
<meta http-equiv="content-type" content="application/xhtml+xml; charset=UTF-8"/>
<meta http-equiv="content-style-type" content="text/css"/>
<meta http-equiv="expires" content="0"/>

<meta http-equiv="refresh" content="5; URL=http://"/>
<link href="/home/david/Un peu d'R/essai.css" rel="stylesheet" type="text/css">
</head>
<body>
<p>Hello word !</p>
</body>
</html>

Je l'ai mis à la racine de mon espace perso, je tape l'adresse, et j'arrive bien sur une page où "Hello word" est écrit...

Pb : au bout de quelques secondes, j'obtiens un message d'avertissement de la part de firefox :

L'URL n'est pas valide et ne peut être chargée

J'ai le mm message quand j'ouvre mon fichier html directement depuis mon /home, et non depuis ma page perso... C'est donc un pb de mon code html, mais j'ai beau le regardé dans le blanc des yeux, je vois pas ce qui va pas !

De quel URL parle-t-il selon vous ? Et comment faire pour qu'il soit valide ?

Dernière modification par pépère (Le 10/08/2006, à 11:52)

PhilippeP · Le 10/08/2006, à 11:59

<link href="/home/david/Un peu d'R/essai.css" rel="stylesheet" type="text/css">

Je ne sais pas ci c'est vraiment une bonne idée l'apostrophe dans le chemin ...

<meta http-equiv="refresh" content="5; URL=http://"/>

et ici apres 5 secondes , il recharge la page avec ...

Dernière modification par PhilippeP (Le 10/08/2006, à 12:01)

ponsfrilus · Le 10/08/2006, à 12:01

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
		<title>Exemple</title>
		<link rel="stylesheet" type="text/css" href="./style.css" />
	</head>
	<body>
		<h1>Hello world</h1>
		<p>cool un paragraphe avec du <b>gras</b> et de l'<i>italic</i></p>
	</body>
</html>

Commence simple, toute tes meta-data sont pas vraiment utiles....

Et avec

<?xml version="1.0" encoding="UTF-8"?>

tu dis au navigateur d'interpréter ton fichier comme de l'xml...

Dernière modification par ponsfrilus (Le 10/08/2006, à 12:03)

ponsfrilus · Le 11/08/2006, à 00:32

luron a écrit :

Remplace ces deux lignes

<meta http-equiv="refresh" content="5; URL=http://"/>
<link href="/home/david/Un peu d'R/essai.css" rel="stylesheet" type="text/css">

par

<meta http-equiv="refresh" content="5; url=/home/david/Un peu d'R/essai.css"/>

Je ne vois vraiment pas l'interet de faire ca... mais bon

luron · Le 11/08/2006, à 02:16

Disons que je suis un peu fatigué et que j'ai lu beaucoup trop vite... Je ne me suis même pas rendu compte que je faisais une redirection vers une feuille de style!

msg_dracula · Le 21/08/2006, à 00:07

Personnellement, je trouve ca bien que tu fasse ton site "a la dure" et non via un CMS. J'ai eu une mésaventure avec Joomla! et Free. En effet, pour l'installation, Il faut normalement modifier certains fichiers a la main pour rendre Joomla compatible avec Free. Or j'ai trouvé une astuce sur un forum qui permet de l'installer sans modifier le fichier de Joomla!. Il suffit de créer un répertoire nommé cession a la racine du FTP et Joomla! s'installe sans probleme. Astuce que je trouvai un peu bizarre, d'autant plus que le répertoire créé devait rester vide, mais astuce qui fonctionne.

Je commence donc a créer mon site avec Joomla, apres plusieur essai pour comprendre l'interface administrateur très (trop?) complete, ainsi que le principe de Sections, Catégorie, Article. Il est vrai que c'est un peu une usine a gaz, qu'il y a plein de template, mais il y a pour moi un probleme, l'absence de réel tuto complet pour répertorier les noms des différentes balises pour créer son template. Qu'a cela ne tienne, avec un peu de patience, j'y arriverai bien a le creer ce template, d'autant plus que la création d'article est simple.

Jusqu'au jour ou :

Je me connecte le matin sur mon site, et la un message d'erreur, free ne peu acceder au repertoire /mnt/4/2/xtremworld/ (un truc dans le genre correspondant au répertoire des serveurs de free. L'astuce visant a créer le répertoire cession n'a pas subbit le choc d'un "nettoyage" ou autre chez free de leur serveurs.

J'avais déja essayer de créer un site en html, ensuite un autre en html+css, puis en rajoutant un peu de php. Apres l'épisode Joomla, j'ai repris la programmation de plus belle, et je vais commencer a inclure des requetes Mysql. Cela fais un an que j'ai commence la programmation, et un an que je progresse. L'interet pour moi n'est pas de me vanter de l'avoir fait de A à Z (quoique....), mais au moins je connait le code et je suis apte a le modifier, a le faire évoluer, et en plus j'aime ca la programmation (je lache rarement l'affaire avant de trouver la solution d'un probleme.)

Tout ca pour dire, oui les CMS sont pratique a utiliser, mais si tu souhaite faire évoluer le site d'une certaine maniere, rajouter des scripts etc..., il est bien plus simple de le faire en créant le code. Par exemple, il est beaucoup plus simple de rajouter un lien pour afficher un flux type présentation d'album jamendo en recopiant le script dans un include php, que de créer un module avec systeme d'installationpour Joomla !!! Enfin, je dis ca, j'ai peut etre tort....

Bref tout ceci pour te souhaiter bon courage. Personnellement, j'ai un peu craqué pour le css et les différentes choses possible a créer grace a ce langage et ce sans javascript.....

Voici les différents site et tutoriels que j'utilise.

Bien évidemment pour les bases :
Le site du zéro
Alsacréation

Pour le css
css play
http://css.maxdesign.com.au/
Mandarin Design surtout les tuto sur les effet de text (pullquote) et l'opacité
Pompage.net notamment cet article Sortez vous la tete des grilles qui fait réflechir sur les oportunité de la mise en page via css.

Pour le php :
Principalement : Php script

Voila, avec tout ca, tu arrivera a faire quelque chose, j'en suis sur. Bon courage a toi !!!!

Dernière modification par msg_dracula (Le 21/08/2006, à 00:07)

papounet · Le 24/08/2006, à 10:01

Bonjour,

Suite à une alerte Google sur joomla!, je découvre votre forum.
A la lecture du sujet, un certain nombre de chose me fond bondir dans le sens ou quelques affirmations sont erronnés.
Loin de moi l'idée d'arriver déguisé en zorro. Mon intention est plus d'éclairer votre lanterne afin que vous disposiez des informations exactes concernant Joomla!

A toute fin utile, je me permet de préciser ces quelques éléments :
- Je fais partit de l'équipe Joomla!FR
- Je suis modérateur sur le forum Joomla!FR
- J'ai un site qui cause le joomla! Il s'agit d'un atelier de conception de tutoriel en ligne dont le sujet principal est la conception des templates pour ce CMS.

Je vous fais un petit topo en dessous après relecture de ce sujet.
Mais un truc rapide pour pas vous ennuyer.

Si vous avez besoins d'informations polus précise sur ce sujet alors ne pas hésiter.

Papounet
PS : J'ai découvert ubuntu avec un Boot-CD en juillet et je vais certainement faire le pas prochainement. Votre forum va m'être certainement très utile.

Dernière modification par papounet (Le 24/08/2006, à 10:05)

Ubuntu-fr

Navigation

Liens de recherche

Annonce

#1 Le 04/08/2006, à 15:28

Tutoriel pour créer un site

#2 Le 04/08/2006, à 15:34

Re : Tutoriel pour créer un site

#3 Le 04/08/2006, à 15:40

Re : Tutoriel pour créer un site

#4 Le 04/08/2006, à 16:16

Re : Tutoriel pour créer un site

#5 Le 04/08/2006, à 16:32

Re : Tutoriel pour créer un site

#6 Le 04/08/2006, à 16:36

Re : Tutoriel pour créer un site

#7 Le 04/08/2006, à 17:03

Re : Tutoriel pour créer un site

#8 Le 04/08/2006, à 17:09

Re : Tutoriel pour créer un site

#9 Le 04/08/2006, à 17:42

Re : Tutoriel pour créer un site

#10 Le 04/08/2006, à 17:46

Re : Tutoriel pour créer un site

#11 Le 04/08/2006, à 20:17

Re : Tutoriel pour créer un site

#12 Le 04/08/2006, à 20:30

Re : Tutoriel pour créer un site

#13 Le 04/08/2006, à 20:46

Re : Tutoriel pour créer un site

#14 Le 04/08/2006, à 20:55

Re : Tutoriel pour créer un site

#15 Le 04/08/2006, à 23:20

Re : Tutoriel pour créer un site

#16 Le 05/08/2006, à 13:17

Re : Tutoriel pour créer un site

#17 Le 05/08/2006, à 14:40

Re : Tutoriel pour créer un site

#18 Le 05/08/2006, à 17:32

Re : Tutoriel pour créer un site

#19 Le 10/08/2006, à 11:51

Re : Tutoriel pour créer un site

#20 Le 10/08/2006, à 11:59

Re : Tutoriel pour créer un site

#21 Le 10/08/2006, à 12:01

Re : Tutoriel pour créer un site

#22 Le 11/08/2006, à 00:32

Re : Tutoriel pour créer un site

#23 Le 11/08/2006, à 02:16

Re : Tutoriel pour créer un site

#24 Le 21/08/2006, à 00:07

Re : Tutoriel pour créer un site

#25 Le 24/08/2006, à 10:01

Re : Tutoriel pour créer un site

Pied de page des forums