Web Publishing1 HTML 1- 2. Web Publishing2 HTML HTML & WYSIWYG, struttura & lay-out!! testo.

Web Publishing 1

HTML 1- 2

Web Publishing 2

HTML• HTML & WYSIWYG, struttura & lay-out!!• <Tag> testo </Tag>

Web Publishing 3

<HTML>

<HEAD>

<TITLE>La mia pagina di esempio</TITLE>

</HEAD>

<BODY>

<H1>Questa è una pagina HTML</H1>

</BODY>

</HTML>

• Editor?

• http://www.w3.org/MarkUp/html-test/

Il primo “mark-up”in html

Web Publishing 4

Heading <H1> … <H6>

Attributi:

align=left|center|right

Web Publishing 5

Paragrafo <P> Divis. <DIV>

Attributi:align=left|center|right

Break Line <BR>Attributi:clear=left|right|all

Web Publishing 6

Unordered List <UL>

Attributi:type=disc|square|circle

List Item <LI>

Attributi:type=disc|square|circle

Web Publishing 7

Ordered List <OL>Attributi:type=1|a|A|i|Istart=numero

List Item <LI>Attributi:type= 1|a|A|i|Ivalue=numero

Web Publishing 8

Def. List <DL>

Term Name <DT>

Term Def <DD>

Web Publishing 9

Commenti

Web Publishing 10

Tutto sui link!• <A>

– relative path

Web Publishing 11

• Link e Ancore

Interni e remoti• URL

Web Publishing 12

URL• http://www.foo.com/home/foo/homepage.html

• ftp://ftp.foo.com/home/foo/homepage.html

• ftp://username:[email protected]/home/foo/homepage.html

• file:///dir1/dir2/file

• mailto:internet_email_address

• gopher://gopher.myhost.com/

Web Publishing 13

Stili semanticiEm, strong, dfn, code, samp, Kbd, var, cite

Web Publishing 14

Font Style<TT>,<I>,<B>,<STRIKE>,

<BIG>,<SMALL>,<SUB>,

<SUP>,<FONT>,<BASEFONT>

Web Publishing 15

Preformatted Text

<PRE>

supporta i tag:

IMG, B, SUP, SUB, SMALL,

BIG, FONT

Web Publishing 16

H rule <HR>

Attributi:align=left|center|rightnoshadesize=numerowidth=numero|percentuale

Web Publishing 17

Indirizzo <ADDRESS>

Web Publishing 18

Quotation

<BLOCKQUOTE>

Web Publishing 19

Crea tu!!!

Web Publishing 20

I tipi di Immagine

• Tipi:– Interne ed Esterne

• includerle:– <IMG SRC=“image.gif”> SRC ~ HREF

– ALIGN= TOP|MIDDLE|BOTTOM

– VSPACE=

– HSPACE=

Web Publishing 21

Web Publishing 22

– ALIGN=LEFT|RIGHT

• BR– CLEAR=LEFT|RIGHT|ALL

Web Publishing 23

Web Publishing 24

Immagini e link

• <A HREF="index.html"><IMG SRC="uparrow.gif"></A>

• BORDER=<HTML><HEAD><TITLE>Motorcycle Maintenance: Removing Spark Plugs</TITLE><BODY><H1>Removing Spark Plugs</H1><P><A HREF="replacing.html"><IMG SRC="arrowright.gif" ALIGN=BOTTOM></A>On to "Gapping the New Plugs"<BR><A HREF="ready.html"><IMG SRC="arrowleft.gif" ALIGN=BOTTOM></A>Back to "When You Should Replace your Spark Plugs"<BR><A HREF="index.html"><IMG SRC="arrowup.gif" ALIGN=BOTTOM></A>Up To Index</P><HR></BODY></HTML>

Web Publishing 25

Immagini esterne?

<P>I grew some really huge <A HREF="bigtomatos.jpeg"> tomatos</A> in my garden last year</P>

Web Publishing 26

alternative

• ALT=“il mio logo” <PRE> <IMG SRC="cow.gif" ALT=" ( )Moo (oo)

\ /*****\ || | \ ||****W|| * || ||">

</PRE>

Web Publishing 27

Dimensioni e previews

• WIDTH

• HEIGHT

• LOWSRC

Web Publishing 28

Font & body color

• N. esadecimale #000000 #FFFFFF

• Black, White, Green, Maroon, Olive, Navy, Purple, Gray, Red, Yellow, Blue, Teal, Lime, Aqua, Fuchsia, or Silver

• BODY– BGCOLOR

– TEXT, LINK, VLINK, ALINK

– BACKGROUND=“images.gif”

• FONT– COLOR=

Web Publishing 29

Quando usare immagini

• IL meno possibile!!

• ALT

• compresse

• le stesse!!

Web Publishing 30

•Pagine leggibili da tutti i browser

•Usa intestazioni e sottotitoli significativi

•usa liste e menù a lista

Web Publishing 31

•Navigational link back, up level and home

•non troppa enfasi

•non usare intere frasi come hiperlinks

•usa un layout uniforme

•max 60K in ogni pagina!!

•Max 65k colori per le foto!

•Firma le pagine:address

•contact information (web master)

•stato della pagina

•last revised

•copyright information

Web Publishing 32

Tabelle

• Caption

• heading

• data

• border

Web Publishing 34

• in generale dinamica• puoi usare <NOWRAP> e <BR>

• TABLE– WIDTH=numero o numero%

– CELLSPACING=2

– CELLPADDING=2

– BGCOLOR=

• TH TD– WIDTH=numero o numero%

– BGCOLOR=

Altezza e larghezza celle

Web Publishing 35

Costruiscila te!

Web Publishing 36

Going live on the web

Web Publishing1 HTML 1- 2. Web Publishing2 HTML HTML & WYSIWYG, struttura & lay-out!! testo.

Documents

Transcript of Web Publishing1 HTML 1- 2. Web Publishing2 HTML HTML & WYSIWYG, struttura & lay-out!! testo.