1. 1&1 DO-IT-YOURSELF HOMEPAGE
Neue Features im Überblick
Stand: 01.09.2011 - www.1und1.de
® 1&1 Internet AG 2011, Dipl.-Ing. Adrian Sonne, Technischer Produktmanager 1

2. Überblick neuer Features nach Tarifen
Feature DIY Privat DIY Basic DIY Plus DIY Pro
(4,99 €) (9,99 €) (19,99 €) (29,99 €)
1. Automatische Anpassung der
Webinhalte für Smartphones
2. Plugins für Facebook, Twitter
und Social Bookmarks
3. Neue Layouts (+ vorhandene)
4 (+ 53) - (53) 31 (+ 53) 31 (+ 53)
4. Mehrere Titelgrafiken pro
Website
 Seit 01.09.2011 sind vier neue Features in der „1&1 Do-It-Yourself Homepage“ verfügbar
 Social-Media-Plugins und Titelgrafiken stehen allen Kunden in allen Tarifen zur Verfügung
 Smartphone-Anpassung und neue Layouts sind in den Tarifen „Plus“ und „Pro“ nutzbar
® 1&1 Internet AG 2011, Dipl.-Ing. Adrian Sonne, Technischer Produktmanager 2

3. 1. Anpassung der Webinhalte für Smartphones
Website www.thai-karlsruhe.eu auf dem iPhone: Webansicht (links), mobile Ansicht (Mitte) und mobile Ansicht bei
Klick auf „Menü“ (rechts).
 Die neue Funktion erkennt, mit welchem Mobilfunk-Gerät ein Besucher Ihre Website aufruft und
passt diese automatisch dem jeweiligen Display an.
 Potentielle Kunden können so Seiteninhalte wie Texte oder Fotos auch unterwegs schnell und
komfortabel abrufen.
® 1&1 Internet AG 2011, Dipl.-Ing. Adrian Sonne, Technischer Produktmanager 3

4. 1. Anpassung der Webinhalte für Smartphones
Und so aktivieren Sie die mobile Ansicht Ihrer Website:
 Wählen Sie im Hauptmenü unter „Einstellungen“ die Option „Mobile Homepage“.
 Diese Option ist nur in den Tarifen „Plus“ und „Pro“ verfügbar.
® 1&1 Internet AG 2011, Dipl.-Ing. Adrian Sonne, Technischer Produktmanager 4

5. 1. Anpassung der Webinhalte für Smartphones
 Wählen Sie die Option „Darstellung für mobile Endgeräte optimieren (Mobile Homepage)“.
 Klicken Sie auf „Speichern“.
 Fertig: Ihre Website wird nun auf mobilen Endgeräten optimiert angezeigt.
® 1&1 Internet AG 2011, Dipl.-Ing. Adrian Sonne, Technischer Produktmanager 5

6. 2. Plugins für Facebook, Twitter und Social Bookmarks
Sie können nun Ihren Social-Media-
Auftritt noch einfacher mit Ihrer
Webseite verknüpfen:
 Sie können einen Facebook „Gefällt
mir“-Button oder Social Bookmarks
einfügen. Besucher Ihrer Website
können so im Web 2.0 auf Ihre
aktuellen Angebote oder Aktionen
hinweisen.
 Wenn Sie bereits auf Facebook sind,
können Sie Profilfotos Ihrer Fans
oder Pinnwand-News auf Ihrer
Website anzeigen.
 Wenn Sie bereits twittern, können
Sie Ihre Tweets auf Ihrer Website
anzeigen.
Website http://s378793174.website-start.de mit Social
Bookmarks und Facebook-Fans
® 1&1 Internet AG 2011, Dipl.-Ing. Adrian Sonne, Technischer Produktmanager 6

7. 2. Plugins für Facebook, Twitter und Social Bookmarks
Und so binden Sie die neuen Elemente in Ihre
Website ein:
 Bewegen Sie die Maus an die gewünschte
Stelle in Ihrer Website. Der Dialog „Neues
Element hinzufügen“ erscheint.
 Klicken Sie am unteren Ende des Fensters
