Midterm Cover Page

The Internet began as a scheme for decentralized networks. Its beginnings can be traced as far back as 1964 at the RAND Corporation. The RAND Corporation set out to solve the problem of how to communicate among networked computers when part of the computers was out of commission. Paul Baron, a researcher at RAND Corporation said that the "nodes" could be connected so that damaged areas could be routed around.

This solution then raised another question. How would they control such a network? RANDs solution to this was to have no central networking authority. They said that all of the nodes should be equal. They said that it would be easier to divide transmitted messages into "packets". Each packet would then be sent individually, which gives each packet a chance to take a different route to get to the recipient.

In 1969, ARPANET began. ARPANET was a pentagon Advanced Research Projects Agency funded research project between four supercomputers at ARPA contract sites. The purpose of this project was to share computer resources between computers distances away. ARPANET began with four nodes but soon included Thirty-Seven. Soon, the researcher began to use this network for news and personal messages.

The advantage of the ARPA structure was that the network could accommodate many different platforms. Prior to this, in order to network all the computers had to be the same. ARPANET's original standard for communication was called NCP (Network Control Protocol). In the mid-70's, NCP was soon replaced by the more advanced TCP/IP. Eventually, TCP/IP linked other networks to ARPANET creating the Internet (Interconnected Networks.) In 1989, ARPANET was soon replaced by NSFNET.

In 1989, The World Wide Web was created by Tim Berners-Lee at CERN. Tim Berners-Lee created the World Wide Web as a way to link members of international high-physics community together so that information could be accessed more readily. The basic idea was to bring together the technologies of personal computing, Computer Networking, and Hypertext into an easy to use global information system that could be accessed by anyone.

Today when we connect to the Internet, we connect to the World Wide Web as well. The WWW has helped to link millions of computer together. As a result, Many people use the WWW as a way of accessing information, news, meeting new friends, talking to friends, and many of the other things that can be done on the internet today.

Standards have become very important in the development of web pages. When HTML (Hypertext Markup Language) was designed, it was designed to be forwards compatible. With its birth, designers looked for ways to twist the code to implement new ways to format information. With this, developers began learning the wrong ways to use Standards, causing them to learn how to break standards rather than implement Standards. Since then, casual developer as well as many professional developers have coded incorrectly.

Standards were designed to work in all Web Browsers. With the way many people have learned to code (Without using Standards), many browsers will not render a Web Site the same way, which may not have been the way the developer intended the site to look. For Example, many sites today are designed for Microsoft's Internet Explorer. Since IE does not support many CSS standards, developers typically break the standards in order to render it the way the developer intended in IE (the browser 80% of the online community uses). This however does not render correctly in the other twenty percent of the communities browsers.

Validation is a very necessary process. You can fin the HTML validator at http://validator.w3.org. This validator is from the W3C (World Wide Web Consortium), the group who develops and determines what are considered standards in HTML, XHTML, and CSS. You can find the CSS style-sheet validator at http://jigsaw.w3.org/css-validator.

