Ένα από τα μεγαλύτερα διλήμματα που αντιμετωπίζουν οι προγραμματιστές ιστού είναι η ασυμβατότητα των διαφόρων εκδόσεων του Internet Explorer με τα τρέχοντα πρότυπα ιστού. Παρόλο που η Microsoft έχει υποσχεθεί την υποστήριξη CSS3 και ακόμη και την HTML5 για το IE9, οι χρήστες των Windows, και ιδίως οι επιχειρήσεις, μπορούν να συνεχίσουν να χρησιμοποιούν τα IE8, IE7 ή ακόμα και το φοβερό IE6 για τα επόμενα χρόνια.

Ως αποτέλεσμα, η κωδικοποίηση ενός ιστότοπου με αποκλειστικές λειτουργίες CSS3 θα αποξενώσει μόνο ένα μεγάλο μέρος των επισκεπτών του ιστότοπού σας και η υποχρέωσή τους να κάνουν λήψη ενός πρότυπου συμβατού περιηγητή, όπως το Mozilla Firefox ή το Google Chrome, θα αντιμετωπίσει μόνο ως αλαζονικό.

Μια πιθανή λύση στο πρόβλημα είναι να χρησιμοποιήσετε έναν εκσυγχρονιστή, που είναι ένα σενάριο ή μια εφαρμογή που χρησιμοποιεί μια ποικιλία από κόλπα για να κάνει τον ιστότοπό σας να εμφανίζεται όπως πρέπει σε όλα τα προγράμματα περιήγησης. Το CSS3 Pie είναι ένας εκσυγχρονιστής βασισμένος σε javascript που βοηθάει τον Internet Explorer να αναγνωρίσει τις δροσερές δυνατότητες του CSS3, όπως στρογγυλεμένες γωνίες, μαλακές σκιάσεις σταγόνας και βαθμίδες γεμίσματος. Είναι γρήγορο, εύκολο και λειτουργεί τις περισσότερες φορές με ελάχιστη μικροαλλαγές.

Εγκατάσταση και ρύθμιση

Αυτό το σύντομο φροντιστήριο υποθέτει ότι έχετε ήδη έναν ιστότοπο με στοιχεία CSS3. Για να λειτουργήσει το CSS3 Pie, πρέπει να κάνετε δύο πράγματα: μεταφορτώστε το πακέτο javascript και προσθέστε ειδικό κωδικό στο αρχείο CSS.

1. Η λήψη από την ιστοσελίδα css3pie.com περιλαμβάνει πολλά αρχεία, αλλά αν όλα πάνε όπως έχει προγραμματιστεί, το μόνο που χρειάζεστε είναι το PIE.htc, το οποίο είναι ένα συμπιεσμένο αρχείο κειμένου. Μεταφορτώστε το σε ένα μέρος στο διακομιστή ιστού όπου το αρχείο CSS σας μπορεί να έχει πρόσβαση σε αυτό.

2. Ανοίξτε το αρχείο CSS στον επεξεργαστή κειμένου και εντοπίστε τα στοιχεία που περιέχουν ιδιότητες CSS3. Εντός των στοιχείων αυτών, προσθέστε τον ακόλουθο κανόνα:

 συμπεριφορά: url (PIE.htc);

Η διαδρομή για το αρχείο PIE.htc πρέπει να είναι ακριβής, οπότε αν δεν βρίσκεται στον ίδιο κατάλογο με το αρχείο CSS, αλλάξτε ανάλογα.

Το τελικό στοιχείο θα πρέπει να φαίνεται ως εξής:

 # element1 {border: 1px στερεά # 696; padding: 60px 0; κείμενο-ευθυγράμμιση: κέντρο; πλάτος: 200px; -webkit-ακτίνα-ακτίνα: 8px; -moz-border-radius: 8px; ακτίνα ακτίνων: 8px; φόντο: # EEFF99; συμπεριφορά: url (PIE.htc); }}

Εάν αυτό λειτούργησε σωστά, θα πρέπει να δείτε τα αποτελέσματα στο IE 6, 7 και 8 αμέσως μετά τη μεταφόρτωση του τροποποιημένου αρχείου CSS.

Αντιμετώπιση προβλημάτων

Εάν δεν βλέπετε καθόλου αλλαγές, θα πρέπει πολύ πιθανόν να πρέπει να προσαρμόσετε τη διαδρομή στο PIE.htc ή ακόμα και να χρησιμοποιήσετε την πλήρη διεύθυνση URL. Απλά θυμηθείτε ότι το IE θα δέχεται μόνο ένα αρχείο htc από τον ίδιο τομέα με τον ιστότοπο και το "www.site.com" και το "site.com" θεωρούνται δύο διαφορετικοί τομείς.

Σε ορισμένες περιπτώσεις, ίσως χρειαστεί να δοκιμάσετε το PIE_uncompressed.htc ή ακόμα και το PIE.php για να το χρησιμοποιήσετε σωστά. Συμβουλευτείτε την τεκμηρίωση για περισσότερες λεπτομέρειες.

Έχω παρατηρήσει ότι ο συνδυασμός της διαφάνειας και του τολμηρού κειμένου έχει ως αποτέλεσμα μερικές λέξεις που τρελαίνονται στο IE8. Μπορεί να χρειαστεί να χρησιμοποιείτε διαφανή φόντα εικόνας σε αυτές τις περιπτώσεις.

Ο συνδυασμός της πίτας CSS3 και ορισμένων λειτουργιών jQuery φαίνεται να προκαλεί σφάλμα στο IE. Δεν έχω βρει λύση γι 'αυτό, αλλά η σελίδα εξακολουθεί να φορτώνεται και να εμφανίζεται σωστά παρά το γεγονός αυτό.

Εκσυγχρονισμός

Με πολύ λίγη προσπάθεια, το CSS3 Pie μπορεί να βοηθήσει τον ιστότοπό σας να δείχνει σταθερά ελκυστικό σε όλα τα μεγάλα προγράμματα περιήγησης, χωρίς τον πονοκέφαλο να χρειάζεται να διαμορφώσει γωνιακές εικόνες ή να κάνει ψεύτικες σκιές. Η πρώτη σελίδα του ιστότοπου περιλαμβάνει μια επίδειξη ώστε να μπορείτε να προσαρμόσετε τις ιδιότητες του CSS3 και να δείτε τα ζωντανά αποτελέσματα στον Internet Explorer. Το καλύτερο από όλα το CSS3 Pie είναι δωρεάν και ανοιχτό και είναι διαθέσιμο για λήψη χωρίς κόστος.