Υπήρξε ένα σημείο στην ιστορία του σχεδιασμού ιστοσελίδων όπου πολλοί χώροι χρησιμοποίησαν ένα χαρακτηριστικό γνωστό ως "χάρτες εικόνας". Αυτή είναι μια λίστα συντεταγμένων που συνδέονται με μια συγκεκριμένη εικόνα σε μια σελίδα. Αυτές οι συντεταγμένες δημιουργούν περιοχές υπερσύνδεσης σε αυτήν την εικόνα, ουσιαστικά προσθέτοντας "hot spots" σε ένα γραφικό, το καθένα από τα οποία μπορεί να κωδικοποιηθεί για να συνδεθεί με διαφορετικά μέρη. Αυτό είναι πολύ διαφορετικό από την προσθήκη μιας ετικέτας συνδέσμου σε μια εικόνα, η οποία θα μπορούσε να προκαλέσει ότι ολόκληρο το γραφικό θα γίνει ένας μεγάλος σύνδεσμος σε ένα μόνο προορισμό.
Παραδείγματα: Φανταστείτε να έχετε ένα γραφικό αρχείο με μια εικόνα των Ηνωμένων Πολιτειών. Αν θελήσατε κάθε κράτος να είναι "clickable" έτσι πηγαίνουν σε σελίδες σχετικά με την συγκεκριμένη κατάσταση, θα μπορούσατε να το κάνετε αυτό με ένα χάρτη εικόνας. Ομοίως, αν είχατε μια εικόνα μιας μπάντας μουσικής, θα μπορούσατε να χρησιμοποιήσετε έναν χάρτη εικόνων για να μπορείτε να κάνετε κλικ σε κάθε μεμονωμένη μέλος σε μια επόμενη σελίδα σχετικά με το συγκεκριμένο μέλος της μπάντας.
Οι χάρτες εικόνας είναι χρήσιμοι; Σίγουρα ήταν, αλλά έχουν χάσει τη χάρη τους στον σημερινό ιστό. Αυτό συμβαίνει, τουλάχιστον εν μέρει, επειδή οι χάρτες εικόνας απαιτούν συγκεκριμένες συντεταγμένες για να δουλέψουν. Οι ιστότοποι σήμερα είναι κατασκευασμένοι ώστε να ανταποκρίνονται και να μεγεθύνουν την εικόνα ανάλογα με το μέγεθος μιας οθόνης ή συσκευής. Αυτό σημαίνει ότι οι προκαθορισμένες συντεταγμένες, όπως είναι οι τρόποι με τους οποίους λειτουργούν οι χάρτες εικόνων, υποχωρούν όταν ένας ιστότοπος κλιμακώνεται και οι εικόνες αλλάζουν μέγεθος. Αυτός είναι ο λόγος για τον οποίο οι χάρτες εικόνων σπάνια χρησιμοποιούνται σε ιστότοπους παραγωγών σήμερα, αλλά εξακολουθούν να έχουν πλεονεκτήματα για επιδείξεις ή περιπτώσεις όπου αναγκάζετε το μέγεθος μιας σελίδας.
Θέλετε να μάθετε πώς μπορείτε να δημιουργήσετε έναν χάρτη εικόνων, ειδικά πώς να το κάνετε με το Dreamweaver; Η διαδικασία δεν είναι ιδιαίτερα δύσκολη, αλλά δεν είναι εύκολη ούτε και θα πρέπει να έχετε κάποια εμπειρία πριν ξεκινήσετε.
Ξεκινώντας
Ας αρχίσουμε. Το πρώτο βήμα που πρέπει να κάνετε είναι να προσθέσετε μια εικόνα στην ιστοσελίδα σας. Στη συνέχεια, κάντε κλικ στην εικόνα για να την επισημάνετε. Από εκεί, πρέπει να μεταβείτε στο μενού ιδιοτήτων (και να κάνετε κλικ σε ένα από τα τρία εργαλεία σχεδίασης hotspot: ορθογώνιο, κύκλο ή πολύγωνο.) Μην ξεχάσετε να ονομάσετε την εικόνα που μπορείτε να κάνετε στη γραμμή ιδιοκτησίας. οτιδήποτε θέλετε. Χρησιμοποιήστε το "χάρτη" ως παράδειγμα.
Τώρα, σύρετε το σχήμα που θέλετε στην εικόνα σας χρησιμοποιώντας ένα από αυτά τα εργαλεία. Αν χρειάζεστε ορθογώνια σποτ, χρησιμοποιήστε το ορθογώνιο. Ίδια για τον κύκλο. Αν θέλετε πιο πολύπλοκα σχήματα hotspot, χρησιμοποιήστε το πολύγωνο. Αυτό είναι που θα χρησιμοποιούσατε πιθανώς στο παράδειγμα του χάρτη των ΗΠΑ, αφού το πολύγωνο θα σας επιτρέψει να αφήσετε σημεία και να δημιουργήσετε πολύπλοκα και ακανόνιστα σχήματα στην εικόνα
Στο παράθυρο ιδιοτήτων για το hotspot, πληκτρολογήστε ή περιηγηθείτε στη σελίδα στην οποία θα πρέπει να συνδεθεί το hotspot. Αυτό είναι αυτό που δημιουργεί αυτή την συνδεόμενη περιοχή. Συνεχίστε να προσθέτετε τα hotspots μέχρι να ολοκληρωθεί ο χάρτης σας και να προστεθούν όλοι οι σύνδεσμοι που θέλετε να προσθέσετε.
Αφού τελειώσετε, ελέγξτε τον χάρτη εικόνας σας σε ένα πρόγραμμα περιήγησης για να βεβαιωθείτε ότι λειτουργεί σωστά. Κάντε κλικ σε κάθε σύνδεσμο για να βεβαιωθείτε ότι πηγαίνει στον κατάλληλο πόρο ή ιστοσελίδα.
Μειονεκτήματα των Χαρτών Εικόνας
Για άλλη μια φορά, να γνωρίζετε ότι οι χάρτες εικόνας έχουν πολλά μειονεκτήματα, ακόμη και εκτός της προαναφερθείσας έλλειψης υποστήριξης με ανταποκρινόμενες ιστοσελίδες. Κατ 'αρχάς, μικρές λεπτομέρειες μπορεί να είναι συγκεχυμένες σε έναν χάρτη εικόνων. Για παράδειγμα, οι χάρτες γεωγραφικών εικόνων μπορεί να βοηθήσουν στον προσδιορισμό σε ποια ήπειρο είναι χρήστης, αλλά αυτοί οι χάρτες ενδέχεται να μην είναι αρκετά λεπτομερείς ώστε να εντοπίζουν τη χώρα προέλευσης του χρήστη. Αυτό σημαίνει ότι ένας χάρτης εικόνων μπορεί να βοηθήσει στον προσδιορισμό του εάν ένας χρήστης προέρχεται από την Ασία αλλά όχι από την Καμπότζη ειδικότερα.
Οι χάρτες εικόνων ενδέχεται επίσης να φορτώνονται αργά. Δεν πρέπει να χρησιμοποιούνται πολλές φορές σε έναν ιστότοπο, διότι καταλαμβάνουν πάρα πολύ χώρο για χρήση σε κάθε σελίδα ενός ιστότοπου. Πάρα πολλοί χάρτες εικόνων σε μία σελίδα θα δημιουργούσαν μια σοβαρή συμφόρηση και μια τεράστια επίδραση στην απόδοση του ιστότοπου.
Τέλος, οι χάρτες εικόνων ενδέχεται να μην είναι εύκολοι για χρήστες με προβλήματα οπτικής πρόσβασης. Εάν χρησιμοποιήσατε χάρτες εικόνων, θα πρέπει επίσης να δημιουργήσετε ένα άλλο σύστημα πλοήγησης για αυτούς τους χρήστες ως εναλλακτική λύση.
Συμπέρασμα
Χρησιμοποιήστε χάρτες εικόνων από καιρό σε καιρό όταν προσπαθείτε να βάζετε μαζί ένα γρήγορο demo ενός σχεδίου και πώς λειτουργεί. Για παράδειγμα, εάν χτυπάτε ένα σχέδιο για μια εφαρμογή για κινητά και θέλετε να χρησιμοποιήσετε χάρτες εικόνων για να δημιουργήσετε hotspots για την προσομοίωση της διαδραστικότητας της εφαρμογής. Αυτό είναι πολύ πιο εύκολο από ό, τι θα ήταν να κωδικοποιήσετε την εφαρμογή, ή ακόμα και να δημιουργήσετε ανωμαλίες ιστοσελίδες που έχουν κατασκευαστεί σύμφωνα με τα τρέχοντα πρότυπα με HTML και CSS. Αλλά η τοποθέτησή τους σε μια τοποθεσία παραγωγής ή μια εφαρμογή είναι πολύ δύσκολη και θα πρέπει πιθανώς να αποφευχθεί στις σημερινές ιστοσελίδες.
