6 WordPress-Plugins für eine erfolgreiche Webseite 2021.

Marc Wag­ner

Juni 9, 2021

12 min read|

Bei der Fül­le an Plug­ins, die es mitt­ler­wei­le für Word­Press gibt, ist es unglaub­lich schwer gewor­den her­aus­zu­fin­den, wel­che man den wirk­lich benö­tigt.

Damit du dei­ne Web­sei­te nicht über­füllst haben wir dir hier die wich­tigs­ten Plug­ins auf­ge­lis­tet, die du in dei­ner Web­sei­te inte­grie­ren soll­test.

  • WP Bakery/Elementor/Fusion Builder/Divi!
    Die­se Page­buil­der hel­fen dir beim ver­wal­ten dei­ner Inhal­te.
  • All-in-One SEO
    Erwei­tert dei­ne Word­Press Web­sei­te um SEO Optio­nen.
  • Borlabs Coo­kie
    Ermög­licht es dir dei­ne Word­Press Web­sei­te Coo­kie-kon­­­form umzu­set­zen.
  • WP Rocket
    Sorgt für schnel­le­re Lade­zei­ten dei­ner Web­sei­te.
  • WebP Express
    Mor­der­ne Bild­for­ma­te auto­ma­tisch zur Ver­fü­gung stel­len.
  • Redi­rec­tion
    Erstellt auto­ma­tisch 301 Wei­ter­lei­tun­gen für Bei­trä­ge und Sei­ten deren Per­ma­links du ver­än­derst.

WP Bakery / Elementor / Avada Builder / Divi #

Ok, wenn man es genau nimmt, sind das ja bereits 4 Plug­ins — aber das hat auch einen ein­fa­chen Grund. Das sind soge­nann­te Page­buil­der. Sie ermög­li­chen es dir mit­tels Drag’n’Drop dei­ne Sei­ten zu bear­bei­ten. Du benö­tigst natür­lich nicht alle vier, son­dern nur eines Davon. In der Regel kom­men die Page­buil­der bereits zusam­men mit dem The­me. Da die­se auf­ein­an­der abge­stimmt sein soll­ten.

Bevor es die Page­buil­der gab muss­ten die gan­zen Designs noch mit­tels ACF (Advan­ced Cus­tom Fields) oder eige­ner Ent­wick­lung ange­passt wer­den. Ver­schie­de­ne Sei­ten wur­den auf­wen­dig über Tem­pla­tes erstellt und für die jewei­li­ge Sei­te akti­viert. Indi­vi­du­el­le Anpas­sun­gen waren damals nur begrenzt mög­lich.

image 10
Frü­her gab es nur einen ein­fa­chen Edi­tor

Für den Lai­en war es daher trotz CMS auf­wen­dig eine Web­sei­te selbst zu pfle­gen. Die Page­buil­der sind im Grun­de nichts ande­res als eine ange­pass­te Ober­flä­che, die das, was du ein­fü­gen möch­test, im Hin­ter­grund in Short­codes umwan­deln.

Ach­tung: Page­buil­der ver­wen­den Java­script, um dir die Funk­tio­nen zur Ver­fü­gung zu stel­len. Java­script wird Cli­ent­sei­tig aus­ge­führt, sprich in dei­nem Brow­ser. Um eine flüs­si­ge Dar­stel­lung zu gewähr­leis­ten, soll­test du daher über aus­rei­chend RAM ver­fü­gen (das dürf­te in der heu­ti­gen Zeit eigent­lich kein Pro­blem mehr dar­stel­len).

image 8
Ava­da Buil­der — Page­buil­der Plug­in für Word­Press

Von der Grund­funk­ti­on sind die Page­buil­der gleich auf­ge­baut, ledig­lich das Aus­se­hen ver­än­dert sich.

image 11
WP Bak­ery Page­buil­der Plug­in für Word­Press

