home

html basics:

  1. your first web page
  2. intro to tags
  3. head & body
  4. headings
  5. comments
  6. source
  7. line breaks
  8. font
  9. font color
  10. font size
  11. font face
  12. bold & italic text
  13. marquee
  14. images
  15. displaying images
  16. paragraphs
  17. horizontal rules
  18. links
  19. email links
  20. images as links
  21. lists
  22. unordered lists
  23. ordered lists
  24. definition lists
  25. nested lists
  26. tables
  27. table rows & cells
  28. table headings
  29. empty table cells
  30. table attributes
  31. table alignment
  32. frames
  33. links in frames
  34. combining frames
  35. inline frames
  36. forms
  37. form text box
  38. form fieldset & legend
  39. form password box
  40. form radio button
  41. form checkbox
  42. form dropdown box
  43. form textarea
  44. buttons, reset & submit
  45. form action & method
  46. the index

byogeek tutorials

byogeek reference

Free Resources


Free Hosting

Firefox 3

CO.CC:Free Domain

Create FREE graphics at FlamingText.com
html lesson 1

Your very first webpage

Ok let's get started making your first web page.
First off, make a new folder iether on your desktop (right click on your desktop, choose "new" then choose "folder") or in your my documents folder, it doesn't really matter where, just make one and name it mywebsite_root.
We'll be refering to this folder throughout the following tutorials as your "root directory" and this is where we will be saving and keeping all the files for our website.

Next open up a new blank document in notepad(if you need help with this click here).

Don't use microsoft word or other office word processing programs as they are designed for writing letters and documents for people to read so all the spellchecks and grammar checking stuff will mess up your code. We're writing a document for computers to read, not people.

Ok, now you have a new notepad document open, type the following strange looking code into it.

<html>
<head>
<title> My first webpage!! </title>
</head>
<body>
<h1> Welcome to my first web page!!!! </h1>
<!-- invisibility rocks!! //-->
<font color="red">Yay!!! I can make my own web pages!!!!</font><br />
<b>I'm now on my way to geekdom!!</b>
</body>
</html>

Don't worry too much, it won't look strange for long I promise! Now once you've done that, save the document in your root directory as myfirstwebpage.html.
Now close the file, go into your root directory and double click your myfirstwebpage.html file. Congratulations!!! You've made your first web page!!
You can see an example of what it should look like here, if it doesn't look the same, make sure you have copied the above code exactly and make sure your file name ends with .html.

This web page you've just made, and many more that will come to follow will also be refered to as "html" files and html file names should always end with the extension ".html"

To continue on to the next lesson and find out what the heck you've just done, and what on earth html is click here.

things to do list:

  • Finish the CSS tutorial
  • Write a JavaScript tutorial
  • Write a PHP/MySQL tutorial
  • Create cheat sheets to accompany each tutorial
  • Put in a feedback form
  • Write a geek tech glossary
  • Write a web slang glossary