Forums Webou.net - Hébergement gratuit et sans publicités avec PHP/MySQL

Hébergement Webou.net => Tutoriels => Discussion démarrée; par: K@cem le 07 Juin 2007, 20:48:01



Titre: Les outils indispensables du Webmaster !
Posté par: K@cem le 07 Juin 2007, 20:48:01
Bonjour,
Dans ce tuto je vais vous parler des outils que chaque Webmaster doit avoir dans son ordi  :)

Je vais juste vous les présenter et vous donner des liens qui peuvent vous aider à les utiliser ...

Sommaire :

  • Notepad++ : Voyez la vie en couleurs !
  • FileZilla : Transférez votre site.
  • WAMP : Pourquoi ne pas tester avant de mettre en ligne ?
  • Web Developer : Une extension pas comme les autres.

Notepad++

Notepad est un éditeur de texte gratuit, libre et qui a pour particularité la coloration syntaxique de votre code source !
Il supporte un bon nombre de languages, et peut aussi colorer des mots définis par l'utilisateur ...
Il a aussi comme point fort une fonction de recherche et de remplacement très developpé, et la gestions de plusieurs onglets avec une rapidité tel que vous ne sentirez même pas qu'il est lancé  :D
Il dispose d'une interface si simple que je ne vais même pas vous écrire un article sur son utilisation  ;D

Site officiel : http://notepad-plus.sourceforge.net/fr/site.htm
Page de téléchargement : http://notepad-plus.sourceforge.net/fr/site.htm

FileZilla :

FileZilla est un client FTP (File Transfer Protocol) gratuit, rapide et fiable !
Ce logiciel propose tout ce dont vous avez besoin pour le transfert de fichiers :
  • éditeur de connexions
  • connexion par protocole SSH
  • répertoire de liens déjà visités
  • compression des données en cours de chargement (accélère la vitesse de transfert)
  • réglage de la bande passante
  • double fenêtre paramétrable type explorateur (à gauche votre disque dur et à droite l’ordinateur distant).
Il conviendra aussi bien au débutant qu’à l’utilisateur confirmé, qu’il soit casanier ou nomade puisque qu’il existe également une version "portable" utilisable directement depuis une clé USB par exemple  ;D

Pour configurer votre site il suffit de cliquer sur le petit ordinateur en haut a gauche du logiciel :

(http://img528.imageshack.us/img528/4111/tutorielfilezillaiw2.gif)

Vous devez maintenant renseigner les champs qui vous sont fournis par votre FAI ou hebergeur, vous les trouverez dans votre espace client en ligne :

1-Cliquez sur "nouveau site"
2-Donnez un nom a votre connexion
3-Rentrez l'adresse de votre serveur ftp
--> Pour webou : 72.52.150.151
4-Cochez "normal"
5-Rentrez vos noms d'utilisateur et mot de passe
6-Validez

Pour plus d'infos sur sa configuration je vous invite à lire ceci : http://www.pcentraide.com/index.php?showtopic=26  ;)

WAMP :

WAMP5 est une plateforme de développement Web sous Windows. Il vous permet de développer des sites Web dynamiques à l'aide du serveur Apache2, du language de scripts PHP5 et d'une base de données MySQL version 5. Il possède également PHPMyAdmin et SQLite Manager pour gérer plus facilement vos base de données.

Bref WAMP permet de faire ce que le serveur de webou.net fait mais en local (sur votre ordinateur)  :)

Pourquoi je vous présente WAMP ?
Pour pouvoir tester son siten, le changer, le développer mais en local !
Si ces changements se sont bien déroulés il vous suffira de transférer ce que vous avez changé ...
WAMP dispose aussi d'un Add-On très utile qui permet de switcher entre PHP 4 et PHP 5 en 1 minute  :D

Commencez par télécharger WAMP sur cette page --> http://www.wampserver.com/download.php
Installez le (suivant, suivant ...  :P ) et lancez le !

Pour plus d'infos sur son utilisation je vous invite à lire ce tuto :
http://www.vulgarisation-informatique.com/ide-php-wamp.php

Web Developer :

Web Developer est une extension de Firefox, elle pourrait être définie comme "le couteau suisse pour Webmasters" !!

Vous pouvez l'installer via cette page : http://chrispederick.com/work/web-developer/

Petite revue des menus :

Dans le premier menu, Désactiver, vous pourrez par exemple

    * Désactiver le Javascript, utile en terme de test d’accessibilité, en effet le Javascript dans vos pages peut masquer certaines informations.
    * Pourquoi ne pas repartir de zéro et "désactiver les couleurs de la page", vous pourrez même désactiver tous les styles Css de la page (et ce de façon précise : ceux inclus dans la page, ceux liés à une feuille externe)
    * Depuis que vous utilisez Firefox, les popups vous manquent ? et bien choisissez "désactiver le bloqueur de popups pour les voir réapparaître.
    * ...

