29Σεπ

5 διαχρονικά bugs του IE6 που στοιχειώνουν τους web designers μέχρι και σήμερα.

, 29 Σεπτεμβρίου 2008 | WEB DESIGN - AUTHORING | 5 Σχόλια

Από τότε που κυκλοφόρησε ο Ιnternet Explorer 6 πριν 7 χρόνια, έχει δημιουργήσει σημαντικά προβλήματα στη δουλειά του web designer. Η φυσική αδυναμία του να υποστηρίξει ολοκληρωμένα CSS 1 και CSS 2 αναγκάζει μέχρι και σήμερα τους επαγγελματίες του χώρου να καταφεύγουν σε τεχνάσματα, ώστε οι ιστοσελίδες/ web εφαρμογές που σχεδιάζουν να λειτουργούν σωστά σε αυτό το προβληματικό και δεσμευτικό περιβάλλον.

Δυστυχώς το αξιοσημείωτο ποσοστό χρήσης 25% του συγκεκριμένου browser ακόμα μέχρι σήμερα καθιστά απαραίτητη την συμβατότητα σχεδίασης, ώστε η προβολή των ιστοσελίδων/ web εφαρμογών να είναι σωστή όπως στους μεταγενέστερους και πιο σύγχρονους browsers.

Τα 5 βασικά “bugs” του ΙΕ6 που στοιχειώνουν τους web designers/ developers μέχρι και σήμερα:


Το συγκεκριμένο “bug” είναι το πιο σύνηθες και το πιο εκνευριστικό αφού μπορεί να δημιουργήσει σοβαρά προβλήματα στο στήσιμο μιας ιστοσελίδας. Χωρίς έγκυρο Doctype ο IE6 αντιλαμβάνεται τους παραμέτρους τελείως διαφορετικά .

Παράδειγμα

#div {
width: 200px;
border: 2px solid white;
padding: 20px;
}

Ο IE6 θα υπολογίσει 200px, ενώ όλοι οι άλλοι νέοι browsers θα υπολογίσουν 244px.

Λύση:
Με την χρήση σωστού και έγκυρου (X)HTML Doctype o ΙΕ 6 υπολογίζει σωστά τους διαφόρους παραμέτρους που έχουν οριστεί.

Αναλυτικές πληροφορίες για την επιλογή σωστού Doctype.


Ένα πολύ σημαντικό πρόβλημα που δημιούργησε πολλά αρνητικά συναισθήματα στους web designers που κάνανε την μετάβαση από table σε div/ layer layout design είναι το min height/ width . Η χρησιμότητα της συγκεκριμένης παραμέτρου αποτελεί την βάση για ποιοτικό design ενισχύοντας τις εικαστικές επιλογές του κάθε web designer, δεν είναι δυνατόν να μην λειτουργεί.

Λύση:
Εφαρμόζοντας το γνωστό min height hack, το θέμα διορθώνετε.

Αναλυτικές πληροφορίες για την λύση.


Ο IE 6 διπλασιάζει το margin ενός element που έχει οριστεί σε float. Δηλαδή αν έχετε επιλέξει να κάνετε float:left ένα layer και του έχετε ορίσει 10pxl, για τον IE6 θα προβάλλεται ως 20pxl.

Παράδειγμα:

#div {
float: left;
margin-right: 10px;
}

Λύση:
Προσθέτοντας την παράμετρο στο CSS “display: inline;” το πρόβλημα διορθώνεται.


Οι περισσότεροι σύγχρονοι browsers υποστηρίζουν την εντολή :hover σε πολλά στοιχεία (elements) μιας ιστοσελίδας. Ο IE6 είναι δεσμευτικός σε αυτό θέμα, υποστηρίζοντας μόνο το pseudo-class σε elements που έχουν οριστεί με anchor <a> (με a href attribute).
Διαβάστε περισσότερα για το θέμα και την λύση του.


Ο IE6 δεν αναγνωρίζει τα transparent PNG δυσκολεύοντας την δουλειά του web designer και δεσμεύοντας τον εικαστικά. Είναι γνωστό άλλωστε πως το PNG format είναι η πιο εξελιγμένη μορφή εικόνας/ γραφικού αφού υποστηρίζει τον μεγαλύτερο αριθμό χρωμάτων.

Λύση:
Εφαρμόζοντας το PNG FIX, το θέμα διορθώνετε.
Διαβάστε περισσότερα για την λύση


Παρά τις προσπάθειες που έχει κάνει η παγκόσμια κοινότητα των web designers/ developers δεν έχει καταφέρει ακόμα να σταματήσει την χρήση του ξεπερασμένου IE6. Δυστυχώς όσο θα παραμένουν χρήστες που τον χρησιμοποιούν θα υπάρχουν ακόμα τα κλασσικά αυτά προβλήματα.

ΧΡΗΣΙΜΗ ΠΛΗΡΟΦΟΡΙΑ: Το άρθρο 5 διαχρονικά bugs του IE6 που στοιχειώνουν τους web designers μέχρι και σήμερα. γράφτηκε από το WebDesignBlog. Η ομάδα μας σας υπενθυμίζει πως αν θέλετε να ενημερώνεστε για τα νέα του διαδικτύου και για επιλεγμένα άρθρα μας, μπορείτε να γραφτείτε εύκολα στο Newsletter μας ή στο RSS Feed μας.

5 comments so far

Σχολιάστε

Back to top

Recent comments

  • Πολυ καλο αθρο πραγματικα!

    Η σωστή αρχιτεκτονική ενός website και τα οφέλη της
  • Πολύ χρήσιμη η λίστα με τα online tools. Ο επιτυχημένος σχεδιασμός μιας ιστοσελίδας βοηθά σε δύο κατευθύνσεις. Η πρώτη είναι ότι βελτιώνει την εμπειρία του επισκέπτη της ιστοσελίδας με συνέπεια ο τελευταίος να βλέπει περισσότερες σελίδες και να μένει περισσότερο χρόνο σε αυτή. Η δεύτερη είναι ότι επειδή ακριβώς βελτιώνονται τα στατιστικά στοιχεία της ιστοσελίδας, όπως το bounce rate, ο μέσος χρόνος παραμονής στην ιστοσελίδα και ο αριθμός των σελίδων ανά επίσκεψη, βελτιώνεται και η κατάταξη της ιστοσελίδας στα οργανικά αποτελέσματα της Google.

    10+1 Χρήσιμα website και on line tools

Latest From Twitter