Karten Bild

Karten Bilder erlauben Tethering Links zu den verschiedenen Bereichen des gleichen Bildes. Implementiert in zwei verschiedenen Versionen - dem Server und dem Client. Im Falle von Serveroptionen sendet der Browser eine Anfrage an den Server die Adresse der ausgewählten Links und wartet auf eine Antwort auf die erforderlichen Informationen zu erhalten. Dieser Ansatz erfordert zusätzliche Zeit für das Ergebnis der getrennten Dateien für jedes Bild der Karte wartet.

Die Client-Version der Karte wird in der gleichen HTML-Dokument als Link zu dem Bild befindet.

Die Client-Version des Kartenbildes

Um anzuzeigen , dass das Bild eine Karte ist, verwenden Sie das usemap Tag <IMG>. Der Wert ist ein Hinweis auf die Beschreibung des Kartenkonfiguration.

Fig. 1. Lesezeichen sind Links erstellt eine Karte mit

Um das Lesezeichen Bezug in Fig machen. 1, sollte der folgende Code (siehe Beispiel 1) verwendet werden.

Beispiel 1 die Karte-Bild verwenden

gültig HTML
<DOCTYPE HTML PUBLIC "- // W3C // DTD HTML 4.01 // EN" "http://www.w3.org/TR/html4/strict.dtd">
<Html>
<Head>
<Meta http-equiv = "Content-Type" content = "text / html; charset = windows-1251">
<Titel> Karte-Bild </ title>
</ Head>
<Body>
<P> <img src = " map.gif" width = " 411" height = "46" usemap = "# map" alt = " Navigation"> </ p>

<P> <map name = " Karte">
<Bereichsform = "Poly" alt = "Lesezeichen 2" coords = "210,27, 203,9, 202,6, 197,2, 192,1, 120,1, 115,2, 110,6, 112, 9, 119,27, 119,32, 211,32, 210,27 "href =" 2.html ">
<Bereichsform = "Poly" alt = "Tab 3" coords = "302,27, 295,9, 293,6, 289,2, 283,1, 212,1, 206,2, 202,6, 203, 9, 210,27, 211,32, 284,32, 303,32, 302,27 "href =" 3.html ">
<Bereichsform = "Poly" alt = "Tab 4" coords = "302,27, 303,32, 394,32, 393,27, 386,9, 382,3, 375,1, 303,1, 298, 2, 293,6, 295,9, 302,27 "href =" 4.html ">
</ Karte> </ p>
</ Body>
</ Html>

Um den Browser zu sagen , dass das Bild eine Karte verwendet usemap Option. Es ist eine Bezugnahme auf die Beschreibung der Kartenkonfiguration, die durch das Tag <MAP> definiert ist. Der Wert des Tag - Name muss mit dem Namen in usemap entsprechen. Um den Vermögensbereich angegeben werden , die einen Verweis auf die HTML-Dokument ist verwenden Sie das Tag <AREA>.

Tag-Parameter AREA

SHAPE

Es definiert die Form des aktiven Bereichs. Die Form kann ein Kreis (Kreis), rechteckig (rect), Polygon (poly) sein.

ALT

Fügt alternativen Text für jeden Bereich. Es dient als Kommentar für die Referenz, da der Bildschirm nie angezeigt.

COORDS

Gibt die Koordinaten des aktiven Bereichs. Die Koordinaten werden in Pixeln von der linken oberen Ecke des Bildes gemessen, die dem Wert von 0.0 entspricht. Die erste Zahl ist die horizontale Koordinate, die zweite - vertikal. Liste der Koordinaten hängt von der Form des Feldes.

Zum Kreis gesetzt drei Zahlen - die Koordinaten des Kreismittel und dem Radius.

<Bereich shape = "Kreis" coords = "230340 100" href = "kreis.html">

Für das Rechteck - die Koordinaten des oberen linken und unteren rechten Ecke.

<Bereichsform = "rect" coords = "24,18, 210,56" href = "rect.html">

Deponie die Koordinaten seiner Eckpunkte (Fig. 2).

Fig. 2. Koordinatenpunkte für die Deponie

HREF

Es gibt die Adresse des Links in der Region. Aufnahme Regeln sind die gleichen wie für die <h>.


Karten Bilder erlauben Ihnen, Links zu den verschiedenen Bereichen des gleichen Bildes zu erstellen. Mit diesem Ansatz deutlicher als normale Textlinks und ermöglicht die Verwendung von nur einer Bilddatei für die Organisation der Links. Jedoch nicht davon ausgehen, dass das Kartenbild aufgenommen werden sollten, wo immer Grafik-Links erforderlich. Zunächst einmal sollten Sie alle Vor-und Nachteile zu bewerten, sowie die Alternativen anzuzeigen.

Vorteile der Image-Maps

1. Karten können Sie jede Formularfeld Referenz angeben. Da die Bilder sind rechteckig in der Natur, machen komplexe Formen grafischen Link, zum Beispiel ein geographisches Gebiet, um anzuzeigen, ist es nicht möglich, ohne eine Karte Bilder. Typischerweise Probanden in der geographischen Kartenbilder und werden am häufigsten verwendet.

