University Information Technology Services

Size: px
Start display at page:

Download "University Information Technology Services"

Transcription

1 University Information Technology Services Creating a Web Page with HTML Table of Contents Learning Objectives...1 Introducing HTML:...2 The HTML Document Basics...3 HTML Tags...4 Creating the HTML Document...6 Adding Body and Text Color...7 Using Background Images... 8 Saving the HTML Document... 9 Viewing the HTML Document... 9 Entering & Formatting Text...10 Inserting Images...14 Creating Lists...16 Creating Hyperlinks...16 Publishing & Viewing Your HTML Document...19 Publishing Viewing Working with Tables...22 Linked Windows...24 Working with Frames...25 Creating Forms...28

2 LEARNING OBJECTIVES Understanding what HTML is How the Web browser and Web server communicate via http Your Web server Understanding the required markup tags The knowledge to apply formatting tags, list tags, color tags How to insert tables, graphics, and hyperlinks How to publish your Web page via FTP How to make editing changes How to create tables, frames, and forms 1

3 INTRODUCING HTML: What is HTML? According to the Dictionary of Computer and Internet Terms 1 HTML (Hypertext Markup Language) is a set of codes that can be inserted into text files to indicate special typefaces, inserted images, and links to other hypertext documents. When you surf the Web, the actual Web page you are viewing is displayed according to how the HTML code is written. Web Servers, Web Browsers, Http, and HTML A Web server is a computer that stores files written in hypertext markup languages (such as Web pages). Other computers connect to these Web servers through a software interface called Web browsers. Examples of Web browsers are Mosaic, Netscape Navigator, or Microsoft s Internet Explorer. When you type in a Web address, the web browser sends a request for a web page to a web server. The browser requests specific documents or services to be delivered from the Web server. If the documents or services are available, the Web server returns it to the browser using http (hypertext transfer protocol). Your Web Server for Your Web Page To publish (see page 19 for publishing) a Web page here at Kennesaw State University, you may want to use any one of many web servers. Students can use the students server, and faculty/staff may use the ksuweb server or a department supported server such as the science server. The address of the students server is students.kennesaw.edu. The address of the ksuweb server is ksuweb.kennesaw.edu. In your account on this server there will be a folder or directory named html, this is where you need to place your web pages so that they are accessible over the Internet. 1 Covington, M.M, Covington, M.A., & Downing, D (2000). Dictionary of Computer and Internet Terms. New York: Barron s. 2

4 THE HTML DOCUMENT BASICS Skills & Tools Needed You do not have to be a programmer to code with HTML. It helps to have an understanding of Web designing to make your Web site more effective, but no prior experience is necessary to create HTML documents. HTML documents are plain-text (also known as ASCII) files that can be created using any text editor (e.g., vi on UNIX machines; SimpleText on a Macintosh; Notepad on a Windows machine). This workshop uses Notepad, but you can use any word processing software as long as you save it as text only with line breaks. Tags To format text and graphics, HTML uses tags. Tags are characters contained within angle brackets (e.g. <H1>). Each tag performs a particular action, such as making text a specific size, aligning an image, or inserting a hyperlink. Many tags have a beginning tag to turn on a formatting option, and an ending tag to turn off the formatting. Beginning tags take the form <TAG>, and ending tags take the form </TAG>. The tags are not case-sensitive. You can type them in lower case, capital case, or a mixture of the two. Generally the HTML tags are typed in all caps to distinguish the code from text. The following section lists some the common HTML tags. 3

5 HTML TAGS Required Markup Tags for Creating a Page <HTML> </HTML> <HEAD> </HEAD> <TITLE> </TITLE> <BODY> </BODY> Declares that the document is HTML Contains information about the document such as the title Title of the document (displayed in the title bar of the browser) Contains all the displayed information Color Color can be specified by the name of the color or by the RGB (Red, Green, Blue) value. RGB is the red, green, blue values specified by a two digit hexadecimal number. This number represents the strengths of the primary colors. For example, Red=FF0000. <BODY BGCOLOR= blue > <BODY BACKGROUND= filename.gif > <BODY TEXT= white > <FONT COLOR= blue > or <FONT COLOR= 0000FF > Background color Background file Text color Text color Preformatted Text <PRE> </PRE> Browser displays text as typed in the HTML document. 4

6 Paragraphs, Fonts, Headers, Typeface Styles <H1> </H1> <H3> </H3> Example Example Heading tag that formats text to approximately 24 point font size Heading tag that formats test to approximately 12 point font size <H6> </H6> Example <FONT SIZE= +1 > </FONT> <FONT FACE= arial > Heading tag that formats test to approximately 8 point font size Increases font size to approximately 8-9 pts. (2= 10pts, 3=12pts, 4=14pts, 5= 16pts, 6=18pts, 7=24 pts) Displays the text in font Arial. <B> </B> <I> </I> <BLINK> </BLINK> <P> </P> Displays text in a bold typeface Italicizes the text Makes the text/ image blink Beginning paragraph. The ending tag is optional. Gives a double space to the next line of text. <P ALIGN= center > Aligns paragraph as center. <BR> &nbsp Line break. It has no ending tag. Non breaking space. Gives space between letters or words (functions like the space bar). 5

7 Images The main types of image files used for HTML documents are GIF and JPEG. <IMG SRC= filename.jpg > <IMG SRC= filename.jpg ALIGN= right > <P ALIGN= center ><IMG SRC= filename.jpg ALT=image HEIGHT= 200 WIDTH= 140 BORDER= 3 > Defines the image source and inserts a graphic file into the HTML document. Right aligns image. The image is centered with a defined height, width, and border. Alt is the text that is displayed if the image cannot be displayed. Lists <OL> </OL> <UL> </UL> <LI> </LI> Indicates an ordered (numbered) list. Indicates an unordered (bulleted) list. Indicates an item in a list. CREATING THE HTML DOCUMENT Exercise: Beginning Tags 1. Open the application Notepad. 2. Type the <HTML> tag. Press ENTER. 3. Type the <HEAD> tag. Press ENTER. 4. Type the title of your page between the beginning and ending <TITLE> tag (e.g. <TITLE>My HTML Page</TITLE>). Press ENTER. 5. Type </HEAD>. Press ENTER. 6. Type <BODY>. Press ENTER 5 times then type </BODY>. 7. Press ENTER about 2 times and type the closing HTML tag (</HTML>). Your document should look like this screenshot: 6

8 Adding Body and Text Color You may want to begin the body by applying a background color and a text color. To do this you need to include the color information inside the appropriate tag. The default background color is white (or light gray); the default text color is black. You can use the name of a color, such as blue, for common colors. For other colors, you may need to know the RGB code (e.g., 0000FF). The following Website contains a good color reference: Exercise: Add Body and Text Color You can enter tags to determine the color of your text and background. The colors that are stated in the body tag will apply to the entire Web page. 1. Replace the <BODY> tag with <BODY BGCOLOR= lightblue TEXT= 4B0082 LINK= Sienna VLINK= Slategray > You can replace the color names or RGB code with the color of your choice. BGCOLOR is the background color of your Web page. TEXT is the text color. LINK is the color designated for your hyperlinks (discussed later). VLINK is the color your hyperlinks will change to after the browser has been to that Web address. 7

