Έχει περάσει αρκετός καιρός από τότε που κυκλοφόρησαν για πρώτη φορά οι επιδείξεις της Retina στις συσκευές iOS, αλλά υπάρχουν ακόμα πολλοί ιστότοποι που δεν είναι έτοιμοι για Retina, ακόμη και όταν οι σχεδιαστές και οι προγραμματιστές έχουν αποκτήσει ισχίο στα γεγονότα ενός πλήρως ανταποκρινόμενου, κινητού -φιλικό κόσμο.
Εδώ είναι τι πρέπει να ξέρετε για τις επιλογές για να κάνετε τη δουλειά σας να δείχνει καλύτερα στις ολοένα και συχνότερες οθόνες Retina. Τα καλά νέα είναι ότι, όσο τρομακτικό μπορεί να φανεί, δεν είναι πολύ περίπλοκο.
$config[code] not foundΠροετοιμασία της ιστοσελίδας σας για εικόνες που είναι έτοιμες για χρήση με αμφιβληστροειδή
Διπλή τη διασκέδαση σας
Υπάρχουν πράγματι αρκετοί τρόποι με τους οποίους μπορείτε να καλύψετε αυτή τη γάτα, να το πω έτσι. Στην πρώτη, θα χρειαστεί να ακονίσετε λίγο το CSS και να συμπεριλάβετε εκδόσεις των εικόνων σας διπλάσιες από την κανονική τους ανάλυση. Το CSS θα καθορίσει ποια εικόνα θα εμφανιστεί με βάση τη συσκευή στην οποία προβάλλεται ο ιστότοπός σας.
Οι ενημερώσεις CSS που χρειάζεστε θα διαφέρουν ανάλογα με τα προγράμματα περιήγησης στόχων σας, αλλά τα καλά νέα είναι ότι δεν είναι τρομερά περίπλοκη τώρα και καθίσταται ευκολότερη. Θα αφήσουμε την πραγματική κωδικοποίηση σε άλλη ημέρα.
Ένα πράγμα που πρέπει να θυμάστε: ίσως να θέλετε να αναπτύξετε μια σύμβαση ονομασίας για τις εικόνες του αμφιβληστροειδούς ώστε να μπορείτε να συνδέσετε εύκολα τις δύο εκδόσεις μιας εικόνας σε περίπτωση που χρειάζεται να τις επεξεργαστείτε αργότερα.
SVG
Μια άλλη προσέγγιση είναι το SVG, ή το Scalable Vector Graphics. Όπως υποδηλώνει το όνομα, αυτά περιορίζονται σε διανυσματικά γραφικά και δεν θα λειτουργούν με φωτογραφικές εικόνες, αλλά τα γραφικά SVG εξαλείφουν την ανάγκη για δύο αρχεία εικόνας για κάθε γραφικό στον ιστότοπό σας. Και πάλι, υπάρχουν παραλλαγές από το πρόγραμμα περιήγησης στο πρόγραμμα περιήγησης, ώστε να θέλετε να κάνετε επιπλέον έρευνα ανάλογα με τις ανάγκες σας.
Και όπως σημειώθηκε παραπάνω, το SVG πιθανότατα δεν πρόκειται να λειτουργήσει ως η μοναδική σας λύση στους περισσότερους ιστότοπους, εκτός αν ο ιστότοπος δεν περιέχει φωτογραφίες τύπου φωτογραφίας.
Ωμής βίας
Φυσικά, θα μπορούσατε απλά να ξεφορτωθείτε τα αρχεία χαμηλής ανάλυσης και απλά να εξυπηρετήσετε τις εικόνες έτοιμες για Retina. Θα το συνιστούσαμε μόνο για χρήσεις με πολύ αυστηρά καθορισμένο κοινό. Εάν γνωρίζετε ότι το εύρος ζώνης δεν θα είναι πρόβλημα, ίσως είναι η σωστή διαδρομή, αλλά σίγουρα δεν είναι μια βέλτιστη πρακτική
Άλλες Λύσεις Κωδικοποίησης
Στο άλλο άκρο της προσπάθειας και το φάσμα της κομψότητας είναι οι μέθοδοι κωδικοποίησης που βασίζονται σε ορισμένες αλλαγές στην πλευρά του διακομιστή (όπως οι καταχωρήσεις αρχείων.htaccess) μαζί με την κωδικοποίηση PHP και Javascript.
Αυτό μπορεί να είναι η καλύτερη σας προσέγγιση, αν και η προσπάθεια δεν μπορεί να αξίζει τον κόπο για μικρότερα έργα.
Συνολικά, η προσέγγιση που θα ακολουθήσετε θα εξαρτηθεί από το κοινό σας, τη φύση των γραφικών του ιστότοπού σας και το επίπεδο τεχνικής εμπειρογνωμοσύνης της ομάδας ανάπτυξης. Υπάρχει μια καλή λύση για σχεδόν κάθε κατάσταση. Η μόνη κακή λύση είναι να αγνοεί πλήρως τις οθόνες της Retina.
NASDAQ Φωτογραφία μέσω του Shutterstock
