Ευχαριστώ (Έκδοση 2022)

Ξέρετε, αυτή είναι η εποχή του χρόνου όπου ο Chris δημοσιεύει κανονικά έναν μεγάλο προβληματισμό για την περασμένη χρονιά. ο πρώτη δημοσιεύτηκε το 2007, την ίδια χρονιά που ξεκίνησε το CSS-Tricks, και αυτό συνεχίστηκε μέχρι το 2021 χωρίς να χάσει ούτε ένα ρυθμό. Έχοντας ο ίδιος αναγνώστης των CSS-Tricks όλα αυτά τα χρόνια, δεν θα ήθελα να δω αυτή την αλλαγή.

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

Ευχαριστώ!

Αυτή είναι η τελευταία ανάρτηση που δημοσιεύουμε φέτος καθώς κρεμάμε την ταμπέλα Gone Fishin' για τις γιορτές. Θα επιστρέψουμε Ιανουάριος 9 με μια σειρά από περιεχόμενο που είναι φρέσκο ​​από το φούρνο.

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

Συνολική κίνηση

Συνολικά, το Google Analytics εμφανίζει ένα σύνολο 64m προβολές σελίδας για ολόκληρο το έτος. Αυτό είναι wayyyyy κάτω από τα 88 εκ. του περασμένου έτους, κάτι που είναι ανησυχητικό με την πρώτη ματιά. Δηλαδή, ποιος θέλει να δει α 27% μείωση της κίνησης από έτος σε έτος;

Αλλά υπάρχει καλός λόγος για αυτό επειδή δημοσιεύσαμε ένα wayyyy λιγότερο περιεχόμενο φέτος. Όλοι γνωρίζουμε ότι ο Chris ήταν ένας παραγωγικός συγγραφέας (και ΑΚΟΜΑ ΕΙΝΑΙ, φυσικά), συχνά βγάζοντας πολλές αναρτήσεις την ημέρα. Είναι σαν να χάσαμε τον πιο παραγωγικό μας συνεργάτη για το μεγαλύτερο μέρος της χρονιάς. Ας συγκρίνουμε την εκδοτική δραστηριότητα τα τελευταία χρόνια:

• 2020: 1,183 άρθρα
• 2021: 890 άρθρα
• 2022: 390 άρθρα

Μια πτώση 27% στις προβολές σελίδων είναι πολύ λιγότερο σχετικά με τη δημοσίευσή μας 43% λιγότερα άρθρα από πέρυσι, και εντυπωσιακά 67% λιγότερο από το συνολικό σύνολο του 2020.

Χμ, δεν νιώθω ότι δουλεύω 67% λιγότερο…

Και όλα αυτά συνοδεύονται από την προειδοποίηση ότι αυτό ακριβώς λαμβάνουμε από το Google Analytics. Τα προηγούμενα χρόνια, ο Chris έχει συγκρίνει αυτούς τους αριθμούς με στατιστικά από Cloudflare (το επίπεδο CDN που βρίσκεται στην κορυφή του ιστότοπου) και jetpack (το πρόσθετο που συνδέει τον αυτο-φιλοξενούμενο ιστότοπο WordPress μας με τις δυνατότητες SaaS-y του WordPress.com). Τα αποτελέσματα είναι πάντα σταθερά ασυνεπή σε βαθμό που δεν μπαίνω καν στον κόπο να κοιτάξω αυτή τη φορά. (Εντάξει, εντάξει ίσως μόνο το Jetpack… που δείχνει 59.9 εκατομμύρια προβολές σελίδας — περιέργως περισσότερες από το σύνολο των 2021 μέτρων του 55.)

Άρθρα, με αριθμούς

Αυτό περιμένω πάντα με ανυπομονησία κάθε χρόνο! Εδώ είναι τα δέκα κορυφαία άρθρα για το 2022 δημοσιεύθηκαν το 2022:

