Class Notes, CS253 - Web Application Engineering, UdaCity

Unit 1- Internet and HTML.

Phew…..Just finished Unit 1. Every concepts are basics and comprehensible. It is taught by Steve Huffman, reddit co-creator.

The introduction videos(course outline).

 

1. Internet.

The Internet is a collection of HTML documents, the most basic and standard documents in the web.

This is the general picture of internet:

The Internet
The Internet

When you go to websites, it is the browser that establish the connection between your computer and other computer. You retrieve the documents(most of them HTML) by clicking the title.

The document can be : Plain text, video, music, pictures.

HTML glues them all together.

2.HTML.(Hyper-Text Markup Language)

In some sense, HTML can be thought as an editor because it formats the way texts, pictures, links, videos show up on a website.

Its general syntax is :

<tag>contents</tag>.

It comes with opening-tag and ending tag(starts with ‘/’). The contents can be others tags.

For example:

<b>Hello.</b>

makes the text ‘Hello’ bold:

Hello.

The example of tag within tag :

<b><i>Hello</i></b>

(<i></i> makes Hello italics)

Hello.

If you forget to add the closing tags, then HTML will format the text according the opening tag without ending. In other words, it format all the way to the ends according to the opening tag.

For example, this is the output of

<i><b>Hello</b>

.I am learning HTML.

Hello. Iam learning HTML

HTML has two common types of tags: Inline and block.

Some common Inline tags:

<b></b>

<i></i>

<em></em>

<br>

Some common blocks tags:

<p></p>

<div></div>

Inline tags formats text as a line, of default length. If your sentence is longer than that length, it automatically goes to the next line.

Every white spaces is shrunken down to one space.

Example:

<html>Hello Iam learning HTML. We are going                                       to learn some basics of

HTML</html>

This is the output:

Hello Iam learning HTML. We are going to learn some basics of HTML.

Block tags formats text as-is. It draws an invisble box around the texts. We can specify the width and the height of the box.

The same example:

<p>Hello Iam learning HTML.</p><p> We are going                                       to learn some basics of      HTML</p>

produces difference result:

Hello Iam learning HTML.

We are going to learn some basics of HTML

Note: To achieve the same result of block tags, we can use <br> tag in the inline-tag.

This:

<html>Hello Iam learning HTML.<br> We are going                                       to learn some basics of      HTML<br></html>

produces the same results as block tag.

Leave a Reply

Fill in your details below or click an icon to log in:

WordPress.com Logo

You are commenting using your WordPress.com account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s