Erste Schritte mit Adobe Muse. Erfahren Sie mehr über MUSE-Dateien, lernen Sie, wie Sie Seiteneigenschaften festlegen, Favicons hinzufügen und vieles mehr.

Hinweis:

Adobe Muse wird nicht mehr um neue Funktionen ergänzt und der Support wird am 26. März 2020 eingestellt. Detaillierte Informationen und Unterstützung erhalten Sie auf der Seite zum Ende der Produktlebensdauer von Adobe Muse.

Ressourcen zu Adobe Muse

Nach der Anmeldung wird der Arbeitsbereich von Adobe Muse aufgerufen. Danach wird der Adobe Muse-Startbildschirm angezeigt. Führen Sie einen der folgenden Schritte aus:

  • Klicken Sie zum Erstellen einer neuen Site auf „Neu erstellen“.
  • Klicken Sie auf „Öffnen“ und navigieren Sie zu einer vorhandenen MUSE-Datei auf Ihrem Computer.
Startbildschirm in Adobe Muse
Verwenden Sie den Startbildschirm, um eine neue Site zu erstellen.

Wenn Sie eine neue Site erstellen, wird das Dialogfeld „Neue Site“ angezeigt. Wählen Sie „Variable Breite“, um das responsive Layout zu aktivieren oder wählen Sie „Feste Breite“, um ein alternatives Layout auszuwählen. Es enthält Felder, mit deren Hilfe Sie die maximale Seitenbreite, Spalten und den Abstand zwischen den Spalten festlegen können.

Über das Dialogfeld „Neue Site“ können Sie eine neue Website erstellen.
Wählen Sie „Datei“> „Neue Site“, um eine neue Website zu erstellen.

Klicken Sie auf „Erweiterte Einstellungen“, um die Werte für Abmessungen, Ränder, Spalten und Innenabstände Ihrer Website (numerisch und in Pixeln) festzulegen. Sie können über dieses Fenster auch Auflösung und Sprache auswählen.

Sie können diese Einstellungen jedoch auch zu einem späteren Zeitpunkt aktualisieren, indem Sie „Datei“ > „Site-Eigenschaften“ auswählen.

Im Dialogfeld „Site-Eigenschaften“ können Sie die Site-Eigenschaften festlegen.
Legen Sie die Site-Eigenschaften im Dialogfeld „Neue Site“ fest.

Klicken Sie auf „OK“, wenn Sie fertig sind, um das Dialogfeld zu schließen.

Standardmäßig wird die Planungsansicht mit zwei bereits erstellten Elementen angezeigt. Die Homepage oben links ist die Seite, die zuerst geladen wird, wenn Besucher Ihre Site online aufrufen. Die darunter befindliche A-Musterseite ist wie eine Vorlage. Platzieren Sie Elemente auf der A-Musterseite, die auf allen Seiten der Site angezeigt werden sollen. Auf diese Weise müssen Sie die gemeinsamen Site-Elemente nur an einer zentralen Stelle aktualisieren.

NewWebsite
Adobe Muse generiert automatisch eine Homepage und eine Musterseite.

Am oberen Rand gibt es vier Links, die auf die verschiedenen Bereiche der Benutzeroberfläche verweisen: Planung, Entwurf und Veröffentlichen.

Weitere Informationen über die Verwendung der Benutzeroberfläche und die Entwicklung einer Site mit Adobe Muse finden Sie unter „Erste Schritte mit Adobe Muse“ und unter „Erstellen der ersten Website mit Adobe Muse“.

MUSE-Dateien

Wenn Sie Websites mit anderen Programmen, wie Dreamweaver, entwerfen, erstellen Sie einen Ordner auf Ihrem Computer, der Unterordner und Dateien mit dem gesamten Site-Inhalt enthält. Er kann schwierig sein, eine Vielzahl an Elementen zu verwalten und sicherzustellen, dass keine fehlerhaften Links auf der Site vorhanden sind.

Wenn Sie eine neue Site in Adobe Muse erstellen und „Datei“ > „Speichern“ wählen, erstellen Sie eine einzelne MUSE-Datei. Dies ähnelt dem Erstellen einer PSD-Datei in Photoshop, die eine beliebige Anzahl von Ebenen, Grafiken und verknüpften Elementen enthalten kann. Diese einzelne MUSE-Datei ist die einzige Datei, die Sie benötigen, um eine Site zu erstellen, da sie alle Bilder, Links, Code und Site-Dateien enthält. Wenn Sie die Site zusammen mit einem Kollegen entwickeln möchten, können Sie Ihrem Kollegen eine Kopie der MUSE-Datei senden, die Sie erstellt haben, damit er sie öffnen, Änderungen vornehmen und die hinzugefügten Änderungen veröffentlichen kann.