9 Using Background Images If you prefer, you can use an image (texture, pattern, picture, etc) for your background, rather than a solid color. To do this, you must have an image file to insert into your Web page. You can find image files on the Internet by using a search engine and entering the term background images. Once you have found a worthy site you must download the image file onto your computer. 1. Place your mouse pointer on top of the image you wish to down load. 2. Right-click on the image. You should get a menu similar to these, depending on which browser you use: Internet Explorer (IE) Netscape Navigator (NN) 3. Select Save Picture As (IE) or Save Image As (NN). 4. Save the file to the same folder your HTML document is stored. You can change the filename, but do not change the file extension (.jpg,.gif, etc). To apply the background image to the HTML document, type: <BODY BACKGROUND= filename.jpg > Replace filename with the name of the image file, (e.g. yeltextr.gif). Note: You cannot combine a background color and a background image-the image will override the color. At this point, you document should look similar to the screenshot on the next page: 8

10 Saving the HTML Document From time to time you will want to see what your HTML document will look like in the Web browser. To do this you will need to save your document. 1. Click on File, Save As. 2. In the Save In box, click on the down arrow and choose the folder (e.g. DL) you wish to save the document in. 3. In the File Name box type index.htm. 4. Change the Save As Type box to All Files by clicking on the down arrow. 5. Click Save. Viewing the HTML Document To view your HTML document, open a Web browser and then open your HTML file. 1. Open Internet Explorer or Netscape Navigator. 2. In the Address bar, type the path where your file is located (e.g. C:\DL\index.htm). Press ENTER. Note: Every time you make a change to your HTML document you must save it. To view the changes, click on the Refresh icon on the browser. 9

11 ENTERING & FORMATTING TEXT You can enter text into the document as you would if you were using a word processor to type a letter or report. However, all formatting that is done to the text, (e.g., font size, alignment, line spacing, etc.) must be done with HTML tags. You will place most text within a beginning and an ending formatting tag. Page 5 shows some formatting tags. How the browser displays your HTML document depends on factors such as the markup tags used, the physical page width, the fonts used to display the text, and color depth of the display. The browser will ignore extra spaces between words, lines, and markup tags. Exercise: Extra Spaces, New Lines, and Spaces between Markup Tags Type in one of fragments below exactly as it appears (note where line and space breaks are). Line 1 Line 2 Line 3 Notice how Notice Notice how this line this line is not how it looks. how this line is not how it looks. is not how it looks. Your document should look similar to this: View the document in the browser to see if it displays as you typed it. Despite which fragment you decided to type, they will all look the same in the browser. The next exercise focuses on how the HTML document handles line spacing. As you noticed before, no matter how many line spaces you have in the actual HTML document, the browser doesn t recognize them. The browser only recognizes line spaces and breaks when the appropriate tags are applied such as the Paragraph tag <P> and the Line break tag <Br>. 10

12 Exercise: Entering Text 1. Type: <H1><CENTER>Welcome To My HTML Page</CENTER></H1> The <H1> tag makes the text the H1 header size; the <CENTER> tag aligns the text in the center of the page. Note the order of beginning and closing tags. 2. Press ENTER and type the following: A line of text.<br>another line of text. The <Br> tag makes the second sentence appear one line below the first such as: A line of text. Another line of text. 3. Press ENTER and type <Br><Br><Br> to add three blank lines. This is equivalent to hitting ENTER three times in a word processor. 4. Press ENTER and type the following: <P>A line of text.</p> <P>Another line of text.</p> The Paragraph tag tells the browser to skip a line and begin on a new line. This helps it to differentiate between paragraphs. 5. Save your document. Your document should now look similar (not exactly) to this: 11

13 6. View your document in the browser (remember to Refresh each time you save changes to your HTML document). Your Web page should look similar to this: Pre-formatting Text There is a way for the browser to recognize if you have pressed ENTER or TAB in your document. You can use the Preformat tag <PRE>. If the Preformat tag allows the browser to display text exactly as it is displayed in the document, why couldn t you just use it for the whole HTML document? Two reasons: 1. The PRE tag displays text in monospaced fonts (gives each letterform the same width) such as Courier. Courier font is similar to a typewriter font. Most websites are not designed in this font. 2. The output will not display exactly as typed in the HTML document. For example, the TAB key may be.5 in one browser or.3 in another. Alignment shows whether your text is left, right, justified or center aligned. The ALIGN attribute is assigned to the tag. For example, to center align text in a paragraph you use the opening paragraph tag with the alignment. <P ALIGN= center > You can also use a Div tag. The Div tag has no formatting properties of its own but carries the properties of whichever attribute is used with it. It won t affect the look of your page in the browser. The W3C (World Wide Web Consortium) recommends using the Div tag. <DIV ALIGN= center > 12

14 Exercise: Entering the Welcome Message Type a welcome message and add formatting tags such as center alignment, a 14 pt. font size, a font color of black. An example might be: I am glad you decided to visit and I hope you will stick around and see what I have displayed here for you. Here I have listed some pictures and links I think you will find interesting. Enjoy! Your HTML document should look similar to this: 13

15 INSERTING IMAGES To insert images into your HTML document you use <IMG SCR> (image source) tag. This tag doesn t have an ending tag so you can use a space-forward slash ( /) just before the final bracket. <IMG SRC= photo.jpg ALT= a photo /> The two most widely supported image file types are.jpg and.gif..jpg (pronounced jay-peg) is an acronym for joint photographers expert group and.gif (pronounced jif) is the acronym for graphic interchange format. The word ALT is the alternative text that displays while the image is downloading. After you insert your image tag into your HTML document, ensure you have the image file in the same folder as your index.htm file to view it in the browser. Exercise: Insert an Image Insert an image and include alternative text. 1. Type the alignment in first with the div tag: <DIV ALIGN= center > 2. Type in two break line tags: <Br> <Br> 3. Now type in your image tag: <IMG SRC="MilkyWay.jpg" ALT="The Milky Way Galaxy" /> 4. Save the file. 5. View it in the browser and place your mouse pointer over the image. You should see the alternative text you typed in. The next page displays two screen shots that should be similar to your HTML document and how it looks in the browser. 14

16 The HTML Document The view in the browser 15

17 CREATING LISTS You can create several lists with HTML, but we will explain these two types of lists: 1. Unordered list (bulleted list) 2. Ordered list (numbered list) For example, if you wanted to list the types of fruit you eat you might write the HTML as: <B> Fruit </B> <OL> <LI> Oranges <LI> Apples <LI> Bananas </OL> CREATING HYPERLINKS A hyperlink is a link that a user can click on and it will take them to another Web site or another Web page within the same site. This is part of the capability of HTML (the first and second letters of HTML standing for Hypertext ). To create a hyperlink you need to use the hypertext reference tag, the URL (Uniform Resource Locator) or Web address, and the text you want displayed on the Web page. For example: <A HREF= State University s Web site</a> Exercise: Creating Lists & Hyperlinks Let s create a list of three hyperlinks for our Web page. You can decide if you want the list to be ordered (numbered) or unordered (bulleted). Format the displayed text with a heading tag. 1. Enter a bold heading and add a line break after it. For example: <B> This is a list of my favorite sites</b> <BR> 2. Enter three hyperlinks of your choice as a list. For example: <UL> <LI><A HREF= <H3>Get the News </H3> </A> <LI><A HREF= <H3>The Weather </H3> </A> <LI><A HREF= <H3> KSU Website </H3> </A> </UL> 3. Change the link and visited link (vlink) color. 4. Save your file, view it in the browser, and check your links. 16

18 Your Web page should look similar to this: You can create a hyperlinked image by adding the hyperlink reference before the image source tag. For example: <A HREF= IMG SRC="MilkyWay.jpg" ALT="The Milky Way Galaxy" /></A> The image will have a border around it in the same color you designated as your link color. 17

