Výhody a nevýhody použití obrázkových map
V historii webového designu bylo místo, kde mnoho stránek používalo funkci známé jako "obrazové mapy". Toto je seznam souřadnic připojených k určitému obrázku na stránce. Tyto souřadnice vytvářejí na tomto snímku oblasti hypertextových odkazů, které zásadně přidávají grafické prvky "hot spots", z nichž každá může být kódována tak, aby odkazovala na různá místa. To je velmi odlišné od přidání značky odkazu na obrázek, což by způsobilo, že se celá grafika stane jedním velkým odkazem na jediný cíl.
Příklady - představte si grafický soubor s obrazem Spojených států. Pokud chcete, aby byl každý stát "klikatelný", aby se dostali na stránky o daném konkrétním stavu, můžete to udělat s obrazovou mapou. Podobně, pokud byste měli obrázek nějaké hudební skupiny, můžete použít mapu obrázků, aby bylo možné každému jednotlivému členovi kliknout na následující stránku o tomto členu skupiny.
Mapy obrázků jsou užitečné? Určitě byli, ale na dnešním webu upadli na laskavost. To je přinejmenším zčásti, protože obrazové mapy vyžadují specifické souřadnice pro práci. Webové stránky jsou dnes postaveny tak, aby odpovídaly velikosti snímků podle velikosti obrazovky nebo zařízení. To znamená, že přednastavené souřadnice, což je způsob, jakým fungují obrazové mapy, se rozpadají, když se měří místa a obrázky mění velikost. Z tohoto důvodu jsou obrazové mapy zřídka využívány dnes na produkčních stránkách, ale stále mají výhody pro ukázky nebo případy, kdy vynucujete velikost stránky.
Chcete vědět, jak vytvořit mapu obrázků, konkrétně jak s aplikací Dreamweaver? . Tento proces není obzvláště obtížný, ale ani to není snadné, takže byste měli mít nějaké zkušenosti dříve, než začnete.
Začínáme
Začněme. Prvním krokem, který musíte udělat, je přidat obrázek na svou webovou stránku. Klepnutím na obrázek jej zvýrazníte. Odtud musíte jít do nabídky vlastností (a kliknout na jeden ze tří nástrojů pro kreslení hotspotu: obdélník, kruh nebo mnohoúhelník.) Nezapomeňte pojmenovat svůj obrázek, který můžete udělat v liště vlastností. vše, co chcete. Jako příklad použijte "mapu".
Nyní nakreslete požadovaný tvar na svůj obrázek pomocí jednoho z těchto nástrojů. Pokud potřebujete obdélníkové skvrny, použijte obdélník. Stejné pro kruh. Pokud chcete mít složitější tvary hotspotů, použijte polygon. To je to, co byste pravděpodobně použili v příkladu mapy USA, protože polygon by vám umožnil upustit body a vytvořit na obraze velmi složité a nepravidelné tvary
V okně vlastností hotspotu zadejte nebo přejděte na stránku, na kterou by měl odkaz hotspot. To vytváří tuto spojitelnou oblast. Pokračujte v přidávání hotspotů, dokud nebude vaše mapa dokončena a všechny odkazy, které chcete přidat, byly přidány.
Až budete hotovi, zkontrolujte v prohlížeči obrazovou mapu, abyste se ujistili, že funguje správně. Klikněte na každý odkaz a ujistěte se, že jde o správný zdroj nebo webovou stránku.
Nevýhody obrazových map
Znovu si uvědomte, že obrazové mapy mají několik nevýhody, a to i mimo výše zmíněnou nedostatečnou podporu s citlivými webovými stránkami. Jedle, malé detaily mohou být zakryty v obrazové mapě. Například zeměpisné obrazové mapy mohou určit, z kterého kontinentu uživatel je, ale tyto mapy nemusí být dostatečně podrobné, aby určily zemi původu uživatele. To znamená, že obrazová mapa může pomoci určit, zda je uživatel z Asie, ale nikoliv z Kambodže.
Obrázkové mapy se mohou také načítat pomalu. Neměly by být používány vícenásobně na webových stránkách, protože zabírají příliš mnoho místa k použití na každé stránce webové stránky. Příliš mnoho obrazových map na jedné stránce by vytvořilo vážné překážky a mohutný dopad na výkonnost webu .
A konečně, obrazové mapy nemusí být pro uživatele s vizuálními problémy snadné. Pokud jste použili mapy obrázků, měli byste pro tyto uživatele vytvořit alternativní navigační systém.
Spodní linie
Z času na čas používám obrazové mapy, když se snažím sestavit rychlou ukázku designu a jak to funguje. Například můžu být zesměšňován návrh mobilní aplikace a chci použít obrazové mapy k vytvoření hotspotů pro simulaci interaktivity aplikace. To je mnohem jednodušší, než by bylo kódování aplikace nebo dokonce vytvářet fiktivní webové stránky postavené na současných standardech pomocí HTML a CSS. V tomto konkrétním příkladu a vzhledem k tomu, že vím, na jakém zařízení se budeme snažit předvést design a lze jej měnit na toto zařízení, funguje obrazová mapa, ale uvedení do výrobního místa nebo aplikace je velmi obtížné a mělo by se mu zřejmě zabránit dnešní webové stránky.
Původní článek Jennifer Krynin. Upravený Jeremy Girard dne 9.7.17.