Abhän­gig vom Page­buil­der ste­hen dir bereits eine Aus­wahl an Kom­po­nen­ten zur Ver­fü­gung um dei­ne Sei­te auf­zu­bau­en. Dazu zäh­len Text-Bau­s­tei­­ne, Bil­der, Vide­os, Über­schrif­ten und vie­le mehr. Du kannst also per Klick neue Inhal­te auf dei­ner Sei­te ein­bin­den.

image 9
Ava­da Buil­der — Kom­po­nen­ten

Dar­über hin­aus kannst du Inhal­te auch wie­der­ver­wen­den und auf ande­re Sei­ten kopie­ren. Dadurch musst du nicht jedes Ele­ment neu erschaf­fen.

All in One SEO #

Mit dem Plug­in All in One SEO erwei­terst du dei­ne Web­sei­te um wich­ti­ge SEO Funk­tio­nen. Daher gehört es zu den Top 6 Word­­Press-Plu­g­ins in unse­rer Lis­te. Die wich­tigs­ten Funk­tio­nen ste­hen dir hier­bei bereits in der kos­ten­lo­sen Vari­an­te zur Ver­fü­gung.

image 12
All in One SEO Plug­in für Word­Press

SEO ist unab­ding­bar um lang­fris­tig bei Goog­le und Co. gefun­den zu wer­den. Neben den Inhal­ten dei­ner Sei­te sowie der Key­­­word-Opti­­mie­rung und der Struk­tur musst du auch die Meta-Titel, Meta-Descrip­­ti­on und Sche­mas ange­ben.

Dank All in One SEO ste­hen dir hier­für bei jeder Sei­te und jedem Bei­trag die pas­sen­den Ein­ga­be­fel­der zur Ver­fü­gung.

image 13
All in One SEO — Erwei­te­rung von Word­Press Sei­ten und Bei­trä­gen

Die Ein­ga­be­mas­ke bie­tet dir dar­über hin­aus auch wich­ti­ge Hin­wei­se an, falls dei­ne Titel oder Beschrei­bung zu lang sind. Auch eine Vor­schau wie dein Ein­trag bei Such­ma­schi­nen dar­ge­stellt wird, ist ent­hal­ten.

Neben den Meta­in­for­ma­tio­nen kannst du in der Pre­­mi­um-Ver­­­si­on auch noch Infor­ma­tio­nen für das Sche­ma hin­ter­le­gen.

Die Sche­mas ermög­li­chen es dir, dem Goo­g­­le-Bot wei­te­re Infor­ma­tio­nen über dei­ne Sei­te zu über­mit­teln. Die­se hel­fen dabei, dei­ne Sei­te bes­ser ein­zu­ord­nen. So kannst du zum Bei­spiel Rezep­te als Rezep­te, Tuto­ri­als als Tuto­ri­als und Arti­kel als Arti­kel defi­nie­ren. Auch Anga­ben zu dei­ner Fir­ma sind mög­lich.

Es erhöht also die Wahr­schein­lich­keit das, wenn jemand nach einem Rezept sucht, auch dei­ne Sei­te gelis­tet wird. Goog­le ver­sucht näm­lich immer, dem Suchen­den auch die pas­sen­den Sei­ten zur Ver­fü­gung zu stel­len.

image 14
All in One SEO — Sche­ma Ein­ga­be

Falls du lie­ber bei einer kos­ten­lo­sen Ver­si­on blei­ben möch­test, kannst du auch zum Plug­in Sche­ma & Struc­tu­red Data for WP & AMP grei­fen. Das bie­tet dir eben­falls die Mög­lich­keit die Sche­mas dei­ner Sei­te indi­vi­du­ell anzu­pas­sen.

image 15
Sche­ma & Struc­tu­red Data for WP & AMP

Eben­falls ent­hal­ten ist die Mög­lich­keit, dem Such­­ma­­schi­­nen-Bot mit­zu­tei­len, wie er mit der Sei­te umge­hen soll. Das kannst du ent­we­der glo­bal für alle Sei­ten defi­nie­ren, oder auch hier wie­der indi­vi­du­ell für spe­zi­fi­sche Sei­ten und Bei­trä­ge.