Passons le menu CSS (plus bas) pour s’attarder au menu Form. qui vous permettra de tester les formulaires des pages web :

    * tester les variables envoyées en Get ou en Post
    * voir les informations liées aux formaulaires : adresse du script utilisé, ID, voir les mots de passe que vous entrez
    * ...

Le menu images

    * vous donnera des informations visuelles : taille, affiche/masquer...
    * vous permettra par exemple de repérer les images qui n’ont pas d’attribut "alt" (accessibilité), qui n’ont pas de taille spécifiée, de repérer les Url des images.

Les menus Informations et Divers sont des petits fourre-tout où l’on trouvera des choses bien utiles comme :

    * l’affichage des AccesKeys
    * l’affichage de la taille des blocs
    * Vous pourrez repérer facilement les "ID" et les "Class"
    * Lire les informations sur les cookies ou les effacer
    * Vider le cache
    * Afficher les commentaires du code Html
    * ...

Le menu "Entourer" permet de repérer la "super-structure" de la page en mettant en évidence les blocs, frames, cellules de tableaux... on peut personnaliser les couleurs d’affichage des blocs en fonction des éléments "div" de la page.

Vous pourrez rapidement redimensionner vos pages dans autant de résolutions que vous souhaitez (il suffit d’en rajouter)

Le menu validation permet de renvoyer vers les "validateurs" connus ( Html, css, accessibilité ). Cette liste est personnalisable, et vous seriez bien inspiré d’y rajouter ce validateur (http://validateur-accessibilite.apinc.org/index.php) Html moins "froid" que celui du W3C et francophone de surcroît. A noter que vous pourrez même tester une page produite en local.


Voilà j'espère que ces outils vont vous aider à faire de supers sites  :D
Je les utilise et croyez moi il vont vous faciliter la vie !
A+


Source : http://www.framasoft.net/


Titre: Re: Les outils indispensables du Webmaster !
Posté par: Ninety le 08 Juin 2007, 09:55:52
Et comme Mac prend de plus en plus de part de marche :D

On a :

  • Smultron (http://smultron.sourceforge.net/) qui remplace Notpad++
  • Cyberduck (http://cyberduck.ch/) qui remplace FileZilla
  • MAMP (http://www.mamp.info/en/index.php) qui remplace WAMP ou encore EasyPHP (Eh hop un petit tuto (http://www.siteduzero.com/tuto-3-13553-1-votre-serveur-local.html) pour utiliser MAMP :))
  • Concernant Web Developer, Firefox existe aussi sur Mac :P


Titre: Re: Les outils indispensables du Webmaster !
Posté par: K@cem le 08 Juin 2007, 13:05:12
Notepad++ est libre donc il peut être téléchargé (Son code source) et compilé sous n'importe quel OS  :)
Sinon j'ajouterai peut être une partie pour les autres OS (Linux & Mac  ;) )
Merci pour les liens que tu viens de donner !
A+


Titre: Re: Les outils indispensables du Webmaster !
Posté par: Ninety le 08 Juin 2007, 20:46:27
Ah ok je savais pas :) Sinon sous Linux j'utilise Bluefish Editor, XAMPP et gFTP.


Titre: Re: Les outils indispensables du Webmaster !
Posté par: damon le 22 Juin 2007, 23:28:51
FileZilla est maintenant sous GNU/Linux!

Est disponible uniquement sur le site de développement du projet (http://www.filezilla-project.org/nightly.php) et est intégré au dépot universe de Ubuntu 7.04.


Titre: Re: Les outils indispensables du Webmaster !
Posté par: K@cem le 23 Juin 2007, 00:49:46
Oui je viens de le voir !
Merci damon pour cette merveilleuse nouvelle :)


Titre: Re: Les outils indispensables du Webmaster !
Posté par: emmanuel le 27 Juin 2007, 22:44:30
Bonsoir à tous,

Comme éditeur gratuit, j'utilise Hapedit.
Simple et efficace, il fait mon bonheur

http://hapedit.free.fr/


Titre: Re: Les outils indispensables du Webmaster !
Posté par: K@cem le 28 Juin 2007, 01:42:58
D'après les screens que j'ai vu, notepad++ ou PSPad  sont mieux !
Mais bon, j'ai jamais essayé pour en être sûr ... :D


Titre: Re: Les outils indispensables du Webmaster !
Posté par: Ninety le 28 Juin 2007, 13:01:43
Je pense qu'il ont besoin d'une grosse MaJ vu la tronche du logiciel ^^


Titre: Re: Les outils indispensables du Webmaster !
Posté par: Angel-Queen le 01 Avril 2008, 18:10:59
Bien le bonjour, tout d'abord, merci pour tout les tutoriels, c'est bien sympa.
Ensuite, j'aimerais bien savoir comment avoir "web développeur" en français. Pas que je parles pas anglais mais c'est quand même plus agréable.

D'avance merci, Angel

Edit pour en dessous : merci beaucoup -_-... mais c'est toujours pas en français... peut-être demain.


Titre: Re: Les outils indispensables du Webmaster !
Posté par: K@cem le 01 Avril 2008, 21:58:10
Ici : https://addons.mozilla.org/fr/firefox/addon/60


Titre: Re: Les outils indispensables du Webmaster !
Posté par: district9 le 02 Avril 2008, 09:36:04
Moi aussi j'utilise HAPedit, ne vous fiez pas aux apparences, malgré son aspect, c'est un très bon éditeur, simple et très très efficace !!
Comme le dit le proverbe : "l'habit ne fait pas le moine." Et en plus il est gratuit ...  ;)


Titre: Re: Les outils indispensables du Webmaster !
Posté par: nitro007 le 04 Juillet 2008, 20:28:33
Bloc-notes et le meilleur editeur !


Titre: Re: Les outils indispensables du Webmaster !
Posté par: K@cem le 05 Juillet 2008, 00:44:27
Bloc-notes et le meilleur editeur !
Bloc notes fait une colorisation syntaxique ?
Bloc notes fait de l'Auto-complétion ? gère plusieurs documents par onglets ? gère l'indentation du code ?
Non, je ne vois donc pas pourquoi bloc note serait le meilleur éditeur ^^
++


Titre: Re: Les outils indispensables du Webmaster !
Posté par: anonyme480 le 08 Juillet 2008, 19:34:36
Personnellement, sous Linux j'utilise également bluefish qui est selon-moi un exellent logiciel. Je le préfère a notepad++ (ce dernier est moins axé développement web) et n'est pas disponible sur toutes les distrib linux, notamment mandriva.


Titre: Re: Les outils indispensables du Webmaster !
Posté par: Kykoonn le 08 Juillet 2008, 22:58:20
Hello :)

Notepad++ est dispo que sous windows sauf si t'emules :) perso j'utilise Geany sous Gentoo et c'est vraiment sympa pour tout type de codes, je testerai peut être bluefish à l'occaz

bonne soirée :)

