Einen Reiseshop von travianet einzurichten, ist einfach. Sie können entweder eine fertige Vorlage verwenden oder den Shopbaukasten. Im Shopbaukasten können Sie nicht nur ganz einfach Ihr eigenes Logo einbinden, sondern auch diverse Farbanpassungen vornehmen. Dazu können Sie im Feld style aus Vorgaben wählen. Ist ihre gewünschte Farbe nicht dabei, dann müssen Sie das CSS verändern. Wie Sie das auch ganz ohne CSS-Kenntnisse machen, erklären wir Ihnen hier.

Herzlichen Glückwunsch, Sie haben einen eigenen Reiseshop von travianet. Sie haben sich schon für eine Buchungsstrecke entschieden, die Ausrichtung des Menüs steht und auch Ihr eigenes Logo leuchtet schon im Header. Aber so ganz zufrieden sind Sie nicht. Die Farbgestaltung sagt Ihnen nicht zu.

Kein Problem, das lässt sich ganz leicht ändern. Im Feld Style haben Sie mehrere Farben zur Auswahl, mit denen Sie das Menü (Navigation) unter dem Logo anpassen können. Aber auch hier ist nichts dabei, was ihren Vorstellungen nahe kommt. Gut, dann müssen wir das CSS verändern.

Wenn Sie das CSS Ihres Reiseshops anpassen wollen, dann wechseln Sie vom Reiter Grundeinstellungen zum nebenstehenden Reiter CSS Verwaltung. Dort klicken Sie auf CSS hinzufügen. Nun sehen Sie ein leeres Formular. Diesem geben Sie zunächst einen Titel, zum Beispiel „Farben“.

So ändern Sie im Reiseshop die Farbe des Menüs

Nun geht es an den CSS-Code. Um den Hintergrund Ihrer Navigation zu ändern, schreiben Sie in das Feld CSS:

#navigation #main-navi {
background: #2e3192;}

Mit #navigation #main-navi bestimmen Sie, wo Sie etwas verändern wollen. In diesem Fall also die Navigation des Hauptmenüs. Innerhalb der geschweiften Klammern steht dann, was Sie verändern wollen, also den Hintergrund (background). Dazu müssen Sie jedoch nun den Hexadezimalwert Ihrer gewünschten Farbe eingeben.

Was sind Hexadezimalfarben?

Ohje, werden Sie jetzt vielleicht denken. Was ist das? Hexadezimalfarben werden für computergestütztes Design verwendet. Sie werden auch gerne HTML-Farben genannt. Zwar sind CSS und HTML unterschiedliche Sprachen, Sie haben jedoch viele Gemeinsamkeiten. Zum Beispiel bei den Farben. Kennzeichen dieser Farbwerte ist der #(Hashtag) vor einer sechsstelligen Kombination aus Zahlen und Buchstaben. Und woher wissen Sie nun, welchen Wert Ihre Farbe hat? Dazu gibt es im Internet verschiedene Tabellen, etwa HTML Color Codes. Dort klicken Sie einfach auf Ihre Farbe in der Übersicht und unten wird Ihnen der Hexa-Wert genannt.

Diesen Wert kopieren Sie und setzen Ihn in Ihrem CSS hinter background ein. Achten Sie dabei auf den Strichpunkt (;) hinter dem Wert. Auch muss die geschweifte Klammer anschließend wieder zugehen.

Bringen Sie Dynamik in Ihren Reiseshop!

Jetzt wollen Sie aber auch noch den Hover in Ihrem Menü andern. Hover nennt man die dynamische Veränderung, wenn Sie mit dem Mauspfeil über das Menü gehen. Wenn Sie möchten, dass der Hintergrund beim jeweiligen Menüpunkt die Farbe ändert, geben Sie in Ihrem CSS folgenden Code ein:

#navigation #main-navi li a:hover {
background: #0335ab;}

Auch hier ersetzen Sie den sechsstellen Hexa-Wert wieder durch Ihren gewünschten Farbwert.

Nun speichern Sie die Änderungen und gehen zurück auf den Reiter Grundeinstellungen. Dort wählen Sie im Feld CSS Ihr soeben erstelltes CSS, klicken auf Änderungen übernehmen. Innerhalb weniger Minuten müssten die neuen Farben in Ihrem Reiseshop sichtbar sein.

Noch mehr farbliche Anpassungen

Sie wollen noch weitere farbliche Anpassungen vornehmen? Dann gehen Sie wieder in Ihre CSS Verwaltung und klicken auf Ihr gespeichertes CSS. Dann fügen Sie einfach weitere Codes hinzu und speichern die Änderungen anschließend wieder.

Suchmaske:

Für die farbliche Hinterlegung der Reiter in der Suchmaske sowie den passenden Rahmen um die Suchmaske verwenden Sie folgende Codes:

/*Rahmen*/
#quicksearch {
border: 1px solid #2e2192;}

/*Reiter*/
#quicksearch .switcher a {
background-color: #2e3192; color: #fff;}

