??

1
??µ??????a ?st?se??d?? se HTML ?a? FrontPage

• ?????aµµa ??aµ??f?s?? ???pt???a??? Sp??d??
• ?e?t???? G?afe?? ?p?st?????? ??pa?de?t???? ?????
• ????a?d??? ?e?ats??

2
HTML

• ?? ?st?se??de? e??a? ??aµµ??e? se µ?a e?d???
  ???ssa , t?? HTML (Hyper-Text Markup
  Language-???ssa s?µa?s?? ?p??-?e?µ????)
• ? HTML µp??e? ?a d?aßaste? ap? ?p???d?p?te
  ?p?????st? d?a??te? ??a web browser, ?p?? t?
  Internet Explorer

3
?a???sµ??? ?st?? - Web

• S????? p????f????? st?? ?p??e? ????µe p??sßas?
  µ?s? ??te??et µe t? p??t?????? http (hypertext
  transfer protocol)
• ?? http e??a? p??t?????? µetaf???? a??e???.

4
???t?????? HTTP

• HTTP HyperText Transfer Prolocol
• ???t?????? µetaf???? ?pe??e?µ????

?e??t?? Internet Explorer, Netscape, Mozilla,
Opera, Lynx
???p??et?t?? (webserver) IIS, Apache, TUX
5
URL ??e????s? st? ??te??et

• URL "Uniform Resource Locator". ??d??
  d?e????se?? ??a p????f???e? st? web p?? ???????
  µe s??t?µ?a, a???ße?a ?a? µ???s?µa?ta t? s?µe??
  ?p?? ß??s?? ?ta? ?? p????f???e?.

http//www.aua.gr/site/index.html
???t?????? ?p????????a?
???µa ap?µa???sµ???? ?p?????st?Web Server
T?s? a??e??? ?a? a??e?? p?? ??t?µe
6
???e?a

• S????? a??e?a p?? µetaf????ta? µ?s? p??t???????
  http. ???e?a p?? ? web browser ??e? t??
  d??at?t?ta ?a ape?????se?.
• ???e?a HTML text/html. ???e?a ?pe??e?µ???? se
  µ??f? HTML
• ???e?a e????a?. image/jpeg image/gif (.jpg,
  .gif, .png)
• ???e?a p???µ?s??. video/mpeg

7
??t?se?? HTTPS????e?? µ???d?? t?? p??t???????
http

• HTTP GET. ??t?µe ??a a??e?? ap? t?? e??p??et?t?
• HTTP POST. ??t?µe ??a a??e?? t?? e??p??et?t?,
  d????ta? ta?t?????a st?? e??p??et?t? ??p??e?
  pa?aµ?t????, µetaß??t??.
• HTTP PUT. St?????µe a??e?? st? e??p??et?t?.
  (???s?µ?p??e?ta? sp???a)
• HTTP HEAD
• HTTP DELETE
• HTTP OPTIONS
• HTTP TRACE

8
G?af??? st? d??t?a?? t?p?

• ??p?? a??e???
• Jpg F?t???af?e?
• Gif S??d?a, ?????µe?e? e????e?, ???µp??.
  ??e????t?µa ??af??e?a. ?e?????t?µa µ??? 256
  ???µata
• Png - S??d?a, ?????µe?e? e????e?, ???µp??.
  ??e????t?µa ??af??e?a. ?e?????t?µa µ??? 256
  ???µata
• ?????s? 72-100 dpi
• ????? µ??e??? a??e???

9
????µ?sa st? d??t?a?? t?p?

• Macromedia Flash
• Java applets
• Video, Streaming Video
• ????
• ???a Plugins

10
?a??de??µa a??e??? html

• lt!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2//EN"gt
  
• ltHTMLgt
• ltheadgt
• ltmeta http-equiv"Content-Type"
  content"text/html charsetiso-8859-7"gt
• lttitlegtAgricultural University of Athenslt/titlegt
• lt/headgt
• ltbodygt
• ltdiv align"center"gt
• ltpgtGe?p????? ?a?ep?st?µ?? ?????? lt/pgt
• ltpgtltimg src"http//www.aua.gr/gpa.jpg"
  width"450" height"317"gtlt/pgt
• lt/divgt
• lt/HTMLgt

11
?a??de??µa a??e??? html
12
html

