The Tenth Fourth

Avatar of Chris Coyier
Chris Coyier am

DigitalOcean bietet Cloud-Produkte für jede Phase Ihrer Reise. Starten Sie mit 200 $ kostenlosem Guthaben!

Wir haben ein Jahrzehnt geschafft! Es ist unser zehnter Geburtstag! 🎉 Dies ist ein ganz besonderer, da wir zweistellige Zahlen erreichen. Jedes Jahr am 4. Juli markieren wir diesen Anlass mit einem Beitrag. In dieser Tradition möchte ich ein wenig über Vergangenheit und Gegenwart plaudern.


Der allererste Beitrag auf dieser Seite war buchstäblich ein CSS-Trick. Es ist auch ein Klassiker. „Header Text Image Replacement“

.headerReplacement {
   text-indent: -9999px;
   width: 600px;
   height: 100px;
   background: url(/path/to/your/image.jpg) #cccccc no-repeat;  
}

Lustig, ich habe diesen Trick erst vor ein paar Tagen benutzt.

Der Beitrag ist aus verschiedenen Gründen interessant für mich. Erstens, ich habe diese Technik keineswegs erfunden. Damals habe ich selbst gerade CSS gelernt und interessante Dinge aufgeschrieben, die mir begegnet und die ich in meiner eigenen Arbeit verwendet habe. Ich glaube, ich habe sie dadurch ein wenig tiefer verstanden, indem ich sie als Erklärung aufgeschrieben habe.

Zum anderen war ich zu dieser Zeit völlig unwissend darüber, wo ein solcher Trick in die CSS-Geschichte und größere Diskussionen über CSS, Semantik, Zugänglichkeit und all das passte. Ein Jahr später begann ich, mich für solche Dinge zu interessieren und tat Dinge wie viele mögliche Techniken für den Bildaustausch zusammenzufassen. Schließlich habe ich sogar ein „Museum“ dafür erstellt.


Bevor ich hier zu sehr ins Detail gehe, muss ich erwähnen, dass wir den Shop anlässlich dieses Jubiläums wiedereröffnet haben. Wir haben einige nerdige Web-bezogene T-Shirts hergestellt und würden uns freuen, wenn Sie eines kaufen würden, um die Seite zu unterstützen.


CSS-Tricks war damals eine WordPress-Seite, die auf PHP und MySQL lief. Heute ist es… eine WordPress-Seite, die auf PHP und MySQL läuft. Obwohl WordPress damals 2.0.1 und jetzt 4.8 war. PHP war damals 5.2 und jetzt 7.1. MySQL damals 5.0 und jetzt 5.7. All diese Versionssprünge scheinen für einen Zeitraum von 10 Jahren ziemlich klein zu sein, aber wirklich sind es ziemlich bedeutende technologische Fortschritte.


Damals haben wir Websites mit HTML, CSS und JavaScript erstellt. Heutzutage sind Websites… HTML, CSS und JavaScript.


Ich versuche, eine Design-Geschichte so gut wie möglich zu führen. Machen wir einen kleinen Rückblick auf Header-Stile.


Dies ist nicht zu unterschätzen: Es erfordert harte Arbeit, eine Website am Laufen zu halten. Es gibt immer etwas zu tun.

  • Es gibt immer eine Software, die aktualisiert werden muss.
  • Es gibt immer einen seltsamen Fehler, der Aufmerksamkeit erfordert.
  • Es gibt immer eine Geschäftsmöglichkeit, die ins Rollen gebracht werden muss.
  • Es gibt immer einen Teil des Designs, der wirklich überarbeitet werden muss.
  • Es gibt immer ein SSL-Zertifikat, um das man sich Sorgen machen muss.
  • Es gibt immer etwas Server- oder DevOps-mäßiges, über das man nachdenken muss.

Ich habe einen ganzen Abschnitt meiner TODOs namens „Site Work“, der voller Dinge ist, die ich hier erledigen muss. Zum Beispiel weiß ich gerade in diesem Moment, dass einige Assets auf eine Weise geladen werden, wie ich es nicht möchte, und ich muss es aus Performance-Gründen überprüfen. Ich würde gerne ein paar Dinge mit eingebetteten Pens machen, um sie standardmäßig etwas breiter zu machen, aber ich muss vorsichtig sein, kein Layout zu zerstören. Ich weiß, dass Markdown in den Foren zum 692. Mal seltsam funktioniert und dass ein privates Forum öffentlich an einer Stelle angezeigt wird, wo ich es nicht möchte. Das ist wie 5% der Liste!

