Επανασχεδιασμός του Nodejs.org: Μέρος 1

Μια ανταγωνιστική μελέτη περίπτωσης

Ο ιστότοπος Node.js δεν είχε σημαντική ενημέρωση για το περιεχόμενο και την Αρχιτεκτονική Πληροφοριών (IA) από τις αρχές του 2014 και πολλά άλλαξαν από τότε! Οι τάσεις σχεδίασης έχουν μεταβληθεί, το ανταγωνιστικό τοπίο έχει γίνει πιο γεμάτο, και το έργο Κόμβος έχει επιτύχει νέα ύψη στην κοινότητα προγραμματιστών. Ο κόσμος τρέχει στον κόμβο και πιστεύω ότι η κατάσταση της δημόσιας εικόνας του θα πρέπει να ταιριάζει με την ποιότητα του κώδικα του.

Ο κόσμος τρέχει στον κόμβο

Για να βοηθήσω να ξεκινήσω την καμπάνια του ιστοτόπου Node.js στο Github Repo, έχω ρίξει μια ματιά σε δέκα από τις μεγαλύτερες ιστοσελίδες της πλατφόρμας προγραμματιστών ανάπτυξης και συνθέσαμε κάποιες από τις αγαπημένες μου επιλογές IA, στοιχεία σχεδίασης και δυνατότητες αλληλεπίδρασης σε μια λίστα συστάσεων για τον επερχόμενο επανασχεδιασμό του ιστοτόπου του Node.js.

Σημείωση: Ξέρω ότι έχω χάσει πολλά εκπληκτικά χαρακτηριστικά εκεί έξω - αυτό το άρθρο δεν είναι εξαντλητικό! Παρακαλούμε σχολιάστε στο κάτω μέρος με τις αγαπημένες σας εμπειρίες προγραμματιστών από ολόκληρο τον ιστό.

Η κατάσταση των ιστότοπων προγραμματιστών

Τι πηγαίνει σε μια μεγάλη ιστοσελίδα τεκμηρίωσης προγραμματιστών; Οι προγραμματιστικές γλώσσες και οι χώροι πλαισίου των frontend πλέουν μια λεπτή γραμμή - πρέπει να προσκαλέσουν και τους νεοφερμένους, παραμένοντας όμως ένας πολύτιμος πόρος για τους χρήστες power.

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

Αποδεικνύεται ότι τα πλαίσια πλαισίων επικρατούν στην αγορά για συναρπαστικά και καινοτόμα σχέδια τεκμηρίωσης τοποθεσιών. Πιστεύω ότι αυτό είναι για δύο λόγους:

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

Λαμβάνοντας αυτή τη διορατικότητα στην καρδιά, καταλήξαμε να εξετάζουμε δέκα (10) γλώσσες προγραμματισμού και Frontend Framework που οδηγούν τους αντίστοιχους χώρους τους για να συλλέξουν ιδέες για αυτό το άρθρο. Αυτά είναι, σε καμία συγκεκριμένη σειρά: Scala, Rust, Dart, Ember, React, γωνιακή, Vue.js, Go, Swift και Ruby.

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

Αισθητική

Η εμφάνιση και η αίσθηση μιας ιστοσελίδας πρέπει να αντιπροσωπεύουν τις αρχές και τις αξίες του έργου. Ευτυχώς για εμάς, στο Node Interactive 2017 στο Βανκούβερ, η κοινότητα συνεργατών έτρεξε μια άσκηση για να βοηθήσει στον προσδιορισμό ορισμένων από τις βασικές αξίες Node.js. Αυτό ήταν μόνο το πρώτο από πολλά εργαστήρια Node.js Core Values, αλλά μας έδωσε ένα υπέροχο εφαλτήριο για να ξεκινήσει ένας επανασχεδιασμός:

Node.js Core Values
Ο κόμβος είναι: Σταθερός, Περιλαμβάνει, Καλωσορίζοντας, Εκπληκτικό και Διασκεδαστικό

Ας συγκρίνουμε αυτές τις έννοιες με τον τρέχοντα σχεδιασμό ιστοσελίδων:

Nodejs.org Circa 2017

✘ Καλωσόρισμα: Μεγάλα γκρίζα μπλοκ αφήνουν το παράθυρο προβολής, περιορίζοντας το περιεχόμενο και στέλνουν ένα αδιάκοπο μήνυμα.

