Inhaltsverzeichnis Vorwort.... 17 I Grundlagen: Wissenswertes übers Web.... 21 1 Das Internet und das Web... 23 1.1 Computer und Netzwerke... 24 Ein LAN ist ein kleines Netzwerk.... 24 Router verbinden Netzwerke miteinander.... 25 Ein großes Netzwerk ist ein WAN.... 25 1.2 Das Internet ist einfach nur ein Computernetzwerk.... 26 1969 Die Keimzelle des Internets.... 26 Was man früher im Internet so gemacht hat: E-Mail und FTP.... 27 1.3 Das World Wide Web: Hypertext im Internet... 29 1.4 Hypertext ist Text mit Hyperlinks.... 30 1.5 Internet und Web sind also nicht wirklich dasselbe... 31 1.6 Auf einen Blick.... 32 2 Das World Wide Web: Ein weltweites Gewebe.... 33 2.1 Das Web besteht aus Webseiten........................ 34 2.2 Hyperlinks verknüpfen Webseiten miteinander.... 35 2.3 Begriffe:»Website«,»Webseite«und»Homepage«.... 36 Eigentlich korrekt:»website«,»webseite«und»homepage«.... 37 Im Alltag:»Homepage«und»Webseite«statt»Website«.. 38 Uns fehlt im Deutschen ein gutes Wort für»website«.... 38 2.4 Orientierung im Web: Navigation.... 39 Eine Website verhält sich anders als ein Buch.... 39 Navigation dient zur Orientierung innerhalb der Site.... 40 2.5 Auf einen Blick.... 42 7
Inhaltsverzeichnis 3 Die Browser: Surfen im Web.... 43 3.1 Die bekanntesten Browser.... 44 3.2 Die Browserbedienung im Überblick... 45 Blättern durchs Web: Die Symbole Zurück und Vor... 45 Die Symbole Abbrechen und Aktualisieren.... 47 Zurück nach Hause: Das Symbol Startseite.... 47 3.3 Lesezeichen: Ihr Adressbuch für das Web.... 48 Lesezeichen sammeln auf einer Symbolleiste.... 48 Lesezeichen für Fortgeschrittene.... 49 3.4 Suchen und Finden im Browser... 50 3.5 Auf einen Blick.... 51 4 Die Suchmaschinen: Zeichen vergleichen.... 53 4.1 Suchmaschinen durchsuchen nicht live das Web... 54 4.2 Der Ablauf einer Websuche... 54 Schritt 1: Der Benutzer gibt die Suchbegriffe ein.... 54 Schritt 2: Die Suchmaschine sucht und findet... 55 Schritt 3: Die Ergebnisseite wird angezeigt.... 56 4.3 Zeichen vergleichen: Suchmaschinen denken nicht... 57 4.4 ToDo: Eine Liste mit Suchbegriffen erstellen.... 58 4.5 Auf einen Blick.... 59 5 Das Domain Name System: Die automatische Auskunft.... 61 5.1 IP-Adressen Die Telefonnummern des Internets.... 62 5.2 Domains und IP-Adressen: Namen statt Nummern... 63 5.3 Der Aufbau von Domain Namen.... 64 Die Top Level Domain.... 64 Die Second Level Domain (und alle darunter).... 66 5.4 Der Aufbau einer Webadresse (URL).... 66 5.5 ToDo: Gedanken über eine Domain machen.... 68 5.6 Auf einen Blick.... 69 8
Inhaltsverzeichnis 6 Die Webseiten: Quelltext auf dem Webspace.... 71 6.1 Der Quelltext ist der Bauplan der Webseite... 71 6.2 Browser bekommen den Quelltext vom Webserver... 73»Webspace«: Speicherplatz zum Veröffentlichen im Web... 73 Überblick: Der Browser holt eine Webseite.... 74 Grafiken werden erst nach dem Quelltext abgeholt.... 75 Grafiken ausstellen im Browser.... 76 6.3 Quelltext besteht aus HTML, CSS und JavaScript.... 76 Die Ordnung: HTML ist nicht hübsch, aber flexibel.... 77 Das Styling: CSS gestaltet die HTML-Elemente.... 79 HTML und CSS: Die Trennung von Inhalt und Gestaltung... 81 JavaScript beeinflusst das Verhalten der Webseite.... 82 6.4 Auf einen Blick.... 84 7 Webpublishing: Der Weg zum Content Management.... 85 7.1 Webpublishing war ursprünglich statisch... 86 So funktioniert statisches Webpublishing... 86 Statische Webseiten sind umständlich zu pflegen... 87 7.2 Statisches Webpublishing wird interaktiv.... 88 Das Web ist ein interaktives Medium.... 89 Ein Kontaktformular als Beispiel zur Interaktion.... 89 Formulardaten werden von einer Webanwendung verarbeitet.... 91 7.3 Dynamisches Webpublishing: Content Management.... 92 So funktioniert ein Content Management System (CMS)... 92 Ein CMS auf dem eigenen Webspace erfordert Know-how.. 93 Beispiele: WordPress, Joomla!, Contao, Drupal und TYPO3... 94 7.4 Auf einen Blick.... 96 8 Social Media, Blogs und Baukästen... 97 8.1 Social Media: Im Web aktiv ohne eigene Website.... 97 Themenorientierte Communities statt eigener Homepage. 98 Soziale Netzwerke: Präsentieren Sie sich selbst... 98 Soziales Netwerk versus eigene Homepage.... 100 9
Inhaltsverzeichnis 8.2 Blogger dir einen: Baukästen für Blogs.... 100 Blogs sind einfache CMSysteme und leicht zu bedienen.... 101 Beispiele: Fertigblogs vom Bloganbieter.... 102 8.3»Instant Websites«: Baukästen für Websites... 103 Für wen kommt ein Website-Baukasten in Frage?.... 104 Beispiele: Jimdo, Webnode, Weebly & Co... 105 Die Website zu den Baukästen:»websitetooltester.com«... 106 Offline-Baukästen: Teurer und nicht so flexibel.... 107 8.4 Auf einen Blick.... 108 9 Gute Seiten, schlechte Seiten.... 109 9.1 Die Webseite ist zu Gast beim Surfer.... 109 9.2 Überblick: Sieben Qualitätskriterien.... 110 1. Der Inhalt: Darum kommen die Besucher.............. 111 2. Die Gestaltung: So sieht s aus.... 112 3. Die Navigation: Orientierung geben.... 113 4. Die Performance: Die Entdeckung der Langsamkeit... 114 5. Die Zugänglichkeit:»Wie Sie sehen, sehen Sie nichts«.... 115 6. Der Quelltext: Verborgene Qualitäten.... 116 7. Die Interaktion: Mit den Besuchern kommunizieren... 118 9.3 Die Mischung macht s: Bibliothek und Galerie.... 118 Die Bibliothek: form follows function.... 119 Die Galerie: form without function.... 120 Bibliotheken und Galerien haben unterschiedliche Prioritäten.... 121 Fazit.... 122 9.4 Auf einen Blick.... 123 II Vorbereitung: Die Homepage planen.... 125 10 Die Rahmenbedingungen festlegen.... 127 10.1 Überblick: Der rote Faden durch das Labyrinth.... 127 10.2 Die Rahmenbedingungen: Ziele, Zeit und Zaster.... 130 Ihre Ziele und die der Besucher... 131 Die Zeit: Bis zur Freischaltung und danach.... 132 Der Zaster: Für die Erstellung und für die Wartung.... 133 10
Inhaltsverzeichnis 10.3 Selber bauen, bauen lassen oder Baukasten.... 133 10.4 ToDo: Surftour was machen die anderen?... 134 10.5 Auf einen Blick.... 135 11 Die Konzeption: Gedanken ordnen.... 137 11.1 Die vier Bereiche zur Planung einer Website.... 138 11.2»Technik«: Das Fundament für die Website... 139 Die private Homepage.... 139 Die Freiberufler-Homepage... 140 Die Homepage für Firmen, Vereine und Schulen.... 141 Der kleine Online-Shop... 143 11.3»Inhalte«: Darum kommen Ihre Besucher.... 143 Schritt 1: Inhalte sammeln.... 143 Schritt 2: Inhalte sortieren Kategorien und Hierarchien... 144 Schritt 3: Inhalte erstellen... 145 11.4»Funktionen«: Interaktion und Verwaltung... 146 Schritt 1: Funktionen sammeln.... 146 Schritt 2: Funktionen sortieren.... 147 Schritt 3: Funktionen erstellen.... 148 11.5»Gestaltung«: So soll es aussehen... 149 Skizzen erstellen... 149 Das Layout erstellen.... 151 11.6» Wartung«: Die Pflege nach der Freischaltung.... 152 Eine Website ist ein Prozess.... 152 Wenn sich die Anforderungen ändern.... 153 11.7 Auf einen Blick.... 154 12 Webhosting: Domain und Webspace.... 155 12.1 Untermieter: Webspace mit Subdomain.... 156 12.2 Domain überprüfen: Ist»mueller.de«noch frei?.... 157 12.3 Wenn Ihr Wunschname vergeben ist... 158 Möglichkeit 1:»pmueller.de«eine andere DE-Domain.... 158 Möglichkeit 2:»mueller.info«eine andere Top Level Domain.... 160 Möglichkeit 3: Domain kaufen der Handel mit Domains.. 161 11
Inhaltsverzeichnis 12.4 Der eigene Webspace.... 162 Überblick über Webhoster: webhostlist.de.... 163 Verwirrende Preise: Null Euro Sternchen.... 163 Der Einstieg: Domain und Mail.... 165 Die Mittelklasse: Webspace mit PHP und Datenbank.... 166 Die Oberklasse: Premiumpakete für Experten.... 166 12.5 Fachbegriffe rund um Web- und Mailspace... 167 Wie viel Speicherplatz wird benötigt?.................. 168 Wie viel Traffic (Datentransfer) brauchen Sie?.... 168 Der Zugang zum Webspace: FTP & Co..... 169 Serverseitige Skriptsprachen: PHP & Co.... 170 Datenbanken: MySQL und phpmyadmin.... 171 Sonstige Fachbegriffe rund um den Webspace.... 172 Der Mailspace: POP3, IMAP und Webmail.... 173 12.6 Auf einen Blick.... 175 III Umsetzung: Eine Homepage erstellen.... 177 13 Eine Homepage mit Jimdo erstellen.... 179 13.1 Bevor Sie beginnen..... 180 13.2 Jimdo im Überblick.... 180 13.3 Die Registrierung bei Jimdo.... 182 Schritt 1: Web-Adresse und Mail-Adresse eingeben.... 182 Schritt 2: Captcha eingeben und Website erstellen.... 183 Schritt 3: Die E-Mail mit den Zugangsdaten.... 185 13.4 Jimdo kennen lernen... 186 First Contact Die Beispielsite von Jimdo in der Übersicht.... 186 Die erste Anmeldung an Ihrer Homepage.... 187 Zu Ihrer Sicherheit: Das zugeschickte Passwort ändern.... 189 Die Layoutbereiche einer Jimdo-Page.... 190 13.5 Den Inhalt auf der Startseite ändern... 192 Die Überschrift auf der Startseite ändern.... 192 12
Inhaltsverzeichnis Text auf der Startseite löschen und neu eingeben... 193 Einen Hyperlink erstellen.... 195 13.6 Ansichts- und Bearbeitungsmodus bei Jimdo.... 197 13.7 Auf einen Blick.... 198 14 Die Homepage bei Jimdo gestalten... 201 14.1 Entdecke die Möglichkeiten in fünf Schritten.... 202 14.2 Schritt 1: Das Layout auswählen.... 202 Die Layout-Vorschau.... 203 Ein neues Layout zuweisen.... 204 14.3 Schritt 2: Den Hintergrund ändern.... 205 14.4 Schritt 3: Das Titelbild austauschen... 206 14.5 Schritt 4: Den Titel der Website ändern.... 208 14.6 Schritt 5: Die Navigation anpassen.... 210 14.7 Auf einen Blick.... 212 15 Die Homepage bei Jimdo mit Inhalten füllen.... 213 15.1 Jede Seite beginnt mit einer»überschrift 1«.... 214 15.2 Die Elemente»Textfeld«und»Bild mit Text«... 214 15.3 Nur ein Bild: Das Element»Bild«.... 217 15.4 Mehrere Bilder: Das Element»Bilder-Galerie«.... 219 15.5 Ein funktionierendes Kontaktformular.... 222 15.6 Weitere nützliche Elemente im Überblick.... 224 15.7 Auf einen Blick.... 225 16 Schreiben im Web für Menschen... 227 16.1 Wie Menschen im Web lesen.... 228 Und es hat Zoom gemacht: Lesen am Bildschirm.... 228 Webseiten werden nicht gelesen, sondern überflogen.... 230 Zwischenlandung: Scannen Skimmen Lesen.... 231 16.2 Verständliche Texte: Die Hamburger Pyramide.... 232 Pulitzer und das Hamburger Verständlichkeitsmodell... 232 Die umgekehrte Pyramide: Das Wichtigste am Anfang.... 233 13
Inhaltsverzeichnis 16.3 Übersichtliches Schreiben: Texte scannbar machen... 234 Überschriften und Zwischenüberschriften.... 234 Schreiben Sie kurze Absätze.... 235 Heben Sie wichtige Worte hervor.... 235 Benutzen Sie Listen... 235 16.4 Abstände und Schriften: Fließtext gestalten.... 236 Abstand halten im Fließtext.... 236 Schnörkel oder nicht Schnörkel: Schriften und Serifen... 237 Sie können nicht jede Schriftart benutzen.... 239 16.5 Der Umgang mit Hyperlinks.... 240 Linken Sie nicht nur des Linkens wegen.... 240 Das»Hier«-Syndrom: Klicken Sie hier.... 241 Benutzen Sie Linklisten... 241 Beschreiben Sie Downloadlinks deutlich... 242 16.6 Zürich, die Stadt, die die Römer Turicum nannten... 242 16.7 Übung: Caipirinha in Jimdo... 244 Rezept für Caipirinha die Ausgangssituation.... 244 Die Überschrift:»Rezept für eine Caipirinha«.... 245 Der Teaser: Blickfang und Einleitung.... 246 Zutaten und Utensilien: Überschrift 2 und Aufzählung.... 247 Die Zubereitung: Überschrift und Nummerierung... 248 Das Jimdo-Menü Style zur Gestaltung des Fließtextes... 249 16.8 Auf einen Blick.... 252 17 Grafiken fürs Web vorbereiten.... 253 17.1 Webgrafiken Das Wichtigste in Kürze................... 253 Grafiken laden länger als Text........................ 253 Frisch aus der Kamera: Bildgröße und Dateigröße.... 254 Im Web sind nur GIF, JPEG oder PNG erlaubt.... 255 17.2 Grafiken Woher nehmen und nicht stehlen?... 256 Vorsicht bei Grafiken von anderen Webseiten.... 256 Die Google-Bildersuche ist keine gute Quelle... 256 pixelio.de kostenlose Bilddatenbank für lizenzfreie Fotos.... 257 14
Inhaltsverzeichnis CreativeCommons und flickr.com.... 258 Andere Websites mit lizenzfreien Fotos.... 259 17.3 Fotos für das Web vorbereiten mit picnik.com... 260 Ohne Registrierung: Bilder mit Picnik online bearbeiten.... 260 Ein Foto in Picnik bearbeiten... 261»Zuschneiden«: Einen Ausschnitt bestimmen... 262»Größe ändern«: Die Bildgröße verkleinern... 263 Die bearbeitete Grafik abspeichern... 263 17.4 Know-how: JPEG, GIF und PNG im Detail... 265 Besonderheiten von JPEG: Kompressionsrate vs. Qualität... 265 Besonderheiten von GIF: Interlaced, Transparenz und Animation.... 266 Besonderheiten von PNG: Alphatransparenz... 267 JPG, GIF und PNG im Überblick.... 267 17.5 Auf einen Blick.... 268 18 Schreiben im Web für Maschinen.... 269 18.1 Wie Maschinen im Web lesen.... 270 Robots sammeln den Quelltext der Webseiten ein.... 270 Suchmaschinen lesen auch den head-bereich... 271 18.2 Übersichtliches Schreiben hilft auch bei Suchmaschinen.... 272 Sprechen Sie die Sprache Ihrer Benutzer.... 272 Einige HTML-Elemente sind wichtiger als andere.... 274 Suchbegriffe in Überschriften.... 274 Suchbegriffe in Hervorhebungen.... 275 Suchbegriffe in Hyperlinks und Listen.................. 276 18.3 Nicht zugänglich: Wie Sie sehen, sehen Sie nichts.... 277 18.4 Suchergebnis, Seitentitel und Seitenbeschreibung.... 278 18.5 Übung: Seitentitel und -beschreibung bei Jimdo... 280 Der Seitentitel.... 280 Die Seitenbeschreibung.... 282 18.6 Auf einen Blick.... 283 15
Inhaltsverzeichnis 19 SEO: Die Optimierung für Suchmaschinen.... 285 19.1 Ranking: Bei Google auf Platz 1...... 285 Google mag Hyperlinks.... 286 Backlinks: Hyperlinks, die auf Ihre Homepage zeigen.... 287 19.2 Ein Beispiel: IKEA in Groningen.... 288 Die Suche nach»ikea Groningen Öffnungszeiten«.... 289 Die Site gibt es schon länger und der Inhalt wird gepflegt.. 290 Es zeigen viele Links auf die Site.... 290 Die Site ist suchmaschinenfreundlich geschrieben.... 291 Fazit: Gut schreiben und fleißig linken.... 293 19.3 Ihre Homepage bei Google.... 293 Die Maßnahmen bis jetzt im Überblick... 293 Einige nützliche Dienste von Google... 294 19.4 Auf einen Blick.... 296 IV Werkzeuge zum Selberbauen... 297 20 Werkzeuge zum Selberbauen.... 299 20.1 Browser zum Testen von Webseiten.... 299 Die aktuellen Browser in der Übersicht.... 300 Verschiedene IE-Versionen auf einem Rechner.... 301 20.2 Editoren zum Erstellen von Webseiten.... 302 Quelltext-Editor oder visueller Editor.... 302 Übersicht: Editoren für den Quelltext.... 304 Visuelle Editoren: Dreamweaver & Co..... 305 Editor und Browser im Alltag: Per Tastatur wechseln... 306 20.3 Editoren zum Bearbeiten von Grafiken.... 307 20.4 FTP: Veröffentlichen von Webseiten.... 308 20.5 HTML und CSS:»Das große Little Boxes-Buch«.... 309 Stichwortverzeichnis... 311 16
Kapitel 3 Die Browser: Surfen im Web Worin Sie die wichtigsten Browser und die wichtigsten Bedienelemente kennen lernen. Außerdem erfahren Sie, dass Lesezeichen wichtig sind und sehen ein paar Tricks zur effektiven Bedienung der Browser. Die Themen im Überblick: Die bekanntesten Browser, Seite 44 Die Browserbedienung im Überblick, Seite 45 Lesezeichen: Ihr Adressbuch für das Web, Seite 48 Suchen und Finden im Browser, Seite 50 Auf einen Blick, Seite 51»To browse«heißt so viel wie»schmökern«oder»umsehen«und um sich im Web umzusehen und auf den Webseiten zu schmökern, benötigen Sie einen Browser, ein Programm zum Betrachten von Webseiten. 43
Kapitel 3 Die Browser: Surfen im Web 3.1 Die bekanntesten Browser Die bekanntesten Vertreter dieser Softwaregattung namens»browser«sind: Microsofts Internet Explorer Mozilla Firefox Opera aus Norwegen Safari von Apple Google Chrome Es gibt noch viele andere Browser, aber Abbildung 3.1 zeigt die großen Fünf und deren Logos in der Browser-Auswahl von Windows auf einen Blick. Abbildung 3.1: Die bekanntesten Browser in der Browser-Auswahl von Windows Mit welchem Browser Sie selbst durchs Web surfen, ist für die Erstellung einer eigenen Homepage nicht wichtig, aber da Sie nicht wissen, welche Browser Ihre Besucher benutzen, ist es gar keine schlechte Idee, einmal ein paar andere Browser zu installieren und auszuprobieren. 44
Die Browser: Surfen im Web 3.2 Die Browserbedienung im Überblick Orientierung im Web ist schwierig, weil Sie wie gesehen nie die ganze Site auf einmal sehen, und von daher lohnt es sich, sich die Zeit zu nehmen, um die Orientierungshilfen in Ihrem Browser bewusst kennen zu lernen. Auch wenn die Browser alle etwas anders aussehen, hat fast jeder irgendwo die in Abbildung 3.2 gezeigten Bedienelemente. Abbildung 3.2: Die Navigationshilfen in einem Browser Alle modernen Browser bieten übrigens ein Suchfeld, in das Sie Suchbegriffe eingeben können, ohne erst zu einer Suchmaschine surfen zu müssen. In immer mehr Browsern fungiert die Adressleiste zur Eingabe der URL auch gleichzeitig als Suchfeld. Einfach ausprobieren. Blättern durchs Web: Die Symbole Zurück und Vor Mit den beiden Symbolen Zurück und Vor bewegen Sie sich in Ihrem Webbrowser eine Webseite zurück bzw. vor, und zwar in genau der Reihenfolge, in der Sie die Seiten in diesem Browser betrachtet haben. Diese beiden Schaltflächen haben zwei wichtige Einschränkungen. Erstens merkt der Browser sich die Liste der besuchten Seiten nur während einer Sitzung. Eine Sitzung (englisch»session«) dauert solange, wie das Browserfenster geöffnet ist. Wenn das Browserfenster geschlossen wird, ist die Sitzung beendet und die Liste wird gelöscht: Browser zu Liste weg. Kommen wir zur zweiten Einschränkung: Jedes Browserfenster und jeder Tab darin haben jeweils ihre eigene Sitzung. Wenn also mehrere Tabs oder Browserfenster geöffnet sind, rufen die Symbole Zurück und Vor in jedem Fenster andere Seiten auf. Dieser Punkt führt manchmal zu Verwirrungen, denn einige Hyperlinks öffnen die an- 45
Kapitel 3 Die Browser: Surfen im Web geklickte Seite heimlich und ohne es zu sagen in einem neuen Tab oder Fenster, und dann funktioniert der Zurück-Button nicht mehr. Am besten überprüfen Sie nach jedem Klick auf einen Hyperlink mit einem kurzen Blick, was genau passiert ist. Nach kurzer Zeit wird diese schnelle Prüfung zur Gewohnheit und Sie merken es gar nicht mehr. Checken Sie nach jedem Klick: 1. Erscheint die angeklickte Seite im selben Browserfenster? Das ist das Standard verhalten und die Buttons für Vor und Zurück funktionieren dann wunderbar. 2. Erscheint die angeklickte Seite in einem neuen Tab? Ein kurzer Blick an den oberen Rand des Browserfensters verrät es Ihnen. In diesem Fall kommen Sie zurück auf die vorherige Seite, indem Sie den neuen Tab schließen (per Maus oder Ÿ + W) oder in den alten Tab wechseln (per Maus oder Ÿ + Å). 3. Erscheint die angeklickte Seite in einem neuen Browserfenster? Ein kurzer Blick in die Taskleiste am unteren Bildschirmrand genügt. Auch hier gilt: Zurück auf die alte Seite geht es durch das Schließen oder Wechseln der Fenster (Ç + Ì bzw. Ç + Å in diesem Fall, oder per Maus). Sie können Hyperlinks übrigens auch absichtlich in einem neuen Tab oder Fenster öffnen: rechter Mausklick auf einen Link und den entsprechenden Befehl aus dem Kontext menü wählen. Wenn Sie auf die Symbole für Vor und Zurück klicken und die Maustaste gedrückt halten, erscheint in vielen Browsern eine Liste mit den Seitentiteln der in dieser Sitzung besuchten Seiten. Je länger die Sitzung, desto länger die Liste. Hinweis Blättern im Web per Tastatur In den meisten Browsern können Sie statt mit der Maus auch mit der Tastenkombination Ç + { bzw. Ç + } eine Webseite zurückoder vorblättern. 46
Die Browser: Surfen im Web Die Symbole Abbrechen und Aktualisieren Eine Webseite kommt nicht in einem Stück auf Ihren Bildschirm. Der Browser läuft los, holt alle Einzelteile und baut sie zu Hause wieder zusammen. Das kann manchmal eine Weile dauern. Wenn Ihnen das Laden einer Webseite zu lange dauert, klicken Sie einfach auf Abbrechen. Das ist nicht verboten. Wie lange Sie warten, bestimmen Sie selbst und das kann je nach Tagesform durchaus unterschiedlich sein. Wenn Sie das Gefühl haben, dass eine Seite nicht richtig angezeigt wird oder veraltet ist, klicken Sie auf das Symbol Neu laden, das manchmal auch Aktualisieren heißt. Per Tastatur geht das Aktualisieren in (fast) allen Browsern mit der Taste Í oder der Kombination Ÿ + R (kurz für Reload). Auf dem Mac + R. Manchmal klemmen Webseiten auch und kommen scheinbar gar nicht. Um einer solchen»verklemmten«webseite auf die Sprünge zu helfen, können Sie Abbrechen und Aktualisieren direkt hintereinander benutzen: zuerst den Ladevorgang ab brechen und ihn dann direkt danach neu starten. Manchmal hilft es. Zurück nach Hause: Das Symbol Startseite Wenn Sie den Browser starten, ruft er meistens sofort eine bestimmte Webseite auf, ohne dass Sie dieses veranlasst haben. Das ist die Startseite Ihres Browsers (manchmal auch Homepage genannt) und durch das Anklicken des Symbols für die Startseite kommen Sie zu dieser Seite zurück. Standardmäßig ist die Startseite eines Browsers oft die Website des Herstellers oder eines Sponsoren, aber Sie können sich in jedem Browser eine eigene Startseite einstellen. Dies geht meist irgendwo in einem Menü namens Einstellungen, das in verschiedenen Browsern aber verschieden heißen kann. Wenn Sie wissen, wie man Webseiten erstellt, können Sie sich als Startseite eine eigene Webseite erstellen mit den Links, die Sie am häufigsten besuchen. Diese Seite speichern Sie irgendwo auf der Festplatte und tragen sie in Ihrem Browser als Startseite ein. 47
Stichwortverzeichnis A Apache 166 B Bildbearbeitung 261 Bildgröße (in px) 254 Blindtext (Fülltext) 194, 216 Blog 100 Bloganbieter (Bloghoster) 102 deutsche Blogcharts 101 Podcast 103 starke Vernetzung 102 typische Features 101 Video-Blog 103 Bloghoster 102 Browser Abbrechen 47 Aktualisieren 47 Back-Button 45 durchsucht den Quelltext 75 Firefox 300 Google Chrome 300 Grafiken ausstellen 76 Kontaktaufnahme mit WebServer 74 Lesezeichen 48 mehrere Fenster 45 moderne Browser 300 Navigationshilfen 43 Opera 300 Safari 300 Schrift vergrößern (Zoom) 229 Session 45 Sitzung 45 Startseite 47 Symbolleiste im Überblick 45 und Editoren 306 und Quelltext 73 und Webserver 73 Webseite vom Server anfordern 74 zurück und vor 45 C Caipirinha (Übung) 244 Captcha (Spamschutz) 157, 184 Chrome (Browser) 300 CMS auf eigenem Webspace 93 Beispiele 94 Blogs 101 Funktionsweise 92 Werkzeug für Webworker 93 ComicSans 239 Contao 94 Content Management Systeme. Siehe CMS CreativeCommons 258 CSS Ergänzung zu HTML 79 Navigation little-boxes.de 80 Styling der Webseite 76 Trennung von Inhalt und Gestaltung 81 verschiedene Ausgabemedien 81 CSS-Regel 79 D Dateigröße (in Kb) 254 DENIC.de 65, 157 DNS 61 andere Top Level Domains 160 311
Stichwortverzeichnis Aufbau eines Domain Namens 64 DENIC Richtlinien 159 Domainkonfiguration 173 Länderliste 65 Namen zu Nummern 63 Second Level Domains 66 Subdomains 66 Übersicht Top Level Domains 65 und IP-Adressen 63 und Sendung mit der Maus 63 Domain 161 Angebote der Webhoster 162 eigene Domain 157 und Recht 161 Webhoster 156 Domain Name System. Siehe DNS Dreamweaver 305 E Editoren Bildbearbeitung 307 Quelltext 304 und Browser 306 WYSIWYG vs. Quelltext 302 E-Mail als Dienst im Internet 27 auf dem Webspace 173 IMAP-Zugriff 174 POP3-Zugriff 174 Spamfilter 174 und Domain Namen 64 Virenschutz 174 Webmail-Zugriff 174 F Favoriten Bookmarks 48 Lesezeichen 48 FileZilla (Download) 308 Firefox (Browser) 300 CSS ausstellen 77 Grafiken ausstellen 76 JavaScript ausstellen 83 Navigationshilfen 43 Flickr.com und CreativeCommons 258 Fotos Bildgröße (in px) 254 Dateigröße (in kb) 254 fürs Web vorbereiten 260 Größe ändern 262 Helligkeit ändern 262 Kontrast ändern 262 kostenlose Quellen 257, 258 zuschneiden 262 Freiberufler-Homepage erstellen 140 FTP 27, 64, 87, 169, 308 Funktionen erstellen 148 sammeln 146 sortieren (A-B-C) 147 zur Interaktion 146 zur Verwaltung 146 G Gestaltung als Qualitätskriterium 112 bei Jimdo 202 planen 149 GIF 255, 266 Animation 266 Interlaced (Zeilensprung) 266 Transparenz 266 Vor- und Nachteile 266 Google Adwords 296 Analytics 295 Google-Bombe 276 Konto 293 mag Hyperlinks 286 Pagerank 287 PageRank 286 Places 295 und ägyptische Pyramiden 56 Webmaster Tools 294 Google Chrome (Browser) 300 312
Stichwortverzeichnis Grafiken Dateigröße überprüfen 253 fürs Web vorbereiten 260 Größe ändern 262 Helligkeit ändern 262 Kontrast ändern 262 kostenlose Quellen 257, 258 Übersicht Grafikformate 267 zuschneiden 262 H Hamburger Verständlichkeitsmodell 232 Homepage Firmen 141 Freiberufler 140 privat 139 Schulen 141 Vereine 141 Homepage (Begriff) 36 Homepage umsetzen bauen lassen 134 Baukasten benutzen 134 selber bauen 133.htaccess 172 HTML body (Element) 271 der Kern der Webseite 76 Elemente 275 head (Element) 271 HTML-Elemente sind flexibel 78 meta (Element) 278 nicht hübsch, aber flexibel 77 title (Element) 278 Trennung von Inhalt und Gestaltung 81 Überschriften (Elemente) 275 und Little Boxes 78 HTTP 67 Hyperlinks 31, 35, 240 Downloads kennzeichnen 242 Empfehlungen zum Einsatz 240 erstellen (Jimdo) 195 interne und externe 195 knüpfen weltweites Gewebe 35 Linklisten 241 und Hier-Syndrom 241, 276 Hypertext nicht auf Papier 36 Text mit Hyperlinks 30 I IANA.org 65 ICANN.org 64, 65 IKEA in Groningen 288 IMAP 173 <img> 75 Inhalt als Qualitätskriterium 111 ändern bei Jimdo 214 erstellen 145 sammeln 143 sortieren 144 Internet und E-Mail 27 und FTP 27 und Telefonnetz 62 und World Wide Web 30 Unterschied zum WWW 31 Zugang zum Internet 25 Internet Explorer Download 300 mehrere Versionen installieren 301 Navigationshilfen 43 Internet Provider 25 Internetseite (Begriff) 36 IP-Adresse Konfiguration ipconfig 62 und Domain Namen 63 Vergleich zu Telefonnummer 62 vier Zahlen, drei Punkte 62 J JavaScript ändert Verhalten der Webseite 82 ausstellen im Firefox 83 das Verhalten der Webseite 76 313
Stichwortverzeichnis Jimdo anmelden (einloggen) 187 Ansichtsmodus 197 Bearbeitungsmodus 191, 197 Beispielsite (Übersicht) 186 bevor Sie beginnen 180 Caipirinha (Übung) 244 das Jimdo-Menü 188 Element Bild 217 Element Bilder-Galerie 219 Element Bild mit Text 214 Elemente (Überblick) 193 Element Formular 222 Element Textfeld 193, 214 Element Überschrift 1 192, 214 Free, Pro und Business 181 Hintergrund ändern 205 Hyperlink erstellen 195 Layout ändern 202 Layoutbereiche 190 Layoutvorschau 203 Layout zuweisen 204 Navigation anpassen 210 Passwort ändern 189 Registrierung 182 Site anpassen (5 Schritte) 202 Text eingeben 193 Text löschen 193 Titelbild ändern 206 Titel der Website ändern 208 Überblick 180 Überschrift ändern 192 Zugangsdaten 185 Joomla 94 JPEG 255, 265 Kompression vs. Qualität 265 Vor- und Nachteile 265 K Keyword Generator 273 Keywords 58, 272, 274, 282 KK-Antrag 173 Klompfastikumpi 286 Konzeption roter Faden 129 Überblick 128 vier Schritte 129 Kopfbereich ändern (Jimdo) 206 L LAMP (Webhosting) 166 LAN (Local Area Network) 24 Layout erstellen 151 Lesen am Bildschirm der Bildschirm 228 Scannen-Skimmen-Lesen 231 Links. Siehe Hyperlinks M Mailspace 173 Megapixel 254, 261 Mozilla Firefox. Siehe Firefox MySQL phpmyadmin 171 Webhosting 171 N Navigation als Qualitätskriterium 113 auf Webseiten 39 Notepad++ (Download) 304 O Online-Shop 143 Opera (Browser) 300 P Performance als Qualitätskriterium 114 PHP 170 php.ini 170 phpmyadmin 171 Picnik.com 260 Planung 127 1. Rahmenbedingungen 130 Technik 139 vier Bereiche 138 314
Stichwortverzeichnis PNG 255, 267 Alphatransparenz 267 PNG-8 267 PNG-24 267 Podcast 103 POP3 173 Private Homepage erstellen 139 PSPad (Download) 304 Pulitzer (Zitat) 233 Pyramide, die umgekehrte 233 Q Qualitätskriterien Bibliothek 119 Bibliothek und Galerie 118, 121 Galerie 120 Gestaltung 112 Inhalt 111 Interaktion 118 Navigation 113 Performance (Ladezeit) 114 Quelltext 116 Überblick 110 Zugänglichkeit 115 Quelltext Bauplan der Webseite 71 HTML, CSS und JS 76 im Browser betrachten 72 kommt vom Webserver 73 R Rechtschreibreform 228 S Safari (Browser) 300 Scannen (Webseite) 231 Schreiben Absatzabstand 236 Abstand halten 236 Beispiel \ 242 Caipirinha (Übung) 244 für Maschinen 270 für Menschen 228 Hamburger Verständlichkeitsmodell 232 Hervorhebung 235, 275 Hyperlinks 240, 276 in der Sprache der Benutzer 272 Linklisten 241 Listen 235, 276 Pulitzer (Zitat) 233 Überschriften 234, 274 übersichtliches Schreiben 234, 272 umgekehrte Pyramide 233 und Hier-Syndrom 241 Zeilenabstand 236 Schriftart auf Webseiten 239 ComicSans 239 mit Serifen 237 ohne Serifen 237 Second Level Domains 66 Secure Shell (SSH) 170 Seitenbeschreibung (<meta>) 278, 282 Seitentitel (<title>) 278, 280 Skimmen 231 Social Media 97 Facebook 98 Twitter 98 und eigene Homepage 100 Social Networking 98 Sonderzeichen eingeben 19, 245 Statisches Webpublishing 86 Subdomain 64, 173 Suchmaschinen 53 Ablauf einer Suche 54 analysieren den Quelltext 274 durchsuchen nicht das Web 54 Google-Bombe 276 Keywords generieren 272 lesen den <head> 271 mögen Hyperlinks 286 Robots (Crawler) 54 Robots (Crawler, Spider) 270 Simulatoren 271 315
Stichwortverzeichnis T Third Level Domain. Siehe Subdomain Top Level Domains andere TLDs 160 Länderliste 65 Übersicht 64 Traffic (Datentransfer) 168 TYPO3 94 U Übersichtliches Schreiben 234, 272 URL 35 Aufbau 67 Aussprache 66 Groß- und Kleinschreibung 68 mit Slash am Ende 68 Uniform Resource Locator 66 V Verknüpfungen. Siehe Hyperlinks Verweise. Siehe Hyperlinks Vorbereitung roter Faden 127 W W3C 36 WAN (Wide Area Network) 25 Webanwendungen auf dem Webspace 91 Content Management Systeme 92 Kontaktformular 89 WebDAV 170 WebFTP 169 Webgrafiken 253 Webhosting 156, 162 Checkliste Kosten 164 Domainkonfiguration 173 eigener Server 167 Einstiegsangebote 165 Fachbegriffe 167 FTP-Zugang 170 nur E-Mail 165 Premiumklasse 166 Reservierung und Weiterleitung 165 Secure Shell (SSH) 170 statische Webseiten 165 Subdomain 173 Traffic 168 Überblick Webhoster 163 Vertragsbedingungen 164 verwirrende Preise 163 WebDAV 170 Webspace mit PHP und MySQL 166 wieviel Speicherplatz? 168 webhostlist.de 163 Weblog. Siehe Blog Webmail 173 Webpublishing Blogs 100 Content 111 Definition 86 eigene Domain 157 Interaktion 89 nach der Freischaltung 152 ohne eigene Domain 156 ohne eigene Site 98 statisches 86, 88 user generated content 112 wird interaktiv 88 Webseite besteht aus Quelltext 71 hat einmalige Adresse 34 scannen 231 sieben Qualitätskriterien 110 skimmen 231 und Website (Begriff) 36 Webserver 73 liefert Quelltext an Browser 73 Website. Siehe auch Homepage anders als Buch 39 und Webseite (Begriff) 36 Webspace 73 der eigene 162 Domainkonfiguration 173 Passwortschutz 172 316
Stichwortverzeichnis Subdomain 173 und E-Mail 173 wieviel Speicherplatz? 168 Webstandards 36 WeBuilder (Download) 305 WordPress als CMS 94 gehostet 102 World Wide Web 29 Ablauf einer Suche 54 als interaktives Medium 89 als weltweites Gewebe 35 Internet und Hypertext 30 und Navigation 39 Unterschied zum Internet 31 Webseite 34 Webstandards 36 World Wide Web Consortium. Siehe W3C WYSIWYG gibt's im Web nicht 304 was ist das? 302 X XAMP (Webhosting) 166 XING.com 99 Z Zeilenabstand 236 Zoom 229 Zugänglichkeit als Qualitätskriterium 115 und Suchmaschinen 277 317