Einfache Homepage (Website) 16.06.10 Ruedi Knupp.

Präsentation zum Thema: "Einfache Homepage (Website) 16.06.10 Ruedi Knupp."—  Präsentation transkript:

1 Einfache Homepage (Website) 16.06.10 Ruedi Knupp

2 Was ist eine HP Warum mache ich eine HP (Ziel) Wie macht man eine HP (mit welchem Programm) Was brauche ich für eine HP (Name, Provider für Platz im Netz) (Vertrag mit Switch für Name, Vertrag mit Provider, Entwurf, Ziel) Wie kommt diese HP ins Internet (allgemein) Wie kommt diese HP ins Internet (Methode Google) Was kostet das alles Teil 1 Erstellen einer normalen Website (allgemein) Teil 2 Erstellen mit einer Gratiswebsite (NVU) Teil 3 Erstellen einer Google-Website Allgemein

3 Was ist eine Homepage (Site, Abkürzg. HP) Eine HP ist eine Online-Anwendung, vergleichbar mit einer Vereins- oder Schülerzeitung, aber auch unter Kollegen, Interessengruppen etc. nur eben nicht gedruckt, sondern online und jederzeit und von jedem Ort von einem PC oder Handy aus abrufbar. Sie kann öffentlich oder privat sein, der Zugang kann mittels Passwort geschützt werden. Es können diverse Informationen darin enthalten sein, sowohl Text, als auch Videos, Fotos, Kalender, Präsentationen, Anhänge, oder mittels Links ganze Abhandlungen, welche sich an einem anderen Ort im Internet befinden. Allgemein

4 Warum mache ich eine HP?/ Ziel Allgemein Familienwebsite: Kontakt mit weiter weg wohnenden Familienmitgliedern Für Vereine aller Art: Information an Mitglieder, Pro- gramme, Fotos von Events, etc. Geschäftswebsite: Vorstellung von Firmen, Werbung, Mitarbeiter, Online-Shop, etc. Wissenschaft und Forschung: Austausch von Forschungsresultaten, Arbeit an gemeinsamen Projekten, etc. Politik: Werbung für Parteien und Personen, Parteiprogramme, Einladungen, etc. Sport: Sportvereine, Resultate, Rekorde, etc. Eine HP hat feste und variable Teile. Eine HP, welche nie verändert wird, macht keinen Sinn

5 Wie entsteht eine HP? 1.Die HP wird mit einem bekannten Programm erstellt (z.B. einem kostenpflichtigen Microsoft Frontpage oder Dreamweaver, Adobe, etc. und gleichzeitig in die HTML-Sprache umgesetzt (ein Muss für alles, was ins Internet geht) und dann mit einem FTP- Programm ins Internet hochgeladen 2.Es gibt einige Gratisprogramme, welche bei der Erstellung helfen. Diese Firmen verpflichten dann den Nutzer vielfach zum Hosting(= Gastplatz im Internet). Teilweise ist das Hosting bei Websites gratis, bei einigen sogar die Erstellung der HP (aber nur bei kleineren Sites von 2-4 Seiten) Allgemein

6 Was braucht es alles für eine HP? 1.Einen geschützten Namen (reservieren bei www.switch.ch, Kosten Fr. 17.- pro Jahr) www.switch.ch 2. Einen Provider für das Hosting, er stellt den Platz im Internet zur Verfügung (z.B.: Glattnet, Bluewin, Sunrise, etc.) 3. Ein Editor-Programm für die Erstellung der HP Text- und HTML- Form (Internet-Sprache) 4. Ein FTP-Programm für den Transport der HP ins Internet Allgemein

7 Bilder behandeln/ hochladen Allgemein Bilder und Fotos unter Eigene Bilder speichern und in Picasa bearbeiten Aus Picasa in Webalbum hochladen, Achtung: in Picasa anmelden (oben rechts) Aus Webalbum kopieren und in HP einsetzen, entweder in Tabelle oder im Text mit Cursor Alternative: In Webalbum Bild suchen, rechts klicken und auf Bild-URL kopieren klicken. Beim Einsetzen auf Einfügen und Webadresse URL klicken. Dann enter/ die kopierte Adresse zeigt sich bei Bild-URL. Enter und das Bild ist eingesetzt Text kann direkt kopiert und eingefügt werden

8 Was kostet das alles? TextBeispielKosten ca. 1.NamenreservationSwitch.chFr. 17.-- pro Jahr 2.Provider (Kosten variabel je nach Grösse) Glattnet Walli Confixx 3 Google Fr. 20.-- pro Mt. Fr. 5.90 pro Mt. gratis 3.Editor-ProgrammMS Frontpage 2003 Dreamweaver Adobe Google Ca. Fr. 160.-- Gratis 4.FTP-ProgrammCute (Global Scape Wiese, etc. Ca. Fr. 90.-- (Kauf) Allgemein

9 Vorgehen für die Erstellung einer HP 1.Erstellen eines Entwurfes z.B. mit Word (wie ein Prospekt). Beispiel: AAWalli auf Word Siehe nächste Seite 2.Reservieren des Namens bei: www.switch.chwww.switch.ch 3.Vertrag mit einem Provider, er schaltet den Platz für die künftige HP auf (z.B. Glattnet, Bluewin, etc.) 4.Übertragen der HP vom Word-Entwurf auf das Editor-Programm, Erstellen der Navigation (siehe Beschrieb) 5.Kontrolle der HP mittels Browser z.B. Internet Explorer, Mozilla, etc. ( simuliert das Internet ) 6.Hochladen der HP ins Internet mittels FTP- Programm Analog Computeria-Wallisellen Allgemein

10 Mit NVU Muster einer HP-Seite in Word

11 Mit NVU 1.Programm NVU herunterladen http://www.nvu- composer.de/ Version 1.0http://www.nvu- composer.de/ 2.Entwurf (auf Word vorbereitet) öffnen, im gleichen Ordner ablegen 3.Programm NVU öffnen, Neu anklicken. Auf dem Tabs steht noch Unbekannt, das ändert sich beim Speichern der Seite (z.B.: Home) im vorbereiteten Ordner aktivalter.chaktivalter.ch 4.Musterseiten aus Wordentwurf öffnen, unter Bearbeiten alles auswählen, kopieren der Seite 5.Direkt auf die entsprechende Seite im NVU Programm gehen und Einfügen 6.Dies gilt für alle Seiten gemäss Entwurf. Die HP ist fertig erstellt, muss jetzt aber noch mit einem FDP zum Provider hochgeladen werden Erstellen einer HP mit NVU-Programm

12 Erstellen Site mit Google Ausgangslage: Gleicher Entwurf wie für vorherigen Teil Word- Muster Anmeldung: Bei Gmail anmelden, dort oben links auf Mehr klicken und dort auf Sites Dann Neue Site erstellen Vorlage auswählen, Motiv auswählen, Anmeldung aus- füllen, unter Optionen die Freigabe wählen: a) jeder kann diese Site ansehen oder b) nur von mir bestimmte Personen können diese Site ansehen Google