✘ Συμπεριλαμβάνεται: Το πράσινο σε σκούρο γκρι δεν έχει καλές επιδόσεις για τα πλήρως χρωματιστά μέλη. Η ψυχρή γραφή παίρνει το μήνυμα σε όλη, αλλά όχι πολύ.

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

✘ Διασκέδαση: ... Λατρεύω τα εταιρικά γκρι!

Σκέψεις για Βελτίωση:

  1. Φωτίσει! Το κυρίαρχο χρώμα σε αυτό το σχέδιο είναι σκούρο γκρι. Εντάξει, αυτό μπορεί να φαίνεται επαγγελματικό, αλλά σπάνια περιγράφεται ως "φιλόξενο". Η επέκταση της παλέτας χρωμάτων για να συμπεριλάβει τα γκρι χρώματα που συμπληρώνουν το χρώμα της επωνυμίας (ή ακόμα και το * gasp * ένα δεύτερο χρώμα ;!) θα αυξήσει την εκφραστικότητα του site και θα προσφέρει περισσότερες επιλογές στους σχεδιαστές.
  2. Επιλέξτε ένα στυλ απεικόνισης ή φωτογραφίας: Μια μικρή εικόνα προχωρεί σε μεγάλο βαθμό για την εξανθρωπισμό ενός ιστότοπου. Αυτό θα βοηθήσει τους επισκέπτες να αισθάνονται ευπρόσδεκτοι και να χρωματίζουν το χώρο ως φιλικό, ελκυστικό και χρήσιμο μέρος για να εξερευνήσετε.
  3. Τυπογραφική Ιεραρχία / Κάθετος Ρυθμός: Έχοντας μια καλά καθορισμένη ιεραρχία και ρυθμό περιεχομένου τραβάει το σχέδιο μαζί και κραυγάζει "σταθερό και επαγγελματικό" όπως και τίποτα άλλο. Αυτό το επιπλέον στρώμα γυαλίσματος θα εμπνεύσει εμπιστοσύνη
  4. Παίξτε με σχήματα: Το λογότυπο του κόμβου είναι όμορφα γεωμετρικό. Χρησιμοποιήστε αυτό το σχέδιο για να εμπνεύσετε νέες, ενδιαφέρουσες και δυναμικές διατάξεις και οπτικά στοιχεία που αντικατοπτρίζουν το λογότυπο. Αυτό θα βοηθήσει να κρατήσει το site αίσθηση on-brand, και προσθέστε μια μικρή σπίθα διασκέδασης στην ιδιοκτησία.
  5. Βρείτε τη φωνή σας: Ο τόνος είναι σημαντικός. Όταν οι χρήστες φτάσουν στο NodeJS.org, είναι εδώ για να μάθουν κάτι. Εισέρχονται σε μια παράξενη, ξένη θέση σε ένα δυνητικά ευάλωτο, "πρέπει να είμαι και εγώ εδώ", κατάσταση - είναι σημαντικό να μιλάς μαζί τους σαν φίλος! Οι πιο αποτελεσματικοί ιστότοποι τεκμηρίωσης που έχω συναντήσει επιφέρουν μια λεπτή ισορροπία μεταξύ ξηρού, τεχνικού περιεχομένου και περιστασιακής, συνομιλητικής παρουσίασης.

Πλοήγηση

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

TL: DR: Κρατήστε το απλό για να αφαιρέσετε τον εκφοβισμό της τρύπας κουνελιού που πρόκειται να τα πετάξετε

Εδώ είναι ένας καλός κανόνας: Παρουσιάστε μόνο μεταξύ τεσσάρων και έξι κύριων στοιχείων πλοήγησης για το χρήστη, ή εκτελέστε τον κίνδυνο επιλογής άγχους.

Συγγνώμη Vue.js, τα γίγαντά σας drop-downs είναι πραγματικά εκφοβιστικά!

Αντ 'αυτού, καθοδηγήστε τον χρήστη όπου επιθυμούν να πάνε, παρουσιάζοντας μικρές επιλογές μανταριάς κατά μήκος του δρόμου.

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

Το Scala Secondary Nav

