Wenn Sie an Seiten in der Entwurfsansicht arbeiten, möchten Sie möglicherweise manchmal Seitenelemente ändern, die in dieser Ansicht nicht sichtbar sind, z. B. Inhaltsbereiche oder Seitenränder und Textabstände. In diesem Fall ermöglicht die visuelle Unterstützung das Anzeigen aller dieser nicht sichtbaren oder leeren Elemente des Seitenentwurfs, sodass Sie die vollständige Kontrolle über Seitenstruktur und -layout haben. Die visuelle Unterstützung erleichtert das Arbeiten an Inhalt, Design, Layout und Struktur der Seite.

In diesem Artikel wird die visuelle Unterstützung vorgestellt, die einzelnen Optionen der visuellen Unterstützung werden beschrieben, und es wird gezeigt, wie Sie diese beim Arbeiten in der Entwurfsansicht schnell ein- oder ausblenden können.

• Was ist visuelle Unterstützung?

• Was wird durch die einzelnen Optionen der visuellen Unterstützung angezeigt?

• Ein- oder Ausblenden der visuellen Unterstützung

Was ist visuelle Unterstützung?

Bei der visuellen Unterstützung handelt es sich um Indikatoren, die Sie in der Entwurfsansicht auf einer Seite anzeigen können, um alle sichtbaren und leeren Elemente und Eigenschaften auf der Seite zu sehen. Sie können die visuelle Unterstützung verwenden, um Elemente mit nicht sichtbaren und leeren Formatvorlagen zu identifizieren, z. B. leere HTML-Tags und nicht sichtbare Microsoft ASP.NET-Steuerelemente. Die visuelle Unterstützung ermöglicht außerdem das Anzeigen der Seitenränder und Textabstände von Seitenelementen, Inhaltsblöcken und Inhaltsbereichen (nur auf ASP.NET-Seiten und in dynamischen Webvorlagen) auf einer Seite.

Wenn Sie die visuelle Unterstützung ausblenden, stimmt das Seitenlayout in der Entwurfsansicht, wie in der folgenden Abbildung gezeigt, mit dem Seitenlayout im Browser überein.

In der nächsten Abbildung wird die gleiche Seite  – immer noch in der Entwurfsansicht, aber jetzt mit eingeblendeter standardmäßiger visueller Unterstützung – anders angezeigt.

Wenn Sie die visuelle Unterstützung einblenden, werden manche der Elemente mit gepunkteten Rändern in verschiedenen Farben angezeigt. Jeder gepunktete Rand stellt eine separate Option der visuellen Unterstützung dar. In der vorherigen Abbildung z. B. werden durch die visuelle Unterstützung Sichtbare Ränder die Inhaltsbereiche in rosa gepunkteten Rändern, Tabellenelemente mit weißen gepunkteten Rändern und nicht bearbeitbare Bereiche grau schattiert angezeigt. Abhängig von der ausgewählten visuellen Unterstützung können Sie auch Inhaltsbereiche, mit ausgeblendeten oder nicht sichtbaren Formatvorlagen markierte Elemente, nicht sichtbare ASP.NET-Steuerelemente und ASP.NET-Steuerelementfehler auf einer Seite sehen. Im nächsten Abschnitt werden die einzelnen Optionen der visuellen Unterstützung im Detail beschrieben.

 Seitenanfang

Was wird durch die einzelnen Optionen der visuellen Unterstützung angezeigt?

In diesem Abschnitt werden die in Microsoft Office SharePoint Designer 2007 verfügbaren Optionen der visuellen Unterstützung, die Verwendung und das Verhalten der einzelnen Optionen der visuellen Unterstützung (sowie alle Verwendungseinschränkungen) beschrieben und die Darstellung der einzelnen Optionen der visuellen Unterstützung in der Entwurfsansicht veranschaulicht.

Eine Seite in einer Microsoft SharePoint-Website enthält normalerweise viele Seiten- und Entwurfselemente. Es kann hilfreich sein, eine leere Seite zu erstellen und ein paar Elemente einzufügen, um die einzelnen Optionen der visuellen Unterstützung besser zu isolieren und zu sehen, wozu sie jeweils dienen.

Blockmarkierung

Die visuelle Unterstützung Blockmarkierung wird auf zwei Arten angezeigt:

• Wenn Sie in einen Block klicken, wird um den Block herum ein gepunktetes Rechteck angezeigt.
• Außerdem wird in der Direktauswahl von Tags der entsprechende Tagname angezeigt. Sie können auf dieses Tag klicken, um den Block auszuwählen und die Seitenränder und Textabstände anzuzeigen.

Die visuelle Unterstützung Blockmarkierung kann nur für die folgenden Tags verwendet werden: Absatz, Liste, Listenelement, Formular, nicht positioniertes div-Tag, Adresse, Blockquote, horizontale Linie und Zentrieren.

 Hinweis   Das gepunktete Rechteck, der Rand und die Ziehpunkte zum Ändern der Größe sind für einige Elemente, wie z. B. Bilder, positionierte div-Tags und Tabellen, auch dann verfügbar, wenn die visuelle Unterstützung Blockmarkierung nicht ausgewählt ist.

