Κάντε το τηλέφωνο στην σελίδα σας clickable

Page 1

Κάντε το τηλέφωνο στην σελίδα σας clickable!

Πως να κάνετε το τηλέφωνο σας στην ιστοσελίδα σας clickable Όλοι στις ιστοσελίδες μας και συνήθως στην φόρμα επικοινωνίας έχουμε το τηλέφωνο μας σε αυτήν. Αυτό όμως δεν είναι clickable υπο την έννοια ότι ο browser με τον οποίο επισκέπτονται την ιστοσελίδα σας δεν αναγνωρίζει ότι πρόκειται για ένα τηλεφωνικό αριθμό αλλά τον βλέπει σαν το υπόλοιπο κείμενο του website σας άρα και δεν μπορεί ο χρήστης να κάνει κλικ σε αυτό και να αποκτήσει κάποια λειτουργικότητα (όπως π.χ. αν ο επισκέπτης σας έχει skype κάνοντας ένα κλικ πάνω σε αυτό να σας καλέσει αυτόματα στο τηλέφωνο σας). Η λύση είναι ιδιαίτερα απλή. Απλά αντί να χρησιμοποιήσετε το http* protocol (ή οποιοδήποτε άλλο μέσα σε ένα anchor ) χρησιμοποιήστε στην θέση του το tel: ή tel://. Δείτε το πολύ απλό παράδειγμα κώδικα μας. 001

<a href="tel:+00302107482904">+0030 210 74 82 904</a>

Οι browsers που δεν μπορούν να αναγνωρίσουν αυτή την μορφή (το desktop σας για παράδειγμα) δεν θα ξέρουν τι να κάνουν με το tel: protocol εκτός και αν ο επισκέπτης - χρήστης του ιστοτόπου σας έχει κάποιου είδους extension ενεργοποιημένο που επιτρέπει στο Skype να αναγνωρίζει τηλεφωνικούς αριθμούς. (κάτι όμως το ιδιαίτερα συνηθισμένο στους χρήστες του skype και παρόμοιων εφαρμογών που είναι όμως και οι ιδανικότεροι υποψήφιοι για να κάνουν κλικ στο phone link και να επικοινωνήσουν μαζί σας ). 'Αλλες non-phone devices (όπως το iPad) θα αναγνωρίσουν τον τηλεφωνικό αριθμό και θα ενημερώσουν τον χρήστη να αποθηκεύσει αν θέλει τον αριθμό στις επαφές του. Αντιλαμβάνεστε λοιπόν οτι αυτή η μικρή αλλαγή μπορεί να προσθέσει με ένα τόσο απλό τρόπο "πόντους" στην εικόνα της ιστοσελίδα σας αλλά και χρηστικότητα στους πολλούς χρήστες skype και όχι μόνο. Το web design πρέπει πάντα να λαμβάνει υπόψη του την χρηστικότητα του χρήστη γιατί όπως έχουμε ξανατονίσει στο wdf.gr σκοπός του είναι η προώθηση του εμπορικού και άλλου μηνύματος σας και όχι η εμφάνιση ως αυτοσκοπός.

Δείτε το απλό παράδειγμα απο τον δικτυακό τόπο της DreamWeaver.Gr στην εικόνα που ακολουθεί:


Αυτό το παράδειγμα δεν διαθέτει κάποια μορφοποίηση έτσι ώστε να είναι πιο εμφανίσιμο ή απλά να είναι πιο έντονο και κατανοητό στον επισκέπτη της ιστοσελίδας ότι ο αριθμός τηλεφώνου είναι clickable (βέβαια το skype θα το αναγνώριζε και θα το τόνιζε μέσα στην σελίδα με δική του έντονη μορφοποίηση). Μπορείτε απλά αν θέλετε στο link του παραδείγματος μας να ενσωματώσετε μια εικόνα έτσι ώστε αυτή να λειτουργεί ως κλικ προς τον τηλεφωνικό σας αριθμό <a href="tel:+00302107482904"><img src="callme.jpg" /></a> όπου τοποθετείτε την δική σας εικόνα ενώ υπάρχουν στο διαδίκτυο και πολλές μεθόδοι μέσω css για να επιτύχετε αρτιότερο αισθητικά αποτέλεσμα. Ελπίζουμε να βρήκατε το tutorial μας χρήσιμο.


Turn static files into dynamic content formats.

Create a flipbook
Issuu converts static files into: digital portfolios, online yearbooks, online catalogs, digital photo albums and more. Sign up and create your flipbook.