Obwohl Blocs liefert eine sehr genaue Darstellung Ihrer endgültigen Site, während Sie sie tatsächlich entwerfen. Es kann vorkommen, dass Sie eine schnelle Vorschau Ihrer Site benötigen, um andere Designaspekte wie z Interaktionen, FX scrollen funktioniert Animationen. Blocs Es sind verschiedene Vorschauoptionen integriert, mit denen Sie Ihre Website auf natürlichere und umfassendere Weise testen können.
In der App-Vorschau
Mit der In-App-Vorschau können Sie eine Vorschau Ihrer Website wie in einem Webbrowser anzeigen, ohne die Hauptseite verlassen zu müssen Blocs Anwendung. Um einfach in den Vorschaumodus zu wechseln links Klick die Play-Schaltfläche rechts neben dem Breakpoint-Steuerelement oder alternativ die Tastenkombination V.
Haltepunkte wechseln
Neben dem Entwurfsmodus hat der Vorschaumodus auch Zugriff auf den Hauptmodus Haltepunktsteuerungen. Mit diesen Steuerelementen können Sie schnell und einfach zwischen verschiedenen Bildschirmgrößen wechseln, um die Reaktionseigenschaften Ihrer Website zu überprüfen.
Entwicklertools
In der App-Vorschau haben Sie auch Zugriff auf die leistungsstarken WebKit Developer Inspector-Tools. Die Inspector-Tools sind eine großartige Möglichkeit, den Code Ihrer Website zu überprüfen und potenzielle Probleme zu beheben, auf die Sie stoßen. Sie können über die Menüschaltfläche oben links im Vorschaurahmen aufgerufen werden.
Oder alternativ einfach Rechtsklick Beliebiges Element auf einer Seite (im Vorschaumodus) und Auswahl Inspizieren.
Vorschau im Browser
Sowie in der App-Vorschau, Blocs ermöglicht Ihnen auch eine schnelle Vorschau Ihrer Site mit jedem der Browser, die Sie auf Ihrem Mac installiert haben. Um eine Vorschau Ihrer Website in einem Browser anzuzeigen, einfach der rechten Maustaste auf die Vorschau-Schaltfläche und wählen Sie einen Browser aus dem Popup-Menü.
Sie können mehr über die Vorschau in Browsern lesen hier.
Vorschau des lokalen Netzwerks
Das Blocs Auf den Vorschauserver kann auch von jedem Gerät im selben Netzwerk wie Ihr Mac zugegriffen werden. Wenn der Dateityp der Seite, die in der Vorschau angezeigt wird, auf eingestellt ist . Html, dann ein kleiner Knopf mit einem Antenne Symbol wird in der oberen linken Ecke des Hauptanwendungsrahmens angezeigt. Durch Klicken auf diese Schaltfläche wird die URL des lokalen Netzwerks in die Zwischenablage Ihres Macs kopiert. Wenn Sie diese URL in einen Webbrowser auf einem beliebigen Gerät eingeben, das mit demselben Netzwerk wie Ihr Mac verbunden ist, können Sie Ihre Website auf dem tatsächlichen Gerät in der Vorschau anzeigen und testen.