Ποιο είναι το βέλτιστο πλάτος ιστοσελίδας;

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

Ωστόσο, τα 1048 pixel δεν ήταν τυχαίος αριθμός.

Υπήρχαν δύο βασικές επιρροές στην επέκταση του πλάτους της σελίδας μου:

  • Αλλαγή πλάτους YoutubeΤο Youtube προσφέρει μεγαλύτερα μεγέθη ενσωμάτωσης τώρα. Εάν κάνετε κλικ στο μικρό γρανάζι στην πλαϊνή γραμμή της σελίδας βίντεο στο Youtube, σας προσφέρονται επιλογές για μεγαλύτερα μεγέθη καθώς και το θέμα. Δεδομένου ότι τα βίντεο υψηλότερης ευκρίνειας γίνονται κοινός τόπος στο Youtube, ήθελα να ενσωματώσω αυτά τα βίντεο στο ιστολόγιό μου και να τα εμφανίσω με όσο το δυνατόν περισσότερες λεπτομέρειες (χωρίς να καταναλώνω όλο το πλάτος της σελίδας).
  • Η τυπική διαφήμιση έχει πλάτος 125, 250 και 300 pixel. 300 pixel φαίνεται να εμφανίζονται όλο και περισσότερο στους ιστότοπους εσόδων από διαφημίσεις και ήθελα να τα ενσωματώσω τακτοποιημένα στην πλαϊνή γραμμή μου.

Και φυσικά, υπάρχει κάποια επένδυση στα αριστερά και τα δεξιά της σελίδας, το περιεχόμενο και η πλαϊνή γραμμή… έτσι ο μαγικός αριθμός ήταν 1048 εικονοστοιχεία για το θέμα μου:

Βέλτιστο πλάτος τοποθεσίας Web

Έλεγξα τα στατιστικά στοιχεία του αναγνώστη μου;

Ναι φυσικά! Εάν η πλειονότητα των επισκεπτών μου έτρεχε οθόνες χαμηλότερης ανάλυσης, σίγουρα θα είχα δεύτερη σκέψη σχετικά με την επέκταση της σελίδας μου. Πλάτος και ΠοσοστόΑφού έβγαλα τις αναλύσεις οθόνης από το πακέτο Analytics (στο Google είναι Επισκέπτες> Ικανότητες προγράμματος περιήγησης> Ανάλυση οθόνης), δημιούργησα ένα υπολογιστικό φύλλο Excel των αποτελεσμάτων και ανέλυσα το πλάτος από το πεδίο ανάλυσης.

Η Google παρέχει ανάλυση ως 1600 × 1200, οπότε πρέπει να πάρετε τα πάντα από τα αριστερά του "x", πολλαπλασιάστε το με 1 για να το κάνετε ένα αριθμητικό αποτέλεσμα, ώστε να μπορείτε να ταξινομήσετε φθίνουσα, μετά να κάνετε SUMIF και να δείτε πόσες επισκέψεις είναι μεγαλύτερο ή μικρότερο από το πλάτος σχεδίασης που βλέπετε.

= ΑΡΙΣΤΕΡΑ (A2, FIND ("x", A2,1) -1) * 1

Έχω εγκαταλείψει το 22% των αναγνωστών που τρέχουν μικρότερη ανάλυση; Φυσικά και όχι! Το ωραίο με μια διάταξη με το περιεχόμενό σας αριστερά και πλευρική γραμμή είναι ότι μπορείτε να διασφαλίσετε ότι το περιεχόμενό σας είναι ακόμα στο πλάτος της πλειοψηφίας των προγραμμάτων περιήγησης. Σε αυτή την περίπτωση, το 99% των αναγνωστών μου τρέχει μεγαλύτερο από 640 εικονοστοιχεία, οπότε είμαι καλός! Δεν θέλω να χάσουν τελείως την πλαϊνή μπάρα, αλλά αυτό είναι δευτερεύον σε σχέση με το περιεχόμενο.

