cs 330 class 2: programming plan for today recap from last time more unix begin html (material from...
TRANSCRIPT
CS 330 Class 2: Programming Plan for Today
• Recap from last time• More UNIX• Begin HTML (material from Chapters 5-8)
– Tags and attributes
– Hyperlinks
• Features we will not cover: images (Ch. 9), tables (Ch 10), frames (Ch 11) but that are useful.
Recap
• Server software on aurora (UNIX-based)• Access via
– FTP (file transfer) and
– Telnet (remote login)
• Your HTML files/pages created on PC• Your HTML files uploaded via FTP to
/home/xxx/public-html/
• Your default page is/home/xxx/public-html/index.htm
Recap (cont.)
• Accessed via – a link on the cs330 page or
– http://aurora.wells.edu/~xxx
• Page maintenance (for now): – download HTML file to PC via FTP or from Netscape
– make changes in WordPad or NotePad
– upload to aurora via FTP
• Alternate upload in telnet– In Notepad: Edit/select all, Edit/copy
– in Telnet: cat>index.htm, Edit/copy, Ctrl/C
UNIX File Permissions• Access modes: read (r), write (w), and execute (x)
• They are controlled for – user (the owner), group (a designated set of users) and others
• You own your directory and any files you create• Look at /home/cs330 using long listing (ls -l)
– First char: d =directory; - = ordinary file– Next 3 groups of 3: r, w, x permissions for user, group and others– Number of links to a file– The user who owns the file– The group that owns the file– File size– Last modified– Name: / means directory, * means executable
Setting versus Augmenting Permissions
• Setting (p.60): sets all permissions using octal– Each group of 3 is one octal number
- - - - - - - - - = 000 000 000 = 000
rwxrw- r - - = 111 110 100 = 764
rwxrwxrwx = 111 111 111 = 777
To set to rwxrw- r - - : chmod 764 index.htm
• Augmenting: change existing permissions by specifying what is to be added or subtracted.
Augmenting File Permissions• chmod (permissions to change) (the file)
u=user, g=group, o=other, a = all
• chmod a+r *.* makes all files on the directory readable
• chmod g-w index.htm – prevents the group from changing index.htm
• Implications for web pages– your public_html must have execute permission to be visible
– defaults on aurora are set so that public_html will have this
– if not: chmod a+x (the file or directory)
– if you create a subdirectory, you may need to check the permission
Language Categories• Markup languages control the appearance of a
static document – LaTeX (word processing)
– HTML. Original goal: to support hypertext access to other documents (non-linear access)
• Scripting languages add executable content – Client-side (JavaScript, VBScript)
– Server-side (Perl, ASP)
• Stand-alone languages (Pascal, C++, Java)
HTML TagsFormat: <tag> processed text {</tag>}
<html> and </html> enclose entire document.
<head> and </head> enclose header information
<body> and </body> the body of the page
<title> and </title> in head and/or body
<!-- This is a comment. --> comment
<p> a new paragraph
<br> a line break (new text line)
<h1> and </h1> heading (also <H2> to <H6)
<u> and </u> underline
<b> and </b> bold
<i> and </i> italics
<pre> and </pre> preformatted text
<ul> and </ul>: <ol> </ol> list
Example: tags.htm.
HTML Attributes• Background and text colors:
<body bgcolor=“#ffffff” text=“#000000”>
(white with black font for the whole doc.)
< body bgcolor =“# ffffff” text =“#000000”>
(white with black font for the whole doc.)
<font color=“ffff00”>Yellow</font>
(Yellow for the text within the tags)
• Example: attrib.htmSee p. 470 for documentation of body tags
What tags can have attribute bgcolor?
P. 75-85 has more on colors and tags to which they apply
• Many of these are deprecated (to be phased out) and will be handled in a new feature called cascading style sheets (CSS). For now, they are widely used.
<meta> Tags (p.98)
• Used to include information about a document.
• Two optional attributes: http-equiv and name– http-equiv : affect how browser handles the document. This
information actually gets put into the HTTP header.
– name : meta information about the document
<meta http-equiv = “refresh” content= 30>
< meta name = “keywords” content = “kayaks, whitewater, rental”>
See source for CS 330 page.
Hyperlinks
• Hyperlinks connect parts of documents via an anchor tag: <a href location linked to> highlighted text </A>
• Links can be to the – same document (internal anchors)
– same site (usually via relative URLs)
– different site (via absolute URLs)
– or via other protocols (mail, ftp)
• Internal anchors (also called linking within a document)
A reference to an internal anchor: <a href=“#anchor name”> some highlighted text </a>
The anchor: < a href =“anchor name“>more highlighted text</a>
• Relative URLSA link to a file on the same directory)
< a href =“ex1.doc">Exercise</a> //CS 330 page, class 1
A link to different directory: on the same site:
< a href =“examples/first.htm”>First page</a> //CS 330 page, class 2
Alternate form for CS 330 participant pages:< a href =“../xxx”>xxx’s name</a>
• Absolute URLSA link, possibly to a different site, with the full address < a href =“aurora.wells.edu/~ ccs/cs131_01/cs131.htm</a>
• Other protocols, e.g. return address tags, images < a href =“mailto:[email protected]”>[email protected]</a>
< a href ="baby/dragon_7_4.jpg">
<img height =50 width=50 src="baby/dragon_7_4.jpg"></a>