Αναρωτηθήκατε τον εαυτό σας: "Ποιος είναι ο ανταποκρινόμενος σχεδιασμός ιστοσελίδων;" Ο υπεύθυνος σχεδιασμός ιστοσελίδων είναι μια προσέγγιση με την οποία ένας σχεδιαστής δημιουργεί μια ιστοσελίδα που "ανταποκρίνεται" ή μετατρέπεται σε μέγεθος ανάλογα με τον τύπο της συσκευής που βλέπει μέσω. Αυτό θα μπορούσε να είναι μια υπερβολική οθόνη επιτραπέζιου υπολογιστή, φορητό υπολογιστή ή συσκευές με μικρές οθόνες, όπως smartphones και tablet.
Ο υπεύθυνος σχεδιασμός ιστοσελίδων έχει γίνει ένα ουσιαστικό εργαλείο για όσους έχουν ψηφιακή παρουσία. Με την ανάπτυξη smartphones, tablet και άλλων φορητών υπολογιστικών συσκευών, περισσότεροι άνθρωποι χρησιμοποιούν μικρότερες οθόνες για να προβάλλουν ιστοσελίδες.
$config[code] not foundΑυτές οι ιστοσελίδες πρέπει επίσης να εξετάσουν τον πρώτο ευρετήριο για κινητά που μόλις ανακοινώθηκε από την Google τον Απρίλιο του 2018. Καθώς περισσότερες μικρές επιχειρήσεις αυξάνουν την κινητή τους παρουσία, ο ιστότοπός τους, το ηλεκτρονικό εμπόριο, η σελίδα Google Business, οι σελίδες κοινωνικών μέσων και άλλα στοιχεία πρέπει να είναι εύκολα προσβάσιμα σε όλα συσκευές.
Τι είναι το Responsive Web Design;
Ο σκοπός του ανταποκρινόμενου σχεδιασμού είναι να έχει έναν ιστότοπο, αλλά με διαφορετικά στοιχεία που να ανταποκρίνονται διαφορετικά όταν βλέπουν σε συσκευές διαφορετικών μεγεθών.
Ας πάρουμε έναν παραδοσιακό "σταθερό" ιστότοπο. Όταν προβάλλεται σε επιτραπέζιο υπολογιστή, για παράδειγμα, ο ιστότοπος ενδέχεται να εμφανίζει τρεις στήλες. Αλλά όταν βλέπετε την ίδια διάταξη σε ένα μικρότερο tablet, μπορεί να σας αναγκάσει να μετακινηθείτε οριζόντια, κάτι που οι χρήστες δεν σας αρέσουν. Ή τα στοιχεία ενδέχεται να μην είναι ορατά ή να φαίνονται παραμορφωμένα. Ο αντίκτυπος περιπλέκεται επίσης από το γεγονός ότι πολλά δισκία μπορούν να προβληθούν είτε σε κατακόρυφο προσανατολισμό είτε σε πλάγια θέση για προβολή τοπίου.
Σε μια μικροσκοπική οθόνη smartphone, οι ιστοσελίδες μπορούν να είναι ακόμα πιο δύσκολο να δουν. Μεγάλες εικόνες μπορεί να "σπάσουν" τη διάταξη. Οι ιστότοποι ενδέχεται να επιβραδύνουν τη φόρτωση σε smartphones εάν είναι γραφικά βαρύ.
Ωστόσο, εάν ένας ιστότοπος χρησιμοποιεί ανταποκρινόμενο σχεδιασμό, η έκδοση του tablet μπορεί να προσαρμοστεί αυτόματα για να εμφανίσει μόνο δύο στήλες. Με αυτόν τον τρόπο, το περιεχόμενο είναι ευανάγνωστο και εύκολο στην πλοήγηση. Σε ένα smartphone, το περιεχόμενο μπορεί να εμφανίζεται ως μία στήλη, ίσως στοιβαγμένη κατακόρυφα. Ή, ενδεχομένως, ο χρήστης θα είχε τη δυνατότητα να περάσει από το δάχτυλό σας για να δει άλλες στήλες. Οι εικόνες θα αλλάξουν το μέγεθος αντί να στρεβλώνουν τη διάταξη ή να αποκόπτονται.
Το θέμα είναι: με την ικανοποιητική σχεδίαση, ο ιστότοπος προσαρμόζεται αυτόματα με βάση τη συσκευή που βλέπει ο θεατής.
Πώς λειτουργεί το Responsive Web Design;
Οι ανταποκριτικοί ιστότοποι χρησιμοποιούν υγρά πλέγματα.Όλα τα στοιχεία σελίδας έχουν μέγεθος ανά αναλογία, αντί για εικονοστοιχεία. Έτσι εάν έχετε τρεις στήλες, δεν θα λέγατε ακριβώς πόσο ευρύ θα έπρεπε να είναι, αλλά μάλλον πόσο ευρύ θα έπρεπε να είναι σε σχέση με τις άλλες στήλες. Η στήλη 1 θα πρέπει να καλύπτει το ήμισυ της σελίδας, η στήλη 2 θα πρέπει να ανέρχεται σε 30% και η στήλη 3 να ανέρχεται, για παράδειγμα, στο 20%.
Επίσης, τα μέσα, όπως οι εικόνες, έχουν προσαρμοστεί σε μέγεθος. Με αυτόν τον τρόπο μια εικόνα μπορεί να παραμείνει στη στήλη της ή σε σχετικό στοιχείο σχεδίασης.
Σχετικά θέματα
Ποντίκι με άγγιγμα: Ο σχεδιασμός για κινητές συσκευές αναδεικνύει επίσης το πρόβλημα του ποντικιού έναντι της αφής. Σε επιτραπέζιους υπολογιστές, ο χρήστης έχει κανονικά ένα ποντίκι για να πλοηγηθεί και να επιλέξει στοιχεία. Σε ένα smartphone ή tablet, ο χρήστης χρησιμοποιεί ως επί το πλείστον δάκτυλα και αγγίζει την οθόνη. Τι μπορεί να φαίνεται εύκολο να επιλέξετε με ένα ποντίκι, μπορεί να είναι δύσκολο να επιλέξετε με ένα δάχτυλο σε ένα μικροσκοπικό σημείο σε μια οθόνη. Ο σχεδιαστής του διαδικτύου πρέπει να λάβει υπ 'όψιν το «άγγιγμα».
Γραφικά και ταχύτητα λήψης: Επίσης, υπάρχει το θέμα των γραφικών, των διαφημίσεων και της ταχύτητας λήψης. Στις κινητές συσκευές, μπορεί να είναι συνετό να εμφανίζονται λιγότερα γραφικά από ό, τι για τις προβολές επιφάνειας εργασίας, έτσι ώστε να μην χρειαστεί ποτέ να φορτώνεται ένας ιστότοπος για ένα smartphone. Μπορεί να χρειαστεί να ανταλλάσσονται μεγαλύτερα μεγέθη διαφημίσεων για μικρότερες διαφημίσεις.
Εφαρμογές και "εκδόσεις για κινητά": Στο παρελθόν, μπορεί να έχετε σκεφτεί να δημιουργήσετε μια εφαρμογή για τον ιστότοπό σας - για παράδειγμα μια εφαρμογή iPad ή μια εφαρμογή Android. Ή θα έχετε μια έκδοση κινητού ειδικά για το BlackBerry.
Αλλά με τόσες πολλές διαφορετικές συσκευές σήμερα, γίνεται όλο και πιο δύσκολο να δημιουργήσετε εφαρμογές και διαφορετικές εκδόσεις για κάθε συσκευή και λειτουργική πλατφόρμα.
Γιατί οι μικρές επιχειρήσεις πρέπει να στραφούν σε υπεύθυνο σχεδιασμό ιστοσελίδων
Περισσότεροι άνθρωποι χρησιμοποιούν κινητές συσκευές. Μια πρόσφατη έρευνα της Pew, το 77% των Αμερικανών κατέχει πλέον το smartphone το 2018, που ξεπερνά το 35% της πρώτης έρευνας ιδιοκτησίας smartphone της Pew Research Center που πραγματοποιήθηκε το 2011.
Ελέγξτε την επισκεψιμότητά σας και ίσως απλά να συγκλονιστείτε με το πόσα επισκέπτες προσεγγίζουν στον ιστότοπό σας μέσω κινητών συσκευών. (Στο Google Analytics, επιλέξτε "Ακροατήριο" στην αριστερή πλευρά και, στη συνέχεια, "Κινητό" για να δείτε ποιο ποσοστό επισκεψιμότητας προέρχεται από κινητές συσκευές. Μπορείτε ακόμη να αναλύσετε τις συσκευές που στέλνουν την επισκεψιμότητα.)
Ανταπόκριση πρότυπα σχεδίασης είναι παντού τώρα, για αγορά. Εάν, για παράδειγμα, έχετε έναν ιστότοπο WordPress, μπορείτε να επισκεφτείτε μια αξιόλογη γκαλερί προτύπων όπως το ThemeForest και να αναζητήσετε "θέματα που ανταποκρίνονται στο WordPress". Αγοράστε ένα για λιγότερο από $ 50. Ο προγραμματιστής σας στο Web μπορεί στη συνέχεια να το προσαρμόσει για το λογότυπο και το εμπορικό σήμα σας.
Σημείωση του συντάκτη: Εδώ στο Small Business Trends, εργαζόμαστε σε ένα νέο σχεδιασμό που ανταποκρίνεται. Δεν θα έπρεπε;
Φωτογραφία μέσω Shutterstock
Περισσότερα στο: Περιεχόμενο Μάρκετινγκ, Τι είναι 95 Σχόλια ▼