Αυτή η ανάγκη για απλότητα δεν σημαίνει ότι δεν μπορούμε να έχουμε λίγη διασκέδαση με το nav αν και! Το React αναδεικνύει την πιο πρόσφατη έκδοση έκδοσης στο πλοίο του ανά πάσα στιγμή και το Go σας επιτρέπει να ανοίξετε ένα πρόγραμμα επεξεργασίας και να παίξετε με κώδικα από οπουδήποτε στον ιστότοπο τεκμηρίωσης.

Ο συνολικός αριθμός έκδοσης στην κορυφή του Reactjs.orgΜπορείτε να ανοίξετε ένα πρόγραμμα επεξεργασίας για να παίξετε με οπουδήποτε στον ιστότοπο Go docs!

Ο καλύτερος τρόπος να προσδιορίσετε αν ένα αντικείμενο ανήκει στο πλοίο είναι να θέσετε τον εαυτό μας αυτό το ερώτημα:

Ποιοι είναι οι χρήστες εδώ για να κάνουν το 90% της ώρας που επισκέπτονται;

Απαντώντας σε αυτή την ερώτηση, μπορούμε εύκολα να κρατήσουμε το parsable και να μειώσουμε το άγχος επιλογής για τους νεοφερμένους στο Nodejs.org.

Έχοντας όλα αυτά υπόψη, μπορούμε τώρα να κάνουμε μερικές συστάσεις για τον ιστότοπο Node.js. Επί του παρόντος, ο κόμβος παρουσιάζει οκτώ επιλογές για τους χρήστες στην κύρια πλοήγησή τους. Σας συνιστώ να το χτυπάμε σε έξι:

Αρχική | Μάθετε | Έγγραφα | Ανακοινώσεις | Κοινότητα | Blog

Η μεγάλη πλειοψηφία του υπάρχοντος περιεχομένου εντάσσεται σε αυτές τις έξι σελίδες. Ωστόσο, υπάρχουν αρκετές σημαντικές σελίδες που δεν ταιριάζουν σε αυτή τη δομή πλοήγησης. Για παράδειγμα: Διακυβέρνηση, Ασφάλεια, Νομική, Ενεργητικό επωνυμίας κ.λπ.

Αυτές οι σελίδες δεν πληρούν τα κριτήρια περίπτωσης χρήσης κατά 90%, επομένως απουσιάζουν από την κύρια πλοήγηση. Ευτυχώς, έχουμε μια πολύ-ξεχασμένη θέση για να επιλύσουμε αυτές τις πολύ αξιόλογες σελίδες: το υποσέλιδο του ιστοτόπου! Πολύ συχνά το υποσέλιδο είναι ξεχασμένο ως ένα πολύτιμο μέρος για την αποθήκευση της πλοήγησης που είναι σημαντικό για τους χρήστες να βρίσκουν εύκολα χωρίς να προσθέτουν γνωστικά έξοδα για την πλειοψηφία των επισκεπτών.

Έτσι, αφήνουμε να αναθεωρήσουμε αυτές τις έξι μεγάλες ενότητες μία προς μία, εμείς;

Αρχική σελίδα

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

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

Οι σελίδες μάρκετινγκ, βεβαίως, πάντα ξεκινούν με κάτι που θα πρέπει να μοιάζει πολύ οικείο με τους έμπειρους πλοηγούς Ιστού: The Hero Banner.

Έντονα διαφημιστικά banners με 1 ή 2 πρωταρχικά CTA - φαίνονται γνωστά;

Αυτό το στοιχείο ακολουθείται συχνά από ένα άλλο γνωστό μοτίβο μάρκετινγκ: Το "One-Two-Three Pitch Punch Punch" (όνομα δίπλωμα ευρεσιτεχνίας που εκκρεμεί).

Απαντά την ερώτηση:

Είναι επίσης πολύ συνηθισμένο για τους ιστότοπους να έχουν έναν εξέχοντα χώρο "ad-unit" για να επεκτείνουν τις επερχόμενες εκδηλώσεις και συνέδρια που φιλοξενούν.

Δυναμικές μονάδες διαφημίσεων για συνέδρια και εκδηλώσεις