Ich erschaudere bei dem Gedanken, was passieren würde, wenn all diese Arbeit nicht ständig geleistet würde. Die Seite würde auseinanderfallen.

Und das schließt nicht das ein, was Sie vielleicht tatsächlich für die harte Arbeit halten, die mit dem Betreiben einer Website verbunden ist.

  • Neue Inhalte schreiben
  • Eingereichte Inhalte bearbeiten
  • Alte Inhalte aktualisieren
  • Verwaltung des Veröffentlichungsplans und Planung zukünftiger Inhalte
  • Community-Management
  • Bewerbung und Marketing der Seite
  • Sponsoren finden
  • Sicherstellen, dass Sponsoren zufrieden sind
  • Soziale Medien

Wenn Sie all diese Arbeit leisten, auf beiden Listen, ist die Hoffnung, dass Sie einfach weitermachen. Jeder wird für seine Bemühungen bezahlt. Dies ist keine Seite mit Hockey-Stick-Wachstum. Es ist eine bescheidene Publikation.


Apropos langsames Wachstum, das ist die Sache.

Das ist kein repräsentatives Ergebnis davon, einfach jedes Jahr das Gleiche zu tun. Das ist repräsentativ dafür, dass immer mehr Leute an der Seite arbeiten und immer mehr Geld wieder in die Seite investiert wird.

Ein interessanter Aspekt dabei ist, wie der Großteil des Traffics durch Suche generiert wird. Natürlich habe ich damit kein Problem. Ich bin sehr glücklich, dass diese Seite in den Suchergebnissen erscheint und auf diese Weise nützlich für die Leute sein kann. Gleichzeitig ist eine aktive Leserschaft sehr wertvoll. Nicht nur Leute, die über die Suche kommen, sondern Leute, die die Seite regelmäßig lesen, so wie sie die Nachrichten lesen. Da gibt es definitiv ein Gleichgewicht. Deshalb investieren wir in Dinge wie den Newsletter, um sicherzustellen, dass wir Wege haben, CSS-Tricks zu lesen, die zu Ihnen kommen und Ihre Zeit wert sind.


Persönlich lebe ich immer noch in Milwaukee, zurück hier nach einem 7-monatigen Aufenthalt in Miami. Meine Verlobte Miranda bekam dort eine Stelle an der FIU und wir nutzten die Gelegenheit, nach unten zu ziehen, den Wisconsin-Winter zu überspringen und nah bei unseren Freunden in Florida zu sein. Ich poste nicht viel öffentlich über persönliches Zeug, aber dies wird ein riesiges Jahr für mich sein. Der Umzug nach Miami und zurück war groß! Miranda und ich heiraten diesen Sommer! Wir erwarten auch im Herbst ein Baby! Und wir planen auch, Ende des Sommers nach Oregon zu ziehen! Verrückte Zeiten. Es kann fast nicht mehr passieren, besonders wenn man all diese Sachen mit dem Betreiben mehrerer Unternehmen und einen ziemlich aggressiven Vortragskalender in diesem Jahr berücksichtigt.


Mein Hauptaugenmerk liegt auf CodePen, das ein fantastisches letztes Jahr hatte. Nachdem wir Finanzierung erhalten, ein großartiges Team eingestellt und viele große Dinge veröffentlicht haben, sind wir an dem wunderbaren Punkt angelangt, den sich alle Unternehmen wünschen: Profitabilität. Die Roadmap an Ideen auf CodePen ist absolut endlos. Ich habe noch nie so stark das Gefühl gehabt, dass noch mehr Arbeit vor uns liegt, wie jetzt.


Ich möchte allen Sponsoren, die die Seite ermöglichen, besonders danken. Ich kann nicht jedem einzelnen danken, aber ich möchte Media Temple besonders hervorheben, die seit langem Sponsor und Unterstützer von CSS-Tricks sind.


Und natürlich herzlichen Dank an all Sie Leser, ohne die es keinen Grund gäbe, überhaupt eine Seite zu haben. Der Diskurs, der hier stattfindet, ist erstklassig und ich könnte nicht glücklicher sein, ihn zu ermöglichen. Und zuletzt, wie Sie wahrscheinlich wissen, ist diese Seite von Front-End-Entwicklern für Front-End-Entwickler, also wenn Sie etwas zu sagen haben, können Sie sich gerne melden.


Siehe den Pen Conways Fireworks von Ben Matthews (@tsuhre) auf CodePen.