WEB DESIGN USING DREAMWEAVER

The World Wide Web –A Web site is a group of related files organized around a common topic –A Web page is a single file within a Web site which has a unique name Types of Web Sites –Commercial: sell or promote a company’s products or services –Educational: provide information about a school, university or topic –Informational: provide people with information –Personal: used by individuals to share information –Portal: provide a variety of services that people use everyday

Elements of a Web Page Text –Words, letters, numbers and other symbols Graphics –Drawings, charts, diagrams, paintings, photographs, and navigational buttons Multimedia –Audio, video or animation Hyperlinks –Internal links, external links and intrapage links

Web Site Development Determine the purpose and goals of the Web site Design and develop the Web site Evaluate and test the Web site Implement the Web site Maintain the Web site

Determine Purpose and Goals What is the site’s purpose –What do you want the site to do What are the site’s goals –What impact do you want the site to have What tools do you need to reach your goals –Do you need special hardware and/or software What is your primary (target) audience –Who will visit/use the site What kinds of hardware and software are the site’s visitors likely to be using

Design and Develop a Site The design process –Interaction design Where will the user need to go In what order will the user move around the site Will the purpose of each link be clear to the user –Information design What text should be on each page What graphics will I include Be sure that text and graphics support the site’s purpose –Presentation design What will the site look like What color scheme will be used Where will I position menus and hyperlinks

Evaluate and Implement a Site Evaluate and Test a Site –Make sure all hyperlinks work correctly –Use various browsers and different computers to view your site Implement the Site –Publish the site on a web server –Retest the site after publishing to make sure all of it still works

Maintain the Site Keep your site current and working properly –Add, delete and update content and pages –Check the links to make sure they continue to work properly (Remember, if you have external links outside Web sites may change location or shut down: check regularly)

HTML HTML stands for Hypertext Markup Language –The code used to create web pages –Consists of tags (a starting and ending tag) –Uses nested tags (a tag enclosed in another set of tags) –An empty tag requires only an opening tag –HTML and the other text in the web page are called its source code –Usually written using Notepad or any other text editor

3 Main Parts of HTML Document Type Definition –Specifies the version of HTML you are using: Start HTML Header Document Title Body CONTENT End HTML

ACTIVITY

Adding Images Using HTML You use the tag to insert images into a Web page Image tags have 5 attributes: –src: the source location of the image –alt: an alternative text message to display if the image does not display –align: wraps text around the image and places the image on the screen –border: places a border around the image –width and height: specifies the image’s height and width EXAMPLE:

Inserting Links using HTML Hyperlinks are external, internal or intrapage Use anchor tags to create all links ( ) Hyperlinks can be text or graphic –Text links example Century Public Library –Graphic links example

Relative and Absolute Links Relative links –Contains the name of the file being linked to –Only works if the file is in the same folder as the document containing the link –Links pages within the same web site Absolute links –Contains the complete URL of the file being linked to –Requires the full file path because it absolutely must follow the path to get to the file –Typically used for external links (to an outside file or website)