HTML 1 2 Web Publishing 1 HTML HTML

HTML 1 - 2 Web Publishing 1

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

Il primo “mark-up”in html <HTML> <HEAD> <TITLE>La mia pagina di esempio</TITLE> </HEAD> <BODY> <H 1>Questa è una pagina HTML</H 1> </BODY> </HTML> • Editor? • http: //www. w 3. org/Mark. Up/html-test/ Web Publishing 3

Heading <H 1> … <H 6> Attributi: align=left|center|right Web Publishing 4

Paragrafo Divis. <DIV> Attributi: align=left|center|right Break Line Attributi: clear=left|right|all Web Publishing 5

Unordered List <UL> Attributi: type=disc|square|circle List Item <LI> Attributi: type=disc|square|circle Web Publishing 6

Ordered List <OL> Attributi: type=1|a|A|i|I start=numero List Item <LI> Attributi: type= 1|a|A|i|I value=numero Web Publishing 7

Def. List <DL> Term Name <DT> Term Def <DD> Web Publishing 8

Commenti  Web Publishing 9

Tutto sui link! • <A> – relative path Web Publishing 10

Interni e remoti • Link e Ancore • URL Web Publishing 11

URL • http: //www. foo. com/home/foo/homepage. html • ftp: //ftp. foo. com/home/foo/homepage. html • ftp: //username: password@ftp. foo. com/home/foo/homepage. html • file: ///dir 1/dir 2/file • mailto: internet_email_address • gopher: //gopher. myhost. com/ Web Publishing 12

Stili semantici Em, strong, dfn, code, samp, Kbd, var, cite Web Publishing 13

Font Style <TT>, , , <STRIKE>, <BIG>, , , , , <BASEFONT> Web Publishing 14

Preformatted Text <PRE> supporta i tag: IMG, B, SUP, SUB, SMALL, BIG, FONT Web Publishing 15

H rule <HR> Attributi: align=left|center|right noshade size=numero width=numero|percentuale Web Publishing 16

Indirizzo <ADDRESS> Web Publishing 17

Quotation <BLOCKQUOTE> Web Publishing 18

Crea tu!!! Web Publishing 19

I tipi di Immagine • Tipi: – Interne ed Esterne • includerle: – <IMG SRC=“image. gif”> SRC ~ HREF – ALIGN= TOP|MIDDLE|BOTTOM – VSPACE= – HSPACE= Web Publishing 20

Web Publishing 21

– ALIGN=LEFT|RIGHT • BR – CLEAR=LEFT|RIGHT|ALL Web Publishing 22

Web Publishing 23

Immagini e link • • <A HREF="index. html"><IMG SRC="uparrow. gif"></A> <HTML> BORDER= <HEAD> <TITLE>Motorcycle Maintenance: Removing Spark Plugs</TITLE> <BODY> <H 1>Removing Spark Plugs</H 1> <A HREF="replacing. html"><IMG SRC="arrowright. gif" ALIGN=BOTTOM></A> On to "Gapping the New Plugs" <A HREF="ready. html"><IMG SRC="arrowleft. gif" ALIGN=BOTTOM></A> Back to "When You Should Replace your Spark Plugs" <A HREF="index. html"><IMG SRC="arrowup. gif" ALIGN=BOTTOM></A> Up To Index <HR> </BODY> </HTML> Web Publishing 24

Immagini esterne? I grew some really huge <A HREF="bigtomatos. jpeg"> tomatos</A> in my garden last year Web Publishing 25

alternative • ALT=“il mio logo” <PRE> <IMG SRC="cow. gif" ALT=" ( ) Moo (oo) /***** || | ||****W|| * || || "> </PRE> Web Publishing 26

Dimensioni e previews • WIDTH • HEIGHT • LOWSRC Web Publishing 27

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 28

Quando usare immagini • • IL meno possibile!! ALT compresse le stesse!! Web Publishing 29

• Pagine leggibili da tutti i browser • Usa intestazioni e sottotitoli significativi • usa liste e menù a lista Web Publishing 30

• Navigational link back, up level and home • non troppa enfasi • non usare intere frasi come hiperlinks • usa un layout uniforme • max 60 K in ogni pagina!! • Max 65 k colori per le foto! • Firma le pagine: address • contact information (web master) • stato della pagina • last revised • copyright information Web Publishing 31

Tabelle • • Caption heading data border Web Publishing 32

Altezza e larghezza celle • in generale dinamica • puoi usare <NOWRAP> e • TABLE – – • WIDTH=numero o numero% CELLSPACING=2 CELLPADDING=2 BGCOLOR= TH TD – WIDTH=numero o numero% – BGCOLOR= Web Publishing 34

Costruiscila te! Web Publishing 35

Going live on the web Web Publishing 36