19 Creating a Mailto Hyperlink Whenever you create and publish a Web page you should always provide an address for your visitor to contact you. This is a good idea in case something is not working correctly on your page such as a link or an image not downloading. A mailto is a hyperlink that is written with mailto instead of http. Clicking on this mailto causes the visitor s program to open a new message with your address in the TO: field of that message. For example: <A HREF=mailto:name@ address.com> me </A> Note: This only works if your visitor has an program setup on their computer. It will not work in the labs on campus. You can also use an image as a mailto. To do so, simple insert the mailto tag before the image source tag. For example: <A HREF= mailto: @address.com >< IMG SRC="MilkyWay.jpg" ALT="The Milky Way Galaxy" /></A> Exercise: Creating a Mailto Create a mailto link and center it. 1. Type in <DIV ALIGN = center > <A HREF=mailto:name@ address.com> me </A> </DIV> 2. Save your work. 3. View it in the browser. 18

20 Publishing PUBLISHING & VIEWING YOUR HTML DOCUMENT Publishing a Web page is the process of placing your HTML document on a Web server. Once you have established an account on a Web server, you must FTP your file to that server. FTP stands for File Transfer Protocol. It is a standard way of transferring files on the Internet. To FTP a file to a server you must have an FTP software program. At Kennesaw State University the program WS_FTP95 is available on the Start button > Owlnet > WS_FTP_95. If you do not have this software you can download a free evaluation copy at You will see WS_FTP LE at the bottom of the page. When you install this program, if you indicate that you are a student or faculty member, it will not ask you for registration information. Viewing After you have published your HTML document you can view it on the Internet by typing in your Web address in the browser: For the Students server- For the Ksuweb server- If you need to edit the Web page certain steps need to be taken: 1. Download the HTML document from the Web server to your machine. 2. Open the HTML document. 3. Make the editing changes and save the document. 4. Upload the edited Web page to the Web server. 19

21 Exercise: Publishing Your Web page with WS_FTP95 When you are ready to publish your Web page, you can follow the steps below to send your files to the server. 1. Open the FTP program WS_FTP Fill-in the fields as: Profile Name: Students (or Ksuweb for faculty/staff) Host Name/Address: students.kennesaw.edu (or ksuweb.kennesaw.edu) Host Type: Automatic detect User ID: type in your username Password: type in your password NOTE: Do not check the boxes in front of Anonymous or Save Pwd!! Your screen should look similar to this dialog box: 3. Click OK. Clicking OK creates a connection to the Web server. Here you will see two windows: one window displays the Local System, or your computer, and the other window displays the Remote System or Web server. 20

22 Your file must be uploaded in the html folder. 5. Open the html folder by double-clicking on it. The address in the Remote System should be /home/username/html". 6. Highlight the HTML file you wish to upload by clicking on it once (from the Local System window). 7. Upload the file by clicking on the arrow pointing right. This sends it to the server. 8. Do the same for all the files you referenced in your HTML document. 21

23 WORKING WITH TABLES Tables in HTML have revolutionized Web page design because tables can be used not just for presenting data in a tabular form, but also for page layout and control over placement of various elements on a page. Tables have become so popular that most major browsers have now added table support. Using the <TABLE> tag creates the table. Inside the <TABLE> </TABLE> tags, you define the actual content of the table. Tables are specified in HTML row by row, and contain definitions for all the cells in that row. <TABLE> </TABLE> <TH> </TH> <TD> </TD> <TR> </TR> Table creates the table Table heading label of the rows or columns. Table data actual value within a cell. Table row creates the rows of the table Using the <TABLE> tag creates the table. Inside the <TABLE> </TABLE> tags, you define the actual content of the table and attributes associated with the content. Some attributes of <TABLE> tag: 1. BORDER width of border around the table. 2. CELL SPACING amt. of space between cells. That is, the width of the shaded lines that separate the cells. Cell spacing is 2 by default. 3. CELL PADDING amt. of space within the cell. That is, the width between the text and the border of the cell. 4. ALIGN attribute of the TH, TD, and TR tags. Horizontal alignment of text within cells. 5. VALIGN Vertical alignment of text within cells. You should plan out the dimensions of your table first then create the code for it. Determine the number of rows you will need and the headings of those rows. Think about the border you would like to apply to it. You can customize text within each cell with the formatting tags you have already learned. This is the table we will create in the next exercise: Table 1.2: Mixing Colors Red Yellow Blue Red Red Orange Purple Yellow Orange Yellow Green Blue Purple Green Blue 22

24 Exercise: Creating Table1 Create a table with an empty cell, a border of 5 pixels wide, and headings along the side and across the top. Save this exercises in a file called tables.htm. Note: To create a table without a border, specify BORDER=0. 1. Open a new document in Notepad and enter beginning HTML tags. 2. Type a title such as Table 1.2: Mixing Colors. 3. Enter the table border tag. 4. Enter the table row tag and the headings for the table. 5. Enter the next three rows. 6. Enter the closing table tag. Your code should look similar to this file: 7. Save the document. 23

25 Exercise: Creating Table2 Let s create another table. Create a 1x2 (1 row, 2 columns) table with one cell text and one cell an image. Don t forget to copy the image file to the same folder that your HTML file is in. 1. In the same document, enter the table tag with a cell spacing of 50 pixels. 2. Create one row and enter This is my favorite place to go as table data. 3. In the same row, enter the image and center align it. It should look similar to: <TABLE CELLSPACING=50> <TR> <TD>This is my favorite place to go.</td> <TD ALIGN=CENTER VALIGN=MIDDLE><IMG SRC="fuji.jpg"></TD> </TR> </TABLE> 4. Save your work and view your document. LINKED WINDOWS Before looking at frames, it s important to know about linked windows (also known as target windows). A linked window is a new browser window that is opened when clicking on a link, button, etc. You must use the TARGET attribute of the <A> tag. (The target attribute will also be useful when creating frames.) For example, if you want your visitor to go to the Kennesaw State University website and not leave your website, you can have another browser window open to the KSU Web page. Here is what the HTML code would look like: <A HREF= TARGET= KSU_window > KSU Website</A> Exercise: Linked Windows Close out of tables.htm and create a new file called linkwin.htm in Notepad. 1. Enter the following code to create a target window: <HTML> <HEAD><TITLE>TARGET PARENT WINDOW</TITLE> </HEAD> <BODY> <H1>Target Parent Window</H1> <P> <A HREF=" TARGET="KSU_window">KSU_window </a> Opens a new window called KSU_window. </BODY> </HTML> 2. Save and name linkwin.htm 3. Preview in the Web browser. 24

26 WORKING WITH FRAMES Frames are the sections of a Web page that display different text, graphics, or websites as a portion of that Web page. You must first create a frame definition document (called a frameset document) using the <FRAMESET> tag. This tag replaces the <BODY> tag in the HTML document. For the next exercise we will create a layout that displays one page on 25% of the website and the other page on the remaining 75% such as: navigate.htm 25% 75% main.htm Exercise: Creating the Frameset Document 1. Open a new file and create the frameset document by entering the following code: <HTML> <HEAD><TITLE>Frames</TITLE> </HEAD> <FRAMESET COLS="25%,75%"> <FRAME NAME= leftframe SRC="navigate.htm" NORESIZE> <FRAME NAME= rightframe SRC="main.htm"> </FRAMESET> </HTML> 2. Save and name the document frameset.htm. If you try to view frameset.htm within your web browser you will see a blank screen. That s because the frameset document is used to define the layout of your frames. Separate HTML documents must be created for each frame. The fourth line of code is defining two columns. The left column (frame) will take up 25% of the browser window. The second column (frame) will use 75% of the browser window. The next two lines specify the HTML document that will be viewed in each frame. Each frame has a name: the left frame (navigate.htm) is called leftframe; the right frame (main.htm) is called rightframe. 25

