Pages

Sunday, December 9

HTML – A quick reference guide

This is a quick reference guide for HTML in 1 hour. Keep learning the tags and simultaneously execute them in the browser to see the effect.
<B> - Bold                                                           ex. <B>Hello World
<em> - Italic                                                        ex. <em>Hello World<em>
<a> - Anchor// For adding links                            ex. <a href= “www.yahoo.com”>yahoo</a>
<P> Paragraph//Gives spacing b/w paragraphs       ex. <P>Hello World</P>
#fragment // purely exists in the browser.             ex. url#fragment
?query parameter

Void tags
They haveno content so they does not involve closing.
<img> Image //For adding images     ex. <img src=”reference url” alt=”text if img not there”>
<BR> Break                                     ex. Hi dude<BR>How are you?

Inline  & Block
<P> tag considers the statement as a block. It has height and width.
whereas as; <BR> tag is inline and only changes the line.
All elements we have studied here are inline except <P> tag.
<SPAN>               Inline                ex. <span class=”foo”>text</span>
<DIV> Block                                 ex<div class=”bar”>text</div>

Other Inline tags are:
<a><span><br><img><strong>


localhost is the name of the machine and 8000 is the port no. In order to make an internet connection you need two things.
1.  Address of the machine
2.  Port No.(Bydefault port is 80). If you want to change it, you can change it between url and path.

A postmortem of an address:
host- www.google.com
protocol - http
fragments - #blue
query - ?p=foo
port- 80

General HTML Document Structure
<!DOCTYPE HTML>                                      //document type
<HTML>                                                         //contains kind of metadata
<HEAD>
                <TITLE></TITLE>                        //title of the page in the window of the browser
</HEAD>
<BODY>
                <B>contentssssss</B>                  //body of the page i.e. actual contents of the page
</BODY>
</HTML>

HTTP Response Headers:
Date- Tue, 20 Jan 2012 07:33:33 GMT
Server – Apache/2.2.3                   (This is version no. Its kept secret or it’ll make it vulnerable to attacks.)
Content- Type: text/html             (Type of document to be returned and told to the browser.)
Content-  Length: 1539


Creating a connection:
telnet www.yahoo.com 80          (browser makes request)
GET / HTTP/1.0                                  (In 1.1, the server does not closes the connection by default to allow browser to make multiple requests to the server. Connection remains open and is a little pain if we are using telnet. 1.0 is an optimisation. )
Host:  www.yahoo.com          (google wants this because its hosting a lot of different things.)


GET method:
1.  GET : a method which tells what type of requests you are making to the server. Other method are POST
2.  /foo: tells about the path. This tells abot the requested document to the server. Path is used for making the request.
3.  HTTP/1.1: Mostly used nowadays.


Request Line to GET this URL is: GET foo/logo.png?p=1 HTTP/1.1
Fragments are never sent to the server. They purely stay in the browser or in the client side.



URL’s stands for uniform Resource Locator ex. http://www.yahoo.com/finance
So http is a protocol; www.yahoo.com is a host name or domain name. Its translated into IP address; /finance is a path. Also it can be very large also. We can have minimum path as /
An important point about URL is that they are case sensitive.



TELNET Request
Status code: 302/200 etc.
Location: http://www.iana.org/domain/example
Request made is:
GET /domain/example HTTP/1.0



Purpose of Servers
is To respond to HTTP requests. There are two type of responses made by the server:
1. Static: Pre written files ex. Image files
2. Dynamic: made on the fly i.e. during the execution of the program. Used mostly nowadays.
Web Application does this dynamic work. It lives on a server and responds to the browser HTTP requests. Ex. Your facebook page; A blog front page; Google search results.

No comments:

Post a Comment