Howtos GNU/Linux .: kozaki :. Howtos GNU/Linux

FAQ Linux applications : Création internet

WEBMASTERING : Création HTML/PHP sous Linux

édition WYSIWYG

What You See Is What You Get - Ce que vous voyez est ce que vous obtenez)

Tous ceux qui ont fait du webdesign utilisent certainement Dreamweaver MX, Flash MX, FrontPage (oh nooon!) et autre Webexpert. Certains de ces programmes ne sont pas forcément à la portée de toutes les bourses... et d'autres ne respectent pas forcément les standards du web (dont ceux du W3C), produisant du code très peu optimisé voire non accessible.
Mais quelles sont les outils sour Linux ?

Get NVU

NVU / Kompozer : création web WYSIWYG

Nvu (prononcer "N-View" ou "New View"), est basé sur le standard W3C en collaboration avec Lindows.
Kompozer le remplace depuis 2007.
NVU/Kompozer propose une utilisation simple (idéale pour les non programmeurs), de la puissance et le fameux mode de création WYSIWYG. Que demander de plus, la gestion des comptes FTP ? nvu le fait aussi...

NVU 0.80 frNVU 1.0 en français

Comme toujours chez Mozilla, toutes les versions antérieures à la version 1.0 ne sont "que" des démonstrations technologiques de ce que pourra faire la version finale du logiciel. Bref, c'est un logiciel de création (x)HTML WYSIWYG basé sur Mozilla Composer, Open Source et cross-platform (disponible pour Linux, pour Windows et Mac_OS_X).
La version actuelle : NVU-1.0 FR (juin 2005) apporte un lot conséquent de corrections de bug et nouveautés (la version 0.81 apportait déja le support expérimental du XHTML 1.0 (cochez la case dans la boite de dialogue 'Fichier > Nouveau'), numérotation des lignes dans la vue du code source, Support de <?php ... ?>, ...).

Ce nouveau programme (apparu mi-2004) est encore en version béta. Cependant si vous désirez un éditeur wysiwyg, ressemblant à Dreamweaver 3, pour créer des pages (x)html, avec un éditeur css, alors essayer NVU est une bonne idée, et il est gratuit...

Installation

  • Installez NVU-1.0 ou Kompozer comme n'importe quel autre package.
  • Ou sinon voici comment installer la version française manuellement
    - désinstallez la version précédente (en supprimant son répertoire si vous l'aviez installé manuellement, ceci laissera votre profil en place), puis
    - téléchargez l'archive ~.tar.bz2 (fonctionnera pour Mandriva, Fedora et tout autre distribution Linux),
    - décompactez-là (par exemple dans /opt/mozilla/, ou dans un dossier de votre répertoire personnel).
    - Lancez NVU-1.0-FR en console en tapant : /là_où_nvu_est_décompacté/nvu.
    - Pour créer une icone, cliquez droit sur votre bureau > Ajouter un lien vers une application et dans l'onglet "Application", collez le /chemin_nvu_est_décompacté/nvu, puis cliquez [OK] ; vous trouverez l'icone NVU dans le dossier nvu.
    - Pour créer l'entrée 'nvu' dans le menu (grace à l'utilitaire KDE ou menudrake). Vous pouvez simplement créer un alias vers /usr/local/mozilla/nvu-0.80/nvu dans le fichier /home/foo/.coderc
  • Infos supplémentaires :
    - Si le système vous renvoit un message au lieu de lancer NVU, c'est vraissemblablement qu'il manque une ou des librairies (leur installation n'est pas automatique si l'on installe à partir des sources). Pas grave, il suffit de l'installer ! Donc lorsque j'ai lu le message :
    /usr/local/mozilla/nvu-0.80/nvu-bin: error while loading shared libraries: libstdcrel="external"-libc6.2-2.so.3: cannot open shared object file: No such file or director, j'ai fait un petit tour sur rpm.pbone.net où j'ai trouvé le pakckage 'libstdcrel="external"2.10-2.96-0.83mdk', que j'ai installé de suite. Plus de problème ensuite.
    - Lancez NVU une fois en tant que root (pour que nvu puisse créer les fichiers nécessaires à son fonctionnement optimal) ; fermez-le, & repassez en simple utilisateur.

