Android

Ανταπόκριση έναντι προσαρμοστικού σχεδιασμού ιστοσελίδων - Ποιο είναι καλύτερο;

Ανταπόκριση από Τσιάπας. Η επίθεση εναντιον των Ζαπατιστας

Ανταπόκριση από Τσιάπας. Η επίθεση εναντιον των Ζαπατιστας

Πίνακας περιεχομένων:

Anonim

Οι πρώτοι προγραμματιστές ιστοτόπων δεν χρειάστηκε να ανησυχούν πολύ για το σχεδιασμό ιστοσελίδων, καθώς οι χρήστες θα τα βλέπουν σε υπολογιστές και οι υπολογιστές αυτοί είχαν σταθερή ανάλυση οθόνης. Με την κινητή επανάσταση, όλο και περισσότεροι άνθρωποι ψάχνουν στις κινητές τους συσκευές - ταμπλέτες ή κινητά τηλέφωνα - για πληροφορίες. Έχει λοιπόν γίνει απαραίτητο για τους προγραμματιστές ιστοτόπων να δημιουργήσουν έναν ιστότοπο που να καλύπτει τα πάντα από τα Windows PC έως τις κινητές συσκευές. Αυτό το άρθρο εξηγεί τη διαφορά μεταξύ του προσαρμοστικού και ανταποκρινόμενου σχεδιασμού ιστοσελίδων και σας επιτρέπει να αποφασίσετε ποια είναι καλύτερη για εσάς και τον οργανισμό σας.

Υπάρχουν δύο μέθοδοι για να δημιουργήσετε ιστότοπους έτσι ώστε να μπορούν να ικανοποιήσουν διαφορετικές αναλύσεις οθόνης: από υπολογιστές σε κινητά τηλέφωνα. Οι μέθοδοι είναι Adaptive web design και Responsive web design. Και στις δύο περιπτώσεις, ο τελικός στόχος είναι να δημιουργηθεί ένας ιστότοπος που να μπορεί να προβληθεί σε οποιοδήποτε τύπο οθόνης. Ο στόχος είναι να παρουσιάσετε τις πληροφορίες σε μια σειρά συσκευών - από τους υπολογιστές έως τα tablet στα κινητά τηλέφωνα.

Η υπεύθυνη σχεδίαση web

ανταποκρίνεται στην πρόσθετη κωδικοποίηση και χρησιμοποιεί τα λεγόμενα "πλέγματα υγρών". Οι αριθμοί καθορίζονται σε "ποσοστό" παρά σε ακριβή αριθμό εικονοστοιχείων. Αυτό κάνει τον ίδιο κώδικα ιστότοπου να εμφανίζεται σωστά σε οθόνη υπολογιστή και σε οθόνη κινητού τηλεφώνου. Έτσι, ανεξάρτητα από το πώς μπορείτε να αλλάξετε το μέγεθος της οθόνης σας, ο ίδιος ιστότοπος παρουσιάζεται με τρόπο εύκολο να το διαβάσετε. Για μικρότερες ιστοσελίδες, το κείμενο και οι εικόνες κυκλοφορούν εύκολα με το χώρο της οθόνης και χωρούν χωρίς να σπάσουν τον ιστότοπο ή χωρίς να περικοπούν τμήματα του ιστότοπου.

Μια προσέγγιση Responsive web design καθιστά υποχρεωτική τη χρήση του CSS3 αντί του CSS. Χρησιμοποιεί επίσης κλιμακούμενες εικόνες και πλέγματα υγρών που είναι λίγο δύσκολο να κωδικοποιηθούν.

Adaptive Web Design

Ο προσαρμοστικός σχεδιασμός ιστοσελίδων επικεντρώνεται επίσης στην παρουσίαση του ορατού ιστοτόπου σε δισκία και κινητά τηλέφωνα, εκτός από τις οθόνες υπολογιστών. Η προσέγγιση είναι λίγο διαφορετική όμως. Σε ευπροσάρμοστο σχεδιασμό ιστοσελίδων, ήταν ευελιξία που επέτρεπε την ελεύθερη ροή κειμένου και το μέγεθος των εικόνων ώστε να ταιριάζουν στις διαφορετικές οθόνες.

Στην προσαρμοστική σχεδίαση ιστοσελίδων, οι προγραμματιστές χρησιμοποιούν προκαθορισμένα μεγέθη οθόνης και κωδικοποιούν ανάλογα. Δηλαδή, όταν ένας χρήστης προσγειώνεται στον ιστότοπο, ο ιστότοπος προσδιορίζει τον τύπο της συσκευής που χρησιμοποιείται και παρουσιάζει τον ιστότοπο που έχει σχεδιαστεί για το συγκεκριμένο μέγεθος οθόνης της συσκευής. Το περιεχόμενο μπορεί να διαφέρει μεταξύ των συσκευών σε ορισμένες περιπτώσεις.

