Lesson 1:  Foundations

By the end of the lessons, you will have built your own website because you will be designing it as you progress through the lessons.  You don't need expensive software.  You already have everything you need to get started.

Components that are required:

1.  Text Editor:

If you are using Windows, Notepad is installed on your computer.  Mac has the built in TextEdit.  You can use either one of these text editors but make sure that you save your files in plain text without any formatting at all.  Other programs change what is typed, adding to it, which will make your code have errors.  If you are using Windows, you can find notepad on your computer in the start menu under Programs in Accessories. If you are not using Windows, you can use a similar simple text editor such as Pico (Linux) or TextEdit (Mac).  [I will give you additional options for free text editors in a later lesson.]

2.  Internet Browser:

The browser looks at the code and displays it as a website on the internet. Each browser interprets the tags a little differently, so what you see in one type of browser may be different than what you see in another type of browser. It doesn't matter which browser you choose to use, so long as you are comfortable with it. But, as a web developer, it is suggested that you have several browsers so you can see what your website looks like in each one. You want to make sure that your code looks decent in each one.

The most popular browsers are as follows:

Internet Explorer (http://www.microsoft.com/windows/internet-explorer/default.aspx)
Firefox (http://www.spreadfirefox.com/)
Opera (http://www.opera.com/)
Google Chrome (http://www.google.com/chrome)
Safari (http://www.apple.com/safari/)

If you don't have all of these browsers, I suggest that you at least download them if only to use them to check your code, making sure its function and design not only look good but work well in all of these browsers. As a web developer, you want to make websites that your audience will like to see and don't encounter problems when they use your website.

I personally use Internet Explorer for surfing the internet. It is the browser that was already on my computer when I purchased it, and it is what I used as I learned how to use a computer and get on the internet. Google Chrome is claimed to be the fastest browser. Firefox has an adblock feature. Opera uses many computer resources so it will run the slowest of all of the browsers mentioned. All of these software programs can be on your computer at one time except you cannot install more than one version of Internet Explorer on your computer.  It creates problems for your computer. There are times when I have all of them loaded and running on my computer at one time, using them to check out sites that I am developing. However, if you have an older computer, you may encounter problems following this same practice. My computer has been modified so that I can run numerous 'high resource' programs as well as browsers without my computer slowing down.

 The two must have tools to design websites is a text editor and a browser.  That's it.  You don't need expensive equipment to design and develop websites. But you do need to know what your resource limits are. You may not be able to use the most current version of a browser because of your computer's requirements. The thing to remember is that you may not be able to use the latest stuff but you are responsible for knowing your own computer and its capabilities. If your computer crashes because you don't know what it can handle is a fault that a responsible web developer does not make.

Homework Assignment No. 1, Part 1:

Your first assignment for this class is to send me a text file with the names and version numbers of the browsers that you have loaded on your computer. Also, tell me what browser you prefer and why. If you download the other browsers that I mention in this assignment, use them and give me your opinion of each one. Next, so I know that you are aware of your computer's capabilities, send me information as to your resources. I am not a techie by any means, but I want to make sure that you know your own equipment and what its limits are. Finally, if you use a browser that I haven't mentioned in this assignment, let me know what that is and why you use it. Give me the name and web url where I can find it. While you have your notepad open, tell me about yourself (only divulge information that you feel comfortable sharing with a stranger), why you want to learn web design and development, and what your goals are. I want to get to know you as we go through this journey together.

Basic HTML Information:

HTML is an abbreviation of "HyperText Mark-up Language" and is the computer language that is used to create documents on the Web. HTML makes it possible to present information on the Internet. What you see when you view a page on the Internet is your browser's interpretation of HTML. To see the HTML code of a page on the Internet, simply click "View" in the top menu of your browser and choose "Source". If you want to make websites, there is no way around HTML. You have to know it if you make websites.

One important concept to learn at the start is to separate content and style.  HTML does not describe how webpages look, it describes what they mean.  CSS (Cascading Style Sheets) define style or how webpages look.  Learn this difference now.  Keep your HTML clean, meaning it is the code that makes the webpage work.  Don't muddy it up with trying to make it do both jobs.  You are learning HTML then I will help you with the CSS afterwards.

Second important concept is to make standard compliant code.  If your HTML is not standard compliant, your pages may not work properly.  I will come back to this topic later.  Keep these two concepts in mind as we go forward.

URL stands for "uniform resource locator." It's the standard address that can take you to a document, or a specific place on a document, anywhere on the WWW. It is a website's address, i.e., www.microsoft.com.

So you have your tools to begin coding a website, you also need a place to store your files (HTML) so your website can be viewed on the internet. You need space on the internet where you can upload your HTML files and store them. There are free hosts that give space on the internet but you agree to permit them to place advertising on your website in exchange for this free service. But, for learning how to design and develop a website, free works great! Bravenet (http://www.bravenet.com/) is a popular free host and it offers more than just free space, it also offers tools such as guestbooks, hit meters, polls, email forms, etc. So, unless you have already established a host, I suggest that you open an account at bravenet and use it to store your HTML files for this class.

 Homework Assignment No. 1, Part 2:

The second part of your assignment for this lesson is to establish web hosting if you don't have it yet. Send me a text file with your account's URL (where your website will appear). Each website that you design begins with an idea about information that you want to share with others via the internet. Since we are going to make a website in this class, I want you to decide what idea you are going to make your website about. Write me a brief essay wherein you describe for me the idea for your website. Be original and creative. Don't just tell me what your idea is, (i.e., a recipe website or an mp3 website), describe for me what your information is going to be. What makes your idea original and makes it stand apart from other websites.  Part of web design is the ability to create content, make it interesting and original.

You have completed Lesson 1.  I look forward to hearing from you soon.