nvu : conserver le format originalGuides :

  • Une des premières choses à faire, si vous retouchez des pages existantes, est de cocher "Conserver le format source d'origine" dans les préférences.
  • Nvu 0.6 par Framasoft
  • N|vu : Ze|N tutoriel : ce tutoriel de 179 pages aux formats PDF ou OpenOffice couvre l'installation, la configuration et l'utilisation de NVU ; il peut certainement vous permettre de combler quelques lacunes :-)
    L'avenir de "N|vu : Ze|N tutoriel" : "Avec la version expérimentale de Nvu-0.6-aviary (modulaire), le programme prend un tournant majeur. Ce qui a pour conséquence la modification de la structure du tutoriel.
    La version 0.6-aviary fait de Nvu un programme modulaire avec la possibilité d'ajouter de nouvelles extensions, des thèmes, etc. De plus une première contribution externe (htmlheader) vient de paraitre et permet la modification de l'en-tete d'une page html en ajoutant des nouvelles balises meta, d'insérer plus facilement des scripts javascript ou d'ajouter des commentaires dans une feuille de style. D'autres modules intégrés deviennent des extensions xpi (format pour les extensions basées sur gecko). l'inspecteur dom, le déboggueur venkman." (fun sun)
  • Gérer un site avec Nvu 0.41 : un slide show instructif de 89 pages ou diapos : description de la fenetre de travail, gestion d'un site web, édition de pages webs et trucs et astuces pour gagner du temps.
  • NVU 0.40-41 Tutorial

À mon avis très pratique pour réaliser assez rapidement quelques pages web ou un petit site, il est (encore) inadapté à une utilisation intensive. attention Par exemple, il modifie le markup quand j'enregistre, meme si je coche "Don't modify when saving / uploading" et ça, c'est pas possible si on édite le code à la main ensuite, nomdedjiou !!

Mozilla Composer & CuneAform HTML Editor

Création / édition de pages web en (x)HTML, CSS, éditeur WYSIWYG.

Composer (inclu dans la suite Mozilla) et, dans une certaine mesure, CuneAform HTML Editor (extension pour Firefox), permettent tous deux d'éditer et créer de bonnes pages web statiques.
Voici quelques guides :
  - "Design a web site with Linux with Mozilla Composer and Mozilla Css Styler Plugin"
  - "Css n' Style Using Mozilla Composer and CSS Style Plugin"

N'hésitez pas à proposer un lien sur le forum ; nous vous en serons reconnaissants !

Éditeurs statiques évolués

bluefish quanta screem cssed

Le code produit par les éditeurs WYSIWYG ne vous satisfait pas vraiment, vous appréciez des fonctionnalités telles que la complétion automatique de commande, l'aide en ligne, la coloration syntaxique, la mise à jour vers/depuis le site distant ou la gestion de projet à plusieurs ? Les puissants éditeurs statiques suivants vous satisfairont plus que NVU

bluefish-1.0BlueFish

