CSI315CSI315 Building Web Sites

What is a website A website is just a bunch of web pages connected together with something called a link. In HTML there is a special tag called the 'link' tag, and it looks like this in its most basic form: E.g, a href=" ">) ( ).

The files (pages, images etc.) that make up your web site are organized in folders just like any other files that you store on your home computer. Your host will give you a space/directory on their server for you to place all your websites' files. This space/folder assigned to you will be the 'root' of your web site. This means that as far as the Internet is concerned, anything (html files, images other folders etc) in this folder is directly accessible by your domain name plus the name of the item.

Building a Web site Define the purpose of web site Diagram the structure of the website. Write out the text for the web site Choose a basic layout, color scheme and fonts that will be used on all pages Build out the website Choose a domain name (pizzaden.com, 'discountHardware.com' ) Register your domain name Find a hosting company Upload your website to the hosting companies servers

Registering a domain name com,.net,.org,.tv,.biz, etc.ca (Canada),.us (USA),.co.uk. Mopipi.bw

Find a hosting company A web host provides you with the space, tools and support to create your web pages and accounts Things that can affect selecting a web host Cost. Cost Top quality customer service accounts Around-the-clock phone and support Ability to update your site 24 hrs/day, 7 days/week No obligation to stay

Network Service Providers: Owns and maintain routings at (Network Access Point),NAP a point on the Internet where several connections converge. Own high speed and high capacity networks to provide global access and interconnectivity Sell wholesale internet connectivity services to ISP’s e.g. AT&T, BT. Internet Service Providers: Provide individuals, busiss, organization access to the internet) Re-Sell or add value to and sell new services to customers e.g AOL, UUNET, Mega, Botsnet, BBi (Broadband Botswana), Infotec Botswana End Users: Include Residential, Business, Orgs

9 Hyperlinks Hyperlinks are the most fundamental part of the World Wide Web. They tie pages together: Links should be text descriptive. phrases such as 'click here' should be avoided –Alternatives to online forms should be provided. –Pages should be tested using different viewers.

10 There are three different kinds of links you can have on your website: Links to anchors on the current page (Internal). Links to other pages within the current site (Local) Links to pages outside the current site (Global). Hyperlinks

11 The tags used to produce links are the and. The tells where the link should start and the indicates where the link ends. The target of the link is added to the tag as an attribute setting : (href= Hyperlinks

12 Hyperlink Example My First Home Page Brian’s HTML Page Hi World, welcome to my HTML page! Enjoy!

13 Hyperlink Example My Second Home Page Brian’s HTML Page Hi World, this is my second HTML page! Go Back To Page 1

14 The general color of text links is specified in the tag: Hyperlink

15 link - standard link - to a page the visitor hasn't been to yet. (standard color is blue - #0000FF). vlink - visited link - to a page the visitor has been to before. (standard color is purple - #800080). alink - active link - the color of the link when the mouse is on it. (standard color is red - #FF0000). Hyperlink

16 You might want one or more links to have different colors than the rest of the page. There are two methods for doing this: Placing font tags between the and the tag. Using a style setting in the tag. Hyperlink

17 Click here to go to Yahoo. Hyperlink Example

18 Link Targets By default, links will open in the current window or frame. To open in another window or frame: To do this you simply add a target="" to the.

19 Predefined targets are: _blank loads the page into a new browser window. _self loads the page into the current window. _parent loads the page into the frame that is superior to the frame the hyperlink is in. _top cancels all frames, and loads in full browser window Link Targets

20 Image Links To make an image a link: To turn off a border, add border="0" to the tag:

Every graphic image should have text associated with it. This is achieved using ALT, for example, If a browser is not capable of displaying images, the text in the ALT statement is displayed instead. Always provide text alternatives to image maps.

22 Links in a Page Normal links always point to the top of a page. Anchors point to a place within a page. An anchor is created using the tag. If you want to create an anchor called chapter4, you simply add this line where you want the anchor to be:

23 After doing this, you can make a link pointing to the anchor using the normal tag, like this: Click here to read chapter 4. Note: When linking to an anchor on a page you need to put a # in front of the anchor. Links in a Page

24 When you link to anchors on external pages use this syntax: CS36L Project-Directory of Students Links in a Page