1. 6 δημιουργικές ιδέες για εφέ Hover Link CSS — Χάρσιλ Πατέλ
2. Εξηγήστε μου τις 10 πρώτες γραμμές του πηγαίου κώδικα του Twitter — Anand Chowdary
3. Ποια ήταν τα πιο καυτά εργαλεία front-end το 2021; — Λούης Λάζαρης
4. Αντικαταστήστε τους διαλόγους JavaScript με το νέο στοιχείο διαλόγου HTML — Mads Stoumann
5. Πείτε Γεια στο επιλεγμένο μενού, ένα στοιχείο επιλογής με δυνατότητα Πλήρους στυλ — Patrick Brosset
6. Στείλτε αξιόπιστα ένα αίτημα HTTP καθώς ο χρήστης φεύγει από μια σελίδα — Άλεξ Μακάρθουρ
7. grid-template-columns — Mojtaba Seyedi
8. Ένας πλήρης οδηγός για CSS Cascade Layers — Μίριαμ Σούζαν
9. Ερωτήματα για τη βάση δεδομένων CSS; Σίγουρα μπορούμε! — Κρις Κογιέρ
10. Το CSS-Tricks εντάσσεται στο DigitalOcean! — Κρις Κογιέρ

Πραγματικά εκπλήσσομαι που το τελευταίο δεν ήταν ψηλότερα στη λίστα. Και είμαι πραγματικά ενθουσιασμένος που βλέπω ένα από το Alamanac εκεί μέσα, ειδικά επειδή ο Mojtaba έφυγε στο όλες τις ιδιότητες CSS Grid τον τελευταίο ενάμιση χρόνο και το χτύπησε έξω από το γήπεδο. Νόμιζα ότι είχα μια καλή λαβή στο πλέγμα μέχρι που άρχισα να διαβάζω όλα τα ψήγματα χρυσού που έβαζε σε κάθε ιδιοκτησία. Υπάρχουν τόσα πολλά να μάθεις εκεί μέσα και ο Mojtaba έχει την ικανότητα να εξηγεί ξεκάθαρα περίπλοκα πράγματα. Ελπίζω να ενημερώσω το Οδηγός πλέγματος CSS με όλες αυτές τις φρέσκες πληροφορίες (αλλά περισσότερα για αυτό σε λίγο).

Μου αρέσει να βλέπω και τον οδηγό CSS Cascade Layers εκεί! Διασκέδασα τόσο πολύ που δουλεύω με τη Miriam σε αυτό. Αν δεν το ήξερες, είναι συντάκτρια για τις προδιαγραφές. Είναι απόλαυση (και τιμή, πραγματικά) να φιλοξενεί το έργο της εδώ και να το κάνει διαθέσιμο για όλους μας για σελιδοδείκτη και αναφορά.

Εδώ είναι 11-20 για λακτίσματα:

11. Κινούμενα σχέδια με βασική JavaScript — Md Shuvo
12. Flutter για προγραμματιστές Web Front-End —Obumuneme Nwabude
13. Πλέγμα CSS και προσαρμοσμένα σχήματα, Μέρος 1 — Τεμάνι Αφίφ
14. Γράψτε HTML, τον τρόπο HTML (όχι τον τρόπο XHTML) — Γενς Όλιβερ Μάιερτ
15. Μια περιήγηση Whistle-Stop με 4 νέες λειτουργίες χρώματος CSS — Κρις Κογιέρ
16. Δροσερά εφέ Hover που χρησιμοποιούν ιδιότητες φόντου — Τεμάνι Αφίφ
17. Ας δημιουργήσουμε μια μικροσκοπική γλώσσα προγραμματισμού — Md Shuvo
18. Cool CSS Hover Effects που χρησιμοποιούν αποκοπή φόντου, μάσκες και 3D — Τεμάνι Αφίφ
19. Ένας τέλειος πίνακας περιεχομένων με HTML + CSS — Νικόλαος Χ. Ζάκας
20. Δακτυλικά αποτυπώματα με βάση το CSS — Κρις Κογιέρ

