Internetnutzer verwenden eine Vielzahl von Monitoren mit unterschiedlichen Bildschirmauflösungen. Daher besteht eine der Aufgaben für Webentwickler darin, eine Site für die korrekte Anzeige auf Monitoren mit beliebiger Auflösung zu erstellen und zu optimieren.
Anweisungen
Schritt 1
Gestalten Sie Ihre Website mit der niedrigsten nutzbaren Auflösung - 800 * 600 Pixel und verwenden Sie ein festes Layout. Bei diesem Ansatz gibt es jedoch einen Nachteil: Für Benutzer mit Breitbildmonitoren werden beim Anzeigen Ihrer Site breite Felder auf dem Bildschirm angezeigt.
Schritt 2
Verwenden Sie ein flüssiges Layout. In diesem Fall werden die Seiten auf den Monitoren horizontal gestreckt, deren Auflösung höher ist als bei der Entwicklung. Dieser Ansatz wird jedoch am besten verwendet, wenn Websites mit vielen Textinformationen und einem Minimum an Grafiken erstellt werden. Dies liegt daran, dass einige Elemente, wie Bilder oder Komponenten von Drittanbietern, bei der Größenänderung auf verschiedenen Monitoren verzerrt werden.
Schritt 3
Am korrektsten, aber gleichzeitig und aus Sicht der Implementierung komplexer ist die Verwendung eines adaptiven Layouts. Dies ist eine komplexere Version des Rubber-Layouts, die es ermöglicht, die Anzahl der Spalten mit Informationen bei Verwendung des Programmcodes zu ändern.
Schritt 4
Unabhängig davon, welches Layout für die Entwicklung der Website gewählt wird, verwenden Sie das Layout mit einer Bildschirmauflösung von 1024 * 768 Pixeln. Dies ist die gebräuchlichste Auflösung.
Schritt 5
Beachten Sie auch für die korrekte Anzeige der Site auf Monitoren mit einer anderen Auflösung einige Regeln. Versuchen Sie, den Hauptinhalt der Seite auf einem Bildschirm zu halten, um ein Scrollen zu vermeiden. Platzieren Sie Textinformationen in einer schmalen Spalte, damit sie sich nicht über die gesamte Bildschirmbreite „ausbreiten“. Behalten Sie das Gesamtdesign der Seiten im Auge, damit alles proportional ist.
Schritt 6
Berechnen Sie bei der Gestaltung Ihres Designs den Prozentsatz, nicht die Menge, der Breite und Höhe der Seite. Dann wird die Seite sowohl auf herkömmlichen Monitoren als auch auf Widescreen-Monitoren proportional in der Größe angepasst.