• lt!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2//EN"gt
  
• ????e? t?? ??d?s? HTML t?? a??e???
• ltHTMLgt. . . . . . lt/HTMLgt
• ?????e? t?? a??? ?a? t? t???? e??? HTML a??e???
• ltHEADgt . . . . . lt/HEADgt
• ????e? pa?aµ?t????, ?d??t?te? t?? a??e??? (t?t??,
  ??d???p???s? ???ssa?, s????af?a)
• ltBODYgt . . . . . . . lt/BODYgt
• ????e? t? s?µa t?? ?e?µ????. ?? tµ?µa a?t? e??a?
  p?? fa??eta? st?? Browser.

13
Microsoft FrontPage

• ?????aµµa epe?e??as?a? t? ?p??? ß???? t?? ???st?
  ?a d?µ??????se? ?st?se??de? ????? ?a ??????e?
  HTML
• ?p??p??e? ?a? ep?ta???e? t?? a??pt??? ?st?se??d??
• WYSIWYG Editor

14
Microsoft FrontPage

• ?µf???s? ?a? ?e?t?????a pa??µ??a µe t?? Word
• ?a???e? d?e??????se?? ??a t?? d?µ??????a
  p???p????? ?a? d??t?a??? t?p??
• ?????? d?a?e???s? d??t?a??? t?p??

15
???a?e?

• ?a?????? d?µ?
• ??????? t?? ??s? t?? st???e??? t?? ?st?se??da?
• ??????? ??aµµ?? st??e? ?a? ?e??? µ?sa sta ?p??a
  e?t?ss??ta? t? ?e?µe?? ?a? ?? e????e? t??
  ?st?se??da?

16
???t?a??? ??p??

• ??????s? ?a? d?µ? t?? d??t?a??? t?p??
• ?e?t??????? d?µ?µ??? ?a? e????? p?????s? t??
  d??t?a??? t?p?? 
• ? ???st?? ?a p??pe? ?a e??a? se ??s? ?a apa?t?se?
  se e??t?µata p?? s?et????ta? µe t? p?? ß??s?eta?,
  p?? ???e, p?? µp??e? ?a p?e? ?a? t? p????f???e?
  ??e? st? d???es? t?? se ???e ep?ped?. 
• ?a???e? ??a t? d?µ? e??? d??t?a??? t?p??
• d?µ?
• pa???s?as?
• ?????? a?a???? t?? ???st?? t??

17
?etaf??? t?? d??t?a??? t?p?? st? e??p??et?t?

• ?etaf??? µ?s? t?p???? d??t???
• FTP (File Transfer Protocol)
• WebDav
• ?.a.

18
?etaf??? a??e??? µe FTP

• ? µetaf??? a??e??? µe FTP ???eta? µe t?? ß???e?a
  e??? p?????µµat?? pe??t? (client) FTP
• ?pa?a?t?t? ? ?pa??? ???a??asµ?? ???st? (username,
  password) st? ap?µa???sµ??? e??p??et?t?
• ??????µµata FTP e?t??? ftp t?? DOS, Internet
  Explorer, t? WS_FTP LE ?.a.
• ftp//ftp.aua.gr/pub/internet/misc/ws_ftple.exe

19
?etaf??? a??e??? µe FTP ???s?µ?p????ta? Internet
Explorer
20
?etaf??? a??e??? µe FTP ???s?µ?p????ta? Internet
Explorer
21
Microsoft FrontPage

• ??e??e?t?µata
• ??a??s?µ? ?a?? µe t? Microsoft Office
• ?µ??a µe??? ?a? ?e???sµ?? µe t? Word
• ?e???e?t?µata
• ?a???e? HTML p?? de? a??????e? ta p??t?pa µe
  ap?t??esµa ?a µ?? e??a? s?µßat? µe ????? t???
  browsers ?a? web server.

22
???aµ???? ?st?se??de?

• ?st?se??de? p?? d????? st? ???st? t?? d??at?t?ta
  a????ep?d?as?? µe t? pe??e??µe?? t???
• ?e???????e? p?? ?e?t??????? st? ???p??et?t?
• ?e???????e? p?? ?e?t??????? st? p????aµµa pe??t?
  (Internet Explorer, Mozilla)
• S??d?asµ?? t?? pa?ap???