Όλες οι αναρτήσεις που δημοσιεύτηκαν το 2022 αποτελούν 4.8m προβολές σελίδας ή περίπου 7.8% όλων των προβολών σελίδας. Το άρθρο μας με τις περισσότερες προβολές είναι πάντα το ol' Οδηγός Flexbox που συγκέντρωσε 5.8m προβολές φέτος. Θα ήθελα πολύ να δω το νέο μας περιεχόμενο να ξεπερνά αυτό το ένα στοιχείο και πιστεύω ότι αυτό θα συνέβαινε εύκολα αν είχαμε διατηρήσει τον ρυθμό της δημοσίευσης. Εδώ είναι τα μαθηματικά της χαρτοπετσέτας, αλλά μπορεί να είχαμε περίπου 67 εκατομμύρια προβολές σελίδων αν είχαμε δημοσιεύσει 540 περισσότερα άρθρα που ταιριάζουν με τον περσινό αριθμό δημοσιευμένων άρθρων.

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

1. Ένας πλήρης οδηγός για το Flexbox
2. Ένας πλήρης οδηγός για το πλέγμα
3. Τέλεια εικόνα φόντου πλήρους σελίδας
4. Τα σχήματα του CSS
5. Ερωτήματα πολυμέσων για τυπικές συσκευές
6. Χρήση SVG
7. Πώς να κλιμακώσετε το SVG
8. Τρίγωνο CSS
9. Περιγράμματα διαβάθμισης στο CSS
10. Περικοπή χορδής με Ellipsis
11. Πώς να το χρησιμοποιήσετε: @font-face σε CSS

Ναι, σχεδόν το ίδιο με πέρυσι. Και τον προηγούμενο χρόνο. Και τον προηγούμενο χρόνο. Και… καλά, σχεδόν. Το "Gradient Borders in CSS" είναι νέο, προσκρούοντας box-shadow ακίνητο εκτός λίστας. Όλα τα άλλα από τα τέσσερα σημεία απλώς άλλαξαν θέσεις.

Μιλώντας για τα ακίνητα στο Αλμανάκ, θέλω να δω τι αναφέρατε περισσότερο τον περασμένο χρόνο:

1. ::after / ::before
2. transition
3. box-shadow
4. scrollbar
5. justify-content
6. flex-wrap
7. gap
8. overflow-wrap
9. animation
10. white-space

Ένα ψευδο στην κορυφή και τίποτα άλλο από ιδιότητες μετά από αυτό. Ενδιαφέρον, δεδομένου ότι ο σχεσιακός ψευδοεπιλογέας λειτουργεί όπως :has(), :is(), να :where() είναι νέα παιδιά στο μπλοκ.

Newsletter

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

Τα καλά νέα? Ακόμα κάνουμε το newsletter! Εμείς στην πραγματικότητα το επανέλαβε τον Αύγουστο μετά από παύση πέντε μηνών. Ήμασταν σε εβδομαδιαίο ρυθμό, αλλά τώρα το μήνα, ενώ ο δικός σας πραγματικά το συντάσσει. Ελπίζω σίγουρα να το επαναφέρω σε εβδομαδιαία δημοσίευση. (Μου λείπεις, Robin!)

Ενημερώσεις ιστότοπου

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

Αυτό θα αλλάξει πολύ το 2023. Εάν συμβαδίζετε με το μηνιαίο μας Πίσω από τις σκηνές CSS ενημερώσεις, τότε ξέρετε ότι σκοπεύουμε να μετεγκαταστήσουμε τα CSS-Tricks από το WordPress στο ίδιο οικιακό CMS που χρησιμοποιεί η DigitalOcean για όλα της (αστρικά) περιεχόμενο της κοινότητας.

Αυτό το έργο ξεκίνησε πριν από μερικούς μήνες και θα πρέπει να ολοκληρωθεί εντός του πρώτου εξαμήνου του έτους. Μπορείτε να στοιχηματίσετε ότι θα σας κρατάμε ενήμερους στην πορεία. Εκτός από α φρέσκο ​​σχεδιασμό και ένα νέο back-end, θα πρέπει να είναι business as usual. Εάν έχετε οποιεσδήποτε ερωτήσεις σχετικά με αυτό το έργο και τι σημαίνει για την αγαπημένη σας δημοσίευση στο front-end, ενημερώστε με στα σχόλια or πυροβολήστε μου ένα email.