image 16
All in One SEO — Robots Anga­ben

Möch­test du zum Bei­spiel dafür sor­gen, dass dein Impres­sum und dei­ne Daten­schutz­er­klä­rung nicht bei Goog­le erschei­nen, dann kannst du hier ein­fach einen Haken bei No Index set­zen.

Hin­weis: Man­che Bots — gera­de die, die für Spam ver­ant­wort­lich sind, igno­rie­ren die Robots anga­ben. Seriö­se Anbie­ter, wie Goog­le und Bing ver­wen­den die­se jedoch. Möch­test du daher sicher­stel­len, dass eine Sei­te nicht auf­ge­ru­fen wer­den kann, soll­test du die­se mit einem Pass­wort schüt­zen.

Das wich­tigs­te Fea­ture kommt natür­lich zum Schluss, die Site­map. All In One SEO erstellt für dich eben­falls eine Sitemap.xml Datei die du dann bei Goog­le und Co. ein­rei­chen kannst.

Die Site­map dient als Inhalts­ver­zeich­nis für den Such­­ma­­schi­­nen-Bot. Damit kannst du sicher­stel­len, dass auch Sei­ten mög­lichst schnell inde­xiert wer­den. Andern­falls kann es sein, das dei­ne Sei­te erst nach Mona­ten oder Jah­ren bei Goog­le auf­taucht.

Es ist daher rat­sam, bei der Goog­le Search Con­so­le die Site­map ein­zu­tra­gen. Falls du noch gar nicht bei der Goog­le Search Con­so­le ange­mel­det bist, soll­test du das schleu­nigst nach­ho­len.

Borlabs Cookie #

Seit dem 28.05.2020 hat der BGH die Coo­kie Opt-In Pflicht bestä­tigt (Hier geht es zur Pres­se­mit­tei­lung).

Was bedeu­tet das nun für einen Web­sei­ten­be­trei­ber? Ganz ein­fach, bevor Coo­kies gesetzt wer­den dür­fen, muss der Besu­cher dem Zustim­men. Ob das nun für essen­zi­el­le Coo­kies gilt oder nur für Mar­ke­­tin­g­/­­Track­ing-Coo­kies lässt sich schwer ein­schät­zen.

Im Zwei­fel soll­te man alle Coo­kies via Coo­kie Opt-In ange­ben.

Borlabs Coo­kie ist zwar ein Pre­mi­um Plug­in (kos­ten­pflich­tig), dafür lässt sich die­ses nach Belie­ben kon­fi­gu­rie­ren und gestal­ten.

image 17
Borlabs Coo­kie — Dash­board Coo­kie Opt-in

Über das Dash­board lässt sich auch schnell nach­voll­zie­hen wel­che Besu­cher wel­che Coo­kie Grup­pen akzep­tiert haben.

Essen­zi­el­le Coo­kies

Hier­zu zäh­len Coo­kies, die für den Betrieb der Web­sei­te benö­tigt wer­den. Dabei han­delt es sich z.B. um Ses­si­ons, Infor­ma­tio­nen für den Log­in.

Sta­tis­ti­ken

Das sind Coo­kies die das Ver­hal­ten von Besu­chern tra­cken. Hier­zu zäh­len unter ande­rem Goog­le Ana­ly­tics und Mato­mo.

Mar­ke­ting

In die­ser Grup­pe fin­den sich z.B. Coo­kies die via Goog­le Ads (frü­her AdWords) gesetzt wer­den. Also unter ande­rem die, wel­che für das Ein­blen­den von indi­vi­du­el­ler Wer­bung ver­wen­det wer­den.

Vorlagen

Für die gän­gigs­ten Vari­an­ten bie­tet Borlabs Coo­kie zudem Vor­la­gen an.

image 18
Vor­la­gen Borlabs Coo­kie

