Web Design I Technical Slides. Internet Friend or Foe.
-
Upload
pearl-matthews -
Category
Documents
-
view
218 -
download
3
Transcript of Web Design I Technical Slides. Internet Friend or Foe.
![Page 1: Web Design I Technical Slides. Internet Friend or Foe.](https://reader035.fdocuments.in/reader035/viewer/2022062517/56649e7a5503460f94b7ac40/html5/thumbnails/1.jpg)
Web Design I
Technical Slides
![Page 2: Web Design I Technical Slides. Internet Friend or Foe.](https://reader035.fdocuments.in/reader035/viewer/2022062517/56649e7a5503460f94b7ac40/html5/thumbnails/2.jpg)
InternetFriend or Foe
![Page 3: Web Design I Technical Slides. Internet Friend or Foe.](https://reader035.fdocuments.in/reader035/viewer/2022062517/56649e7a5503460f94b7ac40/html5/thumbnails/3.jpg)
Updated 8/17/2008 Scott Nelson, Instructor [email protected]
3
What is the Internet?• A single computer• A Network connects workstations to a Server• Servers
– File and Print– Application– Web
• A Local Area Network (LAN)• A Wide Area Network (WAN)• A network of networks
![Page 4: Web Design I Technical Slides. Internet Friend or Foe.](https://reader035.fdocuments.in/reader035/viewer/2022062517/56649e7a5503460f94b7ac40/html5/thumbnails/4.jpg)
Updated 8/17/2008 Scott Nelson, Instructor [email protected]
4
How did the Internet start?• Advanced Research Projects Agency Network, was started
in the 1960's by the U.S. Defense Department. ARPANet is the predecessor to the Internet.
• De-centralized• No single network administrator• Runs on TCP/IP
![Page 5: Web Design I Technical Slides. Internet Friend or Foe.](https://reader035.fdocuments.in/reader035/viewer/2022062517/56649e7a5503460f94b7ac40/html5/thumbnails/5.jpg)
Updated 8/17/2008 Scott Nelson, Instructor [email protected]
5
Network Models• Network Interface
Layer– Physical– Datalink
• Network Layer– Internet Protocol (IP)
• Transport Layer– Transfer Control
Protocol (TCP)
• Application Layer– Presentation– Session– Application
![Page 6: Web Design I Technical Slides. Internet Friend or Foe.](https://reader035.fdocuments.in/reader035/viewer/2022062517/56649e7a5503460f94b7ac40/html5/thumbnails/6.jpg)
Updated 8/17/2008 Scott Nelson, Instructor [email protected]
6
HTTP• HTTP
Hypertext Transfer Protocol
• Hyperlink
• Hypertext
![Page 7: Web Design I Technical Slides. Internet Friend or Foe.](https://reader035.fdocuments.in/reader035/viewer/2022062517/56649e7a5503460f94b7ac40/html5/thumbnails/7.jpg)
Updated 8/17/2008 Scott Nelson, Instructor [email protected]
7
Internet Protocols• HTTP (Port 80)• HTTPS (Port 433)• E-mail (Port 25)• FTP
File Transfer Protocol (Port 21)• Gopher (Port 70)• RTSP
Real Time Stream Control Protocol (Port 554)• Telnet (Port 23)
![Page 8: Web Design I Technical Slides. Internet Friend or Foe.](https://reader035.fdocuments.in/reader035/viewer/2022062517/56649e7a5503460f94b7ac40/html5/thumbnails/8.jpg)
Updated 8/17/2008 Scott Nelson, Instructor [email protected]
8
ASCII/HTML• ASCII
American Standard Code for Information Interchange
• HTMLHypertext Markup Language
![Page 9: Web Design I Technical Slides. Internet Friend or Foe.](https://reader035.fdocuments.in/reader035/viewer/2022062517/56649e7a5503460f94b7ac40/html5/thumbnails/9.jpg)
Updated 8/17/2008 Scott Nelson, Instructor [email protected]
9
XHTML and XML• XHTML
Extensible HTML
• XMLExtensible Markup Language
![Page 10: Web Design I Technical Slides. Internet Friend or Foe.](https://reader035.fdocuments.in/reader035/viewer/2022062517/56649e7a5503460f94b7ac40/html5/thumbnails/10.jpg)
Updated 8/17/2008 Scott Nelson, Instructor [email protected]
10
The Web Browser• Internet Explorer• Firefox• Netscape• Safari
• Opera• AOL• Google?!??!Source:
http://www.w3schools.com/browsers/browsers_stats.asp
2007 IE7 IE6 IE5 Fx Moz S OJ uly 20.10% 36.90% 1.50% 34.50% 1.40% 1.50% 1.90%J une 19.70% 37.30% 1.50% 34.00% 1.40% 1.50% 1.80%May 19.20% 38.10% 1.60% 33.70% 1.30% 1.50% 1.70%April 19.10% 38.40% 1.70% 32.90% 1.30% 1.50% 1.60%March 18.00% 38.70% 2.00% 31.80% 1.30% 1.60% 1.60%February 16.40% 39.80% 2.50% 31.20% 1.40% 1.70% 1.50%J anuary 13.30% 42.30% 3.00% 31.00% 1.50% 1.70% 1.50%
![Page 11: Web Design I Technical Slides. Internet Friend or Foe.](https://reader035.fdocuments.in/reader035/viewer/2022062517/56649e7a5503460f94b7ac40/html5/thumbnails/11.jpg)
Updated 8/17/2008 Scott Nelson, Instructor [email protected]
11
Browser plug-ins• Adobe Flash
• Adobe Acrobat
• Adobe Shockwave
• Apple QuickTime
• Microsoft SilverLight
• Real Player
• Sun Java
![Page 12: Web Design I Technical Slides. Internet Friend or Foe.](https://reader035.fdocuments.in/reader035/viewer/2022062517/56649e7a5503460f94b7ac40/html5/thumbnails/12.jpg)
Updated 8/17/2008 Scott Nelson, Instructor [email protected]
12
Music• Ghetto Gospel, by Tupac Shakur, is inspired
by which Elton John / Bernie Taupin song?
![Page 13: Web Design I Technical Slides. Internet Friend or Foe.](https://reader035.fdocuments.in/reader035/viewer/2022062517/56649e7a5503460f94b7ac40/html5/thumbnails/13.jpg)
Updated 8/17/2008 Scott Nelson, Instructor [email protected]
13
Music• Ghetto Gospel, by Tupac Shakur, is inspired
by which Elton John / Bernie Taupin song?
• Indian Sunset– From Mad Man Across the Water
![Page 14: Web Design I Technical Slides. Internet Friend or Foe.](https://reader035.fdocuments.in/reader035/viewer/2022062517/56649e7a5503460f94b7ac40/html5/thumbnails/14.jpg)
XHTMLExtensible Formatting Language of the Web
![Page 15: Web Design I Technical Slides. Internet Friend or Foe.](https://reader035.fdocuments.in/reader035/viewer/2022062517/56649e7a5503460f94b7ac40/html5/thumbnails/15.jpg)
Updated 8/17/2008 Scott Nelson, Instructor [email protected]
15
What Happened to HTML• eXtensible Hypertext Markup Language
• Combines of HTML and XML
• XHTML is an adopted standard
• Support is universal among current browsers
• Allows support for mobile devices
• More strict code formatting than HTML
![Page 16: Web Design I Technical Slides. Internet Friend or Foe.](https://reader035.fdocuments.in/reader035/viewer/2022062517/56649e7a5503460f94b7ac40/html5/thumbnails/16.jpg)
Updated 8/17/2008 Scott Nelson, Instructor [email protected]
16
Example Page• This is how a basic XHTML page is
displayed in Internet Explorer
• Looks like anyHTML page
![Page 17: Web Design I Technical Slides. Internet Friend or Foe.](https://reader035.fdocuments.in/reader035/viewer/2022062517/56649e7a5503460f94b7ac40/html5/thumbnails/17.jpg)
Updated 8/17/2008 Scott Nelson, Instructor [email protected]
17
Viewing Source• Click on View, Source
![Page 18: Web Design I Technical Slides. Internet Friend or Foe.](https://reader035.fdocuments.in/reader035/viewer/2022062517/56649e7a5503460f94b7ac40/html5/thumbnails/18.jpg)
Updated 8/17/2008 Scott Nelson, Instructor [email protected]
18
XHTML Source Code• This is the information that causes the page
to be rendered
![Page 19: Web Design I Technical Slides. Internet Friend or Foe.](https://reader035.fdocuments.in/reader035/viewer/2022062517/56649e7a5503460f94b7ac40/html5/thumbnails/19.jpg)
Updated 8/17/2008 Scott Nelson, Instructor [email protected]
19
XHTML Structure• All XHTML documents have two
sections– Head
This information is not seen on the web page
![Page 20: Web Design I Technical Slides. Internet Friend or Foe.](https://reader035.fdocuments.in/reader035/viewer/2022062517/56649e7a5503460f94b7ac40/html5/thumbnails/20.jpg)
Updated 8/17/2008 Scott Nelson, Instructor [email protected]
20
XHTML Structure– Body
This information is displayed on the web page
![Page 21: Web Design I Technical Slides. Internet Friend or Foe.](https://reader035.fdocuments.in/reader035/viewer/2022062517/56649e7a5503460f94b7ac40/html5/thumbnails/21.jpg)
Updated 8/17/2008 Scott Nelson, Instructor [email protected]
21
XHTML Tags• Tags are denoted and surrounded by
the less-than and greater-than signs < >
• Tags MUST be lowercase
• Tags may have attributes
• Attributes may have a value– Attribute values MUST always be enclosed
in double-quotation marks " " (not “”)
![Page 22: Web Design I Technical Slides. Internet Friend or Foe.](https://reader035.fdocuments.in/reader035/viewer/2022062517/56649e7a5503460f94b7ac40/html5/thumbnails/22.jpg)
Updated 8/17/2008 Scott Nelson, Instructor [email protected]
22
XHTML Tags• Attributes are separated by a single space• Some tags have opening and closing tags
– Closing tags are denotes by the preceding forward slash / in the tagExample: </body>
– Tags that do not have a separate closing tag are closed with a forward slash before the closing greater-than signExample: <br />
![Page 23: Web Design I Technical Slides. Internet Friend or Foe.](https://reader035.fdocuments.in/reader035/viewer/2022062517/56649e7a5503460f94b7ac40/html5/thumbnails/23.jpg)
Updated 8/17/2008 Scott Nelson, Instructor [email protected]
23
XHTML Tags• Nested tags MUST be closed in the opposite
order in which they were opened– Example:
<td><div>Content</div></td>
![Page 24: Web Design I Technical Slides. Internet Friend or Foe.](https://reader035.fdocuments.in/reader035/viewer/2022062517/56649e7a5503460f94b7ac40/html5/thumbnails/24.jpg)
Updated 8/17/2008 Scott Nelson, Instructor [email protected]
24
Astronomy• How many planets are in our solar system?
![Page 25: Web Design I Technical Slides. Internet Friend or Foe.](https://reader035.fdocuments.in/reader035/viewer/2022062517/56649e7a5503460f94b7ac40/html5/thumbnails/25.jpg)
Updated 8/17/2008 Scott Nelson, Instructor [email protected]
25
Astronomy• How many planets are in our solar system?
• Eight. Pluto was demoted in August 2006 by the International Astronomical Union.
![Page 26: Web Design I Technical Slides. Internet Friend or Foe.](https://reader035.fdocuments.in/reader035/viewer/2022062517/56649e7a5503460f94b7ac40/html5/thumbnails/26.jpg)
DefinitionsLet’s Get on the Same Page
![Page 27: Web Design I Technical Slides. Internet Friend or Foe.](https://reader035.fdocuments.in/reader035/viewer/2022062517/56649e7a5503460f94b7ac40/html5/thumbnails/27.jpg)
DefinitionsComputer Stuff
![Page 28: Web Design I Technical Slides. Internet Friend or Foe.](https://reader035.fdocuments.in/reader035/viewer/2022062517/56649e7a5503460f94b7ac40/html5/thumbnails/28.jpg)
Updated 8/17/2008 Scott Nelson, Instructor [email protected]
28
Client, Workstation• A single computer on the network• Web site visitor• Customer
![Page 29: Web Design I Technical Slides. Internet Friend or Foe.](https://reader035.fdocuments.in/reader035/viewer/2022062517/56649e7a5503460f94b7ac40/html5/thumbnails/29.jpg)
Updated 8/17/2008 Scott Nelson, Instructor [email protected]
29
Server• A computer provides services to a network• Common types of servers
– Web– File and Print– Application– Authentication
![Page 30: Web Design I Technical Slides. Internet Friend or Foe.](https://reader035.fdocuments.in/reader035/viewer/2022062517/56649e7a5503460f94b7ac40/html5/thumbnails/30.jpg)
Updated 8/17/2008 Scott Nelson, Instructor [email protected]
30
Credentials• Username, I.D., Logon Name• Password
![Page 31: Web Design I Technical Slides. Internet Friend or Foe.](https://reader035.fdocuments.in/reader035/viewer/2022062517/56649e7a5503460f94b7ac40/html5/thumbnails/31.jpg)
Updated 8/17/2008 Scott Nelson, Instructor [email protected]
31
WebDAV• Web-based Distributed Authoring and
Versioning
• It is a set of extensions to the HTTP protocol which allows users to collaboratively edit and manage files on remote web servers
• Using HTTPS, is more secure than FTP
![Page 32: Web Design I Technical Slides. Internet Friend or Foe.](https://reader035.fdocuments.in/reader035/viewer/2022062517/56649e7a5503460f94b7ac40/html5/thumbnails/32.jpg)
Updated 8/17/2008 Scott Nelson, Instructor [email protected]
32
FTP• File Transfer Protocol
• Universal
• Less secure than WebDAV
• Comes in FTPS flavor which encrypts transmission
![Page 33: Web Design I Technical Slides. Internet Friend or Foe.](https://reader035.fdocuments.in/reader035/viewer/2022062517/56649e7a5503460f94b7ac40/html5/thumbnails/33.jpg)
DefinitionsBrowser Stuff
![Page 37: Web Design I Technical Slides. Internet Friend or Foe.](https://reader035.fdocuments.in/reader035/viewer/2022062517/56649e7a5503460f94b7ac40/html5/thumbnails/37.jpg)
Updated 8/17/2008 Scott Nelson, Instructor [email protected]
37
URL• Uniform Resource Locator
• Uniform Resource Indicator (URI)
• Address
• Web Address
http://www.WebDesignSB.com/Information/MAT153/
![Page 38: Web Design I Technical Slides. Internet Friend or Foe.](https://reader035.fdocuments.in/reader035/viewer/2022062517/56649e7a5503460f94b7ac40/html5/thumbnails/38.jpg)
Updated 8/17/2008 Scott Nelson, Instructor [email protected]
38
Domain• In the web address:
http://www.WebDesignSB.com/information/MAT153/
• WebDesignSB.comis the Domain
![Page 39: Web Design I Technical Slides. Internet Friend or Foe.](https://reader035.fdocuments.in/reader035/viewer/2022062517/56649e7a5503460f94b7ac40/html5/thumbnails/39.jpg)
DefinitionsGraphic Stuff
![Page 40: Web Design I Technical Slides. Internet Friend or Foe.](https://reader035.fdocuments.in/reader035/viewer/2022062517/56649e7a5503460f94b7ac40/html5/thumbnails/40.jpg)
Updated 8/17/2008 Scott Nelson, Instructor [email protected]
40
Alias, Anti-Alias• Alias is an abrupt change between two colors in an image• Anti-Alias is a smooth change between two colors in an
image
![Page 41: Web Design I Technical Slides. Internet Friend or Foe.](https://reader035.fdocuments.in/reader035/viewer/2022062517/56649e7a5503460f94b7ac40/html5/thumbnails/41.jpg)
Updated 8/17/2008 Scott Nelson, Instructor [email protected]
41
JPEG• Joint Photographic Experts Group• Millions of Colors• Lossy Compression• One of two Web-Ready image formats
![Page 42: Web Design I Technical Slides. Internet Friend or Foe.](https://reader035.fdocuments.in/reader035/viewer/2022062517/56649e7a5503460f94b7ac40/html5/thumbnails/42.jpg)
Updated 8/17/2008 Scott Nelson, Instructor [email protected]
42
GIF• Graphics Interchange Format
• 256 Indexed Color
• Loss-less Compression
• Transparency
• Animation
• One of two Web-Ready image formats
![Page 43: Web Design I Technical Slides. Internet Friend or Foe.](https://reader035.fdocuments.in/reader035/viewer/2022062517/56649e7a5503460f94b7ac40/html5/thumbnails/43.jpg)
Updated 8/17/2008 Scott Nelson, Instructor [email protected]
43
PNG• Portable Network Graphics
• Millions of colors
• Loss-less compression
• Rapidly gaining acceptance
• Not universal enough yet to recommend
![Page 44: Web Design I Technical Slides. Internet Friend or Foe.](https://reader035.fdocuments.in/reader035/viewer/2022062517/56649e7a5503460f94b7ac40/html5/thumbnails/44.jpg)
Updated 8/17/2008 Scott Nelson, Instructor [email protected]
44
Flat Color• A single smooth expanse of a single color
![Page 45: Web Design I Technical Slides. Internet Friend or Foe.](https://reader035.fdocuments.in/reader035/viewer/2022062517/56649e7a5503460f94b7ac40/html5/thumbnails/45.jpg)
Updated 8/17/2008 Scott Nelson, Instructor [email protected]
45
Dither• The combining of several colors in an image
to trick the eye into seeing a single color that is other than the colors in the image
![Page 46: Web Design I Technical Slides. Internet Friend or Foe.](https://reader035.fdocuments.in/reader035/viewer/2022062517/56649e7a5503460f94b7ac40/html5/thumbnails/46.jpg)
Updated 8/17/2008 Scott Nelson, Instructor [email protected]
46
Feather-Edged• A smooth or fuzzy transition between two
composited images or an image and the background
• Opposite of Hard-Edged
![Page 47: Web Design I Technical Slides. Internet Friend or Foe.](https://reader035.fdocuments.in/reader035/viewer/2022062517/56649e7a5503460f94b7ac40/html5/thumbnails/47.jpg)
Updated 8/17/2008 Scott Nelson, Instructor [email protected]
47
Hard-Edged• A sharp distinct transition between a
composited image and the background or another image
![Page 48: Web Design I Technical Slides. Internet Friend or Foe.](https://reader035.fdocuments.in/reader035/viewer/2022062517/56649e7a5503460f94b7ac40/html5/thumbnails/48.jpg)
Updated 8/17/2008 Scott Nelson, Instructor [email protected]
48
Raster, Rasterize• Raster is a bit map image
• Each pixel in the image is stored as a byte of information
• The number of bits in the byte determines the color depth
![Page 49: Web Design I Technical Slides. Internet Friend or Foe.](https://reader035.fdocuments.in/reader035/viewer/2022062517/56649e7a5503460f94b7ac40/html5/thumbnails/49.jpg)
Updated 8/17/2008 Scott Nelson, Instructor [email protected]
49
Vector• Images that are represented by points and lines,
rather than by individual pixel values• Vector image file size a generally very small as
compared to Raster images• Flash uses vector images to
animate quickly with a relatively small file size
![Page 50: Web Design I Technical Slides. Internet Friend or Foe.](https://reader035.fdocuments.in/reader035/viewer/2022062517/56649e7a5503460f94b7ac40/html5/thumbnails/50.jpg)
Updated 8/17/2008 Scott Nelson, Instructor [email protected]
50
Web-Safe Color• Also know as
Browser-Safe colors• One of 216 colors that
are a part of the color pallets of Mac/OS, Unix and Windows
• Not really an issue any more!
![Page 51: Web Design I Technical Slides. Internet Friend or Foe.](https://reader035.fdocuments.in/reader035/viewer/2022062517/56649e7a5503460f94b7ac40/html5/thumbnails/51.jpg)
Updated 8/17/2008 Scott Nelson, Instructor [email protected]
51
Tile• Tiles are used for background images on
Web pageshttp://www.scottandtammy.com/mat122/seamless_graphics/
![Page 53: Web Design I Technical Slides. Internet Friend or Foe.](https://reader035.fdocuments.in/reader035/viewer/2022062517/56649e7a5503460f94b7ac40/html5/thumbnails/53.jpg)
DefinitionsMonitor Stuff
![Page 54: Web Design I Technical Slides. Internet Friend or Foe.](https://reader035.fdocuments.in/reader035/viewer/2022062517/56649e7a5503460f94b7ac40/html5/thumbnails/54.jpg)
Updated 8/17/2008 Scott Nelson, Instructor [email protected]
54
Pixel• Picture Element
• A single dot on a computer or television screen
![Page 55: Web Design I Technical Slides. Internet Friend or Foe.](https://reader035.fdocuments.in/reader035/viewer/2022062517/56649e7a5503460f94b7ac40/html5/thumbnails/55.jpg)
Updated 8/17/2008 Scott Nelson, Instructor [email protected]
55
PPI• Pixels Per Inch
• Used to define monitor resolution
• 72 PPI is typical monitor resolution
• 2540 PPI is typical for print publishing
![Page 56: Web Design I Technical Slides. Internet Friend or Foe.](https://reader035.fdocuments.in/reader035/viewer/2022062517/56649e7a5503460f94b7ac40/html5/thumbnails/56.jpg)
Updated 8/17/2008 Scott Nelson, Instructor [email protected]
56
DPI• Dots Per Inch
• Defines the sharpness of the image
• 72 DPI is for the Web
• 600 DPI is most home printers
• 1200 and greater is for professional printing
![Page 57: Web Design I Technical Slides. Internet Friend or Foe.](https://reader035.fdocuments.in/reader035/viewer/2022062517/56649e7a5503460f94b7ac40/html5/thumbnails/57.jpg)
Updated 8/17/2008 Scott Nelson, Instructor [email protected]
57
Resolution• The X and Y coordinates of the
number of pixels displayed on a computer monitor
• Typical resolutions are:
– 640 x 480 - Universally Compatible
– 800 x 600 - Good current minimum standard
– 1024 x 768 - Good minimum for production houses
– 1280 x 1024 - Maximum Standard Desktop Size
– 1680 x 1050 - Apple Cinema Display
– 1920 x 1200 - Apple Cinema HD Display
– 2048 x 1280 - Apple Cinema HD Display
– 2560 x 1600 - Apple Cinema HD Displayer
![Page 58: Web Design I Technical Slides. Internet Friend or Foe.](https://reader035.fdocuments.in/reader035/viewer/2022062517/56649e7a5503460f94b7ac40/html5/thumbnails/58.jpg)
Updated 8/17/2008 Scott Nelson, Instructor [email protected]
58
CMYK• Cyan, Magenta, Yellow, and Black
• Used in print media
![Page 59: Web Design I Technical Slides. Internet Friend or Foe.](https://reader035.fdocuments.in/reader035/viewer/2022062517/56649e7a5503460f94b7ac40/html5/thumbnails/59.jpg)
Updated 8/17/2008 Scott Nelson, Instructor [email protected]
59
RGB• Red, Green Blue• Used for screen delivery• These three colors sum together to display all of
the millions (16.7) of color you see on your computer monitor
![Page 60: Web Design I Technical Slides. Internet Friend or Foe.](https://reader035.fdocuments.in/reader035/viewer/2022062517/56649e7a5503460f94b7ac40/html5/thumbnails/60.jpg)
DefinitionsXHTML and Dreamweaver Stuff
![Page 61: Web Design I Technical Slides. Internet Friend or Foe.](https://reader035.fdocuments.in/reader035/viewer/2022062517/56649e7a5503460f94b7ac40/html5/thumbnails/61.jpg)
Updated 8/17/2008 Scott Nelson, Instructor [email protected]
61
XHTML• Extensible Hyper-Text Markup Language
![Page 62: Web Design I Technical Slides. Internet Friend or Foe.](https://reader035.fdocuments.in/reader035/viewer/2022062517/56649e7a5503460f94b7ac40/html5/thumbnails/62.jpg)
Updated 8/17/2008 Scott Nelson, Instructor [email protected]
62
XHTML Text• Text that is displayed in the browser windows that has been
typed directly into the XHTML code
![Page 63: Web Design I Technical Slides. Internet Friend or Foe.](https://reader035.fdocuments.in/reader035/viewer/2022062517/56649e7a5503460f94b7ac40/html5/thumbnails/63.jpg)
Updated 8/17/2008 Scott Nelson, Instructor [email protected]
63
Mouseover, Rollover, Image Swap• Terms used interchangeably to describe a change in image
when the mouse pointer hovers over an image
![Page 64: Web Design I Technical Slides. Internet Friend or Foe.](https://reader035.fdocuments.in/reader035/viewer/2022062517/56649e7a5503460f94b7ac40/html5/thumbnails/64.jpg)
Updated 8/17/2008 Scott Nelson, Instructor [email protected]
64
Table• Like a spreadsheet• Tables used to be used to format pages and hold sliced
images together• This is fallen out of favor
![Page 65: Web Design I Technical Slides. Internet Friend or Foe.](https://reader035.fdocuments.in/reader035/viewer/2022062517/56649e7a5503460f94b7ac40/html5/thumbnails/65.jpg)
Updated 8/17/2008 Scott Nelson, Instructor [email protected]
65
Nested Table• An HTML table that is inside the cell of
another HTML table
![Page 67: Web Design I Technical Slides. Internet Friend or Foe.](https://reader035.fdocuments.in/reader035/viewer/2022062517/56649e7a5503460f94b7ac40/html5/thumbnails/67.jpg)
Updated 8/17/2008 Scott Nelson, Instructor [email protected]
67
Divisions and Spans• <DIV>
– Div’s are used in CSS layouts to apply a style to an area or element
• <SPAN>– Span’s are used in CSS layouts to apply a style
to an area or element– Span’s can be applied in mid-sentence without a
line break
![Page 68: Web Design I Technical Slides. Internet Friend or Foe.](https://reader035.fdocuments.in/reader035/viewer/2022062517/56649e7a5503460f94b7ac40/html5/thumbnails/68.jpg)
The File SystemKnow Your Enemy
![Page 69: Web Design I Technical Slides. Internet Friend or Foe.](https://reader035.fdocuments.in/reader035/viewer/2022062517/56649e7a5503460f94b7ac40/html5/thumbnails/69.jpg)
Updated 8/17/2008 Scott Nelson, Instructor [email protected]
69
Folder and Filenames• Adopt the 8.3 (MS DOS convention) nomenclature
when you will be converting between Windows OS and Mac OS/9 and older
• For Mac OS/9 compatibility, filenames should be 31 total characters or less
• Use all lowercase letters– Unix, Linux and Apple servers are case-sensitive– Windows servers are not case-sensitive
![Page 70: Web Design I Technical Slides. Internet Friend or Foe.](https://reader035.fdocuments.in/reader035/viewer/2022062517/56649e7a5503460f94b7ac40/html5/thumbnails/70.jpg)
Updated 8/17/2008 Scott Nelson, Instructor [email protected]
70
Characters to Use• Letters a - z
• Numbers 0 - 9
• Dash or Hyphen -
• Underscore _
![Page 71: Web Design I Technical Slides. Internet Friend or Foe.](https://reader035.fdocuments.in/reader035/viewer/2022062517/56649e7a5503460f94b7ac40/html5/thumbnails/71.jpg)
Updated 8/17/2008 Scott Nelson, Instructor [email protected]
71
Characters Not to Use• Space• Forward slash /• Back slash \• Colon :• Asterisk or star *• Question mark ?• Double Quotation “
• Greater than and less than signs ><
• Pipe |• Pound or number sign #• Percent sign %• At sign @• Comma ,• Apostrophe ‘
![Page 72: Web Design I Technical Slides. Internet Friend or Foe.](https://reader035.fdocuments.in/reader035/viewer/2022062517/56649e7a5503460f94b7ac40/html5/thumbnails/72.jpg)
Updated 8/17/2008 Scott Nelson, Instructor [email protected]
72
Special File Names• First page of a web site must be one of these
file names– index.htm (most universally compatible)– index.html (not supported IIS by default)– Default.htm– Default.asp– Default.aspx
![Page 73: Web Design I Technical Slides. Internet Friend or Foe.](https://reader035.fdocuments.in/reader035/viewer/2022062517/56649e7a5503460f94b7ac40/html5/thumbnails/73.jpg)
Updated 8/17/2008 Scott Nelson, Instructor [email protected]
73
Zoology• What is a pregnant gold fish called?
![Page 74: Web Design I Technical Slides. Internet Friend or Foe.](https://reader035.fdocuments.in/reader035/viewer/2022062517/56649e7a5503460f94b7ac40/html5/thumbnails/74.jpg)
Updated 8/17/2008 Scott Nelson, Instructor [email protected]
74
Zoology• What is a pregnant gold fish called?
• A twit
![Page 76: Web Design I Technical Slides. Internet Friend or Foe.](https://reader035.fdocuments.in/reader035/viewer/2022062517/56649e7a5503460f94b7ac40/html5/thumbnails/76.jpg)
Thank You!That wraps it for tonight. Thanks for your attention!