Les sites Web les plus élémentaires auront une barre de titre, la barre de navigation avec des onglets à différentes pages Web et d'une partie du contenu. Créer un site web avec Adobe Illustrator est l'un des logiciels faciles à utiliser. Il existe de nombreuses applications de conception que vous pouvez choisir et les bases sont faciles à comprendre. Vous allez utiliser des graphiques vectoriels simples pour créer un site Web dans Illustrator. Les graphiques vectoriels sont des modèles qui utilisent des points, des lignes, des courbes et des formes pour créer des images plutôt que des images tramées qui utilisent des pixels , comme dans Adobe Photoshop. Instructions
Création d'un dossier racine et Configuration de Dreamweaver
1
Créez un dossier sur votre bureau. Pour ce faire, faites un clic droit sur votre bureau et sélectionnez "Nouveau dossier" dans le menu déroulant. Ce sera votre dossier racine. Nommez le rien du dossier que vous voulez.
2
Ouvrez Dreamweaver , cliquez sur "Site" en haut et sélectionnez " Nouveau site. " Le menu de définition de site s'ouvrira alors et vous guidera à travers les étapes nécessaires pour mettre en place un site dans Dreamweaver .
3
Nom de votre site dans le champ désigné . Vous n'avez pas besoin de vous soucier de remplissage dans le domaine d'une URL . Une fois que vous nommez votre site cliquez sur "Suivant".
4
définir ce paramètre à côté de " Non, je ne veux pas utiliser une technologie de serveur . " Cliquez sur " Suivant" pour passer au groupe suivant de paramètres.
5
Choisissez " Modifier les copies locales sur ma machine, puis de les télécharger vers le serveur (Internet) lorsque vous êtes prêt . " Ensuite, cliquez sur l'icône du dossier , puis dans le menu qui s'ouvre trouver votre dossier racine, sélectionnez-le et cliquez sur "Choisir ". Lorsque vous avez terminé, cliquez sur "Suivant" pour passer à l'étape suivante.
6
Sélectionnez "None" pour la façon dont vous voulez vous connecter à votre serveur distant. Cliquez sur Suivant après avoir réglé ce paramètre. Cliquez sur "Terminé " après avoir examiné vos paramètres.
Conception de la page Web dans Illustrator
7
Ouvrez Adobe Illustrator et cliquez sur "Créer un nouveau document Web. " Il n'est pas nécessaire d'ajuster tous les réglages , donc cliquez sur "OK " pour continuer.
8
Créer une page "home" simple pour votre site Web en utilisant la barre d'outils . Créer seulement une barre de titre , une barre de navigation , et un espace pour votre contenu. Vous pouvez le faire en utilisant l'outil Rectangle et l'outil de type. Dans la barre de navigation , créer des sous- onglets de catégorie pour accéder aux différentes pages . Par exemple, si vous avez un site web pour un restaurant, vous pouvez configurer catégorie sous les onglets pour la maison , plats et desserts .
9
Sélectionnez l' outil " tranche " de votre barre d'outils une fois que vous avez les bases pour votre site web conçu . Créer votre première tranche en dessinant une boîte autour de votre zone de titre. Répétez cette opération avec votre zone de barre de navigation et votre zone de contenu.
10
passer à la " Sélection de tranche " outil . Elle apparaît si vous détenez votre bouton de la souris enfoncé sur l'outil de coupe. Double-cliquez sur votre tranche de titre . Lorsque le menu " Slice Options" s'ouvre , nommez votre tranche , puis cliquez sur " OK". Répétez cette étape avec la barre tranche navigation et la zone de contenu tranche.
11
Allez dans le menu Fichier et choisissez "Enregistrer pour le Web et les périphériques . " Vous pouvez choisir si vous souhaitez enregistrer vos images au format GIF ou JPEG. Cliquez sur "Enregistrer".
12
Choisissez " Autre ... " Dans la optimisés comme menu. Cela peut être trouvé dans les tranches menu déroulant. Vous obtiendrez un menu qui s'ouvre avec les options de sauvegarde .
13
changement de « HTML » à « tranches » dans le menu des paramètres de sortie. Ce menu déroulant est le deuxième à partir du haut . Après avoir choisi " tranches ", changer le réglage ici pour "Générer CSS. "
14
Changez la couleur de fond sur «Aucun» dans le menu de fond. Cliquez sur "OK". Réglez « Format » à « HTML et images . " Changez vos «Paramètres» pour « toutes les tranches d'utilisateurs . "
15
changer le nom de votre fichier "index" dans la zone Enregistrer sous section . Définissez l'emplacement que vous enregistrez sous le dossier racine que vous avez créé dans la première section . Cliquez sur " Enregistrer" lorsque vous avez fait cela .
Fin de votre site Web dans Dreamweaver
16
Ouvrez Dreamweaver , choisissez "Fichier> Ouvrir " et ouvrez votre index.html fichier que vous avez exporté à partir d' Illustrator. Vous devriez être capable de trouver dans votre dossier racine.
17
Donner votre page web un titre. En haut de la page, vous pouvez trouver un espace pour un titre. Placez le nom de la page que vous travaillez dans cette section . Par exemple, si vous travaillez sur votre page d'accueil, vous aurez envie de mettre « à la maison » dans votre zone de titre.
18
créer un lien de hotspot pour votre navigation en cliquant sur votre tranche de navigation. Au fond , cliquez sur l'outil de carte de hotspot bleu et tracez un cadre autour du premier onglet de la barre de navigation. Placez le nom du fichier HTML que vous voulez lier à la boîte de lien. Par exemple, si vous dessinez un cadre autour de l'onglet Accueil , vous écririez "index.html" dans la boîte de lien. Vous devez également vous assurer que vous lui donnez un nom d' alt pour les navigateurs pour les utilisateurs aveugles et sourds peuvent lire le lien à haute voix ou taper en braille. Dans la section maison de type alt .
19
Répétez cette étape pour chacun de vos onglets de la barre de navigation . Par exemple, si votre prochaine onglet de la barre de navigation est pour entrées , vous dessinez un cadre autour de l'onglet , tapez " entrees.html " dans la boîte de lien , et tapez " entrées " dans la boîte de alt .
20
référence de votre zone de barre de titre et votre zone de contenu sans créer un hotspot. Pour ce faire, cliquez sur l'image , puis ajouter le nom du HTML que vous souhaitez mettre un lien vers la zone de liaison . Par exemple, votre barre de titre serait liée à "index.html ". Assurez-vous que la zone frontalière dit «0».
21
Allez dans "Fichier > Enregistrer". Ce sera la page d' accueil de votre site et la base de toutes les autres pages HTML pour votre site ainsi .
22
modifier la propriété de titre en haut de l'index pour quelle que soit la page suivante sur votre site va être .
23
choisissez "Fichier > Enregistrer sous » et nommez le fichier « entrees.html . " Le nom doit être en minuscules et sans espace .
24
Répétez ces étapes pour toutes les pages Web restantes. Un moyen facile de voir les choses est tout simplement regarder chacun de vos onglets de la barre de navigation . Chaque onglet aura besoin d'une page Web distinct désigné pour cela.
25
Testez vos liens en cliquant sur l'image d'un globe en haut de l'écran. Cela va vous montrer exactement comment votre site se penchera une fois téléchargés vers un site web.