Μερικές από τις πιο ευχάριστες εμπειρίες σε αυτούς τους ιστοτόπους τεκμηρίωσης είναι τα παραδείγματα του ζωντανού κώδικα. Επιτρέπουν στους χρήστες να χάνουν τα χέρια τους γρήγορα, με μηδενική προσπάθεια, μειώνοντας σημαντικά το κόστος για buy-in.

Τα παραδείγματα Live Code είναι όλα τα οργή

Η αρχική σελίδα είναι επίσης ένα μέρος για να καυχηθείτε για τους χορηγούς και τους μεγάλους καταναλωτές σας - το ονομάζω "Η προσφυγή στην αρχή της αυλής".

Χορηγίες / Μεγάλες Λεπτομέρειες Χρήστη

Μην με πάρτε λάθος εδώ, αυτά τα sites δεν είναι όλα τα cookie-cutter διάταξη - υπάρχουν επίσης ορισμένες μυθιστόρημα παίρνει τα στοιχεία της αρχικής σελίδας του προγραμματιστή:

Το Dart Τμήμα Κοινοτικών Φόρουμ Επικοινωνίας για το scala-lang.orgEmber Job Board Up-sell

Εάν θέλουμε να τρελαθούμε με την έμπνευση σχεδιασμού της αρχικής σελίδας μας, μπορούμε να ρίξουμε μια ματιά στους τελευταίους και τους μεγαλύτερους αυτοσχέδιους - ιστοτόπους που κέρδισαν βραβεία Webby σε κατηγορίες όπως "Professional Services", "Financial Services / Banking" και "Υπηρεσίες Web / Εφαρμογές" - για να δείτε τις μεγαλύτερες τάσεις της τελευταίας τεχνολογίας στον σχεδιασμό σελίδων εκκίνησης:

Το 2017 υπήρχε μια τάση προς τολμηρές, κινητικές εμπειρίες μάρκετινγκ πλήρους σελίδας. Μπορεί να μας ωφελήσει να δανειστούμε τις τάσεις σχεδίασης από αιματηρές περιοχές όπως αυτές που κινούνται προς τα εμπρός.

Μαθαίνω

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

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

Πολλές ενότητες "Ξεκινώντας" λαμβάνουν μια πολύ παρόμοια μορφή: σελίδες με μεγάλη κύλιση που διαβάζουν σαν μια σειρά περιστασιακών δημοσιεύσεων ιστολογίου, χωρίζονται σε καλά γνωστά μαθήματα που ακολουθούν μια καλά καθορισμένη πορεία εκμάθησης. Μέχρι το τέλος της όλης διαδικασίας, είστε ειδικός σε αυτό το προϊόν! Μπορεί να μην είναι ειδικός, αλλά τουλάχιστον ξέρετε αρκετά για να είστε επικίνδυνος.

Αυτά τα σχέδια μαθήματος συχνά εμφανίζονται με μακρά δευτερεύοντα μενού ακορντεόν όπως αυτά:

Ναι, αυτό το μενού ήταν παντού!

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

Ωστόσο, παίρνοντας μαθήματα από άλλα προϊόντα των οποίων η δουλειά είναι να εκπαιδεύσουν, ίσως είμαστε σε θέση να βελτιώσουμε περαιτέρω τη μελλοντική σελίδα μας "Ξεκινώντας". Αυτά τα δευτερεύοντα μενού θυμίζουν παρόμοια χαρακτηριστικά σε εργαλεία μάθησης όπως η LinkedIn Learning, η Khan Academy και ακόμη και οι λίστες αναπαραγωγής βίντεο στο YouTube. Αν βγάλουμε τα φύλλα από τα βιβλία τους, μπορούμε να βοηθήσουμε τα νεότερα μέλη μας να μάθουν ακόμα περισσότερα.

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

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

Όποια και αν είναι η παρουσίαση, μια ενότητα Getting Started είναι απαραίτητη προϋπόθεση για οποιαδήποτε σύγχρονη τοποθεσία τεκμηρίωσης.

Τεκμηρίωση

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

Ωστόσο, μόνο και μόνο επειδή αυτοί είναι χρήστες ενέργειας, δεν σημαίνει ότι η εμπειρία περιήγησης API δεν μπορεί να είναι ευχάριστη! Οι καλύτερες συντεχνίες API είναι γρήγορες για πλοήγηση - δεν μπορεί να πάρει πάρα πολλά κλικ για να βρείτε τη μέθοδο που ψάχνετε ή αλλιώς ... Whoops! Πηγαίνει το laptop σας από το παράθυρο.