Nach dem Aus­wäh­len wer­den bereits die wich­tigs­ten Infor­ma­tio­nen. Bei Goog­le Ana­ly­tics bzw. Goog­le Tag Mana­ger muss dann ledig­lich noch der Pro­per­ty ange­ge­ben wer­den.

Exter­ne Medi­en wie iFrames wer­den auto­ma­tisch von Borlabs Coo­kie erkannt und mit einem Opt-in belegt. Und für alle Plug­ins, die noch nicht an Borlabs Coo­kie ange­passt wur­den, gibt es den Script-Blo­­cker. Die­ser ermög­licht es, indi­vi­du­el­le Skrip­te zu suchen und zu blo­ckie­ren. Erst nach dem Opt-in wer­den die­se dann gela­den.

Individuelles Design

Auch die Dar­stel­lung des Coo­kie Opt-ins im Front­end kann an Ihr Unter­neh­men ange­passt wer­den. Über die Ober­flä­che kannst du nach Belie­ben die Far­ben, Tex­te und Ani­ma­tio­nen anpas­sen.

image 19
Borlabs Coo­kie Opt-In Design

Ohne gro­ße Arbeit kannst du die Dar­stel­lung damit an dei­ne Web­sei­te anpas­sen.

image 20
Borlabs Coo­kie — Front­end

Wie finde ich heraus welche Cookies gesetzt werden?

Gute Fra­ge, das lässt sich ganz leicht rea­li­sie­ren. Dein Brow­ser (Chro­me, Fire­fox, Safa­ri) ver­fügt über eine Ent­­wick­­ler-Kon­­­so­­le (Dev­Tools). In Chro­me kannst du die­se bei­spiels­wei­se durch das Betä­ti­gen der F12 Tas­te auf dei­ner Tas­ta­tur öff­nen. Wech­sel also zunächst auf dei­ne Web­sei­te. Sobald die­se fer­tig gela­den hat, kannst du die Kon­so­le öff­nen.

image 22

Das gan­ze sieht dann unge­fähr wie oben aus. Dir ste­hen dann diver­se Rei­ter zur Ver­fü­gung dar­un­ter z.B. Con­so­le, Ele­ments und Appli­ca­ti­on. Für die Coo­kie-Infor­­ma­­tio­­nen müs­sen wir in den Rei­ter Appli­ca­ti­on wech­seln.

image 21
Dev­Tools Chro­me

Auf der Lin­ken Sei­te fin­dest du dann den Rei­ter Coo­kies und dar­un­ter müss­te sich dann dei­ne Domain befin­den. Kli­cke dar­auf.

image 23
Coo­kies

Dort fin­dest du nun alle Coo­kies die durch dei­ne Web­sei­te gesetzt wer­den. All die­se Coo­kies soll­test du nun in dein Opt-in auf­neh­men.

WP Rocket #

Mit­hil­fe von WP Rocket beschleu­nigst du die Lade­zei­ten dei­ner Web­sei­te. Es han­delt sich um ein Pre­mi­um Caching-Plu­g­in. War­um Lade­zei­ten wich­ti­ger sind als zuvor?

Mit­te Juni 2021 wer­den für Goog­le die Core Web Vitals als Ran­king­fak­tor scharf geschal­tet. Die Lade­zeit dei­ner Web­sei­te wirkt sich somit auf dei­ne Plat­zie­rung aus.

Wie dei­ne Sei­te in Bezug auf die Core Web Vitals abschließt, kannst du über den Goog­le Page­Speed Test her­aus­fin­den.

image 24
WP Rocket Caching Plug­in — Dash­board

Bereits mit weni­gen Klicks kannst du hier dei­ne Web­sei­te anpas­sen.

Datei-Optimierung

Zunächst ein­mal soll­test du in der Datei Opti­mie­rung dar­auf ach­ten das die fol­gen­den Check­bo­xen gesetzt wur­den:

  • CSS mini­fi­zie­ren
  • CSS-Dar­s­tel­­lung opti­mie­ren
  • Java­Script mini­fi­zie­ren
  • Java­Script ver­zö­gert laden
  • Java­­Script-Aus­­­füh­rung ver­zö­gern