13 Anmeldung

14 Google nach Anmeldung (erste Seite erstellen)

15 Gestaltung von Layouts und Seite (Motiv aussuchen)) Google

16 Nach Anmeldung (Logo bereits eingesetzt ) Achtung: Bilder (wie das Logo) müssen im Picasa bearbeitet und dann ebenfalls mit Picasa in Webalben hochgeladen werden. Dort können sie direkt in die einzelnen Seiten kopiert werden. Texte können direkt aus dem Word-Entwurf kopiert und in die Homepageseiten eingesetzt werden

17 Google Entwurf in Word Beispiel: Seite Vorstand Die Fotos aus Picasa müssen hochgeladen werden. Damit sie dort sind, wo wir wollen, wurden sie in Tabellenform eingesetzt Bild 1 Bild 2

18 Google Beispiel: Seite VereinBeispiel: Seite Wer sind Wir ? Entwürfe in Word

19 Google Anpassung und Veränderung des Layouts

20 Google Nach Gestaltung: In Google Sites kann man unter Site- Einstellungen einige Stichwörter eingeben, die dann von Google zum Auffinden genutzt werden. Ich habe es mal mit Computeria, Wallisellen, Senioren versucht. Gesamt-Homepage-Link (Beispiel: https://sites.google.com/site/aktivesalter/home https://sites.google.com/site/aktivesalter/home Vergleich: www.aktivalter.ch (zum Suchen einfacher) GoogleEine Google Webseite (Domain) kann man bei http://www.united-domains.de (siehe Beispiel: nächste Folie)http://www.united-domains.de Man könnte z.B. www.aktivesalter.com für 12.-- EUR im Jahr mieten und dann auf der Google Seite eintragen.

21 Reservation und Umleitung einer Google HP

22 Schlussfolgerungen Wenn man die Prospekte der Provider ansieht, ist alles absolut einfach. In Wirklichkeit braucht es aber doch relativ gute Kenntnisse, um eine HP zu erstellen und zu unterhalten. Eine HP vom Provider erstellen zu lassen, kostet je nach Umfang und Komplexität ca. Fr. 500.-- bis 1000.--. Der Unterhalt ist dann allerdings wesentlich einfacher. Beispiel der Computeria-HP auf Google erstellt von Joachim Vetter. https://sites.google.com/site/computeriawallisellen / https://sites.google.com/site/computeriawallisellen /