In der Regel ist es am besten, nur jeweils einer Person die Arbeit an der MUSE-Datei zu gestatten. Nachdem Sie den Inhalt der Site hinzugefügt haben, können Sie ihn veröffentlichen und Ihren Kollegen die MUSE-Datei senden, sodass sie sie durch Hinzufügen von zusätzlichen Inhalten bearbeiten können. Wenn sie fertig sind, können sie die aktualisierte MUSE-Datei (mit den Änderungen) zurücksenden. Dies hat den Vorteil, dass nicht die Arbeit von anderen überschrieben wird.

Alternativ können Sie eine MUSE-Datei erstellen und eine temporäre Datei veröffentlichen. Geben Sie anschließend die MUSE-Datei für Ihre Kollegen frei. Ihre Kollegen können die Datei öffnen, „Datei“ > „Speichern unter“ wählen und Änderungen an der Kopie vornehmen, während Sie weiterhin an Ihrer Kopie arbeiten, unter der Voraussetzung, dass sie ihre eigenen neuen temporären Sites veröffentlichen werden. Wenn Sie diesen Workflow verwenden, sind die beiden Versionen der Site nicht synchron: Ihre Version der MUSE-Datei übernimmt nicht die Änderungen, die Ihre Kollegen hinzugefügt haben, und umgekehrt.

Wenn Sie umfangreiche Änderungen an einer vorhandenen Website vornehmen möchten, empfiehlt es sich immer, die MUSE-Datei zu öffnen und „Datei“ > „Speichern unter“ zu wählen. Erstellen Sie eine neue MUSE-Datei mit einem leicht anderen Dateinamen und speichern Sie alle MUSE-Dateien in einem einzigen Ordner auf Ihrem Computer. Auf diese Weise können Sie stets die vorherige Version der MUSE-Datei mit einem älteren Design öffnen und erneut veröffentlichen, wenn der Kunde die Originalversion der Site bevorzugt, um die Site wieder auf das ursprüngliche Design zurückzusetzen.

Es empfiehlt sich auch, Ihre MUSE-Datei häufig zu speichern. Wenn Adobe Muse abstürzt, wird beim erneuten Start von Adobe Muse im Normalfall die wiederhergestellte Version der MUSE-Datei mit den zuletzt vorgenommenen Bearbeitungen angezeigt. Wenn dies der Fall ist, speichern Sie die wiederhergestellte Version der MUSE-Datei sofort und nehmen Sie die Arbeit wieder auf. Achten Sie darauf, die MUSE-Dateien, die Sie erstellen, an einem sicheren Ort zu speichern und zu sichern, da jede Datei eine gesamte Website enthält. Wenn Sie die MUSE-Datei verlieren und keine Sicherungskopie haben, können Sie die MUSE-Datei nicht wiederherstellen, indem Sie die Site-Dateien herunterladen, die auf dem Server gehostet werden.

Viele Webdesigner speichern Ihre MUSE-Dateien unter aussagekräftigen Namen, wie eigene_site_v1.muse und eigene_site_v2.muse. Sie können dem MUSE-Dateinamen auch das Datum hinzufügen, damit Sie wissen, welche Version älter ist, z. B. eigene_site_2012-4-13.muse und eigene_site_2012-4-30.muse. Sie können die Datei jedoch so benennen, wie es Ihnen am sinnvollsten erscheint.

Festlegen von Site-Eigenschaften beim Erstellen einer neuen Site in Adobe Muse