Much of CSS1 and CSS2 are implemented into most web browsers. However, some features in CSS2 are excluded in some of these browsers. CSS3 is the styles currently in development by the W3C, but some browser include features from CSS3 (such as Mozilla Firefox's capability of rendering opacity, a feature in CSS3). Though some browsers may include some CSS3, a style-sheet with CSS3 included will not validate.

Developers today need to start including Standards in their websites today so that their websites may be viewed tomorrow. If companies would stop hiring developers who do not implement Standards, many professional developers would learn the Standards so they could continue to get jobs in Web Development, making a drastic change in the number of de-standardized web sites.

There are three different ways to make a horizontal menu bar. The first way is type words and turning them into links, (using the same paragraph.) The second way of doing the horizontal menu bar is to type up lists. Then you would style the list, turning them into a horizontal menu bar. The third and final way is to make an image map.

The advantage to the first site is that the menu bar is much easier to make than the latter two. In this one, you would simply type the links into a paragraph. An example code would be:

‹a href= "#"›link 1‹/a›‹a href= "#"›link 2‹/a›

This would result in something that looks like this:

link 1link 2

The disadvantages to this is, as can be seen, you have to do some extra coding to add a space in between the two links. This is also the wrong way to code this sort of thing.

The Best way to style this is to make a list and then style it to make it look like a true navigation bar. In this instance, you would type a list as so:

 
   ‹div class="bar"›
   ‹ol title="General site navigation menu"›
      ‹li›‹a href="#"›Link 1‹/a›‹/li›
      ‹li›‹a href="#"›Link 2‹/a›‹/li›
      ‹li›‹a href="#"›Link 3‹/a›‹/li›
      ‹li›‹a href="#"›Link 4‹/a›‹/li›
      ‹li›‹a href="#"›Link 5‹/a›‹/li›
      ‹li›‹a href="#"›Link 6‹/a›‹/li›
   ‹/ol›
   ‹/div›

Next, you would add some CSS that may look like this:

   .bar {
      width: 738px;  /* Need width restriction if want the centering */
      display: block;
      float: none;
      padding: 0;
      margin: 0;
      margin-left: auto;
      margin-right: auto;
          }
          
   .bar ol {
       padding: 0;
       margin: 0;
       list-style-type: none;
             }
             
   .bar li {
       display: block;
       float: left;      
       background: #036;  
       border-bottom:  6px double #fff;
       margin: 0;
       padding: 0;
             }
             
   .bar ol li a {
       width: 121px;
       border-left: 1px solid #fff; 
       padding: 0;
       margin: 2px 0 2px 0;
       color: #fff;
       text-decoration: none;
       display: block;
       text-align: center;
       font-weight: normal;
       font-size:    .9em;
                   }
                   
   .bar ol li:first-child a {
       border-left: 1px #036;
                              }

The Advantage of this is the fact that it is the Proper way to code menu bars, so you know it follows standards, and that it will be forwards-compatible. Also, It give it a more professional look (which is always beneficial). There are not many disadvantages to styling this way. It does take a longer amount of time, but it is worth it since it will always work.

The next way is to do an image map. An image map is a single image that is linked to different URLs. The coding to an image map may look like this:

   ‹map name="mymap"›
     ‹area shape="rect" coords="0,0,50,50" href="#" alt="Link 1"›
     ‹area shape="rect" coords="50,0,100,50" href="#" alt="Link 2"›
     ‹area shape="rect" coords="100,0,150,50" href="#" alt="Link 3"›
     ‹area shape="rect" coords="0,50,50,100" href="#" alt="Link 4"›
     ‹area shape="rect" coords="50,50,100,100" href="#" alt="Link 5"›
     ‹area shape="rect" coords="100,50,150,100" href="#" alt="Link 6"›
   ‹/map›

This way is very impractical. It takes much longer to code, and also you have to make an image and know exactly where you want the links to be added. This can take much longer than other and can really confuse the users. It's best to stay away from this, as well as the first mentioned. The most practical way of doing this is to use lists and CSS.

So far this semester, we have learned a lot. We started off learning a little bit of the History of the Internet; how it began, the rise of the WWW and hypertext, How TCP/IP work (packet switching). After this, we began working with CSS. This was perhaps the most interesting topic to me.

I've never really been into the artistic aspects of coding. This was partially because I've never had to work with CSS as much as I do now. CSS has really brought out the artistic side of my brain allowing me to make beautiful web pages, which I never thought I'd personally be able to do. The fact that code can be used to make Horizontal Vertical Menu, or place the text into columns is amazing when you first learn this.

The reason I've enjoyed learning CSS was because it was completely new to me. It was full of things I had never done before. I enjoy learning new things and when I learn new challenging things, as with CSS, I tend to find them very interesting.

The most enjoyable topic to me in CSS was the creation of menu bars using lists. It was new to me, and when we started I was amazed at all the things you could do to transform the lists into menus and make each list object look even more like a button. I had been curious about how people made menu bars, both vertical and horizontal, since last semester in CSCI 181. Menus make a website look even more interesting.

Perhaps this is only the beginning of the challenge. I am hoping that this class will only get more challenging as the end of the semester approaches. I am hoping to learn new languages that can be used to make even more interesting web sites, such as XML, PHP, and other languages. As this class becomes more challenging, it will only become more fun.