Δύο από τους μεγαλύτερους παραβάτες των εγγράφων API που είναι δύσκολο να πλοηγηθούν είναι η Σκουριά και η Γωνιακή. Για να πλοηγηθείτε στα docs, απαιτείται σχεδόν το κουμπί back. Θυμηθείτε: Τα κλικ είναι ακριβά, η κύλιση είναι φτηνή, και τα μενού μενού είναι φίλοι.

Μεγάλη API docs όχι μόνο να πλοηγηθείτε καλά, αλλά και να διαβάσετε καλά. Ακριβώς επειδή αυτό είναι το "ξηρό" τμήμα της ιστοσελίδας σας δεν σημαίνει ότι πρέπει να είναι βαρετό!

Εύκολη πλοήγηση στους οδηγούς API σε απλά αγγλικά - ακόμη και οι προηγμένοι οδηγοί μπορούν να διαβάσουν σαν μια συνομιλία με τον χρήστη.

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

Ο ιστότοπος κόμβου παρέχει αυτήν τη στιγμή μια λίστα με όλες τις προηγούμενες εκδόσεις τεκμηρίωσης, αλλά μία φορά στον ιστότοπο API docs, δεν υπάρχει τρόπος να μεταβείτε εύκολα σε άλλη έκδοση. Πολλοί χρήστες θα έρθουν απευθείας στην τεκμηρίωση API από μια αναζήτηση στο Google ή στο σύνδεσμο Υπερχείλιση στοίβας και ίσως χρειαστούν έναν τρόπο αλλαγής των εκδόσεων στη σελίδα. Τα αναπτυσσόμενα μενού Έκδοση είναι ο τυπικός τρόπος για να επιτευχθεί αυτό:

Δυστυχώς

Το περιεχόμενο της τεκμηρίωσης API Node.js είναι καλά γραμμένο, περιεκτικό και ενημερωτικό. Ωστόσο, η παρουσίαση αφήνει κάτι επιθυμητό και θα μπορούσε να χρησιμοποιήσει έναν καλό επανασχεδιασμό. Στην τεκμηρίωση λείπει ένα ολοκληρωμένο τμήμα Αρχιτεκτονικής. Μπορεί επίσης να είναι πολύτιμη η διαίρεση της τεκμηρίωσης του C ++ Addon και του N-API στο δικό του τμήμα.

Κυκλοφορίες

Το τμήμα "Κυκλοφορίες" συχνά φέρει την ένδειξη "Λήψεις" ή "Εγκατάσταση" σε άλλους δικτυακούς τόπους, και έχω την εντύπωση ότι το όνομα αυτής της ενότητας θα είναι αμφιλεγόμενο

Επέλεξα να τίτλο αυτή την ενότητα Τύπου για δύο λόγους:

  1. Το CTA για το "Install" θα εμφανιστεί τόσο στην αρχική σελίδα όσο και στο CTA και στο "Getting Started". Αυτές είναι οι κύριες διαδρομές για την εγκατάσταση που θα κάνουν οι περισσότεροι νέοι χρήστες.
  2. Καλώντας σε αυτήν την ενότητα Τύπου, μπορούμε να επιλύσουμε πληροφορίες σχετικά με τους κύκλους απελευθέρωσης, τις διαδικασίες και τις προηγούμενες εκδόσεις με εύκολο τρόπο εύρεσης. Αυτό διατηρεί την ιεραρχία πληροφοριών στον ιστότοπο και βελτιώνει την ανιχνευσιμότητα άλλου σημαντικού περιεχομένου, ενώ ταυτόχρονα παρουσιάζει μια εύκολη διαδρομή για την ανακάλυψη σε χρήστες που ενδέχεται να χάσουν το CTA "Εγκατάσταση" σε άλλο σημείο του ιστότοπου.

Το τμήμα "Κυκλοφορίες" πρέπει να περιέχει αυτά τα τρία τμήματα σε μια δευτερεύουσα πορεία:

  1. Αρχική σελίδα: (Πληροφορίες κύκλου εγκατάστασης / κυκλοφορίας)
  2. Όλες οι Κυκλοφορίες
  3. Νύχτα χτίζει

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