Führen Sie folgende Schritte aus, um eine neue Site zu erstellen und die Eigenschaften der Site zu definieren:

  1. Wählen Sie auf dem Startbildschirm die Option „Neu erstellen“ > „Site“. Klicken Sie für ein responsives Layout auf „Variable Breite“ und für ein alternatives Layout auf „Feste Breite“.

  2. Legen Sie im angezeigten Dialogfeld „Neue Site“ die Seitenbreite auf 950 und die minimale Höhe auf 800 fest. Legen Sie für „Spalten“ 3 und für „Spaltenabstand“ 20 fest. Setzen Sie unter „Ränder“ alle vier Werte auf 50. Legen Sie die Werte für „Innenabstand“ auf 36 fest.

    Legen Sie die Site-Attribute im Dialogfeld „Site-Eigenschaften“ fest.
    Legen Sie die Site-Attribute fest, indem Sie die Werte direkt in die Felder eingeben oder indem Sie auf die Pfeilschaltflächen für jede Einstellung klicken.

    Hinweis:

    Wenn Sie Ihre Seite für Smartphones und Tablets optimieren möchten, können Sie die Option „Weiterleitung vom Desktop“ nutzen, um die Layout-Funktion „Weiterleitung auf Mobilgeräte“ zu aktivieren bzw. zu deaktivieren. Diese Funktion ist für unfertige Layouts nützlich, die noch nicht weitergeleitet werden sollen (Bearbeitung läuft). Beachten Sie, dass das Layout trotzdem exportiert wird, auch wenn die Weiterleitungsfunktion deaktiviert ist. Mobilgeräte-Browser werden den Benutzer jedoch nicht auf für Mobilgeräte optimierte Seiten weiterleiten und die exportierten Dateien sind so lange nicht in der Datei „sitemap.xml“ enthalten, bis Sie diese Option im Dialogfeld „Site-Eigenschaften“ aktivieren.

  3. Klicken Sie auf „OK“, um Ihre Einstellungen zu speichern und das Dialogfeld zu schließen.

  4. Wählen Sie „Datei“ > „Site-Eigenschaften“ aus. Klicken Sie auf das Ordnersymbol neben dem Favicon-Bild. Navigieren Sie zum Ordner „Kevins_Koffee_Kart“ mit den Beispieldateien und wählen Sie die Datei „favicon.png“ aus. Klicken Sie auf „OK“.

    fig_07
    Favicons sind Symbole, die neben der URL Ihrer Site in der Adresszeile des Browsers angezeigt werden.

  5. Wählen Sie „Datei“ > „Speichern“. Geben Sie der neuen Site einen eindeutigen Namen, wie „EigenerNameKoffeeKart.muse“. (Die Beispiel-Site in diesem Tutorial heißt „01KevinsKoffeeKart.muse“.)

Hinzufügen eines Favicons im Site-Eigenschaftenbedienfeld

Ein Favicon ist ein kleines, quadratisches Bild, das Sie erstellen, zu einer Site hinzufügen und hochladen, um Lesezeichen und URLs zu personalisieren. Das Verhalten variiert zwar abhängig vom verwendeten Browser, aber im Allgemeinen wird das Favicon in der Adressleiste des Browsers neben der URL der Site angezeigt, die gerade betrachtet wird. In vielen Fällen wird das Favicon auch neben dem Namen einer Seite angezeigt, die mit einem Lesezeichen versehen ist, oder auf einer Registerkarte, die eine geladene Site-Seite enthält. Sie können ein beliebiges Bildbearbeitungsprogramm (z. B. Photoshop oder Illustrator) verwenden, um eine quadratische (gleichmäßig proportionierte) Bilddatei zu erstellen, die als Favicon Datei verwendet werden soll. Für dieses Tutorial wird eine PNG-Datei zur Verfügung gestellt.

Führen Sie folgende Schritte aus, um ein Favicon zur Site hinzuzufügen:

  1. Wählen Sie „Datei“ > „Site-Eigenschaften“ aus. Das Site-Eigenschaftenbedienfeld wird angezeigt.

  2. Klicken Sie auf der Inhaltsregisterkarte auf das Ordnersymbol rechts neben dem Abschnitt „Favicon“. Navigieren Sie im angezeigten Dialogfeld „Favicon-Bild wählen“ zum Beispieldateiordner und wählen Sie die Datei „favicon.png“ aus.

    Favicon
    Wählen Sie die Datei „favicon.png“ in den Site-Eigenschaften aus.

    Hinweis:

    Wenn Sie Adobe Muse 2015.0.2 oder eine frühere Version verwenden, können Sie ein Favicon für Ihre Site hinzufügen, indem Sie auf „Datei“ > „Site-Eigenschaften“ > Registerkarte „Layout“ klicken.

  3. Klicken sie auf „Öffnen“, um das Dialogfeld „Favicon-Bild wählen“ zu schließen und die Datei auszuwählen. Klicken Sie dann auf „OK“, um das Dialogfeld „Site-Eigenschaften“ zu schließen.

  4. Wählen Sie „Datei“ > „Site-Vorschau in Browser“. In der Adressleiste am oberen Rand des Browserfensters wird jetzt das Favicon angezeigt. Wenn die Site in einer Registerkarte geladen wird, können Sie das Favicon u. U. auch hier sehen. Versehen Sie die Seite mit einem Lesezeichen, um zu sehen wie das Symbol in der Lesezeichenliste neben dem Namen der Seitennamen angezeigt wird.

    Die Site ist jetzt komplett fertig. Der nächste Schritt besteht darin, die Site auf die bereitgestellten Adobe Business Catalyst-Server hochzuladen.

Dieses Werk unterliegt den Bedingungen der Creative Commons Attribution-Noncommercial-Share Alike 3.0 Unported License.  Twitter™- und Facebook-Beiträge fallen nicht unter die Bedingungen der Creative Commons-Lizenz.

Rechtliche Hinweise   |   Online-Datenschutzrichtlinie