1. WEB DESIGN TABLES, PAGE LAYOUT AND FORMS

2. Page Layout Page Layout is an important part of web design Why do you think your page layout is important?

3. Answers: People visiting can navigate throughout it Looks nice and easy to understand Refers to the way your page will display in the browser, which is one of the major challenges for any web designers

4. Table Great tool for designing a web page Very similar to the table feature in word processing programs (Microsoft Word) Allows you to enter (add) vertical or horizontal structure to a web page Can put anything in your page and have it display in a specific area

5. With a table you can: Lay out tabular data Create columns of text or navigation bars Delete, split, and merge rows and columns Modify table, row or cell properties to add color/alignment Copy and paste cells

6. Understanding and Planning Page Layout Process of arranging the text, images, and other elements on the page

7. Rules to live by when creating your page layout: Easy to navigate Easy to read Quick to download *web site does not load in 15 seconds visitors may lose interest *tables download quickly because they are in HTML code

8. Tables can be used anywhere: Homepage Menus Images Navigation bars

9. A typical web page is composed into three sections: Header-top; contains logos, images, or text that identifies web site Body-informational content; form of text, graphics, animations, video and audio Footer-provides hyperlinks for contact; information; navigational controls ex. Back to top What are the sections of HTML code?

10. Understanding Tables Table-consists of three basic components Row Column cell

11. Row Horizontal collection of cells Column Vertical collection of cells Cell Container created when the row/column intersect

12. Head content What section is the head content located? Meta Keywords Description Refresh Base Link

13. Meta Contains information about the current document. This information is used by servers, browsers, and search engines. HTML documents can have as many tags as needed, but each item uses a different set of tags.

14. Keywords List of words that someone would type into a search engine search field.

15. Description Contains a sentence or two that can be used in a search engine s results page

16. CREATING AND USING INTERACTIVE FORMS

17. Forms Interactive elements that provide a way for the Web site visitor to interact with the site

18. A form provides a method for: A user to give feedback Submit an order for merchandise or services Request information Etc Forms are created using HTML tags

19. Form processing Provides a popular way to collect data from a web site visitor Forms DO NOT process data They require a script to process the data for them

20. Script Is a text file that is executed within an application and usually is written in Perl, VBScript, JavaScript, etc. These are referred to as server-side scripts

21. Common Gateway Interface (CGI) Common way to process form data

22. How to process data: 1.When a browser collects data, the data is sent to a Hypertext Transfer Protocol (HTTP) server (gateway). 2.Server then starts a program which also is specified in the HTML form that can process the collected data 3.The Gateway can process the input however you choose 4.It may return customized HTML based on the user s input 5.Log the input to a file or email the input to someone

23. Two types of HTTP methods are: 1.GET 2.POST

24. GET method Sends the data with a URL Not widely used Limitations: on the amount and format of the data that is transmitted to the application Information being sent is visible in the browser s address bar

25. POST method More efficient Sends data to the application as standard input with no limits Sends much more information Is not sent with the URL, so the data is not visible to the site visitor

26. Input Input-which collects data from check boxes, radio buttons, single- line text fields, form/image buttons, and passwords Select-used with lists and pop-up menu boxes Textarea-collects data from multiline text fields

27. Forms and Web Pages Form object-can be a text box, check box, radio button, list, menu, or other buttons

28. Text field A form object in which users enter a response Forms support three types of text fields Single-line Multiple-line Password

29. List/Menu List-provides a scroll bar with up and down arrows that lets a user scroll the list, whereas a menu contains a pop-up list Multiple selections can be made from a list, while users can select only one item from a menu

30. Jump menu Special type of pop-up menu that provides options that link to documents or files. You can create links to documents on your web site, links to documents on other web sites, e-mail links, links to graphics.

31. Validate Form Behavior verifies that the user has entered data into each designated field The form is checked when the user clicks the submit button If omissions or other errors occur, a Microsoft Internet Explorer dialog box is displayed