Όταν σκεφτόμαστε και πάλι την περίπτωση χρήσης 90% σε αυτήν τη σελίδα, οι περισσότεροι χρήστες θα αναζητήσουν είτε τα Windows Binaries του Windows Installer, του Mac Installer ή του Linux. Επιλέγοντας να παρουσιάσετε αρχικά αυτές τις τρεις επιλογές - με το αναπτυσσόμενο μενού "Λοιπά Λήψη Επιλογών" εύκολα διαθέσιμο για να φιλοξενήσει τις περιπτώσεις χρήσης μεγάλων ουρών - μειώνουμε το μέγεθος αυτής της ενότητας και μειώνουμε την πολυπλοκότητα στη σελίδα. Κάνοντας κλικ στην αναπτυσσόμενη λίστα "Άλλες επιλογές λήψης" θα εμφανιστούν όλες οι λεπτομερείς επιλογές λήψης, οι οποίες είναι πάντα ορατές, για τους χρήστες ενέργειας.

Με την απλοποίηση των ορατών επιλογών εγκατάστασης στην περίπτωση χρήσης 90%, έχουμε τώρα σχεδόν μια ολόκληρη σελίδα για να παρέχουμε πολύτιμες πληροφορίες σχετικά με τη διαδικασία απελευθέρωσης του Node.js!

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

Τίποτα στην αγορά δεν εξηγεί τους πολύπλοκους κύκλους απελευθέρωσης καλύτερα από το Ember Builds Page:

Η Ember χτίζει τη σελίδα

Όπως και ο ιστότοπος Ember, οι απεικονίσεις της διαδικασίας απελευθέρωσης στο nodejs.org μπορούν να κατευθυνθούν από το αρχείο JSON του προγράμματος απελευθέρωσης Node για μια πιο συναρπαστική και κατατοπιστική εμπειρία.

Πλοήγηση στη σελίδα "Όλες οι Κυκλοφορίες" ή "Δημιουργία Nightly" θα εμφανίσει μια λίστα παρόμοια με την τρέχουσα σελίδα Previous Releases. Εντούτοις, μπορεί να επιθυμούμε να συμπεριλάβετε έναν διακόπτη κινητήρα για να επιλέξετε V8 ή ChakraCore και μια επιλογή για να επιλέξετε / φιλτράρετε τους στόχους δημιουργίας, για να συμβάλλετε στην ενοποίηση των σελίδων των φύλλων. SHA257 Τα αθροίσματα ελέγχου μπορεί να εμφανίζονται σε αυτήν τη λίστα για να μοιάσουν τη σελίδα λήψεων Go για να ενοποιήσουν ακόμα περισσότερο τις σελίδες των φύλλων.

Εντάξει, έτοιμη για μια τρελή ιδέα, πίτα-σε-ουρανό; Ως εναλλακτική λύση στο widget εγκατάστασης στην αρχική σελίδα "Εκδόσεις", ο κόμβος θα μπορούσε να επιλέξει να διατηρήσει ένα μόνο σενάριο εγκαταστάτη, όπως συμβαίνει με πολλά άλλα έργα:

Το σενάριο εγκατάστασης σκουριάς - μια γραμμή μπάσων

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

Φανταστείτε εάν οι νέοι προγραμματιστές θα μπορούσαν απλά να τρέξουν:

μπούκλα install.nodejs.org | SH

Και να έχει εγκατασταθεί η πιο ενημερωμένη έκδοση LTS στα μηχανήματά τους.

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

Το εγκατεστημένο CLI θα μπορούσε να είναι τόσο πλήρες όσο το nvm, ή τόσο απλό όσο ο μοναδικός εγκαταστάτης Rust. Υπάρχουν προφανώς πολλά τεχνικά εμπόδια που πρέπει να ξεπεραστούν σε ένα εργαλείο όπως αυτό, και οι λεπτομέρειες αυτού του χαρακτηριστικού θα ήταν προτιμότερο να παραμείνουν στην Τεχνική Επιτροπή Καθοδήγησης, εάν είναι ακόμη δυνατή.

