La première question, qui est à mes yeux la plus importante pour les débutants :
Quels logiciels utiliser ?
Il nous faut donc :
- un logiciel de graphisme
- un logiciel d´édition de pages
- un hébergeur
- un client FTP
- un serveur local ( facultatif)
1. le logiciel de graphisme
Il en existe une pléthore, dont les plus connus sont Photoshop ( Adobe), Fireworks ( Macromedia), et Paint Shop Pro ( Jasc Software).
Disposant de fonctions d´enregistrements spécifiques aux page Web, ils permettent de créer un design.
Pour ma part, j´utilise photoshop, mais nombreux sont ceux qui lui préfèrent Fireworks, complètement orienté vers la création de pages ( Alors que ce ne sont que des fonctions " rajoutées" sur Photoshop).
Il est à noter que Photoshop est accompagné du logiciel ImageReady, très utile pour crééer ses tranches; générer des pages automatiquement depuis une découpe du design, ainsi que pour faire les gifs animés. C´est une " copie" des fonctions de Fireworks.
ne connaissant pas du tout Paint Shop Pro, je préfère m´abstenir de le commenter.
Inconvénient des trois logiciels : ils sont payants.
Il existe une alternative : The Gimp.
Issu du monde Linux, ce logiciel se veut le pendant gratuit de Photoshop.
Ici aussi, je ne dispose d´aucune information supplémentaire.
2. Le logiciel d´édition de pages
Selon moi, il n´y a qu´une seule solution valable : le célèbrissime Dreamweaver ( Macromedia).
utilisé par les professionnels, ce logiciel est le plus complet de sa catégorie.
Il permet, avec ou sans connaissances du langage HTML, de créer ses pages rapidement ( pour peu que la page ne soit pas trop complexe, bien sûr).
Je vous conseille tout de même fortement d´apprendre le HTML, ce n´est pas aussi dur qu´il n´y parait, et c´est très utile.
Dreamweaver se classe dans les logiciels dits " WYSIWYG" ( What You See Is What You Get, traduisez par " Ce que vous voyez est ce que vous obtenez"). C´est à dire qu´une modification dans le logiciel, apparaîtra à l´écran telle qu´elle sera sur le navigateur.
Adobe a lui aussi lancé son logiciel d´édition de pages : GoLive. Encore une fois, je ne dispose pas d´information, et m´abstiendrai de tout commentaire; ceci juste pour vous faire savoir qu´il existe.
Inconvénients de ces deux logiciels : ils sont payants.
Vous pouvez aussi utiliser des outils tout simples, pour créer les pages.
Il vous suffit pour cela de conna^tre le HTML, et d´utiliser un éditeur de texte brut, comme le notepad de windows.
Il existe, bien sûr, une pléthore d´éditeurs gratuits, plein d´options ( Indentation automatique du code, coloration syntaxique . . .). A vous de les trouver.
3. L´hébergeur
Pour pouvoir mettre vos pages à la disposition des internautes, il vous faut tout d´abord choisir un hébergeur. Cet organisme, payant ou non, vous propose ses services, qui sont toutefois assez différents.
Je fais ici un cours pour les débutants, donc je parlerai uniquement des hébergeurs gratuits.
La plupart des fournisseurs d´accès, proposent déjà un hébergement gratuit à leurs abonnés : renseignez-vous !
Sinon, les deux principaux hébergeurs gratuits sont :
http://www.free.fr
Espace de 100 Mo
Pas de pub
Php/Mysql sous certaines conditions
Quelques lenteurs parfois, dûes au nombre impressionnant de sites hébergés
http://www.multimania.lycos.fr/
Espace de 50 Mo
Présence de pop-ups ET de bandeaux de pub sur les pages
Php/Mysql
4. Le client FTP
Un client FTP est un logiciel qui se connecte, via un nom d´utilisateur et un mot de passe, à un ordinateur relié à Internet appelé " serveur". c´est sur ce type d´ordinateurs que sont stockés tous les fichiers que vous pourrez trouver en surfant.
Une fois votre hébergeur trouvé, vous pouvez vous mettre en quête d´un client FTP.
On en trouve plein sur http://www.telecharger.com
Pour ma part, j´ai choisi LeechFTP, qui a l´avantage d´être entièrement gratuit, simple et fonctionnel.
Lorsque vous lancez le logiciel, il vous faut créer une connection, dans laquelle vous paramétrerez plusieurs choses :
Le login est l´identifiant donné par votre hébergeur
Le mot de passe est le mot de passe donné par votre hébergeur.
Le " host", ou " chemin", est un lien vers votre hébergeur. Dans le cas de Free, il s´agit de " ftpperso.free.fr".
il ne vous reste plus qu´à faire transiter vos fichiers depuis votre ordinateur vers le serveur.
On appelle cette action " uploader", en opposition avec " downloader" ( télécharger). il n´y a pas de correspondance en français pour ce premier terme.
5. Le serveur local
Pour ceux qui désirent commencer leur apprentissage des langages dynamiques, comme le PHP, il existe des logiciels permettant de créer un serveur sur votre ordinateur. Une fois ces logiciels installés et configurés, vous pouvez tester vos pages directement de chez vous, sans avoir à les uploader à chaque fois.
Pour le PHP, le plus connu est easyPHP, disponible gratuitement sur http://www.easyphp.org
Il vous installe Apache, Mysql, PhpMyadmin en un clin d´oeil.
Sinon, pour visionner, créer et modifier vos tables MySQL, je ne saurais que vous conseiller le logiciel MySQLFront, véritablement très pratique.
cpatain_torche
>> Comment faire un design ?
I. Le logiciel
Je vous conseille soit Photoshop 7.0 soit Fireworks MX.
_____A. Adobe Photoshop 7.0 ( PS)
PS est le plus puissant logiciel de création d´image ( non-vectorielles). Il est un peu difficile d´accès mais une fois saisi, on peut faire tout ce que l´on veut. Certains critiqueront l´absence d´option web pour l´interactivité, mais ne vous y tromper pas, les logiciels qui les génèrent automatiquement ne les génèrent pas toujours bien. Pour ceux qui tiennent vraiment à ces options, il y a ImageReady. Cependant, rien que le fait qu´il ne soit pas directement intégré à PS montrent qu´il est là pour faire joli plutôt que pour servir.
Quelques liens pour Photoshop ( liste subjective et non exhaustive):
- http://www.pierre-z.fr.st ; -)
- http://www.falkenzone.com
- http://www.deepnight.net
_____B. Macromedia FireWorks MX ( FW)
Plus facile d´accès, complètement orienté création de design, je ne sais pas pourtant si on peut dire qu´il est mieux. FW c´est un PS avec PLEINS d´options et quasiment tout les filtres en moins... Il est finalement assez dur à maitriser por faire un design qui ne pue pas le vectoriel.
Quand aux options d´interactivité et d´exportation HTML, je ne saurais que vous conseiller de ne pas les utiliser et ainsi maitriser votre code.
_____C. Les autres
Bien entendu, d´autres logiciel de création de design existent. Masi aucun ne vaut Photoshop. Quelqu´un me souffle PaintShop Pro, ça ressemble plus à un Paint intégré à Windows qu´autre chose.
Pour les autres, je ne les connais pas.
II. La création
L´étape la plus difficile ( pour moi en tout cas) est d´avoir l´idée du design, se l´imaginer ou faire un croquis. Quelque chose à ne surtout pas faire: mettre tout les effets qu´on sait faire par-ci par-là ou mettre toutes les images qui nous plaisent. L´unité de design est à respecter: il ne faut SURTOUT PAS mélanger les styles. Quand vous voyez un design et que vous vous dites: " Mouarf, on voit que le mec c´est un débutant" ou alors " Plus style ´page perso´ que ça tu meurt", c´est que le designer n´a pas suivi une des consigne ci-dessus. La plupat du temps, les gens veulent un design qui fasse " pro", le secret pour y arriver c´est l´unité de style, deux couleur maximum ( un principale et une " interactive", qui vous servira à faire les effets) et le soucis du détail: rien ne doit être laissé au hasard, tout doit être cohérent et irréprochable.
III. L´exportation en HTML
Une étape pas particulièrement dure masi parfois longue si on n´a pas beacoup d´expérience.
Le principe d´un design, c´est un tableau rempli de cellules dans lesquelles vous mettez des morceau de design. Pour un alignement au pixel près des images, il ne faut mettre aucune marge intérieure dasn les cellules ni d´espacement entre celle-ci. Et surtout, il NE FAUT PAS utiliser les calques. La tentation est souvent grande mais il ne sont souvent pas bien interprété par le navigateur.
Pour rendre un design extensible à souhait ( c´est-à-dire pouvoir écrire un texte aussi long que l´on à envie, ou des menus à ralonge...) il faut mettre des images en arrière plan des cellules, ainsi, si la cellule doit s´agrandir a cause d´un texte trop long, la cellule s´agrandira sans rien dérangé.
Un fois les design mis en HTML, il faut absolument l´enregistrer comme modèle ou assimilé. Comme ça, si une modification du design est impérative, seul le podèle devra être modifié et toutes les autres pages le seront.
IV. Le mot de la fin
ON NE PEUT PAS FAIRE UN BON DESIGN DU PREMIER COUP... Ca demande un minimum de pratique.
blawk
Salut à tous,
Beaucoup de personnes nous demandent comment s´inscrire sur un hébergeur et surtout comment transférer ses pages. Je vais essayer de vous expliquer ça...
Un des meilleurs hébergeurs du web français est Free ( 100Mo, Php-MySQL, sans pub... voir message plus haut dans ce topic.). Cependant, pour s´inscrire à Free, il faut avoir un compte chez eux et demander un CD d´installation ( je crois).
Pour inscrire sa page perso, allez dans Gérer vos comptes puis dans Gérer votre connexion et ensuite Créer vos comptes supplémentaires. Rentrez vos cordonnées. Allez ensuite sur l´adresse que vous venez de créer
( http://votre_adresse.free.fr ) . Une page s´affiche avec marqué en gros " Pages persos des Freenautes", en-dessous, un petit texte, et cliquez sur le lien " activer". Cela vous dirige sur une page de chez Free. Rentrez votre nom de site et votre mot de passe que vous avez choisi. Voilà, vous êtes hébergé chez Free ! Mais je crois qu´il faut patienter quelques heures...(1 ou 2 heures).
Maintenant, vous devez transférer vos pages. Choisissez sur
http://www.telecharger.com un client FTP comme : FlashFXP ou CuteFTP ou FTP Expert... etc... ( Pour Mac, prenez Captain FTP ou Transmit). Lancez votre logiciel que vous venez de télécharger, et paramétrez le :
Serveur ( chez Free) : ftpperso.free.fr
Utilisateur : Nom de votre site
Mot de passe : Mot de passe de votre site
Faites glisser vos pages dans la partie exprès pour ça, vos pages s´uploadent, elles se transfèrent sur Internet.
Retournez sur votre adresse ( http://votre_adresse.free.fr ) et vous voilà sur votre site web ! Si vous voyer plusieurs fichiers et marqué en haut de l´écran " Parent Directory", c´est que votre page principale, index.htm ( ou php), n´existe pas. renommez votre page principale et reuploadez-la.
Et là, normalement, vous vous trouvez sur votre page principale de votre site.
@+
Colas
