On-Site Search

Avatar of Chris Coyier
Chris Coyier am

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

CSS-Tricks ist eine WordPress-Website. WordPress hat eine integrierte Suchfunktion, aber sie ist nicht besonders nützlich. Ich mache ihr wirklich keinen Vorwurf. Suchen ist ein eigenes Produkt und WordPress ist ein CMS-Unternehmen, keine Suchmaschine.

Wissen Sie, wie man eine wirklich leistungsstarke Suchmaschine für seine Website erstellt?

Hier bitteschön

<form action="https://google.com/search" target="_blank" type="GET">
  
  <input type="search" name="q">
  <input type="submit" value="search">
  
</form>

Nur ein kleiner Trick mit JavaScript, um die zu durchsuchende Website zu erzwingen

var form = document.querySelector("form");

form.addEventListener("submit", function(e) {
  e.preventDefault();
  var search = form.querySelector("input[type=search]");
  search.value = "site:css-tricks.com " + search.value;
  form.submit();
});

Ich mache da nur zu 12 % Witze. Ich denke, es ist absolut akzeptabel, Leute über Google-Suchergebnisse nur für ihre Website nach ihrem Suchbegriff weiterzuleiten. Niemand wird dadurch verwirrt sein. Wenn überhaupt, werden sie heimlich erfreut sein.

Kleine Anpassungen könnten sie zu jeder Suchmaschine weiterleiten. Wie DuckDuckGo

https://duckduckgo.com/?q=site%3Acss-tricks.com+svg

Immer noch

  1. Sie werden Ihre Website verlassen
  2. Sie werden Anzeigen sehen

Um Punkt 1 zu verhindern, bietet Google seit langem ein Site-Search-Produkt an, mit dem Sie eine benutzerdefinierte Suchmaschine erstellen und konfigurieren und diese auf Ihrer eigenen Website einbetten können.

Es gab viele Nachrichten darüber, dass Google diesen Dienst einstellt. Zum Beispiel: „Google Site Search ist auf dem Weg nach draußen. Was nun?“ Oh je! Das war für mich ziemlich verwirrend.

Es stellt sich heraus, dass sie eigentlich das einstellen, was als Google Site Search (GSS) bekannt ist, welches ein Enterprise-Produkt ist. Es wird am 1. April 2018 komplett eingestellt. Google hat *ein weiteres* Produkt namens Google Custom Search Engine (CSE), das *nicht* verschwinden wird.

CSE ist das, was ich sowieso benutzt habe. Es gibt eine kostenlose Edition mit Werbung, und man kann dafür bezahlen, sie zu entfernen, obwohl die Preisgestaltung dafür auch sehr verwirrend ist. Ich kann es buchstäblich nicht verstehen. Für eine Seite wie CSS-Tricks wären es meiner Meinung nach Hunderte oder möglicherweise Tausende pro Jahr. Oder Sie können Ihre eigene AdSense-Anbindung nutzen und zumindest versuchen, mit den angezeigten Anzeigen Geld zu verdienen.

Im Zuge dessen dachte ich, ich würde etwas Neues mit der Suche ausprobieren. Algolia ist ein Suchprodukt, von dem ich gehört habe, dass es einige Leute ausprobiert haben, und es scheint ziemlich beliebt zu sein. Mit etwas Hilfe vom wunderbar entgegenkommenden Algolia-Team haben wir das seit einigen Monaten am Laufen.

Wenn wir eine Skala für die Implementierungsschwierigkeit aufstellen würden, bei der mein HTML/JavaScript-Formular dort oben eine 1 ist und das Aufsetzen eines eigenen Servers und das Einspeisen von Solr mit einer benutzerdefinierten Datenstruktur und der Entwicklung eigener Bewertungsalgorithmen eine 10 ist, dann ist Algolia wie eine 7. Es ist ziemlich starker Nerd-Kram.

Mit Alogolia müssen Sie alle Ihre eigenen Daten und Strukturen mitbringen und zu Algolia übertragen, da die gesamte Suchmagie auf deren Servern stattfindet. Neue/geänderte/gelöschte Daten müssen ebenfalls dorthin übertragen werden. Es ist nicht Ihre Datenbank, aber generell muss jede Datenbank-CRUD, die Sie durchführen, auch an Algolia gehen.

Auf derselben Schwierigkeitsskala, wenn Sie Algolia zu einer WordPress-Website hinzufügen, sinkt dies auf eine 3 oder 4. WordPress hat bereits seine eigene Datenstruktur und Algolia hat ein WordPress-Plugin, um alles zu ihnen zu pushen und synchron zu halten. Es ist keine Nullarbeit, aber auch nicht zu schlimm. Das Plugin bietet auch einen UI/UX-Ersatz für das Standard-WordPress-Suchformular, das „sofortige Ergebnisse“ als Dropdown anbietet. Es ist wirklich erstaunlich schnell. Wenn Sie das Formular trotzdem absenden, werden Sie zu einem Vollseiten-Suchergebnisbildschirm weitergeleitet, der ebenfalls von Algolia übernommen wird.

Zur Offenlegung: Ich bin zahlender Kunde von Algolia und es gibt keine Sponsoring-Vereinbarung.

Es ist ein verdammt gutes Produkt. Zum Vergleich: Ich habe exakt null Feedback zu der Umstellung erhalten. Niemand hat sich gemeldet, um mir zu sagen, dass er die Änderung bei der Suche bemerkt hat und nun Dinge nicht mehr so leicht findet. Und Leute schreiben mir ständig solche Sachen, daher fühlt sich kein Piepsen wie ein Gewinn an.

Ich zahle 59 US-Dollar pro Monat für superschnelle On-Page-Suche ohne Werbung.

Es ist fast ein klarer Gewinn, aber es gibt ein paar Nachteile. Einer davon ist die Rangfolge der Suchergebnisse. Sie ist standardmäßig ziemlich beeindruckend und liefert relevantere Ergebnisse als die native WordPress-Suche. Aber, keine Überraschung, sie ist kein Google. Welche interne Magie auch immer stattfindet, sie gibt ihr Bestes, aber sie hat einfach nicht die Daten, die Google hat. Alles, was sie hat, sind ein Haufen Text und vielleicht einige interne Verlinkungsdaten.

Es gibt Wege, es besser zu machen. Sie können zum Beispiel Ihre Google Analytics-Daten mit Algolia verknüpfen und es im Wesentlichen mit Popularitätsdaten füttern, damit die Algolia-Ergebnisse eher Google-Ergebnissen ähneln. Das ist nicht ganz einfach einzurichten, aber wahrscheinlich lohnenswert!

Jedenfalls!

Was benutzt ihr für die Suche auf euren Websites?