Kykoonn


Titre: Re: Les outils indispensables du Webmaster !
Posté par: Ninety le 09 Juillet 2008, 22:52:31
Sous Linux j'utilisais bluefish aussi mais il me creait plein de fichier temporaire qui s'effacait pas (qui finissait pas ~). Du coup, je suis passer a gEdit, et il est bien meilleurs a mon gout ;). Si tu veux, va dans les prefs et essayer de modifier un peu ses apparences =).


Titre: Re: Les outils indispensables du Webmaster !
Posté par: K@cem le 12 Juillet 2008, 19:27:27
Sous Linux j'utilisais bluefish aussi mais il me creait plein de fichier temporaire qui s'effacait pas (qui finissait pas ~). Du coup, je suis passer a gEdit, et il est bien meilleurs a mon gout ;). Si tu veux, va dans les prefs et essayer de modifier un peu ses apparences =).
Je viens de tester bluefish et je le trouve bien, mais il ne me crée pas de fichiers temporaires ...
Peut être parce que je n'ai pas crée un projet ?
Si c'est pour cette raison il est tout à fait logique de créer des fichiers de config où le programme enregistre les options du projet ;)


Titre: Re: Les outils indispensables du Webmaster !
Posté par: Ninety le 13 Juillet 2008, 13:32:50
Bizar ^^ Les fichiers temporaires sont cacher (Ctrl+H).
J'ai pas creer de projet avec ...


Titre: Re: Les outils indispensables du Webmaster !
Posté par: eragon31 le 31 Juillet 2008, 13:12:44
personellement j'utilise pspad
http://www.pspad.com/fr/
je le conseille vraiment
il gere des projets fait les colorations syntaxiques (pouvant etre personalisée) possede un boite de couleur etc
il fait meme le ftp


Titre: Re: Les outils indispensables du Webmaster !
Posté par: WebManiaK le 15 Septembre 2008, 19:19:17
Bonjour.