Για παράδειγμα, οι προγραμματιστές θα θεωρούν 1280 × 800 εικονοστοιχεία για υπολογιστές, 8 "για δισκία και 5" για κινητά. Ο πρώιμος κώδικας του προσαρμοστικού σχεδιασμού ιστού περιέχει την αναγνώριση των οθονών. Αν πρόκειται για υπολογιστή, δείξτε την έκδοση υπολογιστή του ιστότοπου. Εάν πρόκειται για tablet με μέγεθος 8 ", εμφανίστε την έκδοση tablet του ιστότοπου και, επίσης, εάν η συσκευή είναι κινητό τηλέφωνο, δείξτε την έκδοση κινητού τηλεφώνου της ιστοσελίδας. Αυτό επιτυγχάνεται χρησιμοποιώντας τη δήλωση" IF ", ακολουθούμενη από διαφορετικές διαστάσεις ακριβώς σε εικονοστοιχεία και όχι σε ποσοστό

Αν οι νέες συσκευές εμφανιστούν με διαφορετική ανάλυση οθόνης, οι προγραμματιστές θα πρέπει να επιστρέψουν στην κωδικοποίηση για να ενσωματώσουν τις νεότερες αναλύσεις οθόνης. μικρότερες συσκευές, αν οι προγραμματιστές δεν είναι προσεκτικοί.

Σε σύγκριση με την ευαίσθητη σχεδίαση ιστοσελίδων, ο προσαρμοστικός σχεδιασμός ιστοσελίδων είναι ευκολότερος στον κώδικα και οι περισσότεροι προγραμματιστές επιλέγουν τον τελευταίο μέσω του ανταποκριτικού σχεδιασμού ιστοσελίδων

Ανταπόκριση έναντι προσαρμοστικού σχεδιασμού ιστοσελίδων

είναι δύσκολο να κωδικοποιηθεί.Ο κώδικας είναι πολύπλοκος και κάνει χρήση των ποσοστιαίων τιμών αντί των σταθερών pixel αξιών.Χρειάζεται καλή συγκέντρωση για να οικοδομήσουμε μια ιστοσελίδα που ζυγίζει ανάλογα με το μέγεθος της οθόνης των συσκευών.Αντίθετα, είναι πιο εύκολο να δημιουργήσετε διαφορετικούς ιστότοπους για διαφορετικές συσκευές, όπως συμβαίνει με τον προσαρμοστικό σχεδιασμό ιστοσελίδων. Αν και η δουλειά είναι περισσότερο προσαρμοστική σχεδίαση ιστοσελίδων καθώς οι προγραμματιστές θα δημιουργούσαν διαφορετικούς ιστότοπους για διαφορετικά μεγέθη συσκευών, είναι ακόμα πιο εύκολο σε σύγκριση με τον ανταποκρινόμενο σχεδιασμό ιστοσελίδων.

Δεδομένου ότι υπάρχουν πάρα πολλές συσκευές κινητής τηλεφωνίας στην αγορά, οι προγραμματιστές δεν μπορούν απαραίτητα να περιλαμβάνουν όλους τους τύπους ψηφιακών αναλύσεων. Αυτό οδηγεί στην περικοπή των ιστοσελίδων σε μικρότερες οθόνες όταν χρησιμοποιείται προσαρμοστική προσέγγιση σχεδιασμού ιστοσελίδων.

Οι προσαρμοστικές ιστοσελίδες είναι λίγο αργές στη φόρτωση καθώς ο ιστότοπος πρέπει πρώτα να καταλάβει ποια συσκευή και ποια ανάλυση οθόνης χρησιμοποιείται. Με βάση αυτό, η σχετική έκδοση του ιστότοπου φορτώνεται στην οθόνη της συσκευής. Σε περίπτωση ανταποκρινόμενου σχεδιασμού ιστοσελίδων, χρησιμοποιείται ένας μόνος κωδικός και συρρικνώνεται αυτόματα για να ταιριάζει στις οθόνες κινητής τηλεφωνίας.

Ίσως θελήσετε επίσης να ρίξετε μια ματιά σε αυτή την ανάρτηση στο MSDN με τον τίτλο Γιατί προτιμώ τον προσαρμοστικό σχεδιασμό ιστοσελίδων μέσω του ανταποκριτού σχεδιασμός ιστοσελίδων.