27 Exercise: Creating the Frame Documents From the last exercise we created the frameset document. Now let s create the HTML documents it references. 1. Create a new document and include the required basic HTML tags in it. 2. Title it Main Frame and in the body type, This is the main frame. 3. Save and name the document main.htm. It should look like this: 4. Close this document and create another new document. 5. Type the following code: <HTML> <HEAD><TITLE>Navigation Frame</TITLE> </HEAD> <BODY> <H1>Navigation Window</H1> <P> When you click on this link it should open the web site in the right window frame. <P> <A HREF=" TARGET="rightFrame">US & World Weather</A> </BODY> </HTML> 6. Save, name the file navigate.htm, and close this file. 7. View the file frameset.htm within the browser. 26

28 The browser should look like: 8. Click on the US & World Weather link. It should open that Web site in the main frame. 27

29 CREATING FORMS Forms are input screens that collect information. Online forms allow users to order a product, comment on a site, or register for a service. Forms are part of standard HTML and are widely supported by just about every browser. Unlike all the previous tags you ve learned thus far, the <FORM> tag allows users to interact with the web site through surveys, presentations, etc. Creating a form usually involves two independent steps: 1) creating the layout for the form and 2) writing a script program on the server side (called a CGI script) to process the information you get back from the form. Today you ll learn about the HTML side of the process. To learn about CGI scripts go to: Attributes of the <FORM> tag: ACTION indicates the CGI script that will process the form input. METHOD how the form input is given to the CGI script that processes the form. The tag <INPUT TYPE=> tells the browser to expect user input. Attributes of the <INPUT> tag: SUBMIT creates a submit button TEXT creates a text box RADIO creates a radio button CHECKBOX creates a check box RESET creates a reset button, which resets the default values of the form, if any. 28

30 Exercise: Creating a Form In this exercise we will create a simple form that asks the name and profession of the user. We will use all the attributes listed about. Remember that you will not be able to submit the form since that involves having a CGI bin. In a new Notepad file, create a form that posts the form input to the CGI script located at 1. Create a new file and enter the basic HTML tags with a title as Testing Forms. 2. Enter the following code: <HTML> <HEAD><TITLE>Testing Forms</TITLE> </HEAD> <BODY> <H2>Who are you?</h2> <FORM METHOD="POST" ACTION=" <P>Enter your name: <INPUT TYPE="text"> <P>Profession (choose all that apply): <UL> <LI><INPUT TYPE="checkbox">Doctor <LI><INPUT TYPE="checkbox">Attorney <LI><INPUT TYPE="checkbox">Teacher <LI><INPUT TYPE="checkbox">Programmer <LI><INPUT TYPE="checkbox">Student </UL> <P><INPUT TYPE="reset"> <INPUT TYPE="submit"> </FORM> </BODY> </HTML> 3. Save the file, name it form.htm and view it in the browser. Copyright 2004 KSU Dept. of Information Technology Services This document may be downloaded, printed or copied for educational use without further permission of the Information Technology Services Department (ITS), provided the content is not modified and this statement appears at the bottom of the page. Any use not stated above requires the written consent of the ITS Department. The distribution of a copy of this document via the Internet or other electronic medium without the written permission of the ITS Department is expressly prohibited. 29

Creating a Web Site with Publisher 2010

Creating a Web Site with Publisher 2010 Creating a Web Site with Publisher 2010 Information Technology Services Outreach and Distance Learning Technologies Copyright 2012 KSU Department of Information Technology Services This document may be

More information

Getting Started with KompoZer

Getting Started with KompoZer Getting Started with KompoZer Contents Web Publishing with KompoZer... 1 Objectives... 1 UNIX computer account... 1 Resources for learning more about WWW and HTML... 1 Introduction... 2 Publishing files

More information

Creating Personal Web Sites Using SharePoint Designer 2007

Creating Personal Web Sites Using SharePoint Designer 2007 Creating Personal Web Sites Using SharePoint Designer 2007 Faculty Workshop May 12 th & 13 th, 2009 Overview Create Pictures Home Page: INDEX.htm Other Pages Links from Home Page to Other Pages Prepare

More information

Contents. Downloading the Data Files... 2. Centering Page Elements... 6

Contents. Downloading the Data Files... 2. Centering Page Elements... 6 Creating a Web Page Using HTML Part 1: Creating the Basic Structure of the Web Site INFORMATION TECHNOLOGY SERVICES California State University, Los Angeles Version 2.0 Winter 2010 Contents Introduction...

More information

CREATING WEB PAGES USING HTML INTRODUCTION

CREATING WEB PAGES USING HTML INTRODUCTION CREATING WEB PAGES USING HTML INTRODUCTION Web Page Creation Using HTML: Introduction 1. Getting Ready What Software is Needed FourSteps to Follow 2. What Will Be On a Page Technical, Content, & Visual

More information

Microsoft FrontPage 2003

Microsoft FrontPage 2003 Information Technology Services Kennesaw State University Microsoft FrontPage 2003 Information Technology Services Microsoft FrontPage Table of Contents Information Technology Services...1 Kennesaw State

More information

Web Development. Owen Sacco. ICS2205/ICS2230 Web Intelligence

