Creator of HTML - Weblayer's Short Post

Tim Berners-Lee is the creator of the internet. He founded the World Wide Web Consortium (W3C), a group of people who look over the continued development of the Internet. In 1980, he was a independent contractor and invented ENQUIRE, an early hypertext software and a predecessor to the World Wide Web. The first website ever on the internet is Info.cern.ch, and it was put on web servers in 1991.Info.cern.ch comes up as an invalid sight on Stuffgate.

That's HTML's father!

Starting a Webpage

I should have posted this first, but I'll post it now. There are ways to create a webpage without it being online. My favorite is creating a HTM document, and here's how.


1. Open Notepad (or anything similar to Windows notepad).

2. Type what ever code you want



3. Save the document as [Name].htm




4. Open the file from your desktop and viola, you see your webpage in the browser!



When you have put finishing touches on your webpage, you can get it online for others to see by web-hosting sites like Go Daddy. This usually costs money ($5-15/month), at least for the best services.

That's a start for learning web design, you can test things and see your results for free.

For more Web Design tutorials and how-to's, follow this blog!

Links - Making and Understanding

A link is one of the most important things in HTML. It ties the content together and, well, links it. It can come in multiple forms, the two we'll be looking at is in blue text (it's changeable!) and inside a picture.

So lets get to it.


We've all seen text links before, unless you've been using the computer for less than 10 seconds They are normally a blue color and are underlined. Here is an example of a text link:


http://www.example.com

*The HTTP stands for HyperText Transfer Protocol,
*WWW stands for World Wide Web
*Example is the site's title
*Com stands for Commercial (there's also .org (organization), .net (network), etc.)

--So it looks pretty here on this page, doesn't it? Neat and clean!

--But, under the hood, it's a bit  uglier.

Here is what you would have to put in an html document to show a link:

    <A href="http://www.example.com">http://www.example.com</A>

--Don't fret, we'll go over what is going on here now.

Href stands for [h]ypertext [ref]erence

That tells the browser that the text (link) is clickable.

The Red text is the URL itself, for example this blog's url is 

http://www.weblayers.blogspot.com. 

The Green text is what is shown to humans, and it's changable.

So if I wanted to make a URL to my blog, but wanted to change the text, it would

look like this:

    <a href="http://www.weblayers.blogspot.com">I'm a link!</a> 

=>   I'm a link!

So now you know a little about text links. Lets get into image links!


Here's an example of a image with a link:

If you click that it goes to http://www.example.com, and if you right-click you can copy the link location (http://www.example.com). The link is embed!

 But how does it look behind the layers of the web?

<a href="http://www.example.com/" style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;"><img height="200" src="http://tinyurl.com/3vmzr6k" width="200" /> </a></div>

http://tinyurl.com/3vmzr6k is a substitution for the location of the image, such as example.png, through the website tinyurl.com


That is even worse looking!

So again, we see the  <a href="http://www.example.com/". That is the same, linking you to the other page. The rest of this is all for the look of the image, just as we changed the look of the text.

    style="clear: left; float: left; margin-bottom: 1em; margin-right: 1em;">

--This is all positioning of the image, in the CSS language.

    img height="200", width="200"
--These are the dimensions of the image, if you in increase the variables then the image size will increase, and vice versa




So there is a look into Links, a very important part of web design. Stay tuned for more web design tutorials!