Εισαγωγή στη δημιουργία ιστοσελίδων Διδάσκων:

Παρουσίαση με θέμα: "Εισαγωγή στη δημιουργία ιστοσελίδων Διδάσκων:"— Μεταγράφημα παρουσίασης:

1 Εισαγωγή στη δημιουργία ιστοσελίδων Διδάσκων:
Πανεπιστημιακό κέντρο εκπαίδευσης επιμορφωτών Δυτικής Ελλάδας Πανεπιστήμιο Πατρών, ΤΕΕΑΠΗ - Πανεπιστήμιο Πελοποννήσου, ΤΚΕΠ Εκπαίδευση Επιμορφωτών Β΄Επιπέδου Ενότητα 3.2.3: Εισαγωγή στη δημιουργία ιστοσελίδων Διδάσκων: Χρήστος Κατσάνος -

2 Η γλώσσα HTML (1/2) Οι Ιστοσελίδες είναι γραμμένες σε μια ειδική γλώσσα, την HTML (Hyper-Text Markup Language-γλώσσα σήμανσης υπέρ-κειμένου) Η HTML μπορεί να διαβαστεί από οποιοδήποτε υπολογιστή διαθέτει ένα web browser (π.χ. Internet Explorer)

3 Η γλώσσα HTML (2/2)

4 Τυπικές Ετικέτες

5 Ετικέτες Κειμένων

6 Ετικέτες Υπερσυνδέσμων

7 Ετικέτες Υπερσυνδέσμων

8 Ετικέτες Δημιουργίας Λίστας

9 Σημασιολογικές Ετικέτες

10 Ετικέτες εικόνων

11 Ετικέτες Φορμών

12 Ετικέτες Πινάκων

13 Δραστηριότητα Πειραματισμός με ετικέτες

14 Microsoft FrontPage Υποστηρίζει την ανάπτυξη ιστοσελίδων χωρίς απαραίτητη γνώση HTML Απλοποιεί και επιταχύνει την ανάπτυξη Ιστοσελίδων WYSIWYG – What You See Is What You Get

15 Δημιουργία Ιστοτόπου στο FrontPage (1/2)
Σταύρος Καμμάς, Πανεπιστήμιο Αιγαίου

16 Δημιουργία Ιστοτόπου στο FrontPage (2/2)
Σταύρος Καμμάς, Πανεπιστήμιο Αιγαίου

17 Ιστοσελίδες & Προβολές
Σταύρος Καμμάς, Πανεπιστήμιο Αιγαίου

18 Ιδιότητες Ιστοσελίδας (1/4) File > Properties
Σταύρος Καμμάς, Πανεπιστήμιο Αιγαίου

19 Ιδιότητες Ιστοσελίδας (2/4) File > Properties
Σταύρος Καμμάς, Πανεπιστήμιο Αιγαίου

20 Ιδιότητες Ιστοσελίδας (3/4) File > Properties
Σταύρος Καμμάς, Πανεπιστήμιο Αιγαίου

21 Ιδιότητες Ιστοσελίδας (4/4) File > Properties
Σταύρος Καμμάς, Πανεπιστήμιο Αιγαίου

22 Προσθήκη & Μορφοποίηση Κειμένου
Σαν το Word! To Frontpage δημιουργεί αυτόματα τον απαραίτητο HTML κώδικα για αυτά που γράφετε. Σταύρος Καμμάς, Πανεπιστήμιο Αιγαίου

23 Προβολή Περιήγησης Ιστοτόπου (1/2)
Σταύρος Καμμάς, Πανεπιστήμιο Αιγαίου

24 Προβολή Περιήγησης Ιστοτόπου (2/2)
Σταύρος Καμμάς, Πανεπιστήμιο Αιγαίου

25 Εισαγωγή Πίνακα σε Ιστοσελίδα
Σταύρος Καμμάς, Πανεπιστήμιο Αιγαίου

26 Ιδιότητες Πίνακα Δεξί Κλικ > Table Properties
Σταύρος Καμμάς, Πανεπιστήμιο Αιγαίου

27 Διατάξεις Σελίδας (με Πίνακες) Table > Layout Table and Cells
Σημείωση: Είναι προτιμότερο να χρησιμοποιούνται CSS (Cascading Style Sheets) για τη διάταξη

28 Εισαγωγή Εικόνας σε Ιστοσελίδα & Ιδιότητες
Insert > Picture Δεξί Κλικ > Picture Properties Σταύρος Καμμάς, Πανεπιστήμιο Αιγαίου

29 Δημιουργία Υπερσυνδέσμου Επιλέγω το κείμενο!! + Insert > Hyperlink
Εσωτερικός Υπερσύνδεσμος (στον ίδιο ιστότοπο) Εξωτερικός Υπερσύνδεσμος (σε άλλον ιστότοπο) Σταύρος Καμμάς, Πανεπιστήμιο Αιγαίου

30 Εισαγωγή Βίντεο σε Ιστοσελίδα Insert > Picture > Video

31 Χρήσιμα FREE εργαλεία GoogleSites - https://sites.google.com/
Wix -