Many parents would like to give their kids an educational edge by teaching them the technical skills they'll need later in life. But with technological advances coming so rapidly, especially in the field of computers, more than a few parents not only don't have the skills themselves but have a hard time even discerning what skills are worthwhile learning.
One facet of the technoscape that will linger for some time still is the Internet, which revolves around the concept of "web pages." Creating a web page is something you can learn to do and then teach to your children quite easily.
Web pages work their magic through "scripts" written in Hypertext Markup Language, or HTML. Now, here's the secret: HTML is just text, and all the fancy stuff web pages can do is just based on words in a text file.
Because HTML is a type of programming, there is some jargon, but most of it is easy to remember because the commands are often initials or abbreviations of English words.
To get started making a basic web page, make a text file. It's best when you're learning to do this with a simple text editor like Notepad. If you use something with more options, like Wordpad or Word, you'll find the computer will rewrite some of your work and throw in tons of extraneous coding to boot. Whatever program you use should be able to save plain text.
Once you've created the text file, name it something like "MyWebPage" and change the extension from "txt" to "htm." The computer will ask if you're sure and possibly warn you that the world will end if you change the extension, but just click "OK."
Open the file if you haven't already. Write yourself a friendly note like "I am so happy to be learning HTML." Keep your text window open and then find your file's icon on the desktop (or wherever you put it). Click on it to open it in your web browser. (If the browser doesn't open the file automatically, make sure you've changed the extension to "htm," then right-click on the icon and select "Open with" and your browser.) Your web browser should display an otherwise empty page with your message on it.
Now you can start adding HTML to make things look different. All HTML commands, or "tags," begin with an open angle bracket, <, and end with a closing angle bracket, >.
All basic web pages need to start with the following template:
<html>
<head>
</head>
<body>
</body>
</html>
The first command just tells a computer that this is a web page. That's especially important when you start worrying about search engines finding your work, but that's for later. Just remember for now that <html> and </html> should be the first things on your web page. The two commands act like a container for everything else to come.
The next command, <head> and </head> mark off the place where you can put fancy scripts, set styles for your page elements, include messages for visiting web browsers and so on. It's the "thinking" element of the page that contains most of the "unseen" workings of your page.
Between the <body> and </body> tags is where most of your work will appear, including all the elements that will be visible to anyone looking at your page. Elements can be changed by adding what are called in-line style sheets.
The first thing you can do is change the background color of your page. Inside the opening body tag, add "style='background-color:#00FFFF'" so that your tag looks like <body style="background-color:#00FFFF">. Save your file and refresh your browser. This should give your page a nice light blue background. There are literally millions of colors you can choose from. For more on web color codes, check out this page.
Now, let's beef up your message. Put the paragraph tags, <p> and </p> around your message. Make sure your message and its tags are between the body tags. Then we'll add to the opening paragraph tag a stylesheet that says "style='font-family:sans-serif; font-style:italic; color:#FF0000; font-size:72px;'" so your tag looks like <p style="font-family:sans-serif; font-style:italic; color:#FF0000; font-size:72px;">. Save your file and refresh your browser. You should see your message in large, sans-serif, red italic letters. For more about font options, see this page.
Those are the absolute basics. With just those simple commands, your child can begin putting together a nice-looking web page about your homeschooling experiences to share with family and friends. Play around with the numbers and options to see what happens. See the above links for more options.
Editor's note: This is the first part of a planned occasional series about web design.
No comments:
Post a Comment