bucktowndusty
04-21-2005, 10:38 AM
!Validation Error!
Click to See Complete Forum and Search --> : ``I've coded for 10 years. Use my online tutorial free of charge```
the tree
04-21-2005, 10:44 AM
What I really love about the webdevelopers toolbar on Firefox, is that I can tell that that tutorial is a load of rubbish without even reading it.
bucktowndusty
04-21-2005, 10:49 AM
!Validation Error!
the tree
04-21-2005, 10:59 AM
Come on, The Tree! I spent a lot of time creating this. Don't let whatever firefox indicator your talking about(I'm not aware of what you are talking about) make you miss something cool.For Firefox, there is a wonderful little plugin called the webdevelopers toolbar, using it I can tell that the page is rendering in quirks mode and it uses a table based layout, both bad.
OK. just check out this one page and tell me you are not in the slightest impressed. http://www.fromthepen.com/web/color/index.htmlThat is really quite painful. A quick search on Google proves that many people have created colour charts already, what do I need another one for?
OK. just check out this one page and tell me you are not in the slightest impressed. http://www.fromthepen.com/web/color/index.htmlThat is really quite painful. A quick search on Google proves that many people have created colour charts already, what do I need another one for?
bucktowndusty
04-21-2005, 11:02 AM
!Validation Error!
the tree
04-21-2005, 11:15 AM
I doubt it, I tend to ask these forums when I have a question. I see nothing wrong with basic infomation as it's essential grounding for anything more complex but when that infomation is wrong in the first place it means that people will strugle more later on.
bucktowndusty
04-21-2005, 11:25 AM
!Validation Error!
the tree
04-21-2005, 11:38 AM
I never said I didn't read them I just said I didn't need to, these forums are disgustingly coded but fortunately it's contributers aren't the same people who built it.
I suppose I could always start around the begging:Basically, HTML is a collection of letters or words, each surrounded by the "<" (less than sign), and the ">" (greater than sign). These special items, which we call, "tags", make the browser perform a specific task or function.
HTML doesn't just consist of tags, it involves both the tags and the elements that the tags outline.
The tags don't make the browser do anything, all they do it describe to document to the browser and suggest how it should be rendered, a suggestion that most modern browsers are free to ignore.
For example, every html page will contain an <html> html tag. When a browser sees this tag, it knows that the file is an html file and will display it inside of its window.The HTML tag does nothing of the sort. The MIME type of text/html in the response header tells the browser that it is dealing with an HTML document and the doctype declaration before the opening html tag tell the browser which version and which flavour. The opening HTML tag tells the browser that the html is begging, that's it.
Every web page has a head area and a body area. Frameset documents have no body element. The head element isn't really nessersary, a page would still function and validate without it.
That's just a starter, I'll go on if you really like.
I suppose I could always start around the begging:Basically, HTML is a collection of letters or words, each surrounded by the "<" (less than sign), and the ">" (greater than sign). These special items, which we call, "tags", make the browser perform a specific task or function.
HTML doesn't just consist of tags, it involves both the tags and the elements that the tags outline.
The tags don't make the browser do anything, all they do it describe to document to the browser and suggest how it should be rendered, a suggestion that most modern browsers are free to ignore.
For example, every html page will contain an <html> html tag. When a browser sees this tag, it knows that the file is an html file and will display it inside of its window.The HTML tag does nothing of the sort. The MIME type of text/html in the response header tells the browser that it is dealing with an HTML document and the doctype declaration before the opening html tag tell the browser which version and which flavour. The opening HTML tag tells the browser that the html is begging, that's it.
Every web page has a head area and a body area. Frameset documents have no body element. The head element isn't really nessersary, a page would still function and validate without it.
That's just a starter, I'll go on if you really like.
bucktowndusty
04-21-2005, 01:06 PM
!Validation Error!
the tree
04-21-2005, 01:31 PM
may be too young to recognize that for a basic lesson plan, you don't go into stuff like mime types and the interworkings of the DOM right from the get go. You keep it simple, then expand later. I've taught a little bit of theatre and have as such learned that one of the worse things a teacher can do is to contradict themselves. You could easily say what the HTML element is without giving any incorrect infomation or mentioning MIME types.
Charles
04-21-2005, 03:41 PM
bucktowndusty,
You've written that you did this long ago, and it shows. What little is correct on those pages was changed in 1997. You don't do a beginner any good by starting him or her down the wrong path, the first rule being "do no harm".
I've no doubt that you think that you know HTML, but see http://validator.w3.org/check?verbose=1&uri=http%3A//www.fromthepen.com/web/html/index.html for a list of some of the errors on one of your pages. And please note, HTML 4.0 was superceded back in 1998 - and it eliminated most of what you are pushing as HTML.
You've written that you did this long ago, and it shows. What little is correct on those pages was changed in 1997. You don't do a beginner any good by starting him or her down the wrong path, the first rule being "do no harm".
I've no doubt that you think that you know HTML, but see http://validator.w3.org/check?verbose=1&uri=http%3A//www.fromthepen.com/web/html/index.html for a list of some of the errors on one of your pages. And please note, HTML 4.0 was superceded back in 1998 - and it eliminated most of what you are pushing as HTML.
MstrBob
04-21-2005, 04:05 PM
The web does NOT need another tutorial showing the wrong things. People for some reason seem to think that it's okay to teach outdated information to keep things simple. You only complicate matters. Which reminds me, I need to finish my own such tutorial. There is an insane amount of tutorials on web design out there, I don't mean to insult you, but it's nothing new. Teach it correct from the get-go, you've no idea how much it irritates me when I learn something, only to be told later it was wrong.
Jeff Mott
04-21-2005, 04:29 PM
You've written that you did this long ago, and it shows. What little is correct on those pages was changed in 1997.Some of what is written was not accurate even prior to 1997.
For example, one of the first things I noticed before I stopped reading...
Fromthepen
The simpliest html document that you can create is one that contains only 2 tags. Those two tags are the opening and closing HTML tags.This is simply wrong. In truth, a minimal valid HTML document consists of a doctype and a title.
It is not our intention, bucktowndusty, to offend you, but there is already far too many tutorials available written by people who do not know HTML nearly as well as they believe.
For example, one of the first things I noticed before I stopped reading...
Fromthepen
The simpliest html document that you can create is one that contains only 2 tags. Those two tags are the opening and closing HTML tags.This is simply wrong. In truth, a minimal valid HTML document consists of a doctype and a title.
It is not our intention, bucktowndusty, to offend you, but there is already far too many tutorials available written by people who do not know HTML nearly as well as they believe.
Sanim
04-21-2005, 06:24 PM
The website looks good just by looking at it, but man, you need to learn CSS and how to do layouts with it. Example:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Lalala</title>
<style type="text/css">
/* I wrote this out by hand, so I hope it works. Heh */
body {margin: 0;}
#container {
width: 498px;
height: 600px;
margin: auto;
border: 1px solid #aaa;
}
#header {
background-image: url(images/header.gif);
width: 498px;
height: 200px;
margin: auto;
border-bottom: 1px solid #aaa;
}
#navigation ul {
margin: 0;
list-style: none;
border-right: 1px solid #aaa;
padding: 0;
width: 498px;
}
#navigation ul li {
margin: 0;
padding: 0;
float: left;
text-align: center;
width: 83px;
}
#navigation ul li a {
margin: 0;
display: block;
padding: 5px 15px;
background-color: #ACACAC;
color: #000000;
border-right: 1px solid #000;
font: 11px Arial, sans-serif;
text-decoration: none;
}
#navigation ul li a.last {
margin: 0;
display: block;
padding: 5px 15px;
background-color: #ACACAC;
color: #000000;
border: 0;
font: 11px Arial, sans-serif;
text-decoration: none;
}
#navigation ul li a:hover {
background-color: #FFFFFF;
color: #000000;
text-decoration: none;
}
#main {
width: 498px;
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
color: #202020;
}
#footer {
clear: both;
text-align: center;
vertical-align: middle;
font-family: Arial, Helvetica, sans-serif;
font-color: #202020;
font-size: 11px;
width: 498px;
border: 1px solid #aaa;
border-top: 0;
background-color: #E3E3E3;
margin: auto;
}
#footer a {
color: #666666;
text-decoration: underline;
}
#footer a:hover {
color: #000000;
text-decoration: none;
}
/* I know it's a lot of code, but that's what external stylesheets are for!! */
</style>
</head>
<body>
<div id="container">
<div id="header">
Lalala
</div>
<div id="navigation">
<ul>
<li><a href="#">Home</a></li>
<li><a href="#">Login</a></li>
<li><a href="#">Portfolio</a></li>
<li><a href="#">Links</a></li>
<li><a href="#">Tutorials</a></li>
<li><a href="#" class="last">Design</a></li>
</ul>
</div>
<div id="main">
<h2>This is a description</h2>
<p>
This is a main body
</p>
</div>
</div>
<div id="footer">
Copyright © 2005. All rights reserved. Validate <a href="http://validator.w3.org/check?uri=referer">XHTML</a> and <a href="http://jigsaw.w3.org/css-validator/check/referer">CSS</a>.
</div>
</body>
</html>
<!-- Yeah, that's pretty much it. If it doesn't work, reply and I'll fix it. -->
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>Lalala</title>
<style type="text/css">
/* I wrote this out by hand, so I hope it works. Heh */
body {margin: 0;}
#container {
width: 498px;
height: 600px;
margin: auto;
border: 1px solid #aaa;
}
#header {
background-image: url(images/header.gif);
width: 498px;
height: 200px;
margin: auto;
border-bottom: 1px solid #aaa;
}
#navigation ul {
margin: 0;
list-style: none;
border-right: 1px solid #aaa;
padding: 0;
width: 498px;
}
#navigation ul li {
margin: 0;
padding: 0;
float: left;
text-align: center;
width: 83px;
}
#navigation ul li a {
margin: 0;
display: block;
padding: 5px 15px;
background-color: #ACACAC;
color: #000000;
border-right: 1px solid #000;
font: 11px Arial, sans-serif;
text-decoration: none;
}
#navigation ul li a.last {
margin: 0;
display: block;
padding: 5px 15px;
background-color: #ACACAC;
color: #000000;
border: 0;
font: 11px Arial, sans-serif;
text-decoration: none;
}
#navigation ul li a:hover {
background-color: #FFFFFF;
color: #000000;
text-decoration: none;
}
#main {
width: 498px;
font-family: Arial, Helvetica, sans-serif;
font-size: 12px;
color: #202020;
}
#footer {
clear: both;
text-align: center;
vertical-align: middle;
font-family: Arial, Helvetica, sans-serif;
font-color: #202020;
font-size: 11px;
width: 498px;
border: 1px solid #aaa;
border-top: 0;
background-color: #E3E3E3;
margin: auto;
}
#footer a {
color: #666666;
text-decoration: underline;
}
#footer a:hover {
color: #000000;
text-decoration: none;
}
/* I know it's a lot of code, but that's what external stylesheets are for!! */
</style>
</head>
<body>
<div id="container">
<div id="header">
Lalala
</div>
<div id="navigation">
<ul>
<li><a href="#">Home</a></li>
<li><a href="#">Login</a></li>
<li><a href="#">Portfolio</a></li>
<li><a href="#">Links</a></li>
<li><a href="#">Tutorials</a></li>
<li><a href="#" class="last">Design</a></li>
</ul>
</div>
<div id="main">
<h2>This is a description</h2>
<p>
This is a main body
</p>
</div>
</div>
<div id="footer">
Copyright © 2005. All rights reserved. Validate <a href="http://validator.w3.org/check?uri=referer">XHTML</a> and <a href="http://jigsaw.w3.org/css-validator/check/referer">CSS</a>.
</div>
</body>
</html>
<!-- Yeah, that's pretty much it. If it doesn't work, reply and I'll fix it. -->
theuedimaster
04-21-2005, 06:54 PM
You guys are a bunch of arses. Go sit in your own dung.
Bucktown, good effort! The site looks good and appears to be user friendly. Of course, it could be better, but it seems to be legitimate.
You guys don't understand.... a beginner is not going to understand what a doctype is. You have to put everything in simple terms, and then move into more complex things in time. Obviously, you guys have no idea how to teach. Or you just don't remember how you went through your schooling.
Bucktown, good effort! The site looks good and appears to be user friendly. Of course, it could be better, but it seems to be legitimate.
You guys don't understand.... a beginner is not going to understand what a doctype is. You have to put everything in simple terms, and then move into more complex things in time. Obviously, you guys have no idea how to teach. Or you just don't remember how you went through your schooling.
theuedimaster
04-21-2005, 06:57 PM
What I really love about the webdevelopers toolbar on Firefox, is that I can tell that that tutorial is a load of rubbish without even reading it.
Your site is a load of rubbish too tree.
http://validator.w3.org/check?uri=http%3A%2F%2Fpadlock.flinkers.net%2F
Your site is a load of rubbish too tree.
http://validator.w3.org/check?uri=http%3A%2F%2Fpadlock.flinkers.net%2F
Jeff Mott
04-21-2005, 07:19 PM
You guys don't understand.... a beginner is not going to understand what a doctype is.No one here said they should be taught what a doctype is and what it's for on the first day. But that doesn't mean they should be taught something untrue as an alternative.
bucktowndusty
04-21-2005, 08:23 PM
!Validation Error!
Charles
04-21-2005, 08:40 PM
Therefore, if we wanted to change some text to white, we would type <font color="ffffff">
FONT and BASEFONT are deprecated.
color = color [CI]
Deprecated. This attribute sets the text color.
<!---Type or copy the following code below---> That's an invalid and not well formed comment.
<html>
<head>
<title> Fun With Colors </title>
</head>
<body bgcolor="ffcc33" text="blue"> This text and all the rest of the text on the page should be blue due to the fact that we set the text attribute of the body tag to "blue". The only way to make text a different color when using the text attribute of the body tag is to use a font tag with a color attribute around the words you want to be different.
<br><br>
<font color="ff6600">This text will be orange because I used a font tag with "ff6600" as the color attribute value around it.</font>
<br><br>
Have fun with this page. Add some headings, lists, horizontal rules, etc. </body>
</html>
That's not a valid HTML document.
FONT and BASEFONT are deprecated.
color = color [CI]
Deprecated. This attribute sets the text color.
<!---Type or copy the following code below---> That's an invalid and not well formed comment.
<html>
<head>
<title> Fun With Colors </title>
</head>
<body bgcolor="ffcc33" text="blue"> This text and all the rest of the text on the page should be blue due to the fact that we set the text attribute of the body tag to "blue". The only way to make text a different color when using the text attribute of the body tag is to use a font tag with a color attribute around the words you want to be different.
<br><br>
<font color="ff6600">This text will be orange because I used a font tag with "ff6600" as the color attribute value around it.</font>
<br><br>
Have fun with this page. Add some headings, lists, horizontal rules, etc. </body>
</html>
That's not a valid HTML document.
Sanim
04-21-2005, 08:55 PM
You guys are a bunch of arses. Go sit in your own dung.
Bucktown, good effort! The site looks good and appears to be user friendly. Of course, it could be better, but it seems to be legitimate.
You guys don't understand.... a beginner is not going to understand what a doctype is. You have to put everything in simple terms, and then move into more complex things in time. Obviously, you guys have no idea how to teach. Or you just don't remember how you went through your schooling.
Beginner!? Did you read the subject? "I've coded for 10 years" is part of it. No beginner. :P
Bucktown, good effort! The site looks good and appears to be user friendly. Of course, it could be better, but it seems to be legitimate.
You guys don't understand.... a beginner is not going to understand what a doctype is. You have to put everything in simple terms, and then move into more complex things in time. Obviously, you guys have no idea how to teach. Or you just don't remember how you went through your schooling.
Beginner!? Did you read the subject? "I've coded for 10 years" is part of it. No beginner. :P
IncaWarrior
04-21-2005, 10:07 PM
Nice round 60 validation errors on that page. The thing some people don't realize is that experience doesn't help as much when things change. Sure your site may have been nice ten years ago, but there have been so many changes since then (killing off of bad methods for pages like tables) that it needs some serious updating.
It's also a bit annoying how it only takes up that little corner of the window.
It's also a bit annoying how it only takes up that little corner of the window.
Jeff Mott
04-21-2005, 10:12 PM
2. like this, "Hey Buck, That's quite an interesting concept you have there, however, I'd like to bring some inconsistencies to your attention." (through a private email, too)In all fairness, if you wanted private criticisms then you should not have brought it to a public forum.
theuedimaster
04-21-2005, 11:34 PM
Beginner!? Did you read the subject? "I've coded for 10 years" is part of it. No beginner. :P
Don't you understand, the damn thing is for beginners.
Don't you understand, the damn thing is for beginners.
BonRouge
04-22-2005, 12:00 AM
Without wanting to be mean, I like a challenge, so here's the page about colour theory...
magnificant
Starting very small - spelling... 'magnificent'.
Red is red, because the intensity of red is at its highest possible intensity. The same goes for green and blue.
Kind of true... However, if the intensity of green is also at its max and blue is off, you'll get yellow.
In other words, to give a value for a color, you need to specify 3 seperate values for each of the 3 primary colors (RGB). Spelling.
"Well, does all the information that you've given me so far mean that I could possible change the color of something by typing <font color="0,255,0">?" The answer to this would be NO!!!! You'll need to learn yet one more concept about color. That concept is called the Hexidecimal System.
Kind of untrue... You don't have to learn about/use the hex system if you don't want to (though it's a good idea to do so) - 'rgb(0,255,0)' will work fine in CSS.
Therefore, if we wanted to change some text to white, we would type <font color="ffffff">As Charles mentioned, the font tag shouldn't be used.
<html>
<head>
<title> Fun With Colors </title>
</head>
<body bgcolor="ffcc33" text="blue"> This text and all the rest of the text on the page should be blue due to the fact that we set the text attribute of the body tag to "blue". The only way to make text a different color when using the text attribute of the body tag is to use a font tag with a color attribute around the words you want to be different.
<br><br>
<font color="ff6600">This text will be orange because I used a font tag with "ff6600" as the color attribute value around it.</font>
<br><br>
Have fun with this page. Add some headings, lists, horizontal rules, etc. </body>
</html>
There's no DTD here, the break tags aren't closed and you shouldn't be putting those things in the body tag.
1. Add a size 1 heading that says "Color Fun" to the coding you typed above.
A 'size 1 heading'? How big is that? (px/em/%/pt - you choose).
I think a good way to teach the basics would be to start with the doc type, head (with title and content-type), body tags and html tags. This might sound like a bit much for a beginner, but I don't think it is. I think all you have to do is say "this is the DTD and that's the content-type - they help the browsers understand the page correctly." That's all. Then don't mention it again. That's basic. You know, this is one of the most important things to learn these days as a lot of problems that people have when they build pages start here. If that's the first thing you learn, you won't forget it. In fact, what I was going to say comes next will ensure that students never forget their DTD...
Next, you explain that the head is used to add the style and some other magic - say you'll come to that later.
Then there's the body where your content goes.
Now you have a basic template (except for the link to the style sheet) and you tell the students to save that - every time they want to write a new page, they can start there. There you go - no messing around and no forgetting the DTD.
Next, you write a document with appropriate tags - <h1> for the main heading, <h2> for sub-headings, <p> for paragraphs, <ol> and <li> for ordered lists, etc.
The students will have a reasonable looking document - like something from Word maybe - but a bit boring to look at.
Here's where you bring in the sunshine. Introduce the link to the style sheet and get the students to create a new .css file. Start then by introducing the syntax of css and how to set things like the background or text colour...
God, I could go on forever...
Hey... I think I could do this job. Any high-schools hiring? ;)
magnificant
Starting very small - spelling... 'magnificent'.
Red is red, because the intensity of red is at its highest possible intensity. The same goes for green and blue.
Kind of true... However, if the intensity of green is also at its max and blue is off, you'll get yellow.
In other words, to give a value for a color, you need to specify 3 seperate values for each of the 3 primary colors (RGB). Spelling.
"Well, does all the information that you've given me so far mean that I could possible change the color of something by typing <font color="0,255,0">?" The answer to this would be NO!!!! You'll need to learn yet one more concept about color. That concept is called the Hexidecimal System.
Kind of untrue... You don't have to learn about/use the hex system if you don't want to (though it's a good idea to do so) - 'rgb(0,255,0)' will work fine in CSS.
Therefore, if we wanted to change some text to white, we would type <font color="ffffff">As Charles mentioned, the font tag shouldn't be used.
<html>
<head>
<title> Fun With Colors </title>
</head>
<body bgcolor="ffcc33" text="blue"> This text and all the rest of the text on the page should be blue due to the fact that we set the text attribute of the body tag to "blue". The only way to make text a different color when using the text attribute of the body tag is to use a font tag with a color attribute around the words you want to be different.
<br><br>
<font color="ff6600">This text will be orange because I used a font tag with "ff6600" as the color attribute value around it.</font>
<br><br>
Have fun with this page. Add some headings, lists, horizontal rules, etc. </body>
</html>
There's no DTD here, the break tags aren't closed and you shouldn't be putting those things in the body tag.
1. Add a size 1 heading that says "Color Fun" to the coding you typed above.
A 'size 1 heading'? How big is that? (px/em/%/pt - you choose).
I think a good way to teach the basics would be to start with the doc type, head (with title and content-type), body tags and html tags. This might sound like a bit much for a beginner, but I don't think it is. I think all you have to do is say "this is the DTD and that's the content-type - they help the browsers understand the page correctly." That's all. Then don't mention it again. That's basic. You know, this is one of the most important things to learn these days as a lot of problems that people have when they build pages start here. If that's the first thing you learn, you won't forget it. In fact, what I was going to say comes next will ensure that students never forget their DTD...
Next, you explain that the head is used to add the style and some other magic - say you'll come to that later.
Then there's the body where your content goes.
Now you have a basic template (except for the link to the style sheet) and you tell the students to save that - every time they want to write a new page, they can start there. There you go - no messing around and no forgetting the DTD.
Next, you write a document with appropriate tags - <h1> for the main heading, <h2> for sub-headings, <p> for paragraphs, <ol> and <li> for ordered lists, etc.
The students will have a reasonable looking document - like something from Word maybe - but a bit boring to look at.
Here's where you bring in the sunshine. Introduce the link to the style sheet and get the students to create a new .css file. Start then by introducing the syntax of css and how to set things like the background or text colour...
God, I could go on forever...
Hey... I think I could do this job. Any high-schools hiring? ;)
BonRouge
04-22-2005, 12:38 AM
Oh my God! He's taken it all back!
I'm sorry Buck! I was just trying to be helpful...
I'm sorry Buck! I was just trying to be helpful...
rhsunderground
04-22-2005, 02:04 AM
i think this thread needs to be trashed.
BonRouge
04-22-2005, 03:41 AM
I'll never get a job if you trash this thread! ;)
Charles
04-22-2005, 04:24 AM
Don't you understand, the damn thing is for beginners.You do beginners no help and quite a bit of harm by sending them down the wrong path at the outset. If you are going to teach them HTML then teach them HTML, not some crap.
webdeveloper.com
Copyright Internet.com Inc., All Rights Reserved.
Copyright Internet.com Inc., All Rights Reserved.