Personnellement, j'ai deux configurations totalement différentes (puisque deux ordinateurs... l'un pour le boulot et l'autre pour moi).
Le premier est sous Windows XP et tourne avec, comme outils webmasters:
  • Editeur de fichiers: Notepad++
  • Serveur web: XAMPP d'ApacheFriends
  • Navigateurs: Firefox 3 + IE 7 (c'est toujours bon de savoir si tout le monde peut accéder de la même manière au site développé :) )
  • Logiciel FTP: FileZilla
Mon PC perso est, quant à lui, sous Linux Ubuntu et utilise cette configuration qui me convient parfaitement:
  • Editeur de fichiers: SciTE
  • Serveur web: Serveur LAMPP créé grâce à Ubuntu-fr.org (http://doc.ubuntu-fr.org/lamp)
  • Navigateurs: Firefox 3
  • Logiciel FTP: gFTP


Titre: Re: Les outils indispensables du Webmaster !
Posté par: icogne le 29 Mars 2009, 18:34:56
Bon post. Tu peux rajouter Kompozer, qui permet de se passer de notepad+++.


Titre: Re: Les outils indispensables du Webmaster !
Posté par: Angrod le 13 Juin 2009, 14:21:56
Bonjour!

ça n'engage que moi mais Komposer est un véritable instrument de torture pour le net. Il code mal, c'est inutile, trop simpliste et complètement dépassé par le web 2.0 bref que du négatif pour moi. Pour moi c'est Notepad++ sous Windows et simplement Gedit sous Linux.

enfin si je suis venu poster ici, c'est aussi pour vous parler d'un super p'tit logiciel pour le design de votre site (et oui on en parle pas assez !). Combien de temps avez-vous passé à chercher les bons dégradés de couleurs ? à chercher la couleur que vous voyez à l'écran mais que vous n'arrivez pas à aspirer ? ce temps est révolu avec... La Boîte à Couleurs !
Certes ce logiciel n'est pas libre mais il est tellement léger qu'il est indispensable (à mon humble avis) pour faire des dégradés, trouver des couleurs complémentaires etc.. (il fonctionne uniquement sous Windows désolé  :( 98, 2000, XP et même Vista)
voici le lien http://pourpre.com/colorbox/index.php (http://pourpre.com/colorbox/index.php)

Il doit certainement en exister beaucoup d'autres pour Mac et Linux, mais je vous présente celui que j'utilise sous Windows parce que je le trouve très simple d'utilisation et très léger. Pourquoi faire compliqué quand on peut faire simple ?
Sous Linux : ColorZilla, Gcolor je crois (j'aime bien ColorZilla  :) )
Mac : même si je ne connais pas bien Mac je crois qu'il y a un outil de ce type déjà installé dans le système (ils sont forts ces Mac ;) )


Titre: Re: Les outils indispensables du Webmaster !
Posté par: Ninety le 18 Juin 2009, 20:13:17
...et simplement Gedit sous Linux.

+1

... ils sont forts ces Mac ;)

Oui très :P.

Si je me trompe pas sur la fonction du logiciel, il y en a deux sur Mac : DigitalColor Meter et Pixel (un peu moins pratique, mais sympa pour voir si les pixels sont alignes).

(http://img14.imageshack.us/img14/7395/picture1scx.png)
(http://img44.imageshack.us/img44/637/picture2lrj.png)
(http://img40.imageshack.us/img40/7360/picture3xoz.png)

Voila ;).


Titre: Re: Les outils indispensables du Webmaster !
Posté par: olivierkrb le 24 Juillet 2009, 05:13:07
FileZilla est maintenant sous GNU/Linux!

GFTP est préfèrable à Filezilla. Les mêmes fonctionnalités à quelques détails près. Son gros avantage, il se comporte comme un gestionnaire de fichier digne de ce nom. Avec filezilla, il y a des types de fichier réellement difficile à supprimer, alors qu'avec gftp, ca passe comme une lettre à la poste.
gftp est dans toutes les ditributions linux. Il n'est pas forcément installé par défaut mais le fichier n'est pas spécialement gros à télécharger. Il fonctionne avec gnome ou gtk


Titre: Re: Les outils indispensables du Webmaster !
Posté par: doc2rue le 04 Juillet 2016, 20:07:43
Franchement VIM et pour moi le meilleur editeur windows ou linux ou mac pas de probleme et avec un vimrc bien écrit il peut s'adapter automatiquement au changement d'OS.
Donc un seul éditeur à maitriser pour tous OS . et super puissant . Sauf qu'il ne fait pas encore les pizza ni le cafe. Par dans son man (help) il possede la reponse de l'univer.
Pour voir tapez :help 42   8)  ::)