Micro Application WebPlus 10 User Manual [fr]

WebPlus 10
Copyright R 2006 Micro Application
Auteur Serif Ltd
Avertissement aux utilisateurs
20-22, rue des Petits-Hôtels 75010 Paris
Édition Octobre 2006
Toute représentation ou reproduction, intégrale ou partielle, faite sans le consentement de MICRO APPLICATION est illicite (article L122-4 du code de la propriété intellectuelle).Cette représentation ou reproduction illicite, par quelque procédé que ce soit, constituerait une contrefaçon sanctionnée par les articles L335-2 et suivants du code de la propriété intellectuelle.Le code de la propriété intellectuelle n’autorise, aux termes de l’article L122-5, que les reproductions strictement destinées à l’usage privé. Pour le logiciel, seule est autorisée une copie de sauvegarde si cela est indispensable pour préserver son utilisation.
Les informations contenues dans ce produit sont données à titre indicatif et n’ont aucun caractère exhaustif. Elles ne sauraient engager la responsabilité de l’éditeur. La société MICRO APPLICATION ne pourra être tenue pour responsable de toute omission, erreur ou lacune qui aurait pu se glisser dans cet ouvrage ainsi que des conséquences, quelles qu’elles soient, qui résulteraient de l’utilisation des informations et indications fournies.
ISBN : 2-7429-6452-5
Microsoft, Windows et DirectXsont des marques commercialesdéposées de Microsoft Corporation.Les autres noms desociété, de marque ou de produitcités sont reconnus commemarques commerciales ou marques commercialesdéposées de leur propriétaire respectif.
MICRO APPLICATION Support technique : 20,22 rue des Petits-Hôtels Tél : 01 53 34 20 46 - Fax : 01 53 34 20 00 75010 PARIS Également disponible sur www.microapp.com Tél:0153342020-Fax:0153342000 http://www.microapp.com
Retrouvez des informations sur ce logiciel !
Rendez-vous sur le site Internet de Micro Application www.microapp.com. Dans le module de recherche,
sur la page d’accueil du site entrez la référence à 4 chiffres indiquée sur le présent manuel. Vous accédez directement à la fiche produit de ce logiciel.
7452
Licence d’utilisation de ce progiciel Micro Application
Article 1 : Acceptation des conditions
Par le seul fait d’installer le progiciel contenu sur le support, le client s’engage à respecter les conditions d’utilisation figurant ci-après.
Article 2 : Licence d’utilisation
En acquérant le support inclus, le client bénéficie d’unelicence d’utilisation du progiciel contenu sur ce support. Cette licence donneuniquement le droit d’effectuer une seule installation du progiciel, et de le faire fonctionner conformément à sa destination, sur le matériel prévu. Ce progiciel livré dans sa version code-objet est directement lisible par l’ordinateur. Cette licence est valable pour la durée légale de la protection du progiciel.
Article 3 : Limites du droit d’utilisation
Le client ne détient sur le progiciel que le droit d’utilisation de la version objet. Il s’engage donc à ne pas le reproduire, en totalité ou en partie. Le logiciel étant fourni sur un support numérique garantissant sa préservation, le support original tient lieu de copie de sauvegarde au sens de l’article L 122-6-1 du code de la propriété intellectuelle. Le client s’engage également à ne pas chercher à le modifier, le compléter, l’adapter à un autre système d’exploitation, à le décompiler (ingénierie inverse) ou à le traduire. Le progiciel est conçu pour l’usage strictement privé du client, qui s’interdit donc formellement de consentir des sous-licences, de le louer, de le prêter, de le commercialiser en tout ou partie ... De manière générale, il est strictement interdit d’en faire l’objet ou l’instrument d’une utilisation qui bénéficie à un tiers, que ce soit à titre gratuit ou onéreux. Ces restrictions concernent le progiciel pris dans son ensemble mais également dans toutes ses composantes : ainsi, les photographies, images, cliparts, sons, textes et tous autres éléments contenus dans le progiciel, restent la propriété de leurs créateurs. Tout usage du progiciel, toute opération technique sur le progiciel, non prévus par la présente licence est une contrefaçon, délit pénal sanctionné de peines d’amende et d’emprisonnement.
Article 4 : Logiciels en shareware ou logiciels contributifs
Les logiciels commercialisés sous l’appellation de « shareware » sont exclusivement prévus pour vous permettre de les évaluer ou de les tester. Ils sont d’ailleurs le plus souvent constitués de versions incomplètes. MICRO APPLICATION n’est pas l’auteur de ces logiciels et vous cède exclusivement le support comportant les versions d’évaluation. Si vous décidez effectivement de les utiliser, vous devez vous enregistrer directement auprès de l’auteur mentionné pour chaque shareware, dans les délais et les conditions (notamment financières) qu’il exige. A défaut de remplir ces conditions, vous serez considéré comme contrefacteur.
Article 5 : Garantie
Dans le cas où le client constaterait une défectuosité du support, il dispose d’un mois à compter de son achat pour en faire retour à Micro Application. Pour bénéficier de cette garantie, le client doit obligatoirement adresser à ses frais, à Micro Application, le support accompagné du bon de garantie que vous trouverez à la fin du manuel (papier ou électronique) ou de la carte d’enregistrement (si celle-ci n’a pas déjà été envoyée). Micro Application retourne alors à ses frais, au client, à l’adresse indiquée sur le bon de garantie ou la carte d’enregistrement, un nouveau support. Quand un protocole informatique de sécurité est implanté dans le logiciel, ce protocole présente certaines limitations. Aussi, il est de la responsabilité du client de déterminer si le logiciel correspond a ses besoins réels. Le progiciel étant livré en l’état, il n’est fourni par Micro Application aucune autre garantie et, notamment pour les relations du client avec son hébergeur internet. AVERTISSEMENT. Les informations contenues dans ce produit sont données à titre indicatif et n’ont aucun caractère exhaustif voire certain. A titre d’exemple non limitatif, ce produit peut vous proposer une ou plusieurs adresses de sites Web qui ne seront plus d’actualité ou dont le contenu aura changé au moment où vous en prendrez connaissance. Aussi, ces informations ne sauraient engager la responsabilité de l’Editeur. La société MICRO APPLICATION ne pourra être tenue responsable de toute omission, erreur ou lacune qui aurait pu se glisser dans ce produit ainsi que des conséquences, quelles qu’elles soient, qui résulteraient des informations et indications fournies ainsi que de leur utilisation.
A lire avant toute utilisation d’un jeu vidéo par vous-même ou votre enfant
Avertissement sur l’épilepsie
Certaines personnes sont susceptibles d’avoir des crises d’épilepsie ou d’avoir des pertes de conscience à la vue de certains types de lumières clignotantes ou d’éléments fréquents dans notre environnement quotidien. Ces personnes s’exposent à des crisesd’épilepsie lorsqu’elles regardent certaines images télévisées ou lorsqu’elles jouent à certains jeux vidéo. Ces phénomènes peuvent apparaître alors même que le sujet n’a pas d’antécédent médical ou n’a jamais été confronté à une crise d’épilepsie. Si vous-même ou un membre de votre famille avez déjà présenté des symptômes liés à l’épilepsie (crise ou perte de conscience) en présence de stimulations lumineuses, veuillez consulter votre médecin avant toute utilisation. Nous conseillons aux parents d’être attentifs à leurs enfants lorsqu’ils jouent avec des jeux vidéo. Si vous-même ou votre enfant présentez un des symptômes suivants : vertige, trouble de la vision, contraction des yeux ou des muscles, mouvements involontaires ou convulsions, veuillez immédiatement cesser de jouer et consulter un médecin. Précautions à prendre dans tous les cas pour l’utilisation d’un jeu vidéo : Ne vous tenez pas trop près de l’écran. Jouez à bonne distance de l’écran de l’ordinateur et aussi loin que le permet le cordon de raccordement. Utilisez de préférence les jeux vidéo sur un écran de petite taille. Évitez de jouer si vous êtes fatigué ou si vous manquez de sommeil. Assurez-vous que vous jouez dans une pièce bien éclairée. En cours d’utilisation, faites des pauses de dix à quinze minutes toutes les heures. Veuillez conserver le CD d’installation original à proximité de votre PC, le système pouvant vous le réclamer lors d’un lancement du programme.
Sommaire
1 Crédits ......................................................... 9
2 Introduction . . . . . . ............................................... 10
2.1 Quelques fonctionnalités de WebPlus 10 ...................................10
2.2 Installation ...................................................18
Première installation ..............................................18
Installation/réinstallation manuelle ......................................18
3 Démarrage ...................................................... 18
3.1 Présentation des sites web ..........................................18
Qu’implique la création d’un site web ? ....................................19
Qu’est-ce qu’un site web ? ...........................................19
Que dois-je faire pour prévisualiser ou publier mon siteweb ? .......................20
Qu’est-ce que l’HTML ? ............................................20
3.2 Assistant Démarrage .............................................21
Assistant Démarrage .............................................21
3.3 Créer un site web à partir d’un modèle ....................................22
3.4 Ouvrir un site web existant ..........................................22
Options de la boîte de dialogue Ouvrir ....................................23
Importer des pages et des sites web HTML ..................................23
3.5 Créer un site web de toutes pièces ......................................24
3.6 Travailler sur plusieurssites ..........................................25
3.7 Enregistrer un projet WebPlus 10 .......................................25
3.8 Utiliser des modèles ..............................................26
3.9 Fermer WebPlus 10 ..............................................26
4 Concevoir des siteset des pages
4.1 Présentation de la structure du site et de lanavigation ............................27
Structure du site ................................................27
Navigation ...................................................28
4.2 Présentation des pages et des maquettes ..................................30
4.3 Visualiser lespages ..............................................30
Passer d’une page à une autre .........................................32
4.4 Ajouter,supprimer et réorganiserles pages .................................34
Réorganiser des pages ............................................36
Associer des maquettes ............................................37
4.5 Les cadres ...................................................38
4.6 Les outils de mise en page ...........................................39
Règles .....................................................41
Les règles comme outil de mesure ......................................42
Création de repères de règles .........................................42
Magnétisme ..................................................43
Magnétisme sélectif ..............................................43
Utiliser le quadrillage .............................................44
4.7 Ajouter des images à thème ..........................................44
4.8 La Galerie ....................................................47
Nommer des conceptions ...........................................49
Sommaire
Rechercher des conceptions .........................................49
4.9 Définir les propriétés de la page et du site ..................................49
Noms des pages et des fichiers ........................................50
Définir la taille de la page et l’alignement ...................................51
Afficher et modifier des informations sur le projet ..............................52
Ajouter aux Favoris ..............................................53
Appliquer des transitions de pages ......................................53
Rediriger les pages ...............................................55
4.10 Le Gestionnaire de fichiers ..........................................56
4.11 Ajouter des descripteurs pour les moteurs de recherche ..........................56
Balises de titres HTML pour la priorité des recherches ............................57
4.12 Le Gestionnaire de polices WebSafe .....................................58
Définir les options d’exportation WebSafe ..................................59
4.13 Publicité par courrier électronique ......................................59
4.14 Modifier et enregistrer les paramètres par défaut ..............................60
5 Éditer le texte . . . ................................................. 61
5.1 Importer un texte à partir d’un fichier .....................................61
5.2 Les blocs de texte ...............................................62
Qu’est-ce qu’un bloc de texte ? ........................................62
Blocs HTML ou décoratifs ...........................................63
Créer des blocs de texte ............................................64
Placer un texte dans un bloc de texte .....................................65
Définir et mettre en forme un bloc de textedécoratif .............................66
Flux de l’article dans des blocs de texte décoratifs ..............................68
Création automatique .............................................69
Ajuster le texte au bloc de texte ........................................69
Lier des blocs de texte décoratifs .......................................69
Propriétés graphiques des blocs de texte ...................................71
Contrôler le dépassement du texte (blocs de texte HTML) ..........................71
5.3 Le texte artistique ...............................................72
5.4 Éditer le texte sur la page ...........................................73
Sélection et saisie de texte ...........................................73
Copier,coller et déplacerun texte .......................................75
Définir des retraits de paragraphe .......................................76
Rechercher et remplacer ............................................76
5.5 Définir les propriétés du texte .........................................76
Propriétés du texte par défaut .........................................77
5.6 Utiliser des styles de texte ...........................................78
Styles de paragraphe et styles de caractère ..................................78
Appliquer des styles ..............................................79
Importer des styles ...............................................81
5.7 Ajuster l’interlettrage .............................................81
5.8 Insérer un symbole ..............................................82
5.9 Insérer des informations sur l’utilisateur ...................................83
6 Les tableaux ..................................................... 84
6.1 Créer des tableaux avec du texte .......................................84
Tableaux HTML oudécoratifs .........................................84
Sommaire
Tableaux HTML etcontenu dynamique ....................................86
6.2 Modifier les tableaux .............................................86
Format automatique ..............................................90
Définir les propriétés des cellules .......................................90
6.3 Mettre en forme les nombres .........................................90
6.4 Insérer des formules ..............................................93
6.5 Insérer un calendrier ..............................................94
7 Tracer destraits et des formes .......................................... 94
7.1 Tracer des lignes ................................................94
7.2 Dessiner des formes ..............................................97
Formes pleines .................................................98
Formes fermées ................................................99
8 Couleurs et transparences ........................................... 100
8.1 Appliquer des couleurs unies ........................................100
8.2 Les combinaisons de couleurs ........................................101
Appliquer des couleurs de combinaisons à des objets ...........................103
Modifier et créer des combinaisons de couleurs ..............................104
8.3 Définir la transparence ............................................105
Appliquer de la transparence ........................................106
9 Images, animations etmultimédia . . .................................... 107
9.1 Importer des images .............................................107
Insérer des images ..............................................107
Intégration et liaison .............................................108
9.2 Définir les options d’exportation des images ................................109
Définir des options d’exportation, un titre et un textede remplacement pourchacune des images . . . 111
9.3 Appliquer des réglages d’image .......................................113
Ajouter un réglage d’image .........................................114
Activer/désactiver des réglages .......................................115
Modifier des réglages ............................................115
Réorganiser des réglages ..........................................116
Réglages multiples ..............................................116
9.4 Importer des images TWAIN .........................................116
9.5 Ajouter des animations ............................................116
Bannières animées ..............................................117
Animations GIF ................................................117
Fichiers Flash .................................................118
9.6 Ajouter du son et de la vidéo .........................................119
9.7 La Galerie photos ...............................................121
Créer la galerie photos ............................................123
Modifier la galerie photos ..........................................124
9.8 Lier des images distantes ..........................................125
10 Liens hypertextes et interactivité ....................................... 126
10.1 Ajouter des liens hypertextes et des points d’ancrage ...........................126
Insérer un point d’ancrage ..........................................127
10.2 Ajouter des zones dynamiques à la page ..................................128
Sommaire
Modifier des zones dynamiques .......................................129
10.3 Ajouter des images survolées ........................................130
10.4 Options d’images survolées .........................................130
Créer des variations d’images source ....................................132
Importer des images survolées de DrawPlus ................................133
10.5 Ajouter des éléments de navigation .....................................134
10.6 Ajouter des applets Java ...........................................137
11 Fonctionnalités avancées ............................................ 139
11.1 Créer des pages HTML ............................................139
11.2 Joindre un code HTML ............................................141
Ajouter du code HTML ............................................142
Ajouter du JavaScript ............................................143
Utiliser des identifiants ............................................146
Marqueurs ..................................................147
11.3 Formulaires ..................................................147
Structure des formulaires ..........................................147
Où les données sont-elles envoyées ? ....................................148
Utiliser des formulaires standard ......................................149
Ajouter du JavaScript ............................................149
Créer des formulaires ............................................149
Champs de formulaire ............................................152
Modifier les champs de formulaire .....................................155
Transmission de formulaires .........................................156
Organiser l’ordre des tabulations ......................................159
Validerles saisies de données .......................................160
11.4 Les objets intelligents ............................................161
Créer des objets intelligents .........................................163
Modifier les objets intelligents ........................................164
Gérer les objets intelligents .........................................165
Supprimer des objets intelligents ......................................166
11.5 Fils RSS ....................................................167
Qu’est-ce qu’un fil RSS ? ...........................................167
Prise en charge des fils RSS dans le navigateur ...............................167
Créer votre propre fil RSS ..........................................167
L’outil Lecteur de RSS ............................................169
11.6 Commerce électronique ...........................................170
Qu’est-ce que le commerce électronique ? .................................170
Insérer un formulaire de commerce électronique (PayPal) .........................172
12 Aperçu et publication sur le Web . . . . . . . . . ............................... 176
12.1 Afficher un aperçu de votre site Web ....................................176
12.2 Publier le site dans un dossier local .....................................177
12.3 Publier sur le Web ..............................................178
Rassembler des informations sur le serveur ................................180
12.4 La maintenance du site web .........................................181
1
Crédits
(c)2006 Micro Application/Serif (Europe) Ltd. Tous droits réservés. Cette publication ne peut, en tout ou partie, être reproduite sous quelque forme que ce soit sans l’accord écrit préalable de Micro Application.
Tous les noms de produits Micro Application sont des marques de Micro Application. Microsoft, Windows et le logo Windows sont des marques déposées de Microsoft Corporation. Toutes les autres marques sont reconnues.
WebPlus 10 r 2006 Micro Application/Serif (Europe) Ltd.
Les sociétés et les noms utilisés dans les échantillons sont fictifs.
Échantillons de Cliparts fournis par Serif ArtPacks r Serif (Europe), Ltd. et Paul Harris
Images (c)1997-2002 Nova Development Corporation ; (c)1995 Expressions Computer Software ; (c)1996-98 CreatiCom, Inc. ; (c)1996 Cliptoart ; (c)1996-99 Hemera ; (c)1997 Multimedia Agency Corporation ; (c)1997-98 Seattle Support Group. Les droits de chacune de ces sociétés sont réservés.
Contenu des images numériques (c) 2005 JupiterImages Corporation Tous droits réservés.
Crédits
Échantillons de polices TrueType extraits de Serif FontPacks r Serif (Europe) Ltd.
Technologie d’exportation/d’importation des images r AccuSoft Corp. & Eastman Kodak Company & LEAD Technologies, Inc.
THE PROXIMITY HYPHENATION SYSTEM r 1989 Proximity Technology Inc. Tous droits réservés.
THE PROXIMITY/COLLINS DATABASE r 1990 William Collins Sons & Co. Ltd. ; r 1990 Proximity Technology Inc. Tous droits réservés.
THE PROXIMITY/MERRIAM-WEBSTER DATABASE r 1990 Merriam-Webster Inc. ; r 1990 Proximity Technology Inc. Tous droits réservés.
Correcteur orthographique Sentry r 2000 Wintertree Software Inc.
Thésaurus ThesDB r 1993-97 Wintertree Software Inc.
Correcteur grammatical WGrammar r 1998 Wintertree Software Inc.
9
Chapitre 1 WebPlus 10
Andrei Stcherbatchenko, Ferdinand Prantl
eBay r 1995-2006 eBay Inc. Tous droits réservés.
PayPal r 1999-2006 PayPal. Tous droits réservés.
2
Introduction
Bienvenue dans WebPlus 10, la solution la plus simple pour créer un site web professionnel ou personnel.
Que vous soyez un nouvel utilisateur de WebPlus 10 ou que vous ayez mis à jour une version précédente, vous ne manquerez pas d’apprécier la vaste gamme de fonctionnalités qui y sont proposées.
N’oubliez pas d’enregistrer votre copie du logiciel à l’aide de l’Assistant d’enregistrement. Vous serez ainsi informé des nouveaux développements et des mises à jour à venir.
2.1
Quelques fonctionnalités de WebPlus 10
WebPlus 10 a été conçu comme environnement de développement de pages web dynamiques, ce qui permet d’attirer l’attention sur le contenu en perpétuelle évolution, mais les experts en conception de sites web peuvent toujours éditer directement le code source HTML. Examinons quelques-unes des fonctionnalités de WebPlus 10.
E-Commerce – Votre boutique en ligne
WebPlus 10 facilite et accélère la procédure de mise en vente d’articles sur un site web en offrant la prise en charge des principaux fournisseurs de « paniers » de vente en ligne (par ex. : PayPal). Il suffit d’ajouter des formulaires de vente en ligne, un bouton spécial ou un lien hypertexte à partir de n’importe quel objet WebPlus 10 (texte, image ou forme) pour donner accès au « panier » choisi. Les formulaires Acheter maintenant, Ajouter au panier, de don et d’abonnement facilitent les transactions par des options d’achat et la validation de formulaires. Inscrivez-vous auprès d’un fournisseur de panier ou utilisez des comptes existants.
Formulaires web pour la récupération de contenu
Appliquez des formulaires à vos pages web en utilisant l’ Assistant Formulaires web pour utiliser des formulaires standard prêts à l’emploi pour les informations de contact, les commentaires des utilisateurs, les sondage d’opinion ou le transfert de documents (tels que des CV) ou de photos. Utilisez des objets de formulaire standard à la manière de blocs de construction pour accélérer la conception des formulaires. Transmettez les informations des
10
Introduction
formulaires via les ressources web de Serif (service gratuit de passerelle web/courrier électronique par lequel les informations sont directement transmises à votre adresse e-mail au moment de leur envoi) ou traitez les données avec des scripts locaux/distants. Contrôlez l’ordre des tabulations pour améliorer la navigation dans le formulaire.
Envoyer la page courante par e-mail
Créez des courriers électroniques HTML à l’aide des fonctionnalités de mise en page de WebPlus 10. Envoyez votre mise en page sous la forme d’un lien publicitaire par e-mail à l’occasion du lancement de votre site web ou pour promouvoir vos produits et services.
Ressources Web Serif gratuites
Ajoutez du contenu dynamique en utilisant des objets intelligents, tels que des blogs, des compteurs de pages, des sondages ou autres, pour rendre votre site web véritablement
interactif. Les ressources web permettent aussi d’administrer vos blogs où que vous vous trouviez en vous identifiant simplement auprès des ressources web de Micro Application.
Galerie photos
Gérez un site web de photos à l’aide de la Galerie photos de WebPlus 10. Partagez vos albums de photos de famille ou votre collection de photos personnelles en ligne. Divers types de galeries de vignettes sont proposés (planches contact, pellicules horizontales ou verticales) avec affichage des photos par un clic. Tous les types de galeries photos proposent des fonctions de navigation et de présentations esthétiques (bordures, ombres, lumières diffuses, légendes, effets de filtre personnalisés et ajustements des photos). Les principaux formats de photos sont pris en charge, tout comme la rotation automatique des photos prises avec un appareil photo numérique.
Contenu créatif
WebPlus 10 comporte un vaste choix d’exemples prêts à l’emploi,demodèles et de bibliothèques pour vous permettre de créer rapidement votre site personnel. Intégrez les
bannières Flash dynamiques inclues dans les modèles pour une apparence d’avant-garde et personnalisez-en facilement le contenu.
RSS – fils de news et d’informations sur votre site
Tenez vos visiteurs informés des dernières nouvelles en provenance de vos sites favoris (BBC News, Reuters, FTSE, NASDAQ) à l’aide du Lecteur RSS. Ou bien, devenez journaliste en créant directement votre propre fil RSS sur votre site : l’outil Données RSS crée les fils, les titres, les résumés et les liens URL.
Blocs et tableaux compatibles HTML
Concevez des blocs et des tableaux basés sur le HTML. Tirez profit des balises de titres du HTML pour attirer l’attention des moteurs de recherche sur votre site web.
Scinder la page en IFrames
11
Chapitre 2 WebPlus 10
L’outil IFrame assure la prise en charge des cadres défilants dans votre projet WebPlus 10. Ajoutez un cadre de menu ou de navigation ou visualisez une page dans une page en plaçant plusieurs cadres dans la même fenêtre de navigateur.
Lier un code HTML et un script aux objets
Appliquez un code HTML aux objets, aux cellules de tableau, à des fragments de code HTML et des pages entières ; appliquez des scripts (avec des fichiers imbriqués ou liés) pour améliorer l’interactivité. Insérez des marqueurs (token) en tant que codes de champs dynamiques pour ajouter des dates, des couleurs, des titres de pages, des noms de fichiers, etc. Générez automatiquement des identifiants HTML pour tous les objets pour autoriser leur traitement par JavaScript. Si les bases du HTML vous intéressent, développez des pages HTML brutes, toutes explorables via la Structure du site de WebPlus 10.
Importation HTML optimisée
Il est maintenant possible d’importer des pages web avec leurs méta-données, les scripts côté serveur, les JavaScript, les zones dynamiques et les formulaires.
Gérer par arborescence de fichiers et de dossiers
Utilisez le Gestionnaire de fichiers pour gérer votre site web. Consultez l’arborescence des dossiers sous-jacente, créez vos dossiers personnels, ajoutez d’autres types de fichiers et renommez-les à l’intérieur de WebPlus 10.
Lire et manipuler les fichiers Flash
WebPlus 10 vous permet de voir vos animations Flash et de les lire dans la vue de la conception. Le logiciel propose aussi des bannières Flash entièrement personnalisables.
Réglages d’image intégrés
Profitez des réglages d’images intégrés pour une correction rapide des couleurs des images importées et des objets convertis en images. Faites votre choix parmi les nombreuses options proposées : Niveaux, Contraste, Luminosité/Contraste, Mélangeur de canaux, Balance de
couleurs, Courbes, etc. Des effets spéciaux classiques tels que Lumière diffuse, Supprimer éraflures et grains, Ombres et clairs et divers flous viennent compléter les divers réglages
pouvant être appliqués en les associant. Vous pouvez maintenant éliminer les yeux rouges tant redoutés sur vos photos grâce au nouvel outil Yeux rouges, et tout ça en un seul clic.
Si vous voulez aller encore plus loin, utilisez la fonction Éditer dans Studio Photo Créateur 2 (version 10 ou ultérieure) pour modifier et enregistrer des photos et des fichiers Studio Photo à partir de WebPlus 10.
Barres d’outils contextuelles
WebPlus 10 prend en charge les barres d’outils contextuelles qui réunissent des options et des réglages qui évoluent dynamiquement en fonction de l’objet ou de l’outil actuellement sélectionné. Seuls les réglages et les options pertinents sont proposés pour l’édition ou à titre de référence, ce qui accélère et facilite la conception.
12
Introduction
Nouvelle interface utilisateur
WebPlus 10 a subi une refonte complète afin d’améliorer l’accès au contenu dont vous avez besoin. Une gamme complète d’onglets ancrables du Studio remplace désormais la barre d’outils Studio et l’onglet Modif. présents dans les anciennes versions de WebPlus 10. Ces onglets donnent accès par un clic aux réglages fréquemment utilisés tels que Couleur, Contour et Transparence. Un contrôle plus précis est aussi possible pour l’alignement des objets (onglet Aligner), la mise en forme du texte (onglet Caractère) et le positionnement des objets (onglet Transformer). Un onglet Témoins abrite une multitude d’échantillons de couleurs basées sur des palettes pour des remplissages unis, progressifs et bitmap et des couleurs de contour. Vous pouvez même ajouter, visualiser, modifier et supprimer les couleurs que vous avez employées sur votre site web à partir de la Palette de la publication.
Chaque onglet peut être ancré/flottant, regroupé avec d’autres onglets, redimensionné dans une direction ou affiché/masqué. Vous pouvez aussi créer différentes configurations d’onglets et les enregistrer sous forme d’environnements de travail distincts pour les retrouver immédiatement à tout moment. Réduisez les onglets dans un ordre particulier en fonction de vos besoins.
Transfert FTP optimisé
Les fonctionnalités FTP comprennent notamment le transfert de votre projet WebPlus 10 pour sa sauvegarde. Vérifiez manuellement les fichiers à transférer au cours de mises à jours incrémentielles polyvalentes. Si vous voulez tout recommencer, supprimez la totalité du site d’un seul coup.
Contrôle des polices
Utilisez le Gestionnaire de polices WebSafe pour harmoniser les polices entre votre site web et l’ordinateur de vos visiteurs. Définissez une police comme étant WebSafe ou tramez-la. Si vous prévoyez d’utiliser un projet WebPlus 10 tiers, évitez les problèmes de polices manquantes en utilisant les fonctionnalités de substitution de polices du Gestionnaire de ressources.
Des améliorations très attendues
Les objets de la maquette sont maintenant attachés en bas de page en cas de modification de la hauteur de la page web. Créez des liens vers des images Internet distantes pour charger rapidement le contenu de la page. Remplacez facilement un format d’image insérée (GIF en PNG ou JPG) ou une combinaison quelconque (vous pouvez aussi modifier la profondeur de bits, la transparence et/ou la taille/résolution. Un nouvel onglet Couleur permet de choisir d’autres nuances et différents modes d’affichage des couleurs. Les nouvelles propriétés de pages incluent des réglages supplémentaires pour extraire les pages dans les moteurs de recherche (par l’utilisation de codes de langues, notamment), rediriger les pages, évaluer le temps de téléchargement et définir des transitions entre les pages (sous forme de spirales, cercles, stores, etc.) Utilisez les nouvelles options d’édition d’objets Coller à l’emplacement et
13
Chapitre 2 WebPlus 10
Coller la mise en forme. Les barres de navigation sont maintenant personnalisables pour plus de flexibilité. L’enregistrement automatique au moment de la publication et de l’aperçu (ou à des intervalles réguliers) et la production d’une mise à jour automatique sont également proposés. Il faut également citer le chargement d’applets Java directement en JAR ou ZIP (pas d’extraction nécessaire) ; un nouveau gestionnaire de liens hypertexte actifs ; la publication du site avec divers encodage HTML : UTF-8, windows-1252 ou ISO 8859-1 ; la possibilité d’inclure l’icône de votre site web (le logo de la société) dans les favoris du navigateur des visiteurs ; l’importation de fichiers Photo Studio .SPP et Photoshop .PSD (avec des chemins d’accès tronqués) ; et enfin, les fonctionnalités Rechercher-Remplacer, les repères, les bannières animées,leGestionnaire de maquettes et les options d’exportation web (conversion du format des images lors de l’exportation, qualité JPG, re-échantillonnage et optimisation).
En plus des fonctions déjà existantes...
Navigation par page et structure du site
La fonction Structure du site sert de centre de contrôle pour la manipulation des pages et elle permet aussi d’organiser visuellement vos pages à l’intérieur d’une hiérarchie de sections et de niveaux. Mettez-vous dans la peau d’un architecte pour concevoir une mise en page réfléchie du contenu. Parcourez rapidement les pages à partir de la barre d’état au bas de l’écran. Personnalisez facilement diverses propriétés de pages distinctes : taille, couleur du fond, alignement, nom de fichier, titre, etc. Importez des pages web HTML, voire des sites entiers.
Importation et édition
Le texte peut être importé, collé, exporté au format Unicode dans des langues étrangères ou en utilisant des polices exotiques ou des symboles. Utilisez l’édition par glisser-déplacer dans Write Studio. Effacez la mise en forme (pour revenir au style brut) par une simple action sur une touche.
Les images peuvent être importées avec une résolution d’écran de 96 ppp. Ajustez la luminosité et le contraste, la taille et la résolution, appliquez des filtres à l’aide de la barre d’outils contextuelle Image. Ajoutez une couleur de l’espace de travail dans la palette par un simple clic. Importez des animations Flash (.SWF) ou des fichiers audio MP3.
Ancrage des pages et améliorations des liens hypertexte
Vous pouvez insérer des points d’ancrage pour diriger directement des liens hypertexte vers un mot ou un objet affiché ; lier automatiquement des vignettes d’images réduites à des versions en plein format sur une page vide ; ouvrir des liens dans une nouvelle fenêtre ; inclure des liens hors site à la structure du site ; convertir des zones dynamiques pour les faire correspondre à des formes sélectionnées.
Images à thème pour une touche instantanée
Faites votre choix parmi une gamme d’éléments de conception tout prêts classés par catégories sous l’onglet Images à thème. Visualisez les catégories pour modifier l’apparence
14
Introduction
de votre site en un clic. Personnalisez le texte, la police, les couleurs, etc. Des images à thème intelligentes telles que des barres de navigation et des boutons Précédent/Suivant sont programmés pour tenir compte de la structure du site et s’adapter automatiquement en cas de réorganisation des pages. Établissez sans effort des passerelles faciles à suivre à travers votre site.
Bannières animées
Ajoutez de la vie à vos pages web ! Personnalisez vos propres messages multilignes, variés et colorés qui défilent sur l’écran. Ajoutez vos propres boutons interactifs à l’aide de l’option d’image survolée à plusieurs niveaux.
Prise en charge de fonctionnalités web polyvalentes
WebPlus 10 prend en charge la dernière version de l’HTML pour un affichage précis de toute la page. Ajoutez du son et de la vidéo, voire des applets Java et des codes d’en-tête et de corps de page HTML pour agrémenter vos pages. Le Contrôle de la maquette vous permet d’améliorer votre site avant sa publication. Visualisez ensuite votre site dans votre navigateur web et publiez-le dans un dossier local ou sur un serveur distant.
Enveloppe
Appliquez une enveloppe à maillage personnalisable à un objet pour ajouter une perspective, une inclinaison, un bombement, etc. Vous pouvez déformer le contour uniquement ou inclure le remplissage de l’objet, à l’aide d’un quadrillage optionnel révélant la géométrie de votre maillage.
Combinaisons de couleurs intelligentes
Choisissez en un clic parmi une douzaine de combinaisons de couleurs prédéfinies pour modifier l’apparence générale de votre site web. Vous pouvez personnaliser les couleurs de la combinaison, créer de nouvelles combinaisons personnelles et appliquer n’importe quelle combinaison à un site créé de toutes pièces.
Transformer des styles d’objets en un seul clic
Sélectionnez un objet (y compris un texte) et faites votre choix dans une bibliothèque de styles prédéfinis combinant divers attributs tels que des effets de filtre 3D, des remplissages, des transparences, des styles de ligne, des bordures, et même différentes versions de polices. Personnalisez les styles prédéfinis ou créez-en.
Studio à l’écran alliant commodité et fonctionnalité
Les onglets flottants et ancrables du Studio permettent d’accéder rapidement par glisser-déplacer aux commandes fréquemment utilisées telles que les polices, les paramètres de contour et les tables de couleurs. Enregistrez vos conceptions favorites dans la Galerie pour les utiliser dans d’autres sites web avec des éléments animés, des logos et d’autres éléments de pages que vous pouvez personnaliser comme vous le souhaitez !
15
Chapitre 2 WebPlus 10
Outils de mise en page et de saisie de texte professionnels
Adaptation intelligente du texte. Règles et repères amovibles. Précision de la position, de la rotation, du renversement, du recadrage et de l’alignement vertical. L’outil Dupliquer place plusieurs copies d’un objet le long d’une ligne ou à l’intérieur d’une grille, en autorisant le contrôle du décalage et de l’espacement. Mise en forme du texte avec des styles. Maquettes permettant de répéter des éléments d’arrière-plan. Sans oublier les fonctionnalités de décompte de mots, de recherche et de remplacement, le correcteur orthographique, et le vérificateur pour garantir la lisibilité de votre site.
Outil Texte artistique
Pour compléter les traditionnelles zones de texte, cliquez et saisissez un texte n’importe où sur la page, mettez-le en forme à l’aide des outils habituels, puis appliquez des contours et des remplissages colorés, directement sur les caractères. Mettez le texte à l’échelle, faites-le pivoter ou basculer, et découvrez ainsi d’innombrables nouvelles possibilités. Les outils de texte sur tracé permettent de tracer un trait puis de saisir le texte qui suit alors le tracé. Vous pouvez modifier le tracé de la même manière qu’un trait (ce qui modifie le flux du texte), et modifier aussi les propriétés du texte à votre convenance.
Outil Tableau avec calendriers modifiables
Créez et modifiez des tableaux directement dans votre site, sans recourir à une autre application. Faites votre sélection parmi les formats prédéfinis ou personnalisez les bordures, les cellules, les lignes et les colonnes. Parmi les fonctionnalités performantes de modification du texte, nous pouvons mentionner la Suppression rapide,laSaisie rapide et la fusion de cellules, sans oublier les calendriers conçus sur la base de tableaux.
Manipulation des images plus ludique
Importez des images ancrées à l’intérieur de zones de texte et créez vos propres images TIFF et PNG 32 bits anti-crénelées. La conversion en image permet de modifier directement le format. Ajoutez des bordures aux images importées et aux formes, ou encadrez un texte. Contrôlez les métafichiers importés et les options OLE, gérez les images associées. Chaque filtre d’exportation conserve ses paramètres propres en mémoire.
Formes pleines
Déjà présentes dans d’autres applications Micro Application, la fonctionnalité exclusive des Formes pleines fonctionne comme des clipart intelligents, ou comme l’ensemble d’outils de dessins le plus puissant que vous puissiez imaginer. Sélectionnez tout simplement un modèle de forme, faites-la glisser sur la page, puis ajustez les poignées pour personnaliser les angles et les dimensions.
16
Introduction
Options de dessin puissantes
Tout un ensemble d’outils de dessin à votre disposition. Tracez des traits et courbes à main levée, prolongez facilement les traits existants. Appliquez des styles de ligne à toutes les formes et ajoutez des extrémités de ligne telles que des pointes de flèche et des losanges. Utilisez la palette Courbe pour peaufiner les contours d’un trait, d’une forme fermée ou de la limite d’habillage du texte. Dessinez à l’aide de lignes calligraphiques avec un angle de plume réglable. Ajoutez des coins arrondis où et quand vous le souhaitez. Créez des lignes personnalisées à l’aide de points et de tirets et ajoutez-les à votre collection.
Courbes de Bézier intelligentes
Il suffit désormais de relier les points pour tracer des courbes autour des objets et des images. L’outil Ligne courbée a été amélioré par l’ajout de Segments intelligents qui adaptent automatiquement les courbes pour relier chaque nœud. Utilisez l’outil Recadrage pour redimensionner un objet en fonction d’un autre ou l’outil Convertir en courbes pour contrôler les nœuds et les segments de tous les objets, dont les formes pleines.
Remplissages progressifs et bitmap, transparences
Pour les illustrations complexes et les effets typographiques attractifs, faites votre choix dans une large gamme de remplissages linéaires, en ellipse, coniques et de transparences et, à partir du Studio, dans une palette d’effets basés sur des images. Utilisez les outils interactifs de Couleur et de Transparence pour des modifications par glisser-déplacer.
Des effets d’ombre, de lumière diffuse et de biseau magnifiques
Une boîte de dialogue vous sert de studio de création. Vous pouvez y sélectionner et y visualiser de nombreux effets spéciaux impressionnants applicables à du texte ou à tout autre objet. Sélectionnez l’un des effets de transparence visant à adoucir les bords parmi l’Ombre portée, l’Ombre interneoulaLumière diffuse interne ou externe, ou l’un des quatre effets de biseau et d’estampage.
De magnifiques effets d’éclairage et de surface 3D
Outre les effets 2D cités ci-dessus, les effets de filtre 3D donnent vie à des formes plates. Sélectionnez un ou plusieurs effets, puis modifiez les propriétés de la surface et de la source lumineuse. Commencez par un motif ou une fonction, réglez les paramètres pour obtenir des contours de surface, des textures et des remplissages incroyables, tels que du bois, de l’eau, de la peau, du marbre etc., à l’aspect réaliste. L’effet du filtre d’atténuation ajoute une bordure estompée ou floue à un objet, idéale pour les fondus, les montages, les contours de photo vignettés, entre autres.
Effets spectaculaires de relief
Pourquoi vous cantonner à deux dimensions ? La 3D instantanée ajoute de la profondeur aux objets ordinaires et au texte. Utilisez une boîte de dialogue unique pour ajuster extrusion, rotation, biseau, éclairage, texture, etc.
17
Chapitre 2 WebPlus 10
Prévisualisation Web
Utilisez une fenêtre quelconque pour une prévisualisation en interne de votre site dans Internet Explorer en définissant différentes tailles de page ou visualisez des aperçus externes dans un navigateur quelconque installé sur votre ordinateur.
Facilité d’utilisation
Glissez-déplacez des objets à partir d’autres applications. L’affichage s’ajuste automatiquement lors des déplacements et redimensionnements. Menus contextuels, barre d’état, pointeurs adaptés au contexte rendent WebPlus 10 très convivial.
2.2
Installation
2.2.1 Première installation
Pour installer WebPlus 10, insérez simplement le CD-ROM du programme dans votre lecteur de CD-ROM. La fonction d’exécution automatique lance automatiquement l’installation. Il vous suffit de répondre aux questions affichées à l’écran. Si le démarrage automatique ne lance pas l’installation, consultez les instructions du manuel ci-dessous.
Si vous disposez également du CD-ROM de ressources de WebPlus 10, installez-le en suivant la même procédure que pour le CD du programme.
2.2.2 Installation/réinstallation manuelle
Pour réinstaller le logiciel ou modifier ultérieurement un élément de l’installation, sélectionnez Panneau de configuration dans le menu Démarrer de Windows (via l’entrée
Paramètres pour les systèmes antérieurs à XP), puis double-cliquez sur l’icône Ajout/ Suppression de programmes. Vérifiez que le bon CD-ROM est inséré dans votre lecteur de
CD-ROM, sélectionnez WebPlus 10, puis cliquez sur le bouton Installer. Vous aurez la possibilité de supprimer ou d’ajouter des composants, de les réinstaller ou de désinstaller tous les composants.
3
Démarrage
3.1
Présentation des sites web
Ce chapitre et les suivants vous proposent des informations sur la création d’un site web réussi à l’aide de WebPlus 10.
18
3.1.1 Qu’implique la création d’un site web ?
Il vous suffit de répondre aux quelques questions du modèle de site web, mais vous pouvez également choisir de créer votre site de toutes pièces. Quelle que soit l’option choisie, vous apprécierez la facilité avec laquelle WebPlus 10 vous permet de corriger votre texte et vos images et d’affiner la conception de chaque page. WebPlus 10 vous permet de disposer les éléments de votre page comme vous le souhaitez, comme lors de la mise en page d’une lettre d’informations. Si vous maîtrisez les bases de la PAO, vous n’aurez aucune difficulté à vous y retrouver. Si vous débutez, vous pourrez apprendre progressivement à utiliser les outils de WebPlus 10.
WebPlus 10 vous permet d’assembler tous les éléments de votre site en construction afin d’obtenir un document pratique de plusieurs pages pouvant être enregistré en une seule étape sous la forme d’un fichier de projet WebPlus 10. Vous pouvez ensuite publier votre projet à tout moment, et de nouveau en une seule étape, sous la forme d’un jeu de pages distinctes constituant votre site Web.
3.1.2 Qu’est-ce qu’un site web ?
Internet est un réseau mondial qui relie des ordinateurs dans le monde entier. Le World Wide Web est devenu un mode d’utilisation d’Internet pour accéder aux informations stockées sous un format de fichier nommé .html ou Hypertext Markup Language. Pour résumer, un site web est un ensemble de fichiers .html (principalement) stockés sur un serveur de fichiers auxquels toute personne peut accéder à l’aide d’un navigateur web. En réalité, les sites web ne dépendent pas du réseau Internet dans son ensemble, il est possible (et c’est souvent le cas) d’y accéder comme sur un réseau LAN ou un intranet privé. N’oubliez pas qu’un site web n’est qu’un ensemble de fichiers.
Démarrage
Le format .html permet de définir la disposition d’une page. Un fichier .html utilise du texte brut et différents codes intégrés pour décrire une page comportant du texte et des liens hypertextes. Outre les fichiers .html, un site web comporte généralement d’autres fichiers (des images par exemple) que le concepteur a jugé bon d’intégrer. Un navigateur web (tel que Netscape Navigator ou Microsoft Internet Explorer) est un programme pouvant lire un fichier .html et afficher la page (du moins nous l’espérons !) telle que le concepteur l’a envisagée.
Traditionnellement, un site web comporte une seule page d’accueil utilisant un nom de fichier standard comme index.html. La page d’accueil est la première page vue par le visiteur. Elle comporte généralement des liens vers d’autres pages du site qui comportent également des liens vers d’autres pages. Pour la personne accédant au site, les informations semblent parfaitement liées et accessibles à l’aide d’un clic de souris.
WebPlus 10 se charge des pages que vous avez mises en page et les convertit au format .html.
19
Chapitre 3 WebPlus 10
3.1.3 Que dois-je faire pour prévisualiser ou publier mon site web ?
Vous pouvez prévisualiser une page ou plusieurs à tout moment, soit dans WebPlus 10 (dans une fenêtre spéciale basée sur le navigateur Internet Explorer), soit séparément à partir d’un navigateur quelconque installé sur votre ordinateur.
La publication d’un site avec WebPlus 10 est une opération unique consistant non seulement à convertir votre projet en fichiers distincts destinés au Web mais aussi à copier les fichiers web vers un emplacement que vous définissez dans un dossier local ou sur un site web hôte.
Pour la publication dans un dossier local, vous n’avez même pas besoin d’une
connexion à Internet.
Pour publier sur le Web, vous aurez besoin d’un hôte pour votre site web, c’est-à-dire
d’un espace disque sur un serveur connecté à Internet, afin que d’autres personnes puissent accéder à votre site. Cela se résume généralement à l’ouverture d’un compte auprès d’un fournisseur d’accès, qui peut être un important fournisseur ou un fournisseur de services Internet spécialisé (ISP). Les principaux fournisseurs d’accès allouent généralement à chaque utilisateur un espace sur le serveur pour un site web personnel tandis que les ISP moins importants proposent de nombreuses possibilités. Une fois que votre compte est défini et que vous pouvez connecter votre ordinateur à un hôte, la publication sur le Web n’est plus qu’une simple opération de transfert de fichiers dont se charge le module de publication web de WebPlus 10.
3.1.4 Qu’est-ce que l’HTML ?
L’un des avantages de WebPlus 10 par rapport à un programme spécialisé dans la création de pages web est que vous pouvez utiliser la mise en page d’une lettre d’informations ou d’une publicité comportant de nombreuses images multicolores ainsi qu’une typographie fantaisie et publier telle quelle la conception sur le Web. Votre page aura le même aspect sur le Web que sur votre écran !
Bien que vous n’ayez pas besoin de connaître le code HTML, le langage des pages web, pour utiliser WebPlus 10, vous devez connaître les notions suivantes.
1. La durée de chargement de votre page dépend directement de la taille du fichier HTML et des fichiers graphiques ou multimédia joints. Ces fichiers complémentaires sont très volumineux, ce qui ralentit le chargement.
2. Les éléments de votre mise en page que WebPlus 10 ne peut pas convertir en HTML seront considérés comme des graphiques. Plus WebPlus 10 convertira d’éléments en HTML, meilleur sera le résultat.
Si vous avez déjà travaillé dans un environnement de Publication Assistée par Ordinateur, vous devez revoir à la baisse vos exigences typographiques lors d’une conception destinée au Web. WebPlus 10 vous offre néanmoins un large panel de possibilités. Pour la présentation des textes, vous pouvez appliquer n’importe quelle taille de point, utiliser des interlignages et
20
des espacements de caractères variables, et même justifier les paragraphes ! Le résultat obtenu est une correspondance WYSIWYG plus étroite entre ce que vous voyez sur l’écran de WebPlus 10 et ce qui s’affiche sur le navigateur Web. Comme le langage HTML positionne les éléments en utilisant des coordonnées absolues, le chevauchement des éléments est autorisé et les tailles de fichiers sont réduites.
En théorie, vous pouvez utiliser n’importe quelle police. Cependant, si une police n’est pas présente sur l’ordinateur du visiteur, elle est remplacée par une police existante, entraînant ainsi des résultats imprévisibles sur votre si jolie mise en page ! En règle générale, utilisez les polices WebSafe standard (elles sont précédées d’une coche verte dans la liste des polices, les autres sont munies d’un point d’interrogation bleu).
L’Assistant Contrôle de la maquette de WebPlus 10 vous prévient si votre site utilise des propriétés de police ou de caractère non standard, si le texte doit être publié en tant que graphique et si votre site comporte d’autres problèmes.
3.2
Assistant Démarrage
Une fois le logiciel installé, vous pouvez le lancer. Sélectionnez Serif Applications/WebPlus 10 dans le menu Démarrer/Tous les programmes.
Dans le menu Démarrer/Tous les programmes, sélectionnez la commande Serif
Application/WebPlus 10 pour afficher l’Assistant de démarrage (menu principal) ou exécutez la commande Fichier/Assistant Démarrage si WebPlus 10 est déjà ouvert.
Démarrage
3.2.1 Assistant Démarrage
L’Assistant Démarrage vous offre plusieurs possibilités :
21
Chapitre 3 WebPlus 10
Les possibilités sont les suivantes :
Ouvrir un modèle de site, pour créer un site web instantané.
Ouvrir un site, pour modifier l’un de vos fichiers de projet créés dans WebPlus 10.
Créer un nouveau site, pour commencer à partir d’un site web vierge.
Exemples de sites web, pour consulter des exemples conçus par des professionnels.
Importer des pages web, pour convertir des ressources HTML disponibles.
Afficher les didacticiels, pour afficher les présentations illustrées.
Pour commencer, cliquez sur Créer un nouveau site.
L’Assistant Démarrage s’affiche par défaut au démarrage de WebPlus 10. Vous pouvez le désactiver (ou l’activer de nouveau) via la case à cocher Utiliser l’assistant au prochain démarrage de l’écran de l’Assistant Démarrage ou via l’option Utiliser l’Assistant Démarrage sous l’onglet Général accessible par la commande Options du menu Outils.
3.3
Créer un site web à partir d’un modèle
La première fois que vous lancez WebPlus 10, l’Assistant Démarrage apparaît et vous propose six options. La première est Ouvrir un modèle de site. Le recours à un modèle accélère le processus de création d’un site professionnel. Que vous soyez novice dans l’utilisation de WebPlus 10 ou que vous cherchiez de nouvelles possibilités de conception, les modèles font le travail pour vous !
Pour créer un site web à partir d’un modèle :
1. Lancez WebPlus 10 ou choisissez la commande Fichier/Assistant Démarrage pour afficher l’Assistant Démarrage.
2. Cliquez sur l’option Ouvrir un modèle de site, choisissez une catégorie de sites dans la fenêtre de gauche et examinez les exemples à droite. Sélectionnez l’exemple correspondant le plus à vos souhaits, puis cliquez sur Ouvrir.
La première page (la page d’accueil) du site apparaît, avec l’onglet Site du studio affiché à droite et présentant les diverses pages qui constituent le site avec son arborescence Structure du site.
3.4
Ouvrir un site web existant
Vous pouvez ouvrir un site WebPlus 10 existant à partir de l’Assistant de démarrage, du menu Fichier ou de la barre d’outils Standard. D’autres formats de fichiers, dont les modèles WebPlus 10 et les fichiers PagePlus, peuvent également être ouverts.
Il est aussi possible d’utiliser l’option Importer des pages Web de l’Assistant Démarrage pour importer des pages à partir de sites web HTML existant.
22
Démarrage
Pour ouvrir un site WebPlus 10 existant à l’aide de l’Assistant Démarrage :
1. Sélectionnez l’option Ouvrir un site. Dans le volet Documents de la boîte de dialogue Ouvrir un document existant, vous verrez soit l’arborescence de votre ordinateur
contenant vos sites web (onglet Dossiers), soit une liste des derniers sites web utilisés (onglet Historique). Des vignettes d’aperçu ou des informations sur les sites web peuvent apparaître dans le volet adjacent, selon le mode d’affichage courant.
2. Cliquez sur un nom de fichier ou un exemple, puis sur Ouvrir. La première page (la page d’accueil) du site apparaît.
Pour ouvrir un site WebPlus 10 existant (lorsque WebPlus 10 est ouvert) :
1. Exécutez la commande Fichier/Ouvrir.
ou
Cliquez sur bouton Ouvrir de la barre d’outils Standard.
2. Dans la boîte de dialogue Ouvrir, sélectionnez le dossier et le nom du fichier, puis cliquez sur le bouton Ouvrir.
Pour restaurer la version précédemment enregistrée d’un site ouvert :
Exécutez la commande Fichier/Version précédente.
3.4.1 Options de la boîte de dialogue Ouvrir
La boîte de dialogue Ouvrir comporte deux options pour les utilisateurs intermédiaires à chevronnés.
Dans la liste Types de fichiers, vous pouvez sélectionner des sites WebPlus 10 (*.wpp) ou des modèles (*.wpx), ainsi que des documents PagePlus (*.ppp ; jusqu’à la version 9).
Cochez l’option Ouvrir sous "Sans titre" si vous souhaitez ouvrir un fichier sauvegardé sous le nom Sans titre pour créer un nouveau site à partir d’un ancien sans l’altérer, par exemple. Il s’agit de l’option par défaut pour les fichiers de modèles.
3.4.2 Importer des pages et des sites web HTML
L’option Importer des pages web vous permet d’importer une ou plusieurs pages HTML ou XHTML au sein d’un site (nouveau ou existant) réalisé à l’aide de WebPlus 10, tout en contrôlant les éléments supplémentaires importés.
23
Chapitre 3 WebPlus 10
Pour importer une ou plusieurs pages web HTML :
1. Sélectionnez l’option Importer des pages web dans l’Assistant Démarrage. ou
Choisissez Importer des pages Web dans le menu Fichier de l’espace de travail WebPlus 10.
2. Dans la boîte de dialogue, choisissez d’importer Une seule page ou un Site (pages multiples), puis cliquez sur Parcourir ou saisissez une adresse web (une URL d’un
site web en ligne) ou un nom de fichier local HTML/XHTML.
3. En cas d’importation de plusieurs pages, précisez l’option Suivre tous les liens hypertextes jusqu’à une profondeur de (nombre de liens devant être suivis par WebPlus
10 à partir de la page de départ lors de l’importation). Par exemple, une profondeur de 1 correspond à un éloignement d’un lien : WebPlus 10 suit chaque lien figurant sur la page de départ et importe toutes les pages secondaires. Avec un réglage de profondeur de 2, WebPlus 10 suit aussi les liens partant de page secondaire.
4. Indiquez une Largeur de page souhaitée pour l’import dans WebPlus.
5. Cliquez sur le bouton Avancé>> pour sélectionner les types de fichiers (Images, Texte,
Fichiers son, Fichiers vidéo, Applets Java, Balises Méta, Script côté serveur, JavaScript, zones dynamiques ou Formulaires) devant être importés par WebPlus 10.
6. Cliquez sur Importer pour démarrer l’importation. Cliquez sur Fermer pour fermer la boîte de dialogue.
Les pages importées figurent dans l’arborescence de la Structure du site sous l’onglet Site.
3.5
Créer un site web de toutes pièces
Bien que les modèles de sites facilitent vos choix de conception, vous pouvez tout aussi facilement créer un site à partir de zéro.
Pour créer un nouveau site à l’aide de l’Assistant Démarrage :
Démarrez WebPlus 10, cliquez sur Créer un nouveau site.
Le nouveau site apparaît avec une page vierge utilisant les propriétés de page par défaut.
Si vous cliquez sur Fermer (ou si vous appuyez sur [Echap]) dans l’Assistant Démarrage, vous obtiendrez le même résultat.
Pour créer un nouveau site au cours d’une session WebPlus 10 :
Sélectionnez la commande Nouveau dans le menu Fichier.
L’Assistant Démarrage s’affiche par défaut au démarrage de WebPlus 10. Vous pouvez le désactiver (ou l’activer de nouveau) via la case à cocher Utiliser l’assistant au prochain
24
démarrage de l’écran de l’Assistant Démarrage ou via l’option Utiliser l’Assistant Démarrage sous l’onglet Général accessible par la commande Options du menu Outils.
3.6
Travailler sur plusieurs sites
Vous pouvez travailler sur plusieurs sites à la fois. Chaque nouveau site ouvert apparaît dans une fenêtre distincte comportant ses propres paramètres. Des onglets vous permettent de passer facilement d’une fenêtre à l’autre et, lorsque les fenêtres sont réduites ou disposées en mosaïque, vous pouvez y glisser-déplacer des objets. Vous pouvez aussi prévisualiser le site courant dans une fenêtre distincte.
Pour préciser l’emplacement des onglets des fenêtres :
Choisissez Onglets de la fenêtre dans le menu Affichage et sélectionnez Aucun, En
haut ou En bas.
Aucun masque les onglets ; En haut ou En bas les affiche en haut ou en bas de l’espace de
travail.
Pour fermer la fenêtre active :
Exécutez la commande Fichier/Fermer ou cliquez sur le bouton Windows Fermer de
la fenêtre. S’il s’agit de la seule fenêtre ouverte pour le site, la commande ferme le projet et vous êtes invité à enregistrer les modifications.
Démarrage
Vous pouvez fermer tous les sites ouverts sans quitter l’application WebPlus 10.
Le menu Fenêtre vous permet d’organiser les fenêtres actuellement ouvertes, en les disposant en cascade ou en mosaïque horizontale ou verticale.
Le menu Fenêtre fournit également la liste des noms des fenêtres du site ouvertes, la fenêtre active étant cochée. La méthode la plus simple pour passer d’une fenêtre à l’autre est bien évidemment de cliquer sur l’onglet de la fenêtre souhaitée (ou de cliquer directement dans la fenêtre). Cependant, si une fenêtre en masque une autre, appuyez sur [Ctrl+Tab] ou cliquez sur le nom de la fenêtre dans le menu pour y accéder.
3.7
Enregistrer un projet WebPlus 10
Pour enregistrer votre travail :
Cliquez sur le bouton Enregistrer de la barre d’outils Standard.
Pour sauvegarder sous un autre nom, exécutez la commande Fichier/Enregistrer
sous.
25
Chapitre 3 WebPlus 10
3.8
Utiliser des modèles
Une fois que vous avez déterminé une mise en page particulière, vous pouvez l’enregistrer sous un modèle (*.wpx) qui pourra vous servir de base pour vos futures pages web. À l’ouverture d’un fichier de modèle sauvegardé, WebPlus 10 ouvre automatiquement une copie sans titre pour ne pas altérer le modèle d’origine. Les modèles permettent de garantir l’homogénéité de vos documents en préservant les paramètres initiaux pour des éléments tels que les titres, le corps du texte et les images.
Pour enregistrer un site en tant que modèle :
Exécutez la commande Fichier/Enregistrer sous. Dans Type, cliquez pour
sélectionner l’option Modèle WebPlus (*.wpx). Saisissez un nom de fichier, sans toucher à l’extension .wpx, puis cliquez sur Enregistrer.
Pour ouvrir un modèle :
1. Exécutez la commande Fichier/Ouvrir, puis sélectionnez Modèles WebPlus (*.wpx) dans la liste Type.
2. Si vous souhaitez ouvrir le fichier du modèle d’origine, décochez l’option Ouvrir sous "Sans titre". Pour ouvrir une copie sans titre, cochez cette case.
3. Cliquez sur le bouton Ouvrir.
3.9
Fermer WebPlus 10
Pour fermer la fenêtre active :
Exécutez la commande Fichier/Fermer ou cliquez sur le bouton Windows Fermer.
S’il s’agit de la seule fenêtre ouverte pour le site, la commande ferme le projet et vous êtes invité à enregistrer les modifications.
Vous pouvez fermer toutes les fenêtres ouvertes sans quitter l’application WebPlus 10.
Pour fermer toutes les fenêtres ouvertes :
Exécutez la commande Fichier/Fermer tout.
Pour quitter WebPlus 10 :
Exécutez la commande Fichier/Quitter.
Vous êtes alors invité à enregistrer les modifications apportées aux projets ouverts.
26
4
Concevoir des sites et des pages
4.1
Présentation de la structure du site et de la navigation
Contrairement à une publication imprimée, un site web ne repose pas sur une succession linéaire de pages. Il est plus logique de concevoir un site en lui donnant une dimension spatiale, c’est-à-dire une structure telle que celle d’un musée que des personnes visiteraient. En règle générale, vous pouvez supposer que les visiteurs y entreront par la porte principale (la page d’accueil), mais la suite de la visite dépendra des liens que vous aurez prévus. Les passerelles de navigation sont comparables aux couloirs reliant les salles du musée. C’est à vous, en tant qu’architecte, de prévoir une disposition intelligente des pages et des liens afin que les visiteurs s’y retrouvent facilement, sans se perdre.
Dans WebPlus 10, vous pouvez utiliser l’arborescence de la Structure du site pour cartographier visuellement la structure de votre site pour y ajouter ensuite des éléments de navigation (graphiques à thème spéciaux qui s’adaptent dynamiquement à la structure que vous avez définie. Vous utiliserez souvent l’arborescence de la Structure du site lorsque vous apprendrez à éditer les pages.
4.1.1 Structure du site
Contrairement au musée de notre analogie, la structure d’un site web n’a aucun rapport avec son organisation physique ou avec l’endroit où les pages sont conservées. Il s’agit plutôt de l’organisation logique du contenu du site de manièr e à y simplifier la navigation. L’un des principes d’organisation les plus efficaces, défendu par WebPlus 10, est une structure en arbre inversé qui commence par la page d’accueil à partir desquelles les ramifications se développent vers d’autres pages. Du point de vue du visiteur qui parcourt votre site, cette disposition présente le contenu d’une manière hiérarchique familière, structurée en sections et en niveaux.
Concevoir des sites et des pages
Une section est une catégorie de contenu, telle que "Actualités", "Produits", "Contact" ou "Liens". Les diverses sections principales sont généralement répertoriées sur la page d’accueil du site, dans une barre de navigation. Dans l’idéal, chaque page du site appartient à une section particulière et, à moins qu’il n’y ait qu’une seule page dans une section donnée, la section a sa propre page principale qui sert généralement de menu pour les pages subsidiaires.
Le niveau est le nombre d’étapes nécessaires pour atteindre une page donnée, à partir de la page d’accueil. La page d’accueil correspond toujours au niveau 1, généralement avec les pages de menu des sections principales. Ainsi les barres de navigation fonctionnent automatiquement. Les pages situées une étape en dessous des pages de menu des sections se trouvent au niveau 2.
27
Chapitre 4 WebPlus 10
Dans WebPlus 10, l’arborescence de la Structure du site (sous l’onglet Site) constitue une aide visuelle pour l’organisation du contenu du site en sections et en niveaux, c’est-à-dire sous la forme d’une hiérarchie de pages parents qui se ramifient en pages enfants. Voici comment une structure similaire pourrait apparaître dans l’arborescence de la Structure du Site de WebPlus 10.
L’utilisation de l’arborescence de la Structure du Site facilite la visualisation des relations entre les pages et l’organisation du site d’une manière adaptée au contenu que vous avez à offrir. Évidemment, un site web est véritablement un réseau de pages liées les unes aux autres et l’arborescence ne vous empêche pas de prévoir des liens entre deux pages. Mais elle matérialise la représentation des passerelles principales (vers le haut, vers le bas et sur les côtés) à l’intérieur du site. L’organisation logique par sections et par niveaux simplifie la navigation à l’intérieur du site. Avec WebPlus 10, vous pouvez facilement créer des barres de navigation qui reflètent la structure du site et qui guident les visiteurs le long de ces "artères principales".
4.1.2 Navigation
Dans WebPlus 10, certains types d’images à thème appelés éléments de navigation (tels que les boutons Précédent/Suivant et les barres de navigation) sont pré-programmés pour comprendre la structure de votre site, favorisant une navigation simplifiée sur celui-ci. Il vous suffit de sélectionner un élément de navigation sous l’onglet Images à thèmes du Studio et WebPlus 10 s’occupe du reste ! Les boutons Précédent/Suivant créent automatiquement un renvoi latéral vers les pages adjacentes situées au même niveau. Les barres de navigation
28
Concevoir des sites et des pages
associent des boutons à des menus contextuels pour faciliter les déplacements entre les différentes sections et différents niveaux d’un site.
Voici, par exemple, une barre de navigation que nous avons choisie pour le site illustré plus haut. Les boutons comportent des liens vers la page d’accueil et les pages de menu des sections (toutes au niveau 1), ainsi que des menus déroulants permettent d’accéder aux pages enfants (niveau 2 dans ce cas).
Voici un résumé des avantages liés à l’incorporation d’éléments de navigation dans la conception du site :
Vous pouvez insérer des éléments de navigation à n’importe quel niveau de votre site
et, pour les barres de navigation, vous pouvez définir facilement à quelle(s) partie(s) de la structure du site chaque barre de navigation doit être liée (par exemple, à des pages de niveau supérieur, à des pages de même niveau, à des pages enfants, etc.)
Les éléments de navigation étant des images à thème, vous pouvez utiliser l’onglet
Images à thème pour sélectionner des éléments de conception assortis (boutons, etc.) afin d’homogénéiser votre présentation et modifier l’aspect global par un simple clic.
Par défaut, toutes les pages de l’arborescence sont "incluses dans la navigation".
Autrement dit, elles peuvent être reliées par des éléments de navigation. Vous pouvez exclure certaines pages de façon à ce qu’elles ne soient pas prises en compte par les éléments de navigation. Les pages incluses sont repérées par une coche dans leur entrée de page, tandis que les pages exclues n’affichent pas ce symbole. Par exemple, imaginons que votre site comporte une section de pages de référence que les visiteurs ne doivent pas parcourir de haut en bas. L’exclusion de la page parente de cette section supprimerait celle-ci de la barre de navigation. Vous pourrez toujours insérer des liens hypertextes dans la page ; simplement, elle n’apparaîtra pas dans les éléments de navigation.
En outre, un élément de navigation WebPlus 10 est mis à jour dynamiquement en cas
de modification du nom des pages ou des relations, ou en cas de couper-coller de la barre de navigation sur une autre page. Par exemple, "Histoire 1" remplace un titre (une pratique courante lors de la conception d’un site avant que tout le contenu soit en place). Ensuite, lorsque la page est renommée "Durand nommé au comité directeur", la barre de navigation tient immédiatement compte de la modification.
29
Chapitre 4 WebPlus 10
4.2
Présentation des pages et des maquettes
Les pages sont l’unité de base de la conception de sites Web. WebPlus 10 vous aide à organiser le contenu de votre site en disposant les pages à l’intérieur d’une arborescence qui aide à son tour les visiteurs à naviguer dans le site. Lorsque l’on considère les pages du point de vue de leur conception, chaque page WebPlus 10 a un calque de page au "premier plan" et un calque de maquette en "arrière-plan".
Les maquettes font partie de la structure de votre projet Web Plus et constituent un moyen flexible de stocker des éléments d’arrière-plan que vous souhaitez faire apparaître sur plusieurs pages : par exemple, un logo, un arrière-plan, une bordure, voire un élément de navigation. L’aspect essentiel est qu’une maquette particulière est généralement partagée par plusieurs pages, comme illustré ci-dessous. En plaçant un élément de la conception sur une maquette et en affectant plusieurs pages à cette maquette, vous vous assurez que toutes les pages incorporent cet élément. Bien sûr, chaque page individuelle peut comporter ses propres éléments.
L’onglet Site du studio inclue une section supérieure Maquettes avec des icônes pour chaque maquette, ainsi qu’une section Structure du site indiquant quelle maquette est utilisée non seulement par la page affichée, mais aussi par les autres pages du site :
4.3
Visualiser les pages
L’espace de travail d’une publication de WebPlus 10 consiste en une page et en une zone de travail.
30
Loading...
+ 154 hidden pages