CSS and HTML Tutorials for Kids
Tuesday, November 14th, 2006 CSS, HTML, Web Development by Paul FlyerIf you have a child that is interested in web development, there are very few websites geared towards children.
As I was thinking about this, I figured the earliest a child would be capable of doing the basics would be 5th grade with 6th grade being the point where a child could begin to pull all the necessary skills together. (I could be wrong on this, anyone have any kids who are doing web development? When did they start?)
With that age in mind, I figure they could handle most of the tutorial websites I recommend on my CSS Tutorials and HTML Tutorials.
However below are a few links to sites geared towards kids. The lack of quality stuff for kids makes me think that this is a potential market 
.
Cyber Camps – Computer Summer Programs for Kids. This site will point you to computer summer camps in your state.
[tags]css, html, kids, children, webdesign[/tags]
Creating valid xhtml strict nested lists
Wednesday, October 4th, 2006 HTML, Web Development by Paul FlyerTo create a nested list that is valid according to the xhtml strict specification, such as the one below:
- Main List
- Sub Item
- Sub Item
- Sub Item
- Sub Item
- Sub Item
- Sub Item
- Main List
- Sub Item
- Sub Item
- Sub Item
- Sub Sub Item
- Sub Sub Item
- Sub Item
- Sub Item
- Main List
- Sub Item
- Sub Item
- Sub Item
- Sub Item
- Sub Item
Follow the code that looks like this:
<ul>
<li>Main List
<ul>
<li>Sub Item</li>
<li>Sub Item</li>
<li>Sub Item</li>
<li>Sub Item</li>
<li>Sub Item</li>
<li>Sub Item</li>
</ul>
</li>
<li>Main List
<ul>
<li>Sub Item</li>
<li>Sub Item</li>
<li>Sub Item
<ul>
<li>Sub Sub Item</li>
<li>Sub Sub Item</li>
</ul>
</li>
<li>Sub Item</li>
<li>Sub Item</li>
</ul>
</li>
<li>Main List
<ul>
<li>Sub Item</li>
<li>Sub Item</li>
<li>Sub Item</li>
<li>Sub Item</li>
<li>Sub Item</li>
</ul>
</li>
</ul>
General Guidelines
-sub lists MUST be encapsulated within the li tags of an item on the base list. I have tried to show this in the blockquote above by indenting each sub list.
- include any formatting within li tags
- use <p> tags to create breaks around an image
Body tag and seven basic HTML Tags
Tuesday, October 3rd, 2006 HTML, Web Development by Paul FlyerWithin the body of a webpage, there are seven basic tags. In fact, you could get away with only using these seven tags. A note for beginners: it really can be this simple. A few basic tags and you can create complete web pages.
<div> used to DIVide a web page into sections. DIVs are controlled by Cascading style sheets to define the layout of a webpage.
<p> Paragraph tag. This tag places a line break above and below the enclosed text.
<a> Anchor tag. Identifies a hyperlink.
<img> Image tag. Retrieves an image to be displayed.
<ul> Unordered list. Marks the beginning and end of a list.
<ol> Ordered list. Marks the beginning and end of a list that is numbered.
<li> List item. Used within unordered and ordered lists. Items enclosed within this tag appear as line items within the list.
Below is an example of a webpage using only these tags:
<body>
<div>
<p>Lorem ipsum dolor sit amet consectetuer platea sociis sed sed Nulla. Pellentesque mauris sem et Curabitur nulla ac tellus id lorem interdum. Dolor <a href=”http://www.recommendedwebtools.com”>Quisque</a> lacus Curabitur a est est enim interdum vitae tincidunt. Gravida consequat pellentesque interdum turpis Sed libero laoreet a Aenean Duis. Semper amet nibh Sed Lorem Suspendisse sit semper tellus tempor et. Id tempus Pellentesque.</p><p>
<img
src=”http://www.recommendedwebtools.com/
rwt/images/posts/clickgenerate.png”
alt=”Test Image” />
</p><ul>
<li>Item #1</li>
<li>Item #2</li>
<li>Item #3</li>
</ul><ol>
<li>Item #1</li>
<li>Item #2</li>
<li>Item #3</li>
</ol></div>
</body>
The above code will produce the following:
Lorem ipsum dolor sit amet consectetuer platea sociis sed sed Nulla. Pellentesque mauris sem et Curabitur nulla ac tellus id lorem interdum. Dolor Quisque lacus Curabitur a est est enim interdum vitae tincidunt. Gravida consequat pellentesque interdum turpis Sed libero laoreet a Aenean Duis. Semper amet nibh Sed Lorem Suspendisse sit semper tellus tempor et. Id tempus Pellentesque.
- Item #1
- Item #2
- Item #3
- Item #1
- Item #2
- Item #3
For further help with HTML, check out our recommended HTML Tutorials.
[tags]html, webdesign, body, p, li, ul, ol, div,img, a[/tags]
How to create a meta description tag
Monday, October 2nd, 2006 HTML, Web Development by Paul FlyerWhy have a meta description tag? A lot of search engines, particularly Google, will use the meta description tag of a web page in its search results. If one does not exist, they will pull from the content of the web page. This latter approach is fairly random. Having a descirption tag is a far better way to communuicate the content of your web page.
The technical structure of the tag is simple:
<meta name=”description” content=”Your description here.”/>
This tag is placed with the head section of the HTML document.
The meta description tag can be used in several ways. First, it can be used to describe the contents of the web page. Second, it can be used as a means to promote your marketing message. Either way, use the description to your advantage!
Tips:
- Expand on the title to let searchers know a little more detail.
- Write one or two sentences for human readers.
- Include your keyword phrases, but in a creative, human readable way. NOT: web design tools. web site design. create your own website. BUT:
Web site design tool resources for beginners. Reviews and recommendations to help you create your own website. - Consider matching your description to a H1 or H2 tag on the actual webpage. At the least, keep your description within the same semantic domain as your webpage.
[tags]html, meta, description, tags[/tag]
What is a HTML DOCTYPE
Thursday, September 28th, 2006 HTML, Web Development by Paul FlyerEver look at the source code of a web page and find a hideous looking line that looked something like this:
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN”
“http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd”>
Technically speaking, you can write web pages without this line of code. However, the communication between your web page and the browser will be impaired.
Let me put it like this. Imagine you go visit a foreign land. You need directions to get to the local attraction. However, you do not know how to speak the native tongue. The very first question you ask anybody is going to be “Do you speak (enter your native language here)?” You desire to find someone that speaks your language so you can get directions. When you do find that person, the possibility of getting the right directions increases dramatically. If no one around you speaks your language and you can’t understand them, you will end up wandering the streets aimlessly.
DOCTYPE is the initial greeting between a web page and the browser. The web page says “Hey! I speak this kind of (X)HTML, do you?” The browser replies with a resounding Yes! and continues to display the webpage according to the specifications of that DOCTYPE. If no DOCTYPE is specified the browser will attempt to display your web page, but you can’t guarantee the results. If your website is simple, it will probably display correctly. However, any site with any level of complexity will experience problems.
Guidelines:
1) Always include the DOCTYPE at the top of every web page. Build it into your templates.
2) Choose a DOCTYPE that is a current standard, hence XHTML 1.0.
3) Choose a DOCTYPE that is strict. Remember, a strict master is a good teacher. You will learn to create cleaner code.
4) Using a DOCTYPE allows for HTML/website validation.
Learn more about DOCTYPES from the following resources. These pages include the code for writing the correct DOCTYPE.
My Web site is standard! And yours?
Fix Your Site With the Right DOCTYPE!
W3Schools
Articles arguing for the use of strict kinds of DOCTYPES:
Transitional vs. Strict Markup
No more Transitional DOCTYPEs, please
It’s Time To Kill Off Transitional DOCTYPES
[tags]standards, web, webdesign, doctype, html[/tags]
How to write a good HTML title tag
Wednesday, September 27th, 2006 HTML, Web Development by Paul FlyerDo you want your readers to know what your page is about?
Do you want people reading search engine results to know what your web page is about?
If you answer “No” to these questions, then you should rethink why your on the web.
The title tag places content in the title bar at the top of the web browser.
Why is this important?
The title bar lets readers know what to expect on that page. If no title tag exists, most browsers display the name of the actual html file. Imagine a title bar that looks like this:
By the way, this is a screenshot from an actual website that I found. The website belongs to a department of a prominent university. Not good. The title bar tells the reader nothing about what to expect on that page.
Title tags are also used by search engines. The title tag is typically used as the first line of the search result.
The importance here should be apparent. You need to be telling searchers what your page is about. They are not going to guess. Results with a clear title tag will be more attractive than those whose title tag is murky.
The code for the title tag is fairly straightforward.
<title>Your Title Here</title>
No big secret in writing the tags. The trick is the words between the tags.
Tips on writing good titles:
- 60 characters or less. See my SERP example above? I was experimenting with my title tag and I wrote one that was too long. What happened? Google placed an ellipsis at the end. It cut off some important information I wanted to communicate. I have since shortened the title tag.
- Focus on using your main keyword phrase
- Write it for human readers
- Multiple keyword phrases can be accomplished by writing a good sentence
- If writing a good sentence is impossible or impractial, use short keyword phrases separated by a | (bar). For example: Blue Widgets | Red Widgets | Green Widgets
Put this into practice. Below are three title tags I pulled from some random search engine results. I have rewritten them according to the tips above.
OLD:Webster Groves, Kirkwood, Ballwin and St. Louis Missouri real estate listings, homebuying, sel [cutoff at this point]
PROBLEM: Way to much keyword stuffing. The home page is trying to be to much.
NEW:[Real Estate Broker Name] | Your Saint Louis Real Estate Agent
SOLUTION: Quite different huh. I did some quick keyword analysis and found lots of searches for “saint louis real estate”. Now, what he can do is create separate pages for each of the cities he focuses on.
Example: [broker name] | Webster Groves, Missouri (MO) Real Estate Agent.
This site is trying to capture too much traffic to its home page by using keyword stuffing. Instead, they could expand their reach by tightening up their page title (and content) and then creating more content by adding additional pages focusing on other keywords.
OLD: Baking Tips for the Very Best Homade Cookies
PROBLEM: Misspelling
NEW: Baking Tips for the Very Best Homemade Cookies
SOLUTION: This is a huge oversight. While I have my share of spelling mistakes within my posts, having a spelling mistake in the title is inexcusable.
OLD:Find A Good Job By State, Occupation, Salary and Much Much More
PROBLEM: Too many Muches
NEW: Find A Good Job By State, Occupation or Salary | Job Search Articles
SOLTUION: There was no verb in the title when I felt it needed one. Plus the addtion of “find” may help them pick up a few longtail keywords. Adding things like “much much more” is a waste of time and space. It adds no value. Why not use that space to add a keyword of value or just leave it off.
Where do you put the title tag? Visit the post on creating HTML Head sections.
[tags]html, title, tags, webdesign, webdevelopment[/tags]
Essential Tags of a HTML Head Section
Tuesday, September 26th, 2006 HTML, Web Development by Paul FlyerThe head section of an HTML page provides background technical information about the webpage. It does not appear within the browser window (there is one exception, sorta). Though these elements do not physically appear, they are very important.
<head>
<title>The Title of Your Website</title>
<link>Typically a link to an external style sheet</link>
<style>internal style sheets go here</style>
<meta>various data is used here</meta>
<script>any javascript code goes here</script>
</head>
Again, these tags come in pairs. The closing tag must include the forward slash in front of the tag name.
Title- This appears in the web browser title bar way up at the top of the browser. Technically speaking this is the only item in the HEAD section that visibly appears in the browser. However, it does not appear in the actual browser window.
Required: No. If not used, the browser will display the name of the html file.
Recommended: YES! First, this tells your readers what that page is about. Second, search engines use this tag as the very first line of an individual search result.
Link – This tag links the web page to other resources behind the scenes. Important for external style sheets.
Required: No.
Recommended YES! If you are using CSS (and you should), then you will need to link to the external style sheet.
Style – this tag include style sheet information within the code of the actual web page itself. These are called internal style sheets. While this method is not recommended, sometimes it is necessary. Various kinds of CMS plugins will sometimes automatically create a mini internal style sheet.
Required: no.
Recommended: Depends. In general it is not needed since using external css files is best practice.
Meta – meta tags are used to define various information about the web page. Meta tags are defined by the name given to them. There are two essential kinds: description and robots. The details will be discussed in a following post.
Required: no.
Recommended: YES! A robots meta tag helps direct search engine spiders. A description tag is used by Google to be displayed in the search engine results. A well written description adds value to your search result.
Script – this is used for any javascript fucntionality on the webpage. For most people this is typically some kind of web analytics tracking code. More advanced developers use javascript to control various portions of their web page. If you “view source” on the Google home page, you will see a fair amount of script usage, even within the main body of the page.
Required: No.
Recommended: Should be limited. Javascript can slow down a website. It all depends on how well it is written.
I will detail the use of some of these tags in separate posts.
Find more information about learning HTML at our recommended HTML Tutorials page or in our HTML archives.
[tags]html, head, style, link, title, meta, script, tags, web[/tags]
The Three Basic HTML Tags for Web Page Structure
Monday, September 25th, 2006 HTML, Web Development by Paul FlyerEvery single web page has a basic HTML structure. There are three tags every web page includes: html, head and body. Keep in mind these tags have nothing to do with the layout of a webpage on the screen. They have to do with the technical structure of the HTML code. Think of them as essential building blocks/sections/groupings (choose your own metaphor).
The basic web page looks like this:
<html>
<head>
general page information that is not always seen
</head>
<body>
Layout and Content
</body>
</html>
Please remember that these tags occur in pairs. The second of the pair is always the closing tag and includes a forward slash before the tag name.
Think of a web page like the following diagram:
The border represents the HTML tag, it holds everything inside of itself.
The Grey section represents the HEAD portion. Most of the information here is not displayed on a web page, at least not within the main browser window.
The Green section represents the BODY section, everything that is seen within a browser window.
Mistakes that typically occur with these tags:
- missing the closing tag of any one of these pairs – by far the most common
- head section missing
Find more information about learning HTML at our recommended HTML Tutorials page or in our HTML archives.
[tags]html, tags, body, head, webpage[/tags]
HTML Validation
Friday, September 22nd, 2006 HTML, Web Development by Paul FlyerCreating a website that is error free and standards compliant (well at least as close as possible, I still struggle) provides the following benefits:
- increase liklihood of working across all browsers (but not a guarantee)
- lean clean code – there is nothing worse then creating something and looking back at it months later and thinking “How the hell did I accomplish that?”
- clean code saves on bandwidth
- increases website load speed
My favorite online html validator is provided by Total Validator
Total Validator provides the following services:
- HTML Validation
- Accessibility validation
- Browser Snapshots
- Spellchecker
- Broken Link Checker
The online version of Total Validator will check up to 20 pages at one time. Provided it an email address and it will send you a zip file of the results.
For each page checked, Total Validator displays the amount of errors and warnings(if that option was checked). It then displays the code for each page with each error and warning marked. Total Validator provides anchor links to each error so it is easy to look at one error and then click to go to the next.
Overall, it is a very handy tool and one of the best validators around.
For more information check out my page on website validation.
[tags]html, validation, web, website[/tags]
Visibone HTML CSS and Color Reference Guides
Thursday, September 21st, 2006 CSS, HTML, Web Development by Paul FlyerIt is difficult to find an easy to use reference for HTML and CSS that is also easy to slip into a laptop bag. No one wants to carry around a 30 pound HTML reference book. The solution: Visibone Card Collection or Browser Book.
Each set contains the following:
- basic color palette card – covers the colors in the original browser safe palette
- web fonts – covers basic fonts supported by the major browsers
- characters – a list of all the html codes for special characters
- XHTML Tags – list and brief explanation of attributes for each xhtml tag
- CSS selectors – cascasding style sheet reference sheet
- Javascript – reference guide to basic functions within the javascript language
- DOM- document object model reference for javascript
- Regular Expressions – basic guide to regular expression (with this reference I may actually take the time to learn it!)
What is the fundamental difference between the two sets?
The Card collection is smaller at only 10 pages and the print is denser. The Browser Book is 16 pages and has a larger font. In terms of content the only idfference is the inclusion in the card collection of a annotated HTML / CSS example page.
I would highly recommended purchasing laminated versions as this will make it last longer and help it survive life in a messenger bag or briefcase.
I have know about Visibone for years. It wasn’t until recently that I made a purchase. (I purchased the card collection.) I had always been unsure whether I would use it. Well, the first day I carried it with me I referenced it at least three times that afternoon. For beginners, it can serve as a learning tool. Sorta like big flash cards. It may even be a good idea to purchase one before heading into a web design class. It would make an excellent reference tool as you learned.
A short note on customer service:
Bob Stein, the owner, will personally respond to any emails regarding any problems you may encounter. I had a problem with my order and he was very responsive. He corrected the issue quickly and provided some of the best email customer service I’ve seen so far in the life of running this website.
Click for more on HTML Colors or HTML Tutorials.
[tags]css, html, visibone, reference, guide, color[/tags]
How to use cPanel to backup your website
Wednesday, September 20th, 2006 HTML, Utilities by Paul FlyerYou’ve heard it a million times. BACKUP YOUR DATA!
The question is, are you?? If you are not, you really need to be doing so.
Again, let me repeat, you really need to be backing up your website.
Beginners probably have their website hosted on a shared environment with cPanel running as the administrative tool. You can easily backup your website (files and databases) with cPanel. Here’s how:
- Go to www.yoursitedomain.com/cpanel
- Enter your username and password – if you do not know this information please contact your web host.
- Click the ‘Backup’ icon located on the main screen
- Click ‘Generate/Download a full backup’
- The “Full Backups” screen will display
- Select your backup location (choose Home Directory)
- Make sure your email address is correctly entered (once the backup is complete you will be emailed)
- Click Generate Full Backup button
- Backup file will be created in your home directory
- Once the full backup of your account has been completed you will receive an email message to the email address you specified
If you cPanel looks different from above don’t freak. Some web hosts setup cpanel differently. Here is an example:
- Look for a main toolbar icon labled “Tools”
- Click “Backup” from the left menu
- Follow instructions above starting with number four (4).
The backup file will be created on your home root directory. It will be a tar.gz file. This file can then be FTPed off your server to a local drive or CD (or both!) for safe keeping. I recommended doing this weekly at the LEAST.
You will have noticed during this process something stating the following (or something similar):
Full Backups allow you to save a complete, compressed copy of all of your site data either to your home directory locally or remotely to an FTP server. Full backups CANNOT be restored by CPanel automatically. Only your server administrator can restore a full backup automatically. If you want to be able to use CPanel to restore your backup files, you must use the separate HOME, SQL, ALIASES and FILTERS backup features, and then you can restore them below.
While this is a true statement keep in mind the following:
- The full backup contains A LOT of information. It contains MORE than you NEED but ALL that you WANT.
- Don’t worry! While this file cannot be restored automatically via cPanel, the correct pieces can be extracted and restored manually. It is just one huge zip file. Know that every file has been backedup as well as SQL statements generated for recreating and restoring databases.
Using cPanel to backup your website piece by piece is a post for another day!
[tags]backups, backup, website, web, cpanel[/tags]
Learn HTML Visually with VisualTutorials.com
Wednesday, September 20th, 2006 HTML, Web Development by Paul FlyerAre you a visual learner?
Do you prefer to watch something instead of reading something?
Do graphical presentations of data help you understand more than text?
If that is the case, then the HTML tutorials at VisualTutorials maybe the thing for you.
In twenty four easy lessons, the basics of HTML are taught and explored:
- Locating Your Plain Text Editor
- Starting a Web Page in Notepad
- The Head and Body Sections
- Saving Your Document as HTML
- Giving a Title to Your Web Page
- Starting Text on a New Line
- Paragraphs & Horizontal Rules
- Creating Special Characters
- Formatting Bold and Italic Text
- Using Inline Style Inside Tags
- Using Internal Style Sheets
- Using External Style Sheets
- The RGB Color Model
- Web Page Background Color
- Changing the Font of Text
- Setting Content Alignment
- Adjusting the Size of Text
- Linking to Other Websites
- Placing Images in a Page
- Important Image Attributes
- Using an Image for a Link
- Page Layout Using Tables
- Testing in Other Browsers
- Putting Pages on the Web
A few caveats:
- the tutorials don’t adhere to current XHTML standards. For example, they use the tags <b> and <i> instead of <strong> and <em>
- the tutorials dont adhere to current layout standards. They recommend using tables to layout a website instead of using CSS.
- The interface is a tad clunky. For each lesson there is one html page and one video page. For beginners this can get confusing if they don’t realize new open windows are being created.
However, the lessons themselves have a lot of value for the beginner and enable a student to progress slowly at their own pace.
[tags]html, tutorials, tutorial, visualtutorials, beginners, web, design[/tags]
Beginners can practice HTML skills at W3Schools
Tuesday, September 19th, 2006 HTML, Web Development by Paul FlyerIf you have been poking around looking for HTML tutorials long enough, you have most likely come across W3Schools.
The tutorials at W3Schools are mainly for the beginner. Intermediate and advanced developers will find it a handy reference site.
W3Schools offers numerous tutorials related to the Web. No matter the tutorial chosen, they all follow the same format:
- brief explanation of element being discussed
- several examples
- almost all examples open a interactive screen where the user can manipulate the code. The left side of the screen contains the code that the user can change. By making a change and cicking the “Edit the text and click me” button, the right side refreshes with the results of the code change.
All the tutorials are laid out in this manner. They are meant to be short, to the point and explain the concept in the least amount of words. They are also geared towards providing the user an opportunity to practice.
Below is a list of the lessons for HTML:
- HTML Introduction
- HTML Elements
- HTML Basic Tags
- HTML Formatting
- HTML Entities
- HTML Links
- HTML Frames
- HTML Tables
- HTML Lists
- HTML Forms
- HTML Images
- HTML Background
- HTML Colors
- HTML Colorvalues
- HTML Colornames
- HTML Quick List
- HTML Advanced
- HTML Layout
- HTML Fonts
- HTML 4.0 Why
- HTML Styles
- HTML Head
- HTML Meta
- HTML URLs
- HTML Scripts
- HTML Attributes
- HTML Events
- HTML URL-encode
- HTML Webserver
- HTML Summary
- HTML Tag List
- HTML Attributes
- HTML Events
- HTML Colornames
- HTML ASCII
- HTML Entities
- HTML URL Encode
- HTTP Messages
They also offer tutorials in CSS, XML, RSS, JavaScript, AJAX, SQL, ASP, ADO, PHP plus many others. If HTML is totally new to you or you coding skils are a bit rusty, head on over to W3Schools to sharpen your skills.
[tags]html, tutorials, w3schools[/tags]
HTMLDOG: Easy Guides for learning HTML and CSS
Monday, September 18th, 2006 HTML, Web Development by Paul FlyerHTMLDOG is a great place for beginners to learn HTML and CSS. The site is setup according to a series of levels: Beginning, Intermediate and Advanced. There is a HTML guide and a CSS guide for each level.
Here is a rough outline of what is covered in each guide:
- HTML Beginners
- Tags
- Attributes
- Elements
- Page Titles
- Paragraphs
- Headings
- Lists
- Links
- Images
- Tables
- Forms
- CSS Beginners
- Selctors
- Properties
- Values
- Colors
- Text
- Margins
- Padding
- Broders
- HTML Intermediate
- Span
- Div
- Meta
- Tables
- Definition Lists
- Javascript
- Bad Tags
- CSS Intermediate
- Class Selectors
- ID Selectors
- Grouping
- Nesting
- Pseudo Classes
- Shorthand
- Background images
- HTML Advanced
- Standards
- Accessible Links
- Mastering Text
- Mastering tables
- Accessible Forms
- Declarations
- CSS Advanced
- Display
- Page Layout
- At Rules
- Pseudo Elements
- Specificity
With any online tutorials I recommend beginners have a text editor open and follow along as they read. The key is not only to read but do the exercises!
HTML is very easy to learn and I contend any one who is adept at using a word processor can learn HTML. CSS does add a level of complexity. However, beginners just need to start simple. Avoid looking at the fanciest sites on the net and trying to replicate it in the first try.
Visit our other recommended HTML tutorials.
[tags]html, tutorials, beginners, web[/tags]
What is XHTML and why use it?
Friday, September 15th, 2006 HTML, Web Development by Paul FlyerXHTML stands for eXtensible HyperText Markup Language. Yes I know, that means nothing to the beginner.
Lets looks at it this way. HTML is the code used to create web pages. XHTML is the next incarnation of HTML. At the core level there is little difference. However, XHTML brings with it a new set of rules that make for cleaner, tighter code. XHTML is an attempt to make HTML behave similarly to XML.
Why should the beginner care whether they are writing regular old HTML or some new fangled XHTML version?
Well first, XHTML is not new. XHTML became the standard in January 2000. So if you havent been using XHTML, you are woefully out of date (Six and a half years in technology is almost an eternity).
Before the XHTML standard, HTML had sort of gone wild and had become this uncouth slobbering beast. XHTML came along and became like the Master Sergeant during boot camp. Your boots have to be shined, your bed made, proper formation maintained, etc. Overall, a certain level of discipline was set.
Here is a brief list of the changes XHTML brought to HTML:
- XHTML elements must be properly nested
- XHTML documents must be well-formed
- Tag names must be in lowercase
- All XHTML elements must be closed
I encourage beginners to try and follow the XHTML 1.0 Strict standard. It always isn’t possible to maintain, especially when using a Content Management System which are prone to throwing in the occasionally goofy tag. However, following that standard is good practice. It will teach you a better way to code and avoid being sloppy. Yes it maybe a strict master, but the beginning student will be a better coder in the end.
For more information see W3Schools.
[tags]xhtml, html, standards, web[/tags]
HTML Notebook
Friday, September 15th, 2006 HTML by Paul FlyerIn an effort to better organize my writing and posting, I am beginning to write in blocks of posts. Each block will center around a theme, which I call a notebook. The first such Notebook will be about HTML. Here is what you can expect:
- 10-20 posts around the theme over a one to two week time frame
- I will continue to post the occasional post outside the theme
- Each notebook theme will be archived in an appropriate category. The current notebook posts will be archived under HTML
[tags]html, blog, blogging, organize[/tags]
