Comment créer une simple page d`atterrissage personnel à l`aide d`adobe muse

Il y a deux étapes principales impliquées dans le processus de conception de sites Web. La première est la conception de l`aspect des pages et le second est la conception dans la traduction du produit réel - les pages Web. La première étape exige des compétences de conception tandis que la deuxième étape a besoin d`expertise de codage. Le problème est de trouver une personne qui a des compétences est difficile.

Pour ceux qui ont de meilleurs yeux pour la conception (et aucun intérêt pour le codage), il y a Muse d`Adobe. La société affirme que cette plate-forme multi- AIR application peut aider tout le monde à concevoir et publier des sites web HTML sans avoir à écrire de code que ce soit.

Commencez à planifier votre page d`atterrissage personnel

Une question avant de commencer. Pourquoi quelqu`un utiliser un outil de création web comme Muse lorsque vous pouvez utiliser WordPress et ses thèmes à la place? La réponse est « personnalisation ». Même si il y a littéralement des milliers de thèmes WordPress là, la personnalisation du thème vraiment répondre à nos besoins est difficile. Une autre raison est que l`utilisation d`un système de base de données WordPress avancée pour un site simple et linéaire serait exagéré.

Vous pouvez télécharger Muse du site. Il est disponible gratuitement jusqu`à la sortie v.1.0 au début de 2012. L`application fonctionne sous Windows et Mac, mais il faut que votre système est installé AIR.

Pour mieux comprendre comment fonctionne Muse, essayons de l`utiliser pour créer un simple page d`atterrissage personnel, quelque chose le long des lignes de Flavors.me ou À propos de moi. Commencez par choisir «Créer un nouveau site» De la fenêtre de démarrage ou dans le menu Fichier.Cinq conseils pour créer un cool page personnelle LandingCinq conseils pour créer un cool page personnelle LandingLire la suite

page d`atterrissage personnel

  • Ensuite, vous serez invité à personnaliser votre site en choisissant la largeur de la page, le nombre de colonnes, marges, etc.

créer la page d`atterrissage

  • La première étape dans la construction d`un site Web est de décider combien de pages il aura et ce que la relation entre les pages. Vous pouvez facilement ajouter, supprimer et réorganiser les pages du «Plan" fenêtre.

créer la page d`atterrissage

  • Clique le "+ (Plus) » pour ajouter, et le «X» Pour fermer. Cliquez sur le nom de la page pour renommer, puis faites glisser-déposer pour réorganiser.

créer la page d`atterrissage

Video: Adobe Muse CC | One Page Scrolling Menu | Muse For You

  • Au bas de la page, vous pouvez voir la page A-Master. Ceci est le modèle qui sera utilisé tout au long de votre site. Donc, s`il y a des éléments que vous souhaitez conserver sur toutes vos pages, ce serait tellement plus facile si vous définissez les éléments à A-maître au lieu de les répéter encore et encore.

créer la page d`atterrissage

Démarrer bâtiment

  • Si vous double-cliquez sur l`une des pages, il sera ouvert dans un nouvel onglet. Vous pouvez commencer à construire et concevoir les pages à l`aide des outils à la barre d`outils.

créer la page d`atterrissage gratuit

  • D`autres outils qui vous aideront le long du processus de conception sont les «panneaux" sur la droite. Vous pouvez afficher ou masquer ces panneaux via le menu Fenêtre.

créer la page d`atterrissage gratuit

  • Pour construire notre page d`atterrissage personnel, nous allons changer l`arrière-plan en insérant une image. Vous pouvez personnaliser l`image en changeant l`échelle et la position.

créer la page d`atterrissage gratuit

  • , Nous allons ajouter suivante un menu de navigation en le sélectionnant dans le panneau Widget, puis glisser-déposer dans la page Web.

Menu d`insertion 03b

  • Vous pouvez personnaliser le menu de navigation à l`aide du «options« . Cliquez sur la petite flèche bleue pour appeler la fenêtre Options.

Video: Tuto Adobe Muse CC - L01/17 - Design d'une page web

03D Options widget

  • Vous pouvez également modifier l`apparence du texte (type, couleur, taille) en utilisant le «Texte» Onglet dans les panneaux de droite.

03e modifier le texte

  • Ensuite, vous pouvez ajouter des textes et Rectangles en utilisant les outils de la barre d`outils. Faites glisser ces éléments à la position que vous voulez, et de les personnaliser via les panneaux de droite. Pour ajouter des liens externes (ou d`autres éléments HTML), utilisez la «Insérer HTML» Menu «Objet« .

06a insert html

  • Notez le code HTML des liens dans la fenêtre pop-up, puis cliquez sur OK pour l`ajouter au site.

06b code html

  • Comme pour les autres éléments, le code HTML inséré est hautement personnalisable. Malheureusement, nous ne pouvons pas changer la couleur de lien. Espérons que cette fonctionnalité apparaîtra dans une future version de l`application.

06c lien inséré

  • Après tout est réglé, vous pouvez voir le résultat en cliquant sur le «Aperçu" lien.

07a aperçu

La dernière étape

  • Après tout est réglé, vous êtes prêt à mettre votre site sur le Web. Pour ce faire, utilisez la «Exporter en HTML» Menu «Fichier« .

08a export html

  • Décider de l`emplacement pour enregistrer le projet, et cliquez sur «Exportation».

08b Exporter au format HTML

  • Si vous souhaitez joindre votre page de destination personnelle à une URL que vous possédez déjà, utilisez tout bon client FTP de télécharger tout dans le dossier à votre compte d`hébergement Web. Étant donné que les différents fournisseurs d`hébergement utilisent des paramètres différents, s`il vous plaît consulter votre fournisseur d`hébergement à ce sujet.

page d`atterrissage personnel

Cette expérience courte nous a montré que la création d`une page d`atterrissage personnel à l`aide Muse est aussi simple que l`ajout et la personnalisation des éléments. Mais Muse est également capable de créer des sites plus complexes avec plusieurs pages. Il existe de nombreux exemples de sites Web montrant ce que Muse peut faire sur leur «Vitrinepage ». Pour en savoir plus sur Muse, vous pouvez visiter leur «Apprendrepage ».

Video: Adobe Muse CC - Creating a simple website - 2

Que pensez-vous de Muse? Voulez-vous essayer cet outil pour vous aider à construire votre site Web? Partagez votre opinion dans les commentaires ci-dessous.

Articles connexes