9 Σχόλια

  1. 1

    Προτείνω μια υβριδική διάταξη και πλάτος κοντέινερ CSS 100%. Εφόσον έχετε σταθερό πλάτος για την πλευρική γραμμή, οι περιοχές κεφαλίδας, υποσέλιδου και κύριου περιεχομένου θα προσαρμοστούν ώστε να ταιριάζουν στο υπόλοιπο πλάτος της οθόνης. Γεμίζει το 100% του παραθύρου του προγράμματος περιήγησης όλων, ανεξάρτητα από την ανάλυση της οθόνης του χρήστη. Τότε δεν χρειάζεται να μετράτε πια εικονοστοιχεία ούτε να παρακολουθείτε τα στατιστικά χρήστη σχετικά με τις αναλύσεις της οθόνης.

    • 2

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

      Απλώς μια προσωπική προτίμηση υποθέτω!

  2. 3

    Ουσιαστικά, συμφωνώ με το συμπέρασμά σας, αλλά εάν χρησιμοποιώ ρύθμιση σταθερού πλάτους, περιορίζω το πλάτος στα 960 εικονοστοιχεία.

    Κάποιος πρέπει να λαμβάνει υπόψη κάθετες γραμμές κύλισης και άλλες γραμμές συντόμευσης του προγράμματος περιήγησης που καταλαμβάνουν επιπλέον πλάτος. Διατηρώντας εντός 960 pixel, είναι βέβαιο ότι δεν υπάρχει κύλιση από αριστερά προς τα δεξιά σε ανάλυση οθόνης πλάτους 1024 pixel.

    Άντι Έμπον

  3. 4
  4. 5

    πολύ παράξενο. Στο Firefox, ο ιστότοπός σας έχει μια γραμμή κύλισης οριζόντια στα 1048 και δεν έχει καθαρή εμφάνιση μέχρι να φτάσετε στο 1090.

    Σας ευχαριστούμε για τα υπέροχα στατιστικά στοιχεία από τις αναλύσεις της Google

  5. 6

    Δεδομένου ότι έχετε το δικό σας σε 1048px, ο ιστότοπός σας προκαλεί οριζόντιες γραμμές κύλισης σε μια οθόνη 1024. Νομίζω ότι θα ήταν καλύτερο να αφαιρέσετε 100px από το πλάτος (και την επένδυση) της πλαϊνής γραμμής και της περιοχής περιεχομένου σας, ώστε να ταιριάζει σε 728 × 1024. Αυτή είναι η καλύτερη πρακτική σήμερα.

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

  6. 7
  7. 8

    Ανόητο
    Δεν χρησιμοποιούν όλοι τα παράθυρα σε πλήρη οθόνη - στην πραγματικότητα, θα στοιχηματίσω ότι λίγοι το κάνουν. 

    Έχω το ιστολόγιό σας σε 80% windo… και αυτό είναι, μια οριζόντια γραμμή κύλισης

    Και τι είναι εκτός οθόνης ... ας δούμε ... τίποτα.

    Έτσι, η γραμμή κύλισης είναι άσκοπη.

    Ένας εύκολος τρόπος για να χάσετε αναγνώστες !!

    • 9

      Το περιεχόμενο βρίσκεται στο κέντρο της σελίδας @ heenan73: disqus, παρέχοντας στον αναγνώστη ακριβώς αυτό που χρειάζονται. Εάν χάνω αναγνώστες επειδή μπορούν και οι δύο να δουν το περιεχόμενο ΚΑΙ να βλέπουν μια οριζόντια γραμμή κύλισης ... δεν είμαι σίγουρος ότι ήταν οι αναγνώστες που ψάχνω. Υπάρχει σίγουρα κάτι μοναδικό στο περιεχόμενό μας που το ωθεί στα 1217 εικονοστοιχεία, οπότε πρόκειται να το εντοπίσω και να το διορθώσω. Αυτή η ανάρτηση γράφτηκε στην πραγματικότητα για ένα προηγούμενο θέμα. Ευχαριστώ που το γνωρίσατε!

Ποια είναι η γνώμη σας;

Αυτός ο ιστότοπος χρησιμοποιεί το Akismet για να μειώσει το spam. Μάθετε πώς επεξεργάζονται τα δεδομένα των σχολίων σας.