Web Development. Owen Sacco. ICS2205/ICS2230 Web Intelligence Web Development Owen Sacco ICS2205/ICS2230 Web Intelligence Introduction Client-Side scripting involves using programming technologies to build web pages and applications that are run on the client (i.e.

More information

Creating a Website with Publisher 2013

Creating a Website with Publisher 2013 Creating a Website with Publisher 2013 University Information Technology Services Training, Outreach, Learning Technologies & Video Production Copyright 2015 KSU Division of University Information Technology

More information

Using Adobe Dreamweaver CS4 (10.0)

Using Adobe Dreamweaver CS4 (10.0) Getting Started Before you begin create a folder on your desktop called DreamweaverTraining This is where you will save your pages. Inside of the DreamweaverTraining folder, create another folder called

More information

Introduction to Macromedia Dreamweaver MX

Introduction to Macromedia Dreamweaver MX Introduction to Macromedia Dreamweaver MX Macromedia Dreamweaver MX is a comprehensive tool for developing and maintaining web pages. This document will take you through the basics of starting Dreamweaver

More information

How To Use Dreamweaver With Your Computer Or Your Computer (Or Your Computer) Or Your Phone Or Tablet (Or A Computer)

How To Use Dreamweaver With Your Computer Or Your Computer (Or Your Computer) Or Your Phone Or Tablet (Or A Computer) ITS Training Introduction to Web Development with Dreamweaver In this Workshop In this workshop you will be introduced to HTML basics and using Dreamweaver to create and edit web files. You will learn

More information

understand how image maps can enhance a design and make a site more interactive know how to create an image map easily with Dreamweaver

understand how image maps can enhance a design and make a site more interactive know how to create an image map easily with Dreamweaver LESSON 3: ADDING IMAGE MAPS, ANIMATION, AND FORMS CREATING AN IMAGE MAP OBJECTIVES By the end of this part of the lesson you will: understand how image maps can enhance a design and make a site more interactive

More information

TUTORIAL 4 Building a Navigation Bar with Fireworks

TUTORIAL 4 Building a Navigation Bar with Fireworks TUTORIAL 4 Building a Navigation Bar with Fireworks This tutorial shows you how to build a Macromedia Fireworks MX 2004 navigation bar that you can use on multiple pages of your website. A navigation bar

More information

Saving work in the CMS... 2. Edit an existing page... 2. Create a new page... 4. Create a side bar section... 4

Saving work in the CMS... 2. Edit an existing page... 2. Create a new page... 4. Create a side bar section... 4 CMS Editor How-To Saving work in the CMS... 2 Edit an existing page... 2 Create a new page... 4 Create a side bar section... 4 Upload an image and add to your page... 5 Add an existing image to a Page...

More information

Using WS_FTP. This tutorial explains how to use WS_FTP, a File Transfer Program for Microsoft Windows. INFORMATION SYSTEMS SERVICES.

Using WS_FTP. This tutorial explains how to use WS_FTP, a File Transfer Program for Microsoft Windows. INFORMATION SYSTEMS SERVICES. INFORMATION SYSTEMS SERVICES Using WS_FTP This tutorial explains how to use WS_FTP, a File Transfer Program for Microsoft Windows. AUTHOR: Information Systems Services DATE: July 2003 EDITION: 1.1 TUT

More information

Creating Web Pages With Dreamweaver MX 2004

Creating Web Pages With Dreamweaver MX 2004 Creating Web Pages With Dreamweaver MX 2004 1 Introduction Learning Goal: By the end of the session, participants will have an understanding of: What Dreamweaver is, and How it can be used to create basic

More information

Introduction to XHTML. 2010, Robert K. Moniot 1

Introduction to XHTML. 2010, Robert K. Moniot 1 Chapter 4 Introduction to XHTML 2010, Robert K. Moniot 1 OBJECTIVES In this chapter, you will learn: Characteristics of XHTML vs. older HTML. How to write XHTML to create web pages: Controlling document

More information

Basic Web Development @ Fullerton College

Basic Web Development @ Fullerton College Basic Web Development @ Fullerton College Introduction FC Net Accounts Obtaining Web Space Accessing your web space using MS FrontPage Accessing your web space using Macromedia Dreamweaver Accessing your

More information

General Electric Foundation Computer Center. FrontPage 2003: The Basics

General Electric Foundation Computer Center. FrontPage 2003: The Basics General Electric Foundation Computer Center FrontPage 2003: The Basics September 30, 2004 Alternative Format Statement This publication is available in alternative media upon request. Statement of Non-discrimination

More information

Microsoft Excel 2007 Level 2

Microsoft Excel 2007 Level 2 Information Technology Services Kennesaw State University Microsoft Excel 2007 Level 2 Copyright 2008 KSU Dept. of Information Technology Services This document may be downloaded, printed or copied for

More information

Joomla! 2.5.x Training Manual

Joomla! 2.5.x Training Manual Joomla! 2.5.x Training Manual Joomla is an online content management system that keeps track of all content on your website including text, images, links, and documents. This manual includes several tutorials

More information

Creating a Website with MS Publisher

Creating a Website with MS Publisher Creating a Website with MS Publisher Getting Started with the Wizard...1 Editing the Home Page...3 Editing Text...3 Editing and Inserting Graphics...4 Inserting Pictures...6 Inserting a Table...6 Inserting

More information

Web Authoring. www.fetac.ie. Module Descriptor

Web Authoring. www.fetac.ie. Module Descriptor The Further Education and Training Awards Council (FETAC) was set up as a statutory body on 11 June 2001 by the Minister for Education and Science. Under the Qualifications (Education & Training) Act,

More information

ADOBE DREAMWEAVER CS3 TUTORIAL

ADOBE DREAMWEAVER CS3 TUTORIAL ADOBE DREAMWEAVER CS3 TUTORIAL 1 TABLE OF CONTENTS I. GETTING S TARTED... 2 II. CREATING A WEBPAGE... 2 III. DESIGN AND LAYOUT... 3 IV. INSERTING AND USING TABLES... 4 A. WHY USE TABLES... 4 B. HOW TO

More information

RADFORD UNIVERSITY. Radford.edu. Content Administrator s Guide

RADFORD UNIVERSITY. Radford.edu. Content Administrator s Guide RADFORD UNIVERSITY Radford.edu Content Administrator s Guide Contents Getting Started... 2 Accessing Content Administration Tools... 2 Logging In... 2... 2 Getting Around... 2 Logging Out... 3 Adding and

More information

(These instructions are only meant to get you started. They do not include advanced features.)

(These instructions are only meant to get you started. They do not include advanced features.) FrontPage XP/2003 HOW DO I GET STARTED CREATING A WEB PAGE? Previously, the process of creating a page on the World Wide Web was complicated. Hypertext Markup Language (HTML) is a relatively simple computer

More information

In this session, we will explain some of the basics of word processing. 1. Start Microsoft Word 11. Edit the Document cut & move

In this session, we will explain some of the basics of word processing. 1. Start Microsoft Word 11. Edit the Document cut & move WORD PROCESSING In this session, we will explain some of the basics of word processing. The following are the outlines: 1. Start Microsoft Word 11. Edit the Document cut & move 2. Describe the Word Screen

More information

Joomla Article Advanced Topics: Table Layouts

Joomla Article Advanced Topics: Table Layouts Joomla Article Advanced Topics: Table Layouts An HTML Table allows you to arrange data text, images, links, etc., into rows and columns of cells. If you are familiar with spreadsheets, you will understand

More information

Adobe Dreamweaver CC 14 Tutorial

Adobe Dreamweaver CC 14 Tutorial Adobe Dreamweaver CC 14 Tutorial GETTING STARTED This tutorial focuses on the basic steps involved in creating an attractive, functional website. In using this tutorial you will learn to design a site

More information

After you complete the survey, compare what you saw on the survey to the actual questions listed below:

After you complete the survey, compare what you saw on the survey to the actual questions listed below: Creating a Basic Survey Using Qualtrics Clayton State University has purchased a campus license to Qualtrics. Both faculty and students can use Qualtrics to create surveys that contain many different types

More information

COMMON CUSTOMIZATIONS

COMMON CUSTOMIZATIONS COMMON CUSTOMIZATIONS As always, if you have questions about any of these features, please contact us by e-mail at pposupport@museumsoftware.com or by phone at 1-800-562-6080. EDIT FOOTER TEXT Included

More information

Dreamweaver Tutorial #1

Dreamweaver Tutorial #1 Dreamweaver Tutorial #1 My first web page In this tutorial you will learn: how to create a simple web page in Dreamweaver how to store your web page on a server to view your page online what the Internet

More information

Lesson Review Answers

Lesson Review Answers Lesson Review Answers-1 Lesson Review Answers Lesson 1 Review 1. User-friendly Web page interfaces, such as a pleasing layout and easy navigation, are considered what type of issues? Front-end issues.

More information

Contents. Launching FrontPage... 3. Working with the FrontPage Interface... 3 View Options... 4 The Folders List... 5 The Page View Frame...

Contents. Launching FrontPage... 3. Working with the FrontPage Interface... 3 View Options... 4 The Folders List... 5 The Page View Frame... Using Microsoft Office 2003 Introduction to FrontPage Handout INFORMATION TECHNOLOGY SERVICES California State University, Los Angeles Version 1.0 Fall 2005 Contents Launching FrontPage... 3 Working with

More information

IAS Web Development using Dreamweaver CS4

IAS Web Development using Dreamweaver CS4 IAS Web Development using Dreamweaver CS4 Information Technology Group Institute for Advanced Study Einstein Drive Princeton, NJ 08540 609 734 8044 * helpdesk@ias.edu Information Technology Group [2] Institute

More information

Digital Marketing EasyEditor Guide Dynamic

Digital Marketing EasyEditor Guide Dynamic Surveys ipad Segmentation Reporting Email Sign up Email marketing that works for you Landing Pages Results Digital Marketing EasyEditor Guide Dynamic Questionnaires QR Codes SMS 43 North View, Westbury

More information

Web page design in 7 days!

Web page design in 7 days! Learnem Group presents: Web page design in 7 days! Lessons 1-7 By: Siamak Sarmady Start Here Copyright Notice : 2000,2001 Siamak Sarmady and Learnem Group. All rights reserved. This text is written to

More information

By Glenn Fleishman. WebSpy. Form and function

By Glenn Fleishman. WebSpy. Form and function Form and function The simplest and really the only method to get information from a visitor to a Web site is via an HTML form. Form tags appeared early in the HTML spec, and closely mirror or exactly duplicate

More information

7 th Annual LiveText Collaboration Conference. Advanced Document Authoring

7 th Annual LiveText Collaboration Conference. Advanced Document Authoring 7 th Annual LiveText Collaboration Conference Advanced Document Authoring Page of S. La Grange Road, nd Floor, La Grange, IL 6055-455 -866-LiveText (-866-548-3839) edu-solutions@livetext.com Page 3 of

More information

Sample Table. Columns. Column 1 Column 2 Column 3 Row 1 Cell 1 Cell 2 Cell 3 Row 2 Cell 4 Cell 5 Cell 6 Row 3 Cell 7 Cell 8 Cell 9.

Sample Table. Columns. Column 1 Column 2 Column 3 Row 1 Cell 1 Cell 2 Cell 3 Row 2 Cell 4 Cell 5 Cell 6 Row 3 Cell 7 Cell 8 Cell 9. Working with Tables in Microsoft Word The purpose of this document is to lead you through the steps of creating, editing and deleting tables and parts of tables. This document follows a tutorial format

More information

Intro to Web Development

Intro to Web Development Intro to Web Development For this assignment you will be using the KompoZer program because it free to use, and we wanted to keep the costs of this course down. You may be familiar with other webpage editing

More information

KOMPOZER Web Design Software

KOMPOZER Web Design Software KOMPOZER Web Design Software An IGCSE Student Handbook written by Phil Watkins www.kompozer.net CONTENTS This student guide is designed to allow for you to become a competent user* of the Kompozer web

More information

Jadu Content Management Systems Web Publishing Guide. Table of Contents (click on chapter titles to navigate to a specific chapter)

Jadu Content Management Systems Web Publishing Guide. Table of Contents (click on chapter titles to navigate to a specific chapter) Jadu Content Management Systems Web Publishing Guide Table of Contents (click on chapter titles to navigate to a specific chapter) Jadu Guidelines, Glossary, Tips, URL to Log In & How to Log Out... 2 Landing

More information

Microsoft Expression Web

Microsoft Expression Web Microsoft Expression Web Microsoft Expression Web is the new program from Microsoft to replace Frontpage as a website editing program. While the layout has changed, it still functions much the same as

More information

Creating your personal website. Installing necessary programs Creating a website Publishing a website

Creating your personal website. Installing necessary programs Creating a website Publishing a website Creating your personal website Installing necessary programs Creating a website Publishing a website The objective of these instructions is to aid in the production of a personal website published on

More information

Dreamweaver CS6 Basics

Dreamweaver CS6 Basics Dreamweaver CS6 Basics Learn the basics of building an HTML document using Adobe Dreamweaver by creating a new page and inserting common HTML elements using the WYSIWYG interface. EdShare EdShare is a

More information

Basic tutorial for Dreamweaver CS5

Basic tutorial for Dreamweaver CS5 Basic tutorial for Dreamweaver CS5 Creating a New Website: When you first open up Dreamweaver, a welcome screen introduces the user to some basic options to start creating websites. If you re going to

More information

Brock University Content Management System Training Guide

Brock University Content Management System Training Guide Brock University Content Management System Training Guide Table of Contents Brock University Content Management System Training Guide...1 Logging In...2 User Permissions...3 Content Editors...3 Section

More information

Create a GAME PERFORMANCE Portfolio with Microsoft Word

Create a GAME PERFORMANCE Portfolio with Microsoft Word Create a GAME PERFORMANCE Portfolio with Microsoft Word Planning A good place to start is on paper. Get a sheet of blank paper and just use a pencil to indicate where the content is going to be positioned

More information

Using Microsoft Word. Working With Objects

Using Microsoft Word. Working With Objects Using Microsoft Word Many Word documents will require elements that were created in programs other than Word, such as the picture to the right. Nontext elements in a document are referred to as Objects

More information

JOOMLA 2.5 MANUAL WEBSITEDESIGN.CO.ZA

JOOMLA 2.5 MANUAL WEBSITEDESIGN.CO.ZA JOOMLA 2.5 MANUAL WEBSITEDESIGN.CO.ZA All information presented in the document has been acquired from http://docs.joomla.org to assist you with your website 1 JOOMLA 2.5 MANUAL WEBSITEDESIGN.CO.ZA BACK

More information

Umbraco v4 Editors Manual

Umbraco v4 Editors Manual Umbraco v4 Editors Manual Produced by the Umbraco Community Umbraco // The Friendly CMS Contents 1 Introduction... 3 2 Getting Started with Umbraco... 4 2.1 Logging On... 4 2.2 The Edit Mode Interface...

More information

Creating Web Pages with Microsoft FrontPage

Creating Web Pages with Microsoft FrontPage Creating Web Pages with Microsoft FrontPage 1. Page Properties 1.1 Basic page information Choose File Properties. Type the name of the Title of the page, for example Template. And then click OK. Short

More information

Introduction to Microsoft Word 2003

Introduction to Microsoft Word 2003 Introduction to Microsoft Word 2003 Sabeera Kulkarni Information Technology Lab School of Information University of Texas at Austin Fall 2004 1. Objective This tutorial is designed for users who are new

More information

Creating HTML authored webpages using a text editor

Creating HTML authored webpages using a text editor GRC 175 Assignment 1 Creating HTML authored webpages using a text editor Tasks: 1. Acquire web host space with ad free provider 2. Create an index webpage (index.html) 3. Create a class management webpage

More information

CONTENTM WEBSITE MANAGEMENT SYSTEM. Getting Started Guide

CONTENTM WEBSITE MANAGEMENT SYSTEM. Getting Started Guide CONTENTM WEBSITE MANAGEMENT SYSTEM Getting Started Guide Table of Contents CONTENTM WEBSITE MANAGEMENT SYSTEM... 1 GETTING TO KNOW YOUR SITE...5 PAGE STRUCTURE...5 Templates...5 Menus...5 Content Areas...5

More information

Inspiring Creative Fun Ysbrydoledig Creadigol Hwyl. Web Design in Nvu Workbook 1

Inspiring Creative Fun Ysbrydoledig Creadigol Hwyl. Web Design in Nvu Workbook 1 Inspiring Creative Fun Ysbrydoledig Creadigol Hwyl Web Design in Nvu Workbook 1 The demand for Web Development skills is at an all time high due to the growing demand for businesses and individuals to

More information

DESIGN A WEB SITE USING PUBLISHER Before you begin, plan your Web site

DESIGN A WEB SITE USING PUBLISHER Before you begin, plan your Web site Page 1 of 22 DESIGN A WEB SITE USING PUBLISHER Before you begin, plan your Web site Before you create your Web site, ask yourself these questions: What do I want the site to do? Whom do I want to visit

More information

Recreate your Newsletter Content and Layout within Informz (Workshop) Monica Capogna and Dan Reade. Exercise: Creating two types of Story Layouts

Recreate your Newsletter Content and Layout within Informz (Workshop) Monica Capogna and Dan Reade. Exercise: Creating two types of Story Layouts Recreate your Newsletter Content and Layout within Informz (Workshop) Monica Capogna and Dan Reade Exercise: Creating two types of Story Layouts 1. Creating a basic story layout (with title and content)

More information

Content Management System User Guide

Content Management System User Guide CWD Clark Web Development Ltd Content Management System User Guide Version 1.0 1 Introduction... 3 What is a content management system?... 3 Browser requirements... 3 Logging in... 3 Page module... 6 List

More information

Site Maintenance. Table of Contents

Site Maintenance. Table of Contents Site Maintenance Table of Contents Adobe Contribute How to Install... 1 Publisher and Editor Roles... 1 Editing a Page in Contribute... 2 Designing a Page... 4 Publishing a Draft... 7 Common Problems...

More information

Dreamweaver. Links and Tables

Dreamweaver. Links and Tables Dreamweaver Links and Tables WORKSHOP DESCRIPTION... 1 Overview 1 Prerequisites 1 Objectives 1 ADDING HYPERLINKS... 2 New Text Hyperlink 2 Existing Text or Image Hyperlink 2 EXERCISE 1 3 New Text E-mail

More information

Creating Interactive PDF Forms

Creating Interactive PDF Forms Creating Interactive PDF Forms Using Adobe Acrobat X Pro Information Technology Services Outreach and Distance Learning Technologies Copyright 2012 KSU Department of Information Technology Services This

More information

Creating Web Pages with Dreamweaver CS 6 and CSS

Creating Web Pages with Dreamweaver CS 6 and CSS Table of Contents Overview... 3 Getting Started... 3 Web Page Creation Tips... 3 Creating a Basic Web Page Exercise... 4 Create a New Page... 4 Using a Table for the Layout... 5 Adding Text... 6 Adding

More information

Lab: Create Your Own Homepage! This exercise uses MS Expression Web as a Web Page creation tool. If you like you

Lab: Create Your Own Homepage! This exercise uses MS Expression Web as a Web Page creation tool. If you like you Lab: Create Your Own Homepage! This exercise uses MS Expression Web as a Web Page creation tool. If you like you can download a trial version at http://www.microsoft.com/enus/download/details.aspx?id=7764.

More information

Sage Accountants Business Cloud EasyEditor Quick Start Guide

Sage Accountants Business Cloud EasyEditor Quick Start Guide Sage Accountants Business Cloud EasyEditor Quick Start Guide VERSION 1.0 September 2013 Contents Introduction 3 Overview of the interface 4 Working with elements 6 Adding and moving elements 7 Resizing

More information

How to Edit Your Website

How to Edit Your Website How to Edit Your Website A guide to using your Content Management System Overview 2 Accessing the CMS 2 Choosing Your Language 2 Resetting Your Password 3 Sites 4 Favorites 4 Pages 5 Creating Pages 5 Managing

More information

WebCT 4.x: HTML Editor

WebCT 4.x: HTML Editor Competencies After reading this document, you will be able to: Employ the HTML Editor capabilities to create and publish content. About HTML Editor The HTML editor provides word-processor-like features

More information

Module 6 Web Page Concept and Design: Getting a Web Page Up and Running

Module 6 Web Page Concept and Design: Getting a Web Page Up and Running Module 6 Web Page Concept and Design: Getting a Web Page Up and Running Lesson 3 Creating Web Pages Using HTML UNESCO EIPICT M6. LESSON 3 1 Rationale Librarians need to learn how to plan, design and create

More information

Google Sites: Site Creation and Home Page Design

Google Sites: Site Creation and Home Page Design Google Sites: Site Creation and Home Page Design This is the second tutorial in the Google Sites series. You should already have your site set up. You should know its URL and your Google Sites Login and

More information

Building a Personal Website (Adapted from the Building a Town Website Student Guide 2003 Macromedia, Inc.)

Building a Personal Website (Adapted from the Building a Town Website Student Guide 2003 Macromedia, Inc.) Building a Personal Website (Adapted from the Building a Town Website Student Guide 2003 Macromedia, Inc.) In this project, you will learn the web publishing skills you need to: Plan a website Define a

More information

Caldes CM12: Content Management Software Introduction v1.9

Caldes CM12: Content Management Software Introduction v1.9 Caldes CM12: Content Management Software Introduction v1.9 Enterprise Version: If you are using Express, please contact us. Background Information This manual assumes that you have some basic knowledge

More information

Chapter 14: Links. Types of Links. 1 Chapter 14: Links

Chapter 14: Links. Types of Links. 1 Chapter 14: Links 1 Unlike a word processor, the pages that you create for a website do not really have any order. You can create as many pages as you like, in any order that you like. The way your website is arranged and

More information

How to create pop-up menus

How to create pop-up menus How to create pop-up menus Pop-up menus are menus that are displayed in a browser when a site visitor moves the pointer over or clicks a trigger image. Items in a pop-up menu can have URL links attached

More information

CREATING WEB FORMS WEB and FORMS FRAMES AND

CREATING WEB FORMS WEB and FORMS FRAMES AND CREATING CREATING WEB FORMS WEB and FORMS FRAMES AND FRAMES USING Using HTML HTML Creating Web Forms and Frames 1. What is a Web Form 2. What is a CGI Script File 3. Initiating the HTML File 4. Composing

More information

SoftChalk. Level 1. University Information Technology Services. Training, SoftChalk Level Outreach, 1 Learning Technologies and Video Production

SoftChalk. Level 1. University Information Technology Services. Training, SoftChalk Level Outreach, 1 Learning Technologies and Video Production SoftChalk Level 1 University Information Technology Services Training, SoftChalk Level Outreach, 1 Learning Technologies and Video Production Page 1 of 49 Copyright 2013 KSU Department of University Information

More information

Client Admin Site Adding/Editing Content Under Site Builder/Site Navigation Tutorial by Commerce Promote

Client Admin Site Adding/Editing Content Under Site Builder/Site Navigation Tutorial by Commerce Promote SiteBuilder (Adding/Editing Content) Enable web pages on your website Add and format text and images Upload images Create Image Links Create Sub Levels Create Hyperlinks Upload Data files (ppt,xls,word

More information

Dreamweaver. Introduction to Editing Web Pages

Dreamweaver. Introduction to Editing Web Pages Dreamweaver Introduction to Editing Web Pages WORKSHOP DESCRIPTION... 1 Overview 1 Prerequisites 1 Objectives 1 INTRODUCTION TO DREAMWEAVER... 1 Document Window 3 Toolbar 3 Insert Panel 4 Properties Panel

More information

Adobe Dreamweaver Student Organizations Publishing Details Getting Started Basic Web Page Tutorial For Student Organizations at Dickinson College *

Adobe Dreamweaver Student Organizations Publishing Details Getting Started Basic Web Page Tutorial For Student Organizations at Dickinson College * Adobe Dreamweaver Student Organizations Publishing Details Getting Started Basic Web Page Tutorial For Student Organizations at Dickinson College * Some Student Organizations are on our web server called

More information

Ingeniux 8 CMS Web Management System ICIT Technology Training and Advancement (training@uww.edu)

Ingeniux 8 CMS Web Management System ICIT Technology Training and Advancement (training@uww.edu) Ingeniux 8 CMS Web Management System ICIT Technology Training and Advancement (training@uww.edu) Updated on 10/17/2014 Table of Contents About... 4 Who Can Use It... 4 Log into Ingeniux... 4 Using Ingeniux

More information

VP-ASP Shopping Cart Quick Start (Free Version) Guide Version 6.50 March 21 2007

VP-ASP Shopping Cart Quick Start (Free Version) Guide Version 6.50 March 21 2007 VP-ASP Shopping Cart Quick Start (Free Version) Guide Version 6.50 March 21 2007 Rocksalt International Pty Ltd support@vpasp.com www.vpasp.com Table of Contents 1 INTRODUCTION... 3 2 FEATURES... 4 3 WHAT

More information

Redback Solutions. Visionscape Manual

Redback Solutions. Visionscape Manual Redback Solutions Visionscape Manual Updated 31/05/2013 1 Copyright 2013 Redback Solutions Pty Ltd. All rights reserved. The Visionscape Content Management System (CMS) may not be copied, reproduced or

More information

Microsoft Word 2010 Tutorial

Microsoft Word 2010 Tutorial Microsoft Word 2010 Tutorial GETTING STARTED Microsoft Word is one of the most popular word processing programs supported by both Mac and PC platforms. Microsoft Word can be used to create documents, brochures,

More information

NURSING 3225 NURSING INQUIRY WEB SITE DEVELOPMENT GUIDE BOOK

NURSING 3225 NURSING INQUIRY WEB SITE DEVELOPMENT GUIDE BOOK Nursing 3225 Web Dev Manual Page 1 NURSING 3225 NURSING INQUIRY WEB SITE DEVELOPMENT GUIDE BOOK Nursing 3225 Web Dev Manual Page 2 N3225: Nursing Inquiry Student Created Group Website Addresses (1 of 2)

More information

Introduction to Drupal

Introduction to Drupal Introduction to Drupal Login 2 Create a Page 2 Title 2 Body 2 Editor 2 Menu Settings 5 Attached Images 5 Authoring Information 6 Revision Information 6 Publishing Options 6 File Attachments 6 URL Path

More information

ITP 101 Project 3 - Dreamweaver

ITP 101 Project 3 - Dreamweaver ITP 101 Project 3 - Dreamweaver Project Objectives You will also learn how to make a website outlining your company s products, location, and contact info. Project Details USC provides its students with

More information

Customizing forms and writing QuickBooks Letters

Customizing forms and writing QuickBooks Letters LESSON 15 Customizing forms and writing QuickBooks Letters 15 Lesson objectives, 398 Supporting materials, 398 Instructor preparation, 398 To start this lesson, 398 About QuickBooks forms, 399 Customizing

More information

Website Development Komodo Editor and HTML Intro

Website Development Komodo Editor and HTML Intro Website Development Komodo Editor and HTML Intro Introduction In this Assignment we will cover: o Use of the editor that will be used for the Website Development and Javascript Programming sections of

More information

Essential HTML & CSS for WordPress. Mark Raymond Luminys, Inc. 949-654-3890 mraymond@luminys.com www.luminys.com

Essential HTML & CSS for WordPress. Mark Raymond Luminys, Inc. 949-654-3890 mraymond@luminys.com www.luminys.com Essential HTML & CSS for WordPress Mark Raymond Luminys, Inc. 949-654-3890 mraymond@luminys.com www.luminys.com HTML: Hypertext Markup Language HTML is a specification that defines how pages are created

More information

BIGPOND ONLINE STORAGE USER GUIDE Issue 1.1.0-18 August 2005

BIGPOND ONLINE STORAGE USER GUIDE Issue 1.1.0-18 August 2005 BIGPOND ONLINE STORAGE USER GUIDE Issue 1.1.0-18 August 2005 PLEASE NOTE: The contents of this publication, and any associated documentation provided to you, must not be disclosed to any third party without

More information

Web Portal User Guide. Version 6.0

Web Portal User Guide. Version 6.0 Web Portal User Guide Version 6.0 2013 Pitney Bowes Software Inc. All rights reserved. This document may contain confidential and proprietary information belonging to Pitney Bowes Inc. and/or its subsidiaries

More information

Garfield Public Schools Fine & Practical Arts Curriculum Web Design

Garfield Public Schools Fine & Practical Arts Curriculum Web Design Garfield Public Schools Fine & Practical Arts Curriculum Web Design (Half-Year) 2.5 Credits Course Description This course provides students with basic knowledge of HTML and CSS to create websites and

More information

PowerPoint 2013 Basics for Windows Training Objective

PowerPoint 2013 Basics for Windows Training Objective PowerPoint 2013 Basics for Windows PowerPoint 2013 Basics for Windows Training Objective To learn the tools and features to get started using PowerPoint more efficiently and effectively. What you can expect

More information

Create a Web Page with Dreamweaver

Create a Web Page with Dreamweaver Create a Web Page with Dreamweaver Dreamweaver is an HTML editing program that allows the beginner and the advanced coder to create Web pages. 1. Launch Dreamweaver. Several windows appear that will assist

More information

GUIDELINES FOR SCHOOL WEB PAGES

GUIDELINES FOR SCHOOL WEB PAGES GUIDELINES FOR SCHOOL WEB PAGES Introduction Mountain Home Public School District School web pages are public documents welcoming the outside world to our school and linking our students and staff to outside

More information

Virtual Exhibit 5.0 requires that you have PastPerfect version 5.0 or higher with the MultiMedia and Virtual Exhibit Upgrades.

Virtual Exhibit 5.0 requires that you have PastPerfect version 5.0 or higher with the MultiMedia and Virtual Exhibit Upgrades. 28 VIRTUAL EXHIBIT Virtual Exhibit (VE) is the instant Web exhibit creation tool for PastPerfect Museum Software. Virtual Exhibit converts selected collection records and images from PastPerfect to HTML

More information

Quick Reference Guide

Quick Reference Guide Simplified Web Interface for Teachers Quick Reference Guide Online Development Center Site Profile 5 These fields will be pre-populated with your information { 1 2 3 4 Key 1) Website Title: Enter the name

More information

ANATOMY OF A WEB PAGE...

ANATOMY OF A WEB PAGE... Web Design Contents INTRODUCTION... 4 WHAT YOU WILL LEARN... 4 ABOUT THE HOME AND LEARN WEB DESIGN SOFTWARE... 5 INSTALLING THE SOFTWARE... 6 WEB COURSE FILES... 6 ANATOMY OF A WEB PAGE... 7 WHAT IS A

More information

Personal Portfolios on Blackboard

Personal Portfolios on Blackboard Personal Portfolios on Blackboard This handout has four parts: 1. Creating Personal Portfolios p. 2-11 2. Creating Personal Artifacts p. 12-17 3. Sharing Personal Portfolios p. 18-22 4. Downloading Personal

More information

css href title software blog domain HTML div style address img h2 tag maintainingwebpages browser technology login network multimedia font-family

css href title software blog domain HTML div style address img h2 tag maintainingwebpages browser technology login network multimedia font-family technology software href browser communication public login address img links social network HTML div style font-family url media h2 tag handbook: id domain TextEdit blog title PORT JERVIS CENTRAL SCHOOL

More information