Ανεξάρτητα από τα στοιχεία υλοποίησης της εγκατάστασης, η βασική ευθύνη αυτής της σελίδας παραμένει η ίδια: Να επιτρέπεται η εγκατάσταση των εκδόσεων κόμβων με όσο το δυνατό λιγότερη τριβή για το χρήστη της χρήσης του 90%, παρέχοντας παράλληλα μια θυρίδα διαφυγής για χρήστες ηλεκτρικής ενέργειας που απαιτούν πιο εξειδικευμένη υποστήριξη .

Κοινότητα

Οι σελίδες της κοινότητας, από τον ίδιο τον ορισμό τους, περιέχουν ένα από τα πιο ανθρώπινα περιεχόμενα σε έναν ιστότοπο προγραμματιστών. Εξαιτίας αυτού, είναι αδύνατο να καλυφθούν όλες οι δυνατότητες για περιεχόμενο και παρουσίαση σε αυτό το άρθρο - αξίζουν ένα blog post όλοι τους!

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

Γιατί να προωθήσετε την κοινότητα

Αυτό είναι σωστό, ο τρέχων δικτυακός τόπος Node.js δεν περιέχει ειδική σελίδα κοινότητας! Υπάρχουν κομμάτια που σπρώχνονται γύρω από το σχετικό υλικό, αλλά παρά τις βασικές αξίες των κόμβων που είναι η ένταξη, η υποδοχή και η διασκέδαση, ο ιστότοπος δεν τοποθετεί επί του παρόντος την κοινότητά του και το κέντρο του.

Οι σελίδες κοινότητας σε άλλους ιστότοπους αυτού του χώρου λειτουργούν ως εκδοτήρια στο μεγαλύτερο οικοσύστημα που εμφανίστηκε γύρω από το προϊόν. Ο κόμβος έχει ένα από τα πλουσιότερα οικοσυστήματα εκεί έξω και είναι έγκλημα να μην παρουσιάσουμε τους καταπληκτικούς πόρους που έχει αναπτύξει αυτή η κοινότητα!

Κοινοτική ταξινόμηση

Στις τοποθεσίες που εξετάστηκαν, οι κοινοτικοί πόροι ευθυγραμμίζονται σε αυτές τις οκτώ κατηγορίες:

  1. Comms: Φόρουμ, λίστες αλληλογραφίας και συνομιλίες
  2. Εργασίες: Πόροι ανακαλύψεων εργασίας
  3. Συνέδρια: Conf. Πληροφορίες, παρελθόν και παρόν
  4. Κοινότητα: Ομάδες χρηστών και συναντήσεις
  5. Ειδήσεις: Επίσημες και μη επίσημες εκδόσεις / Podcasts
  6. Εκπαίδευση: Κοινοτικοί Πόροι Μάθησης
  7. Εργαλεία: Βιβλιοθήκες και εργαλεία τρίτων μερών
  8. Συνεργασία: Οδηγίες για τη συμβολή στον κώδικα και τα θέματα αναφοράς

Τα πέντε καλύτερα παραδείγματα που βρήκα σχετικά με το εύρωστο περιεχόμενο σελίδας κοινότητας εμφανίστηκαν στις ακόλουθες σελίδες:

Κοινοτική σελίδα Scala Αντιδράστε την κοινοτική σελίδα Κοινοτική σελίδα σκουριάς Κοινή σελίδα Σελίδα γωνιακών πόρων

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

Κοινοτικό σχέδιο

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

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

Τα κανάλια Commala ScalaΤο Emble's Community Sizzle Reel είναι ένα ζεστό καλωσόρισμαΟ χάρτης έκτακτης ανάγκης

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

Για παράδειγμα:

Κάρτες άρθρου μέσου. Παρατηρήστε το κλείδωμα δημοσίευσης στο κάτω μέρος.

Νέα: Εμφανίζουμε λίστες άρθρων ή δημοσιεύσεων; Μεσαίο έχει αυτό κάτω από μια επιστήμη.

UI του Gitter για τις λίστες του διαλόγου

Comms: Μπορούμε να δούμε πλατφόρμες όπως Gitter ή Slack για το πώς να παρουσιάσει καλύτερα τους καταλόγους chat rooms. Εάν είστε ένας ιδιαίτερα έξυπνος αναγνώστης, θα παρατηρήσετε ότι αυτή η παρουσίαση φαίνεται εξοικειωμένη με το widget του Channel Comms του Scala!

