Review session for Web development
Today’s class Review the web designing. Filling out instructor evaluation form.
Time line of the internet history When was the ARPANET first demostrated? When did the NFSNet replace it? When did the (ftp, www…) appear? Exact year not required, but you need to know the era.
Basics of Internet What is an IP address. What is the structure of an IP address. What is the static IP and dynamic IP. What are domain names? What are domain names? How does a domain name corresponding to an IP address. – –
Domain names What are first level, second level domain names?.com.org.edu are top level domains, which specify the category of the domain name user. Second level domain name gives the entity ’ s name. This must be unique in the top level domain. Low level domain gives the server ’ s name. What is the difference between a domain name and a URL
Universal Resource Locator: Static Domain Name - name of remote computer identifies type of transfer /~urquhar5/tour/active.html File Location on Remote Computer This part is CasE SenSiTiVe.
Universal Resource Locator: Dynamic Domain Name - name of remote computer identifies type of transfer Folder name /cgi-bin/ Server program name: redirect.cgi Argument of the server program: ?q=LBS&site=Web
Web Page Development Cycle EDIT and SAVE the file in your AFS p:\web\test.html TEST by BROWSING to the page
HTML File Structure <HTML><HEAD></HEAD><BODY></BODY></HTML>
Essential HTML tags MSU MSU H1, H2, u, em.
Cascading Style Sheets (CSS) A Cascading Style Sheet is a file with a list of formatting instructions. When a CSS file is attached to an HTML file, the appearance of the HTML will be defined by the CSS file. When a CSS file is attached to an HTML file, the appearance of the HTML will be defined by the CSS file. What can CSS change –Define customized style and apply to the content. –Redefine the appearance of HTML tags. –Advanced HTML tags. a:link, a:hover…
Separation of Content and Presentation Content –Use tags like,,, or to indicate the structure of your pages Presentation –Use a CSS style sheet to determine how the tags are formatted Advantage of separation –Changing the formatting only requires editing the style sheet
Hyperlinks in HTML Code Text for link Text for link Opening Tag Tag Attribute: URL Closing Tag Link text href = “Hyper Text Reference ”
Types of link Absolute link – – Relative Link – – Link – – Anchor Link – –
Color Control Codes Computer monitors combine Red, Green and Blue (RGB) in various amounts Hexadecimal codes tell the computer how much Red, Green and Blue to display –Red: FF0000 –Green:00FF00 –Blue: 0000FF –Other colors? Combinations! Yellow = FFFF00 –White: FFFFFF –Black: Approximately 17 million combinations.
Graphics Types of graphics that can be insert into HTML –Jpeg –Gif What are they good for?
Graphics in HTML First step: Copy the graphics into your web folder, because graphics is NOT embedded in HTML. or or Can include size parameters – – Note: No closing tag!
Additional graphics features Graphics as link –How? Image map –What is it? Rollover images –What is under beneath the rollover images?
General steps of web site design Survey –Who’s my audience –Decide the general style Organize information Layout design Template design Implementation –Generating content page from template. Testing the web site Publishing
Layout design Two methods –Using table –Using layout view to draw layout cells. Dreamweaver automatically translate the layout table and cell to standard tables.
Dreamweaver Template What is a Dreamweaver template? –A special HTML file (with.dwt) What are the advantages of using a template to create the pages in a web site? Why is it better than reusing previously created HTML files? How template file differs from an HTML file –Non-editable region: same for every pages –Editable region: different in different pages