auf „Weitere“. Es erscheint die Rubrik
„Weitere Inhalte“ im Fenster.
 Fügen Sie „Social Bookmarks“, „Twitter“
oder „Facebook“ per Klick hinzu.
 Wir empfehlen, Facebook- und Twitter-
Boxen in die linke oder rechte Randspalte
Ihres Layouts einzubauen. „Gefällt mir“-
Button oder Social Bookmarks lassen sich
gut unter der Überschrift, am Ende eines
Artikels oder ebenfalls in einer Randspalte
positionieren.
® 1&1 Internet AG 2011, Dipl.-Ing. Adrian Sonne, Technischer Produktmanager 7

8. 2. Plugins für Facebook, Twitter und Social Bookmarks
Facebook „Gefällt mir“-Button
 Wählen Sie die Option „Gefällt mir“ Button. Klicken Sie “Speichern“.
 Fertig: Ist ein Besucher Ihrer Website bei Facebook eingeloggt und klickt auf „Gefällt mir“,
erscheint ein Link zu Ihrer Website auf der Pinnwand Ihres Besuchers.
® 1&1 Internet AG 2011, Dipl.-Ing. Adrian Sonne, Technischer Produktmanager 8

9. 2. Plugins für Facebook, Twitter und Social Bookmarks
http://de-de.facebook.com/1und1
Facebook „Like Box“ mit Profilfotos der Fans
 Wählen Sie „Like-Box“ und kopieren Sie die URL ihrer Facebook-Seite in das Feld.
 Wählen Sie „Anzeigen: Profilfotos der Fans“ und klicken Sie auf „Speichern“. Auf Ihrer
Website erscheinen die Profilfotos von Besuchern, denen Ihr Facebook-Auftritt gefällt (Fans).
® 1&1 Internet AG 2011, Dipl.-Ing. Adrian Sonne, Technischer Produktmanager 9

10. 2. Plugins für Facebook, Twitter und Social Bookmarks
http://twitter.com/#!/1und1
Twitter „Profil-Tweets“
 Wählen Sie „Tweets“ mit der Option „Profil-Tweets“. Geben Sie Ihren Profilnamen ein.
 Auf Ihrer Website erscheinen die neuesten Kurznachrichten, die Sie auf Twitter geschrieben
haben. Besucher Ihrer Website können direkt antworten oder retweeten.
® 1&1 Internet AG 2011, Dipl.-Ing. Adrian Sonne, Technischer Produktmanager 10

11. 2. Plugins für Facebook, Twitter und Social Bookmarks
Social Bookmarks
 Wählen Sie die gewünschten Social-Bookmark-Dienste und klicken Sie auf „Speichern“.
 Auf Ihrer Website erscheint eine Leiste mit Icons. Besucher können darauf klicken, sich beim
jeweiligen Dienst einloggen und dort einen Link zu Ihrer Website eintragen (Empfehlung).
 So können z. B. Besucher von http://www.mister-wong.de Ihre Website entdecken.
® 1&1 Internet AG 2011, Dipl.-Ing. Adrian Sonne, Technischer Produktmanager 11

12. 3. Neue Layouts und verbesserte Layoutauswahl
® 1&1 Internet AG 2011, Dipl.-Ing. Adrian Sonne, Technischer Produktmanager 12

13. 3. Neue Layouts und verbesserte Layoutauswahl
 Aus Befragungen wissen wir: Sie wünschen
sich eine große, vielseitige Auswahl
moderner Layouts für Ihre ganz individuelle
Homepage.
 Seit Jahresbeginn haben wir deshalb die
Anzahl der Layouts auf aktuell 84 Stück
mehr als verdoppelt.
 Zuletzt kamen am 1. September 31 Layouts
dazu, die speziell für die Tarife Privat, Plus
und Pro gestaltet wurden.
 Jedes Layout können Sie anpassen:
Hintergrundfarbe, Muster, Schriftarten,
Titelgrafiken, Logo… So entsteht Ihr ganz
einzigartiges Design.
 …und wir arbeiten bereits an den nächsten
Layouts für Sie.
® 1&1 Internet AG 2011, Dipl.-Ing. Adrian Sonne, Technischer Produktmanager 13