https://www.dotconferences.com/attend

Συνέδρια: Οι μεγάλοι διοργανωτές συνεδρίων όπως οι Dot Conferences έχουν μερικές πολύ ελκυστικές μεθόδους για να προβάλλουν τις επιλογές των συνεδρίων τους.

Οδηγούς συμβολής

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

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

Blog

Υπάρχουν τόσα πολλά άρθρα στο Διαδίκτυο που υποστηρίζουν το πώς ακριβώς το νεκρό - ή νεκρό - blogging έχει γίνει τα τελευταία πέντε χρόνια. Από την άνοδο και την επακόλουθη παγκόσμια εξαγορά των κοινωνικών μέσων ενημέρωσης, τα αποκλειστικά blogs έχουν αρχίσει να παίρνουν ένα πίσω κάθισμα σε καλοσχεδιασμένες στρατηγικές κοινωνικών μέσων. Παρ 'όλα αυτά, πολλές τοποθεσίες τεκμηρίωσης έχουν ακόμα ένα αποκλειστικό ιστολόγιο - γιατί;

Εάν ρωτήσετε και τους δέκα ιστότοπους που εξετάστηκαν σε αυτό το άρθρο, πιθανόν να λάβετε δώδεκα διαφορετικές απαντήσεις. Ωστόσο, αυτός ο συγγραφέας πιστεύει ότι τα blogs τεκμηρίωσης έχουν έναν μοναδικό σκοπό: τις Nitty-gritty σημειώσεις έκδοσης και την αλλαγή των αρχείων καταγραφής. Μετά από όλα, όπως είπε μια διάσημη ...

Κρατήστε το στο σημείο!
- Αυτός ο συντάκτης, Δεκέμβριος 2017

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

Ιστολόγια όπως αυτά των ιστοτόπων React, Go και Scala έχουν ένα αναποτελεσματικό μίγμα κομμάτια χνούδι, σημειώσεις κυκλοφορίας και βιτρίνα χαρακτηριστικών.

Blogs, όπως αυτά που υπάρχουν στις ιστοσελίδες Ember, Ruby και Angular, δημοσιεύουν σχεδόν αποκλειστικά σημειώσεις έκδοσης, αναφορές προόδου χαμηλού επιπέδου χαρακτηριστικών και ενημερώσεις ασφαλείας ή απλώς συνδέονται με μια έκδοση Medium.

Ευτυχώς για εμάς, το blog του Node.js ακολουθεί σε μεγάλο βαθμό το μοντέλο blog-release! Η μόνη μου πρόταση είναι να προσθέσω μια κορυφαία προσφορά για τους χρήστες που αναζητούν το blog της κοινότητας του κόμβου και να μεταναστεύσουν περισσότερα κομμάτια που σχετίζονται με την κοινότητα στα δημοσιευμένα με μεσαία άρθρα άρθρα και να ολοκληρώσουν τη διάσπαση στην ευθύνη.

Υποσέλιδο

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

Αυτές οι σελίδες μπορεί να περιλαμβάνουν, αλλά δεν περιορίζονται σε:

  1. Διακυβέρνηση
  2. Ασφάλεια
  3. Νομικός
  4. Στοιχεία επωνυμίας
  5. Ομάδα
  6. Σύνδεσμος προς το Site Foundation Node

Προχωρώντας μπροστά

Ελπίζω ότι αυτό το άρθρο χρησιμεύει ως σημείο εκκίνησης για συζητήσεις στην κοινότητα Node.js σχετικά με τα επόμενα βήματα. Αυτή η ανταγωνιστική ανάλυση είναι μόνο η αρχή μιας μακράς διαδικασίας σχεδιασμού και είμαι ενθουσιασμένος που συμμετέχω στη συζήτηση!

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

Παρακαλούμε αισθανθείτε 100% ελεύθερο να σχολιάσετε στο κάτω μέρος αυτού του άρθρου με τις αγαπημένες σας εμπειρίες προγραμματιστών από ολόκληρο τον ιστό ή να συμμετάσχετε στις συνεχιζόμενες συζητήσεις που πραγματοποιούνται στο Node.js Github Repo - υπάρχει πολύς δουλειά που πρέπει να γίνει και Ανυπομονώ να σας δω εκεί!