Αν δεν το έχετε δει ακόμα, εδώ είναι μερικές κομψές που ο σχεδιαστής μας, Logan Liffick, συγκέντρωσε:

Ανασκόπηση στόχων 2021

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

• ✅ Περισσότερη εστίαση στο SEO. Εδώ θα μας δώσω μια επιτυχία. Η αλήθεια είναι ότι ο Chris και εγώ ήδη σκάβαμε τα τακούνια μας σε αυτό πριν από την απόκτηση. Αντικαταστήσαμε το πρόσθετο Yoast SEO με το RankMath, εκμεταλλευόμενοι τα εργαλεία του in-editor για να μας βοηθήσουν να μάθουμε πώς να βελτιστοποιούμε τις αναρτήσεις μας για αποτελέσματα αναζήτησης. Και για να είμαστε ξεκάθαροι: το θέμα είναι λιγότερο να αυξήσετε την επισκεψιμότητα για περισσότερα έσοδα από χορηγίες παρά να αναγνωρίσετε ότι η αναζήτηση είναι ο κύριος τρόπος με τον οποίο μας βρίσκουν οι αναγνώστες όπως εσείς και σας διευκολύνει να βρείτε αυτό που ψάχνετε. Αυτό ισχύει ιδιαίτερα τώρα που υποστηρίζουμε την DigitalOcean και βασιζόμαστε σε χορηγίες πολύ λιγότερο από ό,τι στο παρελθόν.
• 🚫 Άλλο ένα ψηφιακό βιβλίο. Κούνια και δεσποινίς! Λοιπόν, στην πραγματικότητα ποτέ δεν ταλαντευτήκαμε από την πρώτη θέση, ούτε μπήκαμε στο κουτί του κουρκού για αυτό το θέμα. (Έτσι λειτουργούν οι αθλητικές αναλογίες;) Ο Κρις δημοσίευσε ένα βιβλίο με Τα καλύτερα κόλπα CSS το 2020 και το έκανε προνόμιο του να είσαι συνδρομητής επί πληρωμή CSS-Tricks. Η ιδέα ήταν να κάνουμε άλλη μια φέτος, αλλά ξεφορτωθήκαμε τις συνδρομές επί πληρωμή και ανοίξαμε το The Greatest CSS Tricks για να το απολαύσουν όλοι, δωρεάν.
• 🚫 Περισσότεροι πειραματισμοί στα social media. Οχι! Αλλά αυτό μπορεί να είναι για το καλύτερο, λαμβάνοντας υπόψη τη σωστή θέση του Twitter αυτό το δευτερόλεπτο. Ίσως αναγκαστούμε να πειραματιστούμε σε αυτόν τον τομέα τον επόμενο χρόνο περισσότερο από ανάγκη παρά από ενδιαφέρον. Το Twitter ήταν πάντα μια στάλα στον παροιμιώδη κουβά της κυκλοφορίας CSS-Tricks. τόσο πολύ που η επένδυση σε αυτό μοιάζει σαν να βάζουμε τα αυγά μας σε λάθος καλάθι, ρε κουβά. Δεν ξέρω. Ένα μέρος του εαυτού μου θέλει απλώς να καθίσει στα χέρια μου και να δει πώς θα κλονιστούν τα πράγματα πριν αποφασίσει για οτιδήποτε νέο ή διαφορετικό.

2023 καθορισμός στόχων

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