Voici un éditeur apportant des fonctions similaires à Quanta (ci-dessous).
Plus léger & rapide que Quanta et Screem (quoique Quanta s'est bien amélioré de ce coté), il propose des syntaxes personnalisables avec le support et les modèles de base pour entre autres : HTML, PHP, C, Java, JavaScript, Java server pages (JSP), SQL, XML, Python, Perl, Cascading stylesheets (CSS), ... !
À noter que Bluefish est internationalisé francais comme la plupart des applications, GTK notamment ; la version 1.0 est sortie en 2004 ; la version 1.01 en juin 2005.

Screenshots, Features,
  - OS : Mac OS X, Linux
  - Environnement Linux : GNOME
  - Langue : Français, English, ...multilingue
  - Taille : <2 Mo
  - Licence : GNU General Public License link_license

cssed

Un excellent éditeur CSS (feuilles de style niveau 1 & 2). Doté de fonctions avancées comme la vérification de la syntaxe... Très léger.

Quanta+ / kdewebdev

Création / édition de sites web en langages statiques ((x)HTML, CSS) et dynamiques (PHP, XML, ...). Gestion de projets intégrés, aide sur chaque balise en 2 clics, prévisualisation (mais n'est PAS un éditeur WYSIWYG), actualisation / MÀJ manuelle ou automatique du projet sur FTP...

Selon moi, si vous préférez l'édition de code (html, css, php, etc.) à l'édition WYSIWYG, Quanta+/kdewebdev est l'une des toutes meilleurs applications sous Linux (avec vim ou Emacs si vous maîtrisez un peu : leurs nombreux plugins pour les languages web sont précieux pour gagner du temps quand on code).

Fonctionnalités supplémentaires

Quanta est (très) utilement complété par des applications annexes, qu'il intègre sous forme de "modules" accessibles dans Quanta :
Parfois appelées "quanta-extra (Debian, Ubuntu), ces applications modulaires sont entres autres : kommander, kfilereplace, checklink / KLinkstatus (qui peut analyser n'importe quel document ou site (X)HTML ou dynamique en local comme en ligne, révélant les liens incorrects ou mal formulés).

Quanta + KLinkstatus intégré - 1

Klinkstatus peut aussi bien être lancé en application stand-alone (sans Quanta) :
klinkstatus

Documentation CSS, Javascript, HTML, MySQL & PHP inclue

Quanta fournit une documentation étendue sur ces 5 langages.
3 clics dans Quanta suffisent pour les obtenir :

Quanta : télécharger la doc CSS, Javascript, HTML, MySQL & PHP

Après quoi vous aurez une doc assez chouette consultable à tout moment :
Quanta : doc CSS, Javascript, HTML, MySQL & PHP - 2 Quanta : doc CSS, Javascript, HTML, MySQL & PHP - 3

Résolution de problèmes

attention Le pompage des ressources du système que j'avais rencontré avec les anciennes versions (Quanta 3.3.x, lors de l'activation du gestionnaire de projets) a totalement disparu depuis que j'utilise KDE-3.4.x & plus (et la version de Quanta / kdewebdev qui va avec), cela quelque soit mon gestionnaire de fenêtres (Enlightenment, KDE, xfce4).

En cas de problème (persistant) avec Quanta+,vérifiez le fichier quantarc. Il se trouvait pour moi dans le répertoire ~/.kde/share/config, sur une mdk 8.1 avec kde.
- Sauvez le fichier initial (genre mv quantarc quantarc.old) et relancez quanta, ça devrait le régénérer et si tout va bien vous pouver effacer quantarc.old
- Si vous voulez comprendre ce qui s'est passé, comparez l'ancien et le nouveau en tapant dans une console :
diff -t ~/.kde/share/config/quantarc .kde/share/config/quantarc.old

ScreemScreem

L'éditeur le plus intuitif... quand il fonctionne correctement

Le package officiel pour Mandriva 2005 LE (screem-0.10.2-4mdk) était buggé, et pompait tellement de mémoire que je le déconseille à moins : d'avoir 1 Go de RAM (là, ça passe, voir ma copie d'écran) ou, éventuellement, de savoir pourquoi il pompe 800Mo de RAM et de corriger ça...
Toutes les versions que j'avais essayé depuis 2001, packages ou tarballs, ayant buggé sous Mandrake, je n'ai pas réessaye depuis. À noter que je ne l'ai jamais utilisé pas Gnome, environnement sur lequel est basé screem.

LAMP : Linux Apache MySQL PHP

  • Tutoriel Linux-Apache-MySQL-PHP.
    Toujours sur Mandriva, Tutoriel - Installation serveur Ampache : Le cahier des charges = serveur SSH pour administration distante, serveur FTP pour transfert de fichiers depuis Internet, serveur NFS pour transfert/modification de fichiers en local, serveur HTTP pour AMPACHE, Munin, PHPMYADMIN, et serveur MYSQL pour les bases de données d'AMPACHE.
    Installer un serveur dédié : tutoriel conséquent pour installer rapidement un serveur dédié Mandriva permettant la mise en oeuvre d'un "LAN virtuel" pour une petite communauté (famille, amis, ...) ou une petite entreprise, doublé de logiciel PIM à la sauce Web 2.0. Couvre toutes les étapes depuis la configuration disque (Raid) au serveur de fichiers SAMBA VPN en passant par la sécurisation de SSH, LAMP, serveur mail, LDAP , la configuration d'un système de détection d'intrusion (IDS Prelude ou Snort), les services Web eGroupware ou la téléphonie (Asterix)...
  • Tutoriel serveur web LAMP sur ubuntu.fr
  • Activer le mode_rewrite sur un serveur local sur markup.fr.
    - Vous avez installé Apache2 dans votre distribution Linux en local. Mais votre fichier ".htaccess" est magnifiquement ignoré? Pas de panique. Le module Apache2 de réécriture des URLs (mod_rewrite) n'est pas configuré par défaut.