Sie können einen Block in der Direktauswahl von Tags auswählen, indem Sie auf den Pfeil klicken und dann auf Tag auswählen klicken. Daraufhin werden die Seitenränder und Textabstände des Blocks zusammen mit Ziehpunkten angezeigt. Sie können die Ziehpunkte verwenden, um die Größe des Blocks sowie seine Ränder und Textabstände zu ändern. Die Seitenränder werden rot schattiert angezeigt, und Textabstände werden blau schattiert angezeigt, wie in der folgenden Abbildung gezeigt.

 Hinweis   Wenn Sie einen Block mithilfe der Direktauswahl von Tags auswählen, werden die Seitenränder und Textabstände des Blocks auch dann angezeigt, wenn Sie die visuelle Unterstützung Seitenränder und Textabstand nicht einblenden.

 Direktauswahl von Tags mit Anzeige des entsprechenden Tagnamens

 Rot schattiert angezeigte Ränder

 Blau schattiert angezeigte Textabstände

 Ziehpunkt zum Ändern der Größe des Blocks

 Ziehpunkt zum Ändern der Größe des Rands

Sie können absolut positionierte Elemente (z. B. Bilder) auf der Seite durch Ziehen verschieben. Sie können das dem Block des Elements entsprechende Tag an beliebige Positionen auf einer Seite ziehen.

Sichtbare Ränder

Mit der visuellen Unterstützung Sichtbare Ränder werden gepunktete Ränder um die Seitenelemente mit ausgeblendeten Rändern oder Seitenelemente ohne Ränder angezeigt. Sichtbare Ränder werden um Elemente wie z. B. Tabellen, positionierte Elemente, Formularcontainer und Inhaltsbereiche angezeigt. Für systemintern formatierte Elemente wie z. B. Bilder werden keine sichtbaren Ränder angezeigt, wenn die visuelle Unterstützung ausgewählt ist. Sichtbare Ränder werden außerdem um Elemente mit angepasster Größe (Elemente mit einer bestimmten Breite und Höhe) und ohne Ränder herum angezeigt. Wenn Sie die Größe eines Absatzes ändern und dann auf eine andere Stelle auf der Seite klicken, wird das Absatzelement mit sichtbaren Rändern angezeigt.

Auf einer Masterseite werden die Inhaltsbereiche mit rosa gepunkteten Rändern, Tabellenelemente mit weißen gepunkteten Rändern und nicht bearbeitbare Bereiche grau schattiert angezeigt, wie in der folgenden Abbildung gezeigt.

 Inhaltsbereiche werden mit rosa gepunkteten Rändern angezeigt.

 Tabellenelemente werden mit weißen gepunkteten Rändern angezeigt.

 Nicht bearbeitbare Bereiche werden grau schattiert angezeigt.

Leere Container

Mit der visuellen Unterstützung Leere Container wird ein gepunktetes Rechteck um leere Elemente auf einer Seite herum angezeigt, wie in der folgenden Abbildung gezeigt.

 Hinweis    In der Entwurfsansicht von Office SharePoint Designer 2007 werden leere Elemente reduziert, da dies in den meisten Browsern der Fall ist. Wenn Sie die visuelle Unterstützung Leere Container einblenden, werden alle leeren Elemente auf einer Seite angezeigt. Dadurch kann das Seitenlayout in der Entwurfsansicht geändert werden, im Browser jedoch nicht.

 Leere Elemente auf einer Seite, die in gepunktete Rechtecke eingeschlossen sind

Seitenränder und Textabstand

Mit der visuellen Unterstützung Seitenränder und Textabstand werden die Seitenränder und Textabstände um Seitenelemente angezeigt. Die Seitenränder werden rot schattiert angezeigt, und Textabstände werden blau schattiert angezeigt. Bei dieser visuellen Unterstützung werden die Seitenränder und Textabstände aller Seitenelemente angezeigt.

 Hinweis   Sie können die visuelle Unterstützung Seitenränder und Textabstand nicht zum Ändern von Seitenrändern und Textabständen verwenden. Wählen Sie stattdessen das Element aus, und verwenden Sie die visuelle Unterstützung Blockmarkierung, mit der Sie die Ziehpunkte zum Anpassen der Größe ziehen können.

 Blau schattiert angezeigte Textabstände

 Rot schattiert angezeigte Ränder

CSS Display:none-Elemente

Mit der visuellen Unterstützung CSS Display:none-Elemente werden die Elemente angezeigt, die im entsprechenden Stylesheet der Seite als display:none definiert sind.

 Hinweis   Diese Elemente werden im Browser nicht angezeigt.

CSS Visibility:hidden-Elemente

Mit der visuellen Unterstützung CSS Visibility:hidden-Elemente werden die Elemente angezeigt, die im entsprechenden Stylesheet der Seite als visibility:hidden definiert sind.

 Hinweis   Diese Element sind im Browser nicht sichtbar, aber ihr Layout bleibt in der Entwurfsansicht sichtbar.