• Ομαλή μετεγκατάσταση ιστότοπου. Τίποτα δεν θα με έκανε πιο ευτυχισμένη¹ παρά μια κίνηση χωρίς λόξυγγα στην αρχιτεκτονική του DigitalOcean. Αλλά έλα, όλοι ξέρουμε κάτι εμφανίζεται πάντα όταν είναι ώρα. Αυτός ο ιστότοπος έχει 7,000+ άρθρα που έχουν γραφτεί για 15 χρόνια και έχουν υπάρξει 19 εκδόσεις του ιστότοπου σε αυτό το χρονικό διάστημα. Υπάρχουν τόσοι πολλοί προσαρμοσμένοι τύποι αναρτήσεων, προσαρμοσμένα πεδία, πρότυπα σελίδων, προσθήκες λειτουργικότητας, ενσωματώσεις και μια βάση δεδομένων που ξεπερνά τα 6 GB για μετακίνηση και αντιστοίχιση σε ένα υπάρχον σύστημα. Ευτυχώς που έχουμε μια ομάδα κορυφαίων προγραμματιστών εδώ για να το αναλάβει!
• Δημοσιεύστε 1-2 νέους οδηγούς. Θα ήθελα να στοχεύσω ψηλότερα, στην πραγματικότητα. Πήγαμε από εννέα νέους οδηγούς το 2020 σε έναν ασήμαντο έναν νέο οδηγό το 2021 και έναν άλλο αυτόν τον περασμένο χρόνο: ο Miriam's Πλήρης οδηγός για CSS Cascade Layers. Έχω μια λίστα με άλλα 10 που θα ήθελα να γράψω, αλλά νομίζω ότι θα βάλουμε τον πήχη πολύ χαμηλά δεδομένου του πρόσφατου ιστορικού μας. Ανέφερα νωρίτερα ότι θα ήθελα πολύ να ενσωματώσω το έργο του Mojtaba στο Almanac στον υπάρχοντα οδηγό CSS Grid. Δεν είναι μικρή δουλειά και θα τη μετρούσα προς τον στόχο, αν μπορέσουμε να το πετύχουμε.
• Αναπτύξτε το Αλμανάκ. Αυτό είναι το φεγγαρόφωτο μου. Θα ήθελα να δω περισσότερους τύπους τεκμηρίωσης εκεί. Έχουμε ψευδο-επιλογείς και ιδιότητες, κάτι που είναι υπέροχο και ήταν πάντα. Αλλά, γαμώτο, σκεφτείτε όλα τα άλλα πράγματα που θα μπορούσαμε να έχουμε εκεί μέσα: συναρτήσεις, κανόνες, μονάδες, επιλογείς, τιμές ιδιοτήτων κ.λπ. Ξύνουμε μόνο την επιφάνεια του τι θα μπορούσε ενδεχομένως να πάει εκεί! Αν είχαμε έστω και ένα από αυτά, θα ήμουν μέσα place-self: heaven.

Ευχαριστώ, λοιπόν, so πολύ!

Αυτή είναι η δουλειά των ονείρων μου και δεν θα την είχα χωρίς αναγνώστες σαν εσάς. Δεν μπορώ να πιστέψω ότι έχουν περάσει οκτώ χρόνια από τη δημοσίευση του πρώτου μου άρθρου και ότι είμαι ακόμα εδώ, δουλεύοντας με μαθαίνοντας από τα πιο έξυπνα μυαλά στον τομέα μας. Θα μπορούσα να αναρωτηθώ (περισσότερα από όσα έχω ήδη) για το πόσο σημαίνει για μένα η κοινότητα CSS-Tricks, αλλά αυτό που πραγματικά καταλήγει είναι… ευχαριστώ, ευχαριστώ, ευχαριστώ. Από τα βάθη της καρδιάς μου, ευχαριστώ.

Και ευχαριστώ όλους τους εξαιρετικούς ανθρώπους εδώ στο DigitalOcean που έχουν δημιουργήσει ένα υπέροχο σπίτι για τα CSS-Tricks. Extra special high-fives στους Haley Mills, Sydney Rossman Reich, Bradley Kouchi, Karen Digi, David Berg, Matt Crowley, Logan Liffick και Kirstyn Kellogg που με ενημέρωσαν προσωπικά και με έκαναν να νιώθω τόσο ευπρόσδεκτος εδώ. Είναι ένα υπέροχο μέρος για να είσαι.

Εμπρός, πάμε!