4. Μπαλατσούκας Νικόλαος

SOS όπου βλέπετε (….> να αντικατασταθεί με <….>



Παράδειγμα = θέλω να γράφει
Μαρία Νικολάου
maria@gmail.com
maria.blogspot.com
----- θα πρέπει να γράψω στον κώδικα
(html>
(head>
(title> test (/title>
(body>
Μαρία Νικολάου (br>
(a href = “mail to : maria@gmail.com”>
maria@gmail.com (/a> (br>
(a href = “maria.blogspot.com”>
Maria.blogspot.com(/a>
(/body>
(/html>
Αν θέλω να συνεχίσω τη λίστα μου με άλλο όνομα τότε αντιγράφω από το κάτω μέρος του (body> μέχρι και το τέλος του (body> δηλαδή από το Μαρία Νικολάου έως και το maria.blogspot.com(/α>

Κάθε σελίδα html πρέπει απαραιτήτως να περιέχει=
(html>
(head>
(title> test (/title>
(/head>
(body>
…
…
…
(/body>
(/html>


Π Ι Ν Α Κ Ε Σ

Πίνακας = (table> (/table>
Σειρά = (tr> (/tr>
Κελί = (td> (/td>
Περίγραμμα - πλαίσιο = (table border = “1”> χωρίς κλείσιμο ιδιαίτερο. Κλείνει απλώς (/table>
Χρώμα περιγράμματος = (table border = “1” bordercolor = “green” or “#00ff00”>
Χρώμα σε συγκεκριμένο κουτάκι = (td bgcolor = “red”>
για να γράψω μέσα στο κάθε κελί του πίνακα = (table> (tr> (td> ονοματεπώνυμο (/td> (td> blog (/td> (td> e-mail (/td> (/tr> (/table>
πλάτος πίνακα = (table width = “500”> ή (table width = 80%> sos η συγκεκριμένη ανάλυση οθόνης είναι περίπου 1.000 pixel. Όμως για να μην βγάζει λάθη καλό θα είναι να χρησιμοποιούμε το “800” και όχι το 80%
Θέση πίνακα = algin = “center” ή “left” ή “right”
πχ (table border = “1” Bordercolor = “green” algin = “center”>
κατακόρυφη στοίχιση πίνακα= valign = “middle” ή “top” ή “bottom”
ύψος κελιού πίνακα = height = 80%
για να προσθέσω εικόνες σε πίνακα = (table> (tr> (td> (img src = “1.jpg”> (/td>

##############################################################

πώς αναρτούμε ιστοσελίδες
(html> (head> (title> test (/title> (/head> (/html>
(table width = 100% border = “0”
(tr>
(td width = “200” valign = “top”>
Test 1
(/td>

(td valign = “top”>


Test 2
(/td>
(/tr>
(/table>

2η κίνηση όπου test 1 το αντικαθιστώ με =
(a href = “page1.html”> ποιοι είμαστε (/a> (br>
(a href = “page2.html”> προϊόντα (/a> (br>
(a href = “page3.html”> επικοινωνία (/a> (br>

3η κίνηση πρέπει να βάλω σελίδες στα page 1, page 2, page 3. για να γίνει αυτό, μέσα στο φάκελο (c:\βεζύρη βίκυ….. αντιγράφω 3 φορές τον φάκελο «πίνακας σε πίνακα» και τα ονομάζω page1.html, page2.html, page3.html. πρέπει να βάλω περιεχόμενο σε κάθε σελίδα.
4η κίνηση μπαίνω στον 1ο φάκελο και γράφω στη θέση test 2 το τι θέλω να δείχνει το link. Το ίδιο κάνω και με τον 2ο και 3ο φάκελο.

Για να βγάζει link σε νέους συνδέσμους πχ google, αρχικά δημιουργώ έναν νέο 4ο φάκελο (p> σύνδεσμοι (br>
(a href=”http//www.google.com”> google (/a> (/p>

Για να κάνω μια εικόνα link
(img src=”1.jpg”>

Αν θέλω πατώντας την εικόνα να ανοίγει νέο link
(a href=http://www.google.com>
(img src=”1.jpg”>
(/a>

Πίνακας μέσα σε πίνακα
(table>
(tr>
(td>


Test 1


(/td>
(/tr>


Test 2

(/td>

(/table>

Για να βάλω 2ο πίνακα μέσα στη θέση πχ του test 2, τότε μέσα στη θέση αυτή γράφω
(tr> (td> όνομα (/td> (td> vasiliki (/td>(/tr>
(tr> (td> επώνυμο (/td> (td> veziri (/td>(/tr>
………….
(/table>



Για να προσθέσω video στην ιστοσελίδα
Αρχικά δημιουργώ έναν κενό .html φάκελο. Ανοίγω το www.youtube.com. Βάζω να παίξει ένα video. Δεξιά βγάζει τη λέξη embet και από κάτω έναν κώδικα. Αντιγράφω τον κώδικα στον κενό .html φάκελο.









Πώς φτιάχνω σελίδα η οποία καλεί δύο άλλες σελίδες πχ. Σελίδα index.html

Στη σελίδα index γράφω
(frameset cols = “200,*”>
(frame src = “left.html”>
(frame src = “right.html”>
(/frameset>
Με αυτόν τον τρόπο δημιουργώ έναν πίνακα με δύο στήλες. Το πλάτος της πρώτης (αριστερής – left) στήλης είναι 200. το πλάτος της δεύτερης (δεξιάς – right) στήλης είναι το υπόλοιπο * και πιο μεγάλο (φαρδύ) μέρος.

Φτιάχνω τις 2 σελίδες left.html και right.html

Στη σελίδα index γράφω
……..(frame src = “right.html” name = “frame1”>

Μέσα στη σελίδα left.html γράφω
(html>(head>(title> test (/title> (/head>
(body>
(a href= http://www.google.com target = “frame1”> google (/a>
(/body> (/html>


Hr= τραβάει οριζόντια γραμμή και πάει το κείμενο από κάτω
Background = για να κάνω μια εικόνα φόντο

Αν θέλω να δημιουργήσω μια ιστοσελίδα με left + right αλλά να γράφει πχ ποιοι είμαστε, προϊόντα, επικοινωνία, τότε μέσα στο φάκελο προσθέτω 3 αρχεία .html, στα οποία γράφω μόνο με απλά γράμματα ότι θέλω να γράψω (=χωρίς κώδικα)

www.telegraph.co.uk --- digital life --- 101 most usefull sites

ιστοσελίδα μαγαζιού Αγγελικής
κατ’ αρχήν θα πρέπει τα link να μπουν οριζόντια και όχι κάθετα (αν είναι μέχρι 4 τότε τα βάζω οριζόντια).
(html>
(head>
(title> ιστοσελίδα μαγαζιού Αγγελικής (/title>
(/head>
(body>

(table>
(tr> (td> (img src=”1.jpg”> (/td> (/tr>

(tr> (td>
(a href=”page1.html”> ποιοι είμαστε (/a>
(a href=”page2.html”> προϊόντα (/a>
(a href=”page3.html”> δραστηριότητες (/a>
(a href=”page4.html”> φωτογραφίες (/a>
(/td> (/tr>

(td> (tr>
………………
………….
(/td> (/tr> (/table>

(/body>
(/html>

Ετικέτες τίτλου
Γράφονται πριν από τον τίτλο. Για να καταλάβει ότι ξεκινάει μια ετικέτα πρέπει να αρχίζει με meta.
Για ελληνικά = char set=windows-1253
(html>
(head>
(meta http-e quiv=”content-type” content=”text/html; char set=windows-1253”>
(meta name=”keywords” content= “elevator, electronics”> (=θα βάζω το τι θέλω πχ hotel, Greece)
(meta name = “description” content = “this is a Greek hotels, apartments and villa’s guide”> (=περιγραφή)
(title> test (/title>
(/head>
(body test = “green” alink = “green” (= τι χρώμα θα έχει το χεράκι όταν το πατάω) link = “red” (τι χρώμα θα έχουν τα link) vlink = “yellow” (τι χρώμα θα έχει όταν θα το έχω επισκεφτεί )>
Πώς να ενημερώνομαι για το html = www.w3schools.com και www.w3.org
Στήλες πίνακα = (tr>

Photoshop
Οι φωτογραφίες χρησιμοποιούνται σε τίτλους και σαν background

Ανάρτηση σελίδων
1 να κατοχυρώσω domain name. Το κατοχυρώνω από τους καταχωρητές. Κατ’ αρχήν πάω στο www.gr. Καταχωρητές = papaki.gr, hoster.gr, ip.gr, forthnet.gr. για να κατοχυρώσω domain πληρώνω 23€ την διετία

2 πρέπει να βρω server = ο υπολογιστής που θα πρέπει να βάλω τα αρχεία. Ο server κρίνεται από τον
Χώρο = 100ΜΒ 1GB 10GB 100GB
Badwidth = 1GB 10GB 100GB 1TB
Ετησίως = 50€ 100€ 150€ 200€
Badwidth = η κίνηση των αρχείων που μετακινούνται προς τον χρήστη ανά μήνα. Χρεώνεται από 50€ και επάνω.

3 θα χρησιμοποιήσω ένα πρόγραμμα FTP για να μεταφέρει τα αρχεία στον server. Είναι δωρεάν














#############################################################
παραδείγματα

ΠΑΟΚ – ΑΕΚ 9:00μμ
ΟΣΦΠ - ΑΡΗΣ 8:00μμ

(Table border = “1” align = “center” table width = 100% valign = “middle” heght = 100%
(tr> (tr valign = “middle ‘ align = “center”> ΠΑΟ – ΑΕΚ (/td>
(td valign = “middle” align = “center”> 9:00μμ (/td> (/tr>

(tr> (tr valign = “middle ‘ align = “center”> ΟΣΦΠ - ΑΡΗΣ (/td>
(td valign = “middle” align = “center”> 8:00μμ (/td> (/tr>

(/table>
test
το πρώτο μου test
σήμερα είναι 1/4/2008 και κάνω το πρώτο μου test

(table border = "1" width = 80% height = 80% align = "center">
(tr> (td align = "center" valign= "middle"> test (br>
το πρώτο μου test

σήμερα είναι 1/4/2008 και κάνω το πρώτο μου test (br>

(/td>(/tr>
(/table>