Autres applications

IE4LinuxInternet Explorer sous Linux

Alors comme ça, le super navigateur à Microsoft vous manque... Ou il vous le faut pour développer / designer sous Linux :)
Ça tombe bien, MSIE 5, 5.5 et 6 sont installables facilement. Et IE7 ? voyez ci-dessous !

IEs 4 Linux (navigateurs Internet Explorer pour Linux)

IEs 4 Linux est le moyen le plus simple pour faire tourner Microsoft Internet Explorer sous Linux (et tout OS compatible avec Wine).
Aucun clic n'est nécessaire, ni de configuration pénible ou encore de réglage de Wine. En un seul script, on obtient 3 versions d'IE pour tester nos sites. C'est gratuit et open source :)
IEs 4 Linux : the simpler way to have Microsoft Internet Explorer running on Linux (or any OS running Wine)

Support d'IE7 : IE4Linux Beta

Les derniers efforts de la team IE4Linux portent sur une interface graphique (pygtk) et sur le support de IE7.
La dernière version beta (avril 2008) ajoute plusieurs nouvelles fonctionnalités, dont les 2 ci-dessus et des douzaines d'autres !
  - Notes about IE7 ;
  - Nouvelles fonctionnalités sur le blog ie4Linux

liens

Vérificateurs de liens

Plusieurs existent, certains depuis longtemps comme linkchecker. La nouveauté vient de la puissance et de la stabilité des outils graphiques, comme gurlchecker. Ce dernier peut vérifier un site de plusieurs centaines de pages, en local ou sur Internet ; il affiche au choix, les liens brisés, mal formés, les images manquantes, ...

Référencement, outils SEO

english RobotCop

"Robotcop is an open source module for web servers which helps webmasters prevent spiders from accessing parts of their sites they have marked off limits : Spiders which read the robots.txt file are held to its rules. If a spider breaks a law in that file, further requests from that spider are intercepted by Robotcop.

The webmaster can create trap directories which are marked off limits in the robots.txt file. Spiders which access these trap directories in violation of the robots.txt file are also placed on an intercept list.
It includes several interception methods which allows the webmaster to counterattack e-mail address harvesting spiders to trap them, poison their databases, or simply block them.
It is a web server module written in C, not a CGI program, which ensures that it does its job very fast. All requests to the site are checked; it even protects requests for other modules, such as PHP.
It has a configurable list of known offending spiders which are automatically intercepted on their first request."

http://www.robotcop.org/
Le tarball fait [22 Kb]

Animations, flash

englishOpenLazlo

un concurrent libre pour Macromedia Flex. Il s'agit d'un service permettant de développer et de fournir, simplement, une interface "client riche" pour les applications web. OpenLaszlo repose sur J2EE et un servlet (Laszlo Presentation Server) exécutant le code XML qui décrit l'interface utilisateur.

Il est donc relativement facile de développer avec cette technologie ; la syntaxe XML étant d'une simplicité et d'une efficacité redoutables. Une démonstration interactive en ligne est disponible sur le site et permet de tester les fonctionnalités du produit. Une documentation, un tutoriel express et une table de références des balises d'OpenLaszlo sont disponibles sur le meme site.
Coté client, les interfaces développées avec OpenLaszlo sont affichées et exécutées par Macromedia Flash Player 7, ce qui permet une certaine portabilité de Laszlo. Un navigateur internet supportant Flash Player est donc le minimum requis. Techniquement, c'est le LPS qui compile, en bytecode Flash, le script XML. Le LPS sert et met en cache les interfaces compilées.
OpenLaszlo présente un modèle orienté objet agréable et efficace. Il permet également l'accès aux données et aux webservices de façon simple. Une panoplie de widgets est à la disposition du développeur : fenetres, boutons, cases à cocher, etc.

Opinion : "J'ai commencé il y a une semaine à bosser avec et c'est vraiment sympa !!! Je le conseille à tout le monde.. ne serait ce que par curiosité... par contre, à priori, oubliez le MVC..."

Trop cool pour Internet Explorer