Nicht visuelle ASP.NET-Steuerelemente

Mit der visuellen Unterstützung Nicht visuelle ASP.NET-Steuerelemente werden alle nicht sichtbaren ASP.NET-Steuerelemente auf einer Seite angezeigt – z. B. die Steuerelemente HiddenField oder Datenquelle.

 Darstellung nicht visueller ASP.NET-Steuerelemente auf einer ASP.NET-Seite

ASP.NET-Steuerelementfehler

Mit der visuellen Unterstützung ASP.NET-Steuerelementfehler wird eine Fehlermeldung angezeigt, wenn bei einem ASP.NET-Steuerelement auf einer Seite ein Fehler auftritt (z. B. ein Fehler beim Herstellen der Verbindung mit einer Datenquelle oder das Vorhandensein falscher Seiteneigenschaften).

Vorlagenbereichsbeschriftungen

Mit der visuellen Unterstützung Vorlagenbereichsbeschriftungen wird ein lila Rand um Inhaltsbereiche herum angezeigt, außerdem wird ein Platzhalter angezeigt, der den Namen des jeweiligen Inhaltsbereichs angibt.

 Hinweis   Diese visuelle Unterstützung kann nur auf Seiten angezeigt werden, die über ASP.NET-Masterseiten oder dynamische Webvorlagen erstellt wurden.

 Lila konturierte Inhaltsbereiche auf einer ASP.NET-Masterseite

 Seitenanfang

Ein- oder Ausblenden der visuellen Unterstützung

Wenn Sie in der Entwurfsansicht arbeiten, können Sie die visuelle Unterstützung schnell ein- oder ausblenden. Sie können sie z. B. einblenden, damit Sie einfacher mit Inhaltsbereichen arbeiten können. Oder Sie können Sie ausblenden, damit das Seitenlayout in der Entwurfsansicht mit dem im Browser angezeigten Seitenlayout übereinstimmt.

1. Öffnen Sie eine Seite zum Bearbeiten in der Entwurfsansicht.

    Hinweis   Der Befehl Visuelle Unterstützung ist nur in einer der Seitenansichten verfügbar. Außerdem ist der Befehl Visuelle Unterstützung nicht verfügbar für Dateien wie z. B. Stylesheets, in denen Sie nicht mit Entwurfselementen arbeiten.

2. Führen Sie eine der folgenden Aktionen aus, um die visuelle Unterstützung ein- oder auszublenden:
   • Zeigen Sie im Menü Ansicht auf Visuelle Unterstützung, und klicken Sie dann auf Anzeigen. Daraufhin werden alle im Untermenü ausgewählten Optionen der visuellen Unterstützung angezeigt. Klicken Sie im Untermenü Visuelle Unterstützung auf einzelne Optionen der visuellen Unterstützung, um sie ein- oder auszublenden.
   • Drücken Sie STRG+/. Daraufhin werden alle im Untermenü Visuelle Unterstützung ausgewählten Optionen der visuellen Unterstützung angezeigt.
   • Doppelklicken Sie auf die Anzeige für die visuelle Unterstützung auf der Statusleiste. Daraufhin werden alle im Untermenü Visuelle Unterstützung ausgewählten Optionen der visuellen Unterstützung angezeigt.

 Hinweis   Die im Untermenü Visuelle Unterstützung ausgewählten Optionen der visuellen Unterstützung bleiben ausgewählt, bis Sie auswählen, dass sie nicht mehr angezeigt werden sollen. Das heißt, wenn Sie STRG+/ drücken oder auf die Anzeige auf der Statusleiste doppelklicken, um die visuelle Unterstützung anzuzeigen, sehen Sie immer die Optionen der visuellen Unterstützung, die zurzeit im Untermenü Visuelle Unterstützung ausgewählt sind.

In der folgenden Abbildung wird das Ein- oder Ausblenden der visuellen Unterstützung gezeigt.

 Klicken Sie auf Anzeigen, um alle ausgewählten Optionen der visuellen Unterstützung anzuzeigen.

 Klicken Sie auf eine einzelne Option der visuellen Unterstützung, die ein- oder ausgeblendet werden soll, wenn Anzeigen ausgewählt ist.

 Darstellung ausgewählter Optionen der visuellen Unterstützung. Dies sind auch die Standardoptionen der visuellen Unterstützung.

 Darstellung nicht ausgewählter Optionen der visuellen Unterstützung.

Sie können die Statusleiste überprüfen, um schnell herauszufinden, ob Visuelle Unterstützung aktiviert ist. Sie können auch auf den Abschnitt Visuelle Unterstützung der Statusleiste doppelklicken, um für die Einstellung für Visuelle Unterstützung zwischen Ein und Aus zu wechseln.

Wenn Sie den Zeiger auf dem Abschnitt Visuelle Unterstützung der Statusleiste positionieren, wird in einer Benachrichtigung erklärt, wie sich der aktuelle Status der Einstellung für Visuelle Unterstützung auf das Seitenlayout in Office SharePoint Designer 2007 auswirkt.

 Seitenanfang