14. 3. Neue Layouts und verbesserte Layoutauswahl
 Bisher standen Ihnen Layouts mit
Titelgrafiken im Querformat zur
Verfügung.
 Jetzt gibt es zusätzlich Layouts mit
hochformatigen Titelgrafiken.
 Bei der Motivsuche können Sie aus
mehr als 2.500 Fotos wählen. Im
„Pro“- oder „Plus“-Tarif können Sie
darüber hinaus auf ein Bildarchiv mit
mehr als 12.000 Fotos zugreifen.
 Oder Sie verwenden einfach eigene
Fotos oder Grafiken.
Beispiel:
Layout „Block Design“ mit
Titelgrafik im Hochformat
® 1&1 Internet AG 2011, Dipl.-Ing. Adrian Sonne, Technischer Produktmanager 14

15. 3. Neue Layouts und verbesserte Layoutauswahl
 Sie mögen keine Titelgrafiken und
wollen diesen Platz anders nutzen?
Dann können Sie ab jetzt ein Layout
ohne Titelgrafik wählen. Ihr Logo
oder ein schönes Hintergrundbild
kommt so voll zur Geltung.
Beispiel:
Layout „Colour Tail“ ohne
Titelgrafik.
® 1&1 Internet AG 2011, Dipl.-Ing. Adrian Sonne, Technischer Produktmanager 15

16. 3. Neue Layouts und verbesserte Layoutauswahl
 Apropos Hintergrundbild: Ab jetzt
können Sie aus Layouts mit vielen
schönen Hintergrundbildern
wählen.
 Oder laden Sie doch einfach Ihr
eigenes Hintergrundbild auf Ihre
Website.
 Die Einstellungen finden Sie unter
„Hauptmenü > Style >
Hintergrund“.
Beispiel:
Layout „Landscape View“ mit
auswählbarem Hintergrundbild.
® 1&1 Internet AG 2011, Dipl.-Ing. Adrian Sonne, Technischer Produktmanager 16

17. 3. Neue Layouts und verbesserte Layoutauswahl
 Trotz der großen Auswahl an Layouts
bleibt die Do-It-Yourself Homepage
gewohnt leicht bedienbar. 1 2
 Dazu haben wir die Layoutauswahl
weiterentwickelt. Jetzt neu ist eine
Detailansicht mit Kurzbeschreibung,
einer Übersicht der Eigenschaften
und Infos zur Beliebtheit.
 Beim Ausprobieren der Layouts
stehen Ihnen hilfreiche Sortier- und
Filtermöglichkeiten zur Verfügung.
 Eine Banderole mit 3 Sternen
kennzeichnet Layouts, die Sie exklusiv
in den Tarifen „Pro“ und „Plus“ 3
nutzen können. Über eine Vorschau
sehen Sie, wie Ihre Website mit
einem bestimmten Layout aussehen 4
würde. Neue Layoutauswahl: (1) Übersicht und Detailansicht wählen, (2) Ansicht
sortieren und filtern, (3) Banderole für Plus- und Pro-Layouts, (4) Vorschau.
® 1&1 Internet AG 2011, Dipl.-Ing. Adrian Sonne, Technischer Produktmanager 17

18. 3. Neue Layouts und verbesserte Layoutauswahl
 Bisher konnten Sie sich die von Ihnen
zuletzt benutzten Layouts nicht
anzeigen lassen. Jetzt merkt sich das
System, welche Layouts Sie
verwenden.
 Das gestern ausprobierte Layout
gefällt Ihnen doch besser als das
aktuelle? Einfach „Sortieren nach:
Zuletzt benutzt“ auswählen und
wieder das Layout von gestern
aktivieren.
Neue Layoutauswahl: Mit „Sortieren nach: Zuletzt benutzt“ können Sie leicht
auf zuvor ausprobierte Layouts zurückwechseln.
® 1&1 Internet AG 2011, Dipl.-Ing. Adrian Sonne, Technischer Produktmanager 18

19. 4. Mehrere Titelgrafiken pro Website
Home Neuwagen Werkstatt
Über uns Kontakt Anfahrt
Website http://s378793174.website-start.de – Beispiel Autohändler: Jeder Hauptnavigationspunkt hat eine eigene Titelgrafik
® 1&1 Internet AG 2011, Dipl.-Ing. Adrian Sonne, Technischer Produktmanager 19