Falls du noch bei einem Hos­ting bist, das HTTP1.1 ver­wen­det, soll­test du zudem die Check­bo­xen akti­vie­ren:

  • CSS zusam­men­fas­sen
  • Java­Script mini­fi­zie­ren

Her­aus­fin­den wel­che Ver­si­on du ver­wen­dest, kannst du ein­fach über keydcn.

image 25
HTTP/2 Test

Alter­na­tiv kannst du es auch in dei­nem Brow­ser tes­ten. Wech­sel hier­zu ein­fach auf dei­ne Web­sei­te und öff­ne die Ent­wick­lungs­kon­so­le (F12 bei Chro­me).

Sprin­ge zum Rei­ter Netz­werk und lade die Sei­te anschlie­ßend neu.

image 26

In der Spal­te Pro­to­col siehst du nun ob HTTP/1.1 oder h2 ver­wen­det wird. h2 steht hier­bei für HTTP/2.

Falls bei dir noch http1.1 akti­viert ist, soll­test du mit dei­nem Web­hos­ter spre­chen oder ggf. dei­nen Web­hos­ter wech­seln.

Über HTTP/2 kön­nen meh­re­re Daten par­al­lel gela­den wer­den (mul­ti­plex­ing). Bei HTTP/1.1 wird für jede Datei eine TCP Ver­bin­dung benö­tigt.

Du soll­test also unbe­dingt HTTP/2 ver­wen­den. Damit dei­ne Sei­te mög­lichst schnell gela­den wird.

Medien

Als Nächs­tes soll­test du dich um die Medi­en küm­mern. Hier­zu zäh­len Bil­der, Vide­os und iFrames.

Falls du noch kein Lazy­Load ver­wen­dest, soll­test du es hier­über akti­vie­ren. Sicher­heits­hal­ber soll­test du das aber zunächst prü­fen. Falls dein The­me oder ein ande­res Plug­in bereits Lazy­Load akti­viert hat, brauchst du es hier nicht noch­mal zu akti­vie­ren.

Lazy­Load sorgt dafür, das Bil­der ver­zö­gert gela­den wer­den wenn die­se in den sicht­ba­ren Bereich des Brow­sers gelan­gen.

Wich­tig: Lazy­Load wird auf alle Bil­der ange­wen­det, also auch auf dein Logo. Das soll­test du jedoch deak­ti­vie­ren. Das wirkt sich auch auf den FCP Wert dei­ner Core Web Vitals aus.

Ein­zel­ne Bil­der kannst du vom Lazy­Load aus­neh­men, indem du die­se unter Bil­­der- oder iframes-Aus­­­nah­­men hin­zu­fügst.

image 27
WP Rocket Lazy Load

Akti­vie­ren soll­test du bei den Medi­en fol­gen­de Optio­nen:

  • Für Bil­der akti­vie­ren
  • Für iFrames und Vide­os akti­vie­ren
  • You­Tube iFrame durch Vor­schau­bild erset­zen.
  • Feh­len­de Bild­ab­mes­sun­gen hin­zu­fü­gen
  • Word­­Press-Embeds deak­ti­vie­ren
  • WebP-Caching akti­vie­ren

Das sind alles Quick-Wins die du ohne gro­ßen Auf­wand rea­li­sie­ren kannst.

WebP Express #

Kennst du schon das neue Bild For­mat WebP? Nicht? Dann soll­test du jetzt wei­ter­le­sen.

WebP ist ein neu­es Gra­fik­for­mat das es ermög­licht, Bil­der noch klei­ner als bis­her mög­lich zu spei­chern. Gera­de im Web also extrem hilf­reich um schnel­le Lade­zei­ten auch mit gro­ßen Bil­dern zu ermög­li­chen.

Schau mal wie viel du allein durch das Ändern des Gra­fik­for­ma­tes an Spei­cher­platz spa­ren könn­test:

Grafikformat Vergleich
Gra­fik­for­ma­te Ver­gleich

Wenn du nur 10 Bil­der auf dei­ner Sei­te hast kannst du ohne Pro­ble­me 50% der Sei­ten­grö­ße ein­spa­ren.

Das Pro­blem ist jedoch, das noch nicht alle Brow­ser WebP For­ma­te unter­stüt­zen. Daher soll­test du das WebP Express Plug­in ver­wen­den.

Es erstellt auto­ma­tisch Kopien dei­ner Bil­der im WebP For­mat (JPEG und PNG). Beim Öff­nen dei­ner Web­sei­te über­prüft das Plug­in ob der Brow­ser WebP For­ma­te unter­stützt und ent­scheid anhand des­sen, wel­ches Gra­fik­for­mat gela­den wird.

Ein­fa­cher geht es eigent­lich gar nicht mehr. Damit das gan­ze funk­tio­niert muss jedoch dein Web­hos­ter eine Biblio­thek für Bild­be­ar­bei­tung akti­viert haben.

image 29
Biblio­the­ken WebP Express

Denn dein Ser­ver muss die Kon­ver­tie­rung der Bil­der über­neh­men. Hier­für steht dir jedoch auch eine Aus­wahl zur Ver­fü­gung. Ansons­ten am bes­ten ein­mal bei dei­nem Web­hos­ter nach­fra­gen.

Redirection #

Ein klei­nes aber fei­nes Tool das dir viel Arbeit abnimmt. Wir ken­nen es, eine Web­sei­te ist bereits lan­ge Online und du möch­test end­lich mal Auf­räu­men oder aber es ändert sich etwas an der Link­struk­tur.

Wie ärger­lich wäre es, wenn dei­ne gan­zen Links, die Goog­le inde­xiert hat, plötz­lich weg wären? Und das nur, weil du ver­ges­sen hast eine 301 Umlei­tung auf die neue Sei­te ein­zu­rich­ten?

Damit dir das nicht mehr pas­sie­ren kann, ver­wen­dest du in Zukunft am bes­ten Redi­rec­tion. Das Plug­in über­wacht auf Wunsch Ver­än­de­run­gen an den Per­ma­links und erzeugt auto­ma­tisch eine 301 Wei­ter­lei­tung.

image 30
Bei­spiel Redi­rec­tion

Zusätz­lich dazu kannst du auch Wei­ter­lei­tun­gen manu­ell hin­zu­fü­gen. Ganz nütz­lich, wenn du Sei­ten immer mal wie­der tem­po­rär für Aktio­nen akti­vie­ren möch­test.

Und als extra bekommst du ein 404 Log. Hier kannst du jeder­zeit nach­voll­zie­hen wel­cher Auf­ruf einen 404 Feh­ler erzeugt hat.

image 31

Fazit #

So, das waren unse­re Top 6 Word­­Press-Plu­g­ins 2021. Was sind für euch die wich­tigs­ten Plug­ins, die man nicht ver­ges­sen darf?

88e86fcb816eff22bc917094df2862d8dd5c0e978b333e6dd5f36f808990c261 96

Arti­kel von:

Marc Wag­ner

Hal­lo, Marc hier. Ich bin der Grün­der von Forge12 Inter­ac­ti­ve und bereits seit über 20 Jah­ren lei­den­schaft­lich dabei Web­sei­ten, Online­shops, Anwen­dun­gen und SaaS-Lösun­gen für Unter­neh­men zu ent­wi­ckeln. Vor der Grün­dung habe ich bereits in Bör­sen notier­ten Unter­neh­men gear­bei­tet und mir aller­lei Wis­sen ange­eig­net. Die­ses Wis­sen möch­te ich nun an mei­ne Kun­den wei­ter­ge­ben.

Hast du eine Fra­ge? Hin­ter­lass bit­te einen Kom­men­tar