2. Mit einem bequemen Datei Arbeit - müssen nicht über Schnittstellen einzelnen Fragmente und Muster sorgen kann einfach an der gewünschten Stelle platziert werden.

Mängel

1. Sie können keine Quick-Info und alternativen Text für die einzelnen Regionen festgelegt. Alternativer Text liefert eine Textinformationen über das Bild in den Browser das Herunterladen von Bildern deaktiviert ist. Da das Laden von Bildern erfolgt nach Eingang der Browser Informationen über sie nimmt, dann wird der Text vor einem Ersetzungsmuster erscheinen. Und schon im Prozess um den Text des Ladens wird durch das Bild ersetzt werden. Für Image-Maps, ist diese Funktion relevant, denn wenn Sie das Betrachten von Bildern deaktivieren, die viele Benutzer machen, wird das Ergebnis nur ein leeres Rechteck zu sehen.

2. In der Form eines komplexen Feld von Links erhöht die Lautstärke Ihres HTML. Die Kontur wird durch einen Satz von geraden Liniensegmenten angenähert, für jeden Punkt des Intervalls sollte zwei Koordinaten, und die Gesamtzahl solcher Punkte kann sehr groß eingestellt werden, sein. In Fairness sollte angemerkt werden, dass komplexe Formen ein Spezialfall und werden selten verwendet.

3. Karten, Bilder können nicht verschiedene Effekte gemacht werden, die verfügbar sind, wenn ein Muster in Fragmente schneiden: die Wirkung von Walzen, Teil Animation, individuelle Optimierung der Bilder für schnelles Laden.

Verwendbarkeit

Vom Standpunkt der Bequemlichkeit, Bildkarten haben nur einen Vorteil - die Links in verschiedenen Formen. Dies schafft mehr Klarheit bei der Darstellung von Informationen - wir sind nicht auf die rechteckige Form der Verbindungen begrenzt und komplexe Konfiguration Referenz für ihre eigenen Zwecke zu nutzen. In jeder anderen Hinsicht ihnen viel Gutes gibt - sind die üblichen Text-Links informativer und haben keine Angst, Bilder im Browser zu zeigen. Die Tatsache, dass ein Bild schneller als das gleiche Bild heruntergeladen, sondern als eine Reihe von Bilddateien in Stücke geschnitten und gespeichert werden kann leicht umgangen. Jeder von ihnen kann die endgültige Datei zu reduzieren, verwenden Sie die einzelnen Optimierungseinstellungen. Als Ergebnis wird die Gesamtmenge aller Fragmente weniger Platz als ein einzelnes Bild. Sie nicht den psychologischen Faktor Rabatt - scheint der Mann wie eine Reihe von kleinen Bildern schneller geladen werden als ein großer.

Der größte Nachteil der Karten - es gibt keine klar Bezugsgrenzen identifiziert. Daher müssen diese Grenzen verschiedene Ressourcen zuteilen bereits im Bild. Wenn das Bild aus irgendeinem Grund nicht geladen wird, versteht man die Menge der Links sehr problematisch wird.

Alternativen

Nicht immer gibt es eine dringende Notwendigkeit, die Kartenbilder zu verwenden, daher sollte die Aufmerksamkeit auf die Tatsache, dass es noch andere Optionen für die Aufgabe.

Mit FLash

In den Flash-Rollen können Sie verschiedene Bereiche der Referenz, mit Vektorgrafikfunktionen erstellen. Aufgrund der vielfältigen Möglichkeiten, in Flash können Sie beeindruckende Menüs und Navigationstools erstellen. Aber auch hier müssen vorsichtig sein, den Wald nicht für die Bäume zu verlieren.

Schnittbilder

Dies ist eines der beliebtesten Werkzeuge in der Gestaltung. Ein Bild in diesem Fall wird geschnitten, mit Hilfe von speziellen Programmen auf den Fragmenten, die schließlich zusammengebracht werden, um die Illusion von Vollbild. Obwohl die Schnittfläche in den meisten Fällen nur rechteckig sein kann, ist dies genug Links zu erstellen. das geeignetste grafischen Format kann für jedes Segment ausgewählt werden, in dem es gespeichert ist, die Optimierungsparameter, fügen alternative Text. Dann, auch wenn Bilder ausgeschaltet wird deutlich sichtbare Grenzen des Bildes und dem Ersetzungstext.

Zusammenfassung

Wie sich herausstellte, zu der Grund, Image-Maps verwenden, nur eine - eine komplexe Form der Bezugnahme durch die Designziele vorgegeben. Typische Anwendungen - Gebiete geografischer Karten, die als Referenz dienen. In allen anderen Fällen können Sie verwalten und die Links zu testen und gegebenenfalls die Erstellung grafischer Navigation, ein Bild für die Bequemlichkeit kann in Stücke geschnitten werden. Dieser Ansatz wird mehr Komfort für die Nutzer schaffen, vor allem diejenigen, die aus verschiedenen Gründen, Bilder im Browser deaktiviert. Auch sie müssen sich zu erinnern.

© Erklärung Copyright www.htmlbook.ru