20. 4. Mehrere Titelgrafiken pro Website
 Bisher konnten Sie für die gesamte
Website nur eine Titelgrafik
auswählen. Jede Seite verwendete
das gleiche Foto.
 Nun können Sie jedem Menüpunkt
Ihrer Website ein eigenes Foto
zuordnen. Zum Beispiel können Sie
unter „Kontakt“ ein passendes Motiv
einsetzen.
 Besonders bei großen Websites wird
so Ihren Besuchern die Orientierung
wesentlich erleichtert, z.B. wenn Sie
verschiedene Produktkategorien
vorstellen.
 Bei der Motivsuche können Sie aus
mehr als 2.500 Fotos wählen. Im
„Pro“ oder „Plus“ Tarif können Sie Website http://s378793174.website-start.de – Jeder Hauptnavigationspunkt
darüber hinaus auf ein Bildarchiv mit hat eine eigene, thematisch passende Titelgrafik. Unter „Anfahrt“ ist eine
mehr als 12.000 Fotos zugreifen. Landkarte mit Stecknadeln zu sehen, ein Symbol für Standorte.
® 1&1 Internet AG 2011, Dipl.-Ing. Adrian Sonne, Technischer Produktmanager 20

21. 4. Mehrere Titelgrafiken pro Website
So gestalten Sie Ihre Titelgrafiken:
 Gehen Sie auf den Menüpunkt, dem
Sie eine eigene Titelgrafik geben
wollen.
 Klicken Sie auf die Titelgrafik. Das
Menü öffnet sich.
 Wählen Sie unter „Branche“ die
Option „Bild anzeigen auf: Aktueller
Seite und Unterseiten“.
 Wählen Sie ein Bild aus. Geben Sie
dazu einen Suchbegriff ein und
drücken Sie [Enter]. Das Suchergebnis
wird angezeigt. Dialog „Kopfbereich bearbeiten > Branche“: Wählen Sie eine Titelgrafik und
 Klicken Sie auf das gewünschte Bild. stellen Sie ein, ob sie auf der gesamten Website oder nur auf der aktuellen
Das Bild wird als Titelgrafik eingefügt. Seite und allen Unterseiten erscheinen soll.
 Klicken Sie auf „Schließen“. Wechseln
Sie nun auf den nächsten
Menüpunkt, um ihn zu bearbeiten.
® 1&1 Internet AG 2011, Dipl.-Ing. Adrian Sonne, Technischer Produktmanager 21

22. Hilfe und Support
1&1 Hilfe-Center
Im Hilfe-Center finden Sie das Handbuch zur Do-It-Yourself Homepage. Und außerdem
auch Anleitungen zu allgemeinen Fragen, zur Gestaltung und zur Verwaltung Ihrer
Website.  http://hilfe-center.1und1.de/hosting
1&1 Kundenforum
Nutzer stellen Fragen und erhalten Hilfe von anderen Nutzern und vom 1&1 Support.
Anmeldung mit Kundennummer ist erforderlich. Verfügbar für alle Produkte, darunter
auch die 1&1 Do-It-Yourself Homepage.  https://forum.1und1.de
XING Gruppe "1&1 Do-It-Yourself Homepage"
In dieser Gruppe tauschen sich Anwender vom Anfänger bis zum Web-Profi miteinander
aus, helfen sich gegenseitig und stellen Fragen an die DIY-Profis von 1&1. 
Bereits mehr als
100 Mitglieder sind dabei.  https://www.xing.com/net/diyhomepage
1&1 Blog
1&1 bloggt über Technik, Produkte, Netzkultur. Es finden sich einige Beiträge zur DIY, 
zum
Beispiel "Do It Yourself - So optimiert Ihr Eure Website". Lesen Sie Kommentare anderer
Nutzer, kommentieren Sie oder empfehlen Sie Beiträge.  http://www.blog.1und1.de
® 1&1 Internet AG 2011, Dipl.-Ing. Adrian Sonne, Technischer Produktmanager 22