/*Reise finden-Button*/
#quicksearch form .column .field .submit {
border: 0;
position: relative;
top: 9px;
background: #c1272d;
color: #FFF;
font-weight: bold;
font-family: Helvetica, Arial, Verdana, sans-serif;
font-size: 20px;
border-radius: 3px;
padding: 5px;
cursor: pointer;
height: 40px;
width: 165px;}

Bitte übernehmen Sie die Codes genau so und ändern Sie dann nur immer den Hexa-Wert bei background-(color). Mit dem Wert color können Sie übrigens die Schriftfarbe im jeweiligen Bereich ändern.

Die Angebote:

Die Hintergrundfarbe der Angebote ändern Sie wie folgt:

.offer .bubble .rectangle {
background: #c1272d;}

.offer .bubble .triangle-l {
border-color: transparent #c1272d; transparent transparent;}

.offer .bubble .triangle-r {
border-color: transparent transparent transparent #c1272d;}

Hier ersetzen Sie auch jeweils (also in allen drei Codes) den sechsstelligen Wert hinter dem Hashtag.

Mit diesen Codes können Sie die wichtigsten Elemente Ihres Reiseshops ändern und ihm ein individuelles Farbdesign schenken. Wenn Sie weiterreichende Grundkenntnisse in CSS haben, können Sie selbstverständlich noch mehr ändern. Wir freuen uns auf die Ergebnisse!

Der Beitrag Reiseshop: So verändern Sie das CSS im Shopbaukasten erschien zuerst auf travianet.

SEO ist die Abkürzung für „Search Engine Optimization“, zu deutsch: Suchmaschinen-Optimierung. Es handelt sich also um Maßnahmen, mit denen man bei Suchmaschinen wie Google besser gefunden wird. Also bei den Suchergebnissen ganz oben steht und somit besser „rankt“. Jeder, der eine eigene Reiseseite betreibt, sollte sich mit dem Thema auseinandersetzen. Denn: Eine bessere Platzierung bei Suchmaschinen bedeutet mehr Klicks auf die Homepage, was im besten Fall zu mehr Buchungen und mehr Umsatz führt. Wir wollen Ihnen mit unseren SEO-Tipps einen kleinen Leitfaden an die Hand geben, mit der Sie Ihren Reiseshop optimieren können.

1. Der Aufbau Ihrer Reiseseite

1.1. Die Architektur

Niemand kennt Ihre Seite so gut wie Sie selbst. Sie wissen genau, wo Sie was finden. Aber versetzen Sie sich einmal in die Lage des Besuchers. Geht es ihm genau so? Findet er auch auf Anhieb,
was er sucht? Bekommt er sofort die Informationen, die er sich wünscht?

Lassen Sie einmal einen Freund einen Blick auf Ihre Seite werfen und bitten Sie um eine ehrliche Meinung. Oder vergleichen Sie Ihre Seite mit denen der Konkurrenz, die bei den Suchergebnissen
ganz oben steht.

Was Sie beachten sollten:

• Aussagekräftige Bilder
• Übersichtliche Menüführung
• Klare Inhalte

1.2. Mobile Anpassung

Mittlerweile hat fast jeder ein Smartphone und nutzt dieses für Ausflüge ins WWW. Ein sehr wichtiger Rankingfaktor bei Google ist daher die mobile Anpassung. Passt sich Ihre Seite der Größe eines Tablets oder Smartphones an, ist sie also responsive? Mittlerweile bieten fast alle CMS (Content Management Systeme wie zum Beispiel WordPress, Typo3, Joomla) mobile Lösungen, informieren Sie sich, falls bei Ihnen hier noch Handlungsbedarf besteht.

2. Keywords – das A und O bei den SEO-Tipps

2.1. Was sind Keywords?

Keywords sind die Suchbegriffe, die bei Google eingegeben werden. Die Schlüsselwörter also. Sie können aus einem oder mehreren Begriffen bestehen. Je mehr Keywords Ihre Seite enthält und je öfter sie dort vorkommen, umso größer die Chance auf eine gute Suchmaschinenplatzierung.

2.2. Die richtige Verwendung von Keywords

Der Title-Tag:

Geben Sie Ihrer Seite eine Namen, in der das Keyword vorkommt.

Die Meta-Description:

Wie auch beim Title-Tag handelt es sich bei der Meta-Description um eine so genannte Off-Page-Maßnahme, das bedeutet, sie findet im Hintergrund statt, ist auf der Seite nicht sichtbar. Wenn Sie ein CMS wie zum Beispiel WordPress verwenden, können Sie die Meta-Description unter dem Menüpunkt Einstellungen eingeben. Auch hier sollte das Keyword vorkommen. Sie haben ca. 140 Zeichen Platz dafür – nutzen Sie ihn! Fordern Sie den User zur Handlung auf (Call-to-action)! „Buchen Sie …!“. Wenn Sie Angebote auf einer bestimmten Unterseite ihrer Homepage hervorheben wollen, so können Sie für dafür auch eine eigene Meta-Descritpion eingeben. Am einfachsten geht dies mit speziellen Plugins wie etwa Yoast SEO.

Meta-Keywords:

Dass man Meta-Keywords im Head benennen soll, ist ein weit verbreiteter Mythos. Sparen Sie sich den Aufwand! Sie beeinflussen Google damit nämlich gar nicht. Allerdings geben Sie der Konkurrenz
einen Hinweis, für welche Keywords Sie eigentlich ranken wollen und die kann dann entsprechend gegensteuern. Also besser ohne.

Die URL:

Idealerweise kommt Ihr Keyword auch in der URL vor. Wollen Sie zum Beispiel für das Keyword „Last Minute Mallorca“ ranken, so lautet die perfekte URL: „www.reiseXYZ.de/last-minute-mallorca“
Damit zeigen Sie dem User, dass er genau dort hinkommt, wo er hin will.

Der Content/Inhalt Ihrer Seite:

Neben den Angeboten sollte Ihre Seite auch einen entsprechenden Text enthalten. Empfohlen werden hier 700 bis 1000 Wörter. Auch hier sollte das Keyword möglichst oft vorkommen. Verwenden
Sie Zwischentitel (h2, h3, h4), in denen Sie das Keyword oder Synonyme ebenfalls verwenden. Bilder zählen ebenso zum Content. Diese sollten nicht nur einen entsprechenden Namen haben (last-minute-mallorca.jpg), sondern auch mit einem alt-Tag versehen sein (alt=“Günstige last Minute Mallorca Angebote bei ReiseXYZ“).

3. Links – Raketentreibstoff für Ihre Seite

Ein wichtiger, vielleicht sogar DER wichtigste Faktor für ein gutes Ranking bei Google&Co. sind Verlinkungen. Dabei unterscheidet man zwischen internen und externen Links.

3.1. Externe Links

Externe Links, so genannte Backlinks, sind die Links, die von anderen Seite auf Ihre Seite führen. Je mehr, umso vertrauenswürdiger stuft Sie die Suchmaschine ein. Das Problem: Solche guten Links sind nicht leicht zu bekommen. Natürlich kann man Links auch kaufen, doch mahnen wir hier zur Vorsicht. Google erkennt sehr wohl, ob es sich bei einem Link um einen echten, sinnvollen Link handelt oder um einen gekauften, also bösen. Finger weg von z.B. Ebay-Anzeigen, die Ihnen Backlinks verkaufen wollen und womöglich noch ein Top-10-Ranking innerhalb weniger Wochen garantieren. Denn das kann niemand! Auch nicht die beste SEO-Agentur!

Vielleicht kennen Sie aber Reiseblogger, die Ihnen auf ihrer Seite einen Link platzieren. Das werden die zwar auch nicht kostenlos tun, aber dafür haben Sie dann auch einen guten Link. Unser Tipp: Wenn Sie bei Google nach Reiseblogs suchen, gehen Sie auf den Trefferseiten weiter nach hinten. Die Reiseblogs, die ganz oben bei Google ranken, werden von Profis gemacht. Da kostet ein Link
dann schnell mal ein paar 100 €.

3.2. Interne Links

Wenn das mit den externen Links nicht klappt, dann können Sie Ihre Seite immer noch mit internen Links optimieren. Damit verlinken Sie zwischen den Unterseiten Ihres Webauftrittes. Beispiel: Auf der Last-Minute-Mallorca-Seite schreiben Sie im Text: „Mallorca ist nichts für Sie? Dann schauen Sie doch auf unsere Last-Minute-Angebote in Griechenland!“ Last-Minute-Angebote in Griechenland verlinken Sie dann auf Ihre entsprechende Griechenland-Seite. Wichtig ist dabei, dass der Link-Text (blau) genau das beinhaltet, worum es auf der Zielseite geht (auch bei externen Links).

Auch hier gilt: Je mehr Links Sie auf einer Seite haben, umso besser. Wir nennen Ihnen 5 als Richtwert.

4. Controlling

Sie haben nun all diese Maßnahmen durchgeführt. Aber wie kontrollieren Sie nun, ob sie auch erfolgreich waren? Hier wollen wir Ihnen ein Tool namens Sistrix ans Herz legen. Hier bekommen Sie den kompletten Überblick, wie Ihre Seite derzeit von Google gerankt wird. Welche Keywords für Sie wichtig sind, welche Links etc. Da Sistrix ein sehr umfassendes Tool ist, ist ein Abo dementsprechend kostenpflichtig.

Alternativ können Sie auch die Analytics von Google verwenden. Das ist vor allem dann sinnvoll, wenn Sie bei Google auch Werbung für Ihre Seite machen wollen. Das nennt man dann SEA (Search Engine Advertising), wofür Google mit Adwords auch ein eigenes Programm bietet. Beide sind kostenlos.

Sollten Sie noch Fragen zum Thema SEO haben, so steht Ihnen als Partner von travianet die Vertriebs- und Marketingabteilung gerne zur Seite.

Der Beitrag So wird Google Ihr bester Freund: SEO-Tipps für unsere Partner erschien zuerst auf travianet.