LAN Net Work!

LAN Net Work!

LAN Tait is Net Working!

Friends Flags…

Free counters!


No Sessions

Bitesize .htaccess - Testing - Beginners Guide

Here we will test to see if your .htaccess file is turned on, and if it is working properly. This is easy for those new to .htaccess  Before you begin trying to make your first .htaccess file, let’s make sure you have things set up correctly. It is simple, here is all you need to do…

Continue reading Bitesize .htaccess – Testing – Beginners Guide

Bitesize PHP - First Steps in PHP!

The best first steps in PHP is just to jump in!

Set PHP Variable

You can set a temporary storage device, called a PHP Variable or “$var” for short.

Something like:

  $my_page_title = 'My First Page Title!';

Basic Syntax

Continue reading Bitesize PHP – First Steps in PHP!

Bitesize HTML5 – Building a Website Folder Layout

In this lesson we create a structured layout for our file folders. We learn to set a PHP variable and to use that  variable in a template format. This is the first steps in PHP!

In Bitesize HTML5 – Switch from HTML to PHP Coding we switched the file extension from .html to .php. Some of you may have tried to open and view the pages in you browser and it did not work. That is because .php scripts Must be served by a server, no exceptions are allowed! If you have a hosting account, perhaps on Ubuntu running Apache, you can put your pages there.  If not, you can try putting your .php pages on one of the following.  All of these are Apache Web Servers with the .htaccess file working.


– Works Great on Linux Mint with the Mate desktop (what I use).  Any Linux can run this. Just search the Internet to get started.  This is really the best because it is the same as your Linux Hosting Company uses!

Continue reading Bitesize HTML5 – Building a Website Folder Format – Layout

Bitesize HTML5 – Switch from HTML to PHP Coding

The Artajo’s Cafe code that Ranz Artajo (one of my students) sent to me, has now been validated at W3C for XHTML and CSS3.  You can view both the original code and the improved code at

Marie Pelin did a great job of validating and correcting the little site.  The corrected site has links on the footer to the XHTML and CSS3 tests.

It is on my list to convert the XHTML to HTML5 at this time.  However, I noticed it would be far easier to change to PHP first. Therefore, let’s activate the PHP Hypertext Preprocessor on every page at this time…

Continue reading Bitesize HTML5 – Switch from HTML to PHP Coding

Bitesize HTML5 - Convert any hypertext to HTML5

Ed. I decided it would be easier to switch to PHP before switching to HTML5. Therefore Please follow the following pages before doing this…

Bitesize HTML5 – Switch from HTML to PHP Coding

Continue reading Bitesize HTML5 – Convert any hypertext to HTML5

Bitesize HTML5 - Zip-a-Dee-Doo-Dah - File Transfer!

New Student

I took on a new student this last week to tutor.  He had built a small website for an imaginary Coffee Shop. He has no server so I told him to just email the files to me.  When I received his email, he had attached his files, one by one.  A number of images, html files and css that all downloaded into the same folder..

Missing Folders

The problem was, he had just attached the files to the email, so when I downloaded them, they all ended up in one folder.  When I opened his index file, the site was all messed up!

The problem was that these were all lumped together in one folder, but his design was to have separate folders for the images and the css.  I had to manually sort out and recreate the file structure, before I could view and evaluate his work.


A far better way for him to send this to me attached to an email would have been for him to ZIP the files and folders together first.

Continue reading Bitesize HTML5 – Zip-a-Dee-Doo-Dah – File Transfer!

Bitesize HTML5 - Attribute Quote Syntax

Attributes, within tags, need a proper syntax also. This is easy, but often it is so very wrong.  Here I will present a couple easy to follow “Best Practices!”

Continue reading Bitesize HTML5 – Attribute Quote Syntax

Bitesize HTML5 - Attributes and Tags

Attributes and Tags

All tags and attributes must be written in lowercase (small letters). Additionally, attribute values should be lowercase when the purpose of the text therein is only to be interpreted by machines. For instances in which the data needs to be human readable, proper title capitalization should be followed.

For machines:

<meta http-equiv="content-type" content="text/html; charset=utf-8" />

For humans:

<a href="" title="Description Here"></a>

This tag,


And this pair of tags,


This last example was not valid in any version of hypertext, even 30 years ago!

All of these examples would have failed XHTML Validation.

Moving on to Bitesize HTML5 – Attribute Quote Syntax

Bitesize HTML5 - Self-closing Elements

Building on what we learned in Bitesize Programming – Polyglot Markup and Bitesize HTML5 – The W3C Validator let’s take a look at our old friend, the break tag and other…

Self-closing Elements

All tags must be properly closed. For tags that can wrap nodes such as text or other elements, termination is a trivial enough task. For tags that are self-closing, the forward slash should have exactly one space preceding it:

<br />

rather than the compact but incorrect:


The W3C specifies that a single space should precede the self-closing slash (source).

Empty Element Tags

Another name for an empty Self-closing Element is an Empty Element or Empty Tag.  Things like <hr/> and <img … />.  For example, this week I received a website declared to be written in XHTML and containing the following code.

<img class = "main_image" src ="images_artajo/logo5.jpg" alt ="scrambled eggs in english muffin" align ="left">

Polyglot Markup mandates it to be markup would be written:

<img class="main_image" src="images_artajo/logo5.jpg" alt="scrambled eggs in english muffin" align="left" />

However there is another error on this img tag that is much harder to see. The image was actually a beautiful cup of coffee, not “scrambled eggs in english muffin”. If it was scrambled eggs, the alt attribute is human readable and should have had proper human punctuation, like: “Artajo’s scrambled eggs in English muffin.” So this tag should actually have looked like this…

<img class="main_image" src="images_artajo/logo5.jpg" alt="An inviting cup of Artajo's coffee." align="left" />

Let’s now consider Bitesize HTML5 – Attributes and Tags.

Bitesize HTML5 - The W3C Validator

Search Engine Optimization

One of the goals of Search Engine Optimization, or SEO is to have your Original Content website rank high on the SERP (Search Engine Results Page).

A Search Engine is where you look for information, like Google or Bing.  I have NEVER had a client who wanted to have a listing on page 100 (basically the 1,000th website listed!)  Indeed, most clients would like to be listed first!  Or at least on the First Page of the SERPs!  That is because they do not understand the value of being on the second or third page of the SERPs.

Anyway, to move hire than ranking #1,000, you need both Original Content and “well formed code.  “You will never get to the top ten pages of the SERPs by coping content from another website.  You also will not get there with sloppy code with a lot of errors in it.  In other words, NOT Well Formed Code!

Well Formed Code

Thousands of my students have handed me their HTML code and asked me to help them improve it.  One of my first questions is usually, “Does it pass the W3C Validator?”  I often get a puzzled look!  They have put a lot of effort into making their page.  Perhaps it is original coding, more likely it was copied out of a book or from a website, and then modified to make it their design.  That’s all ok! What is not ok is that they didn’t run their code through the W3C Validator.

When I ask about this they usually tell me they did not know about the W3C Validator, or thought it would not work on their code because they were developing it on some kind of “localhost server” like a Linux LAMP server, or a Windows WAMP server, or a cross platform development server such as XAMPP.  While it is true that the W3C Validator cannot read the files on these development servers, there is an easy and simple way to still use the W3C Validator on your code.

Easy W3C Validator

In developing your code, you would likely view it in your browser. I would highly recommend Firefox for this job, but it would likely be possible with any browser.  Just view your page and view the source.  In Firefox you can do this by right clicking on some blank part of the page, and clicking on “View Page Source.”

Now that you are viewing the page source, you can “Select All” by clicking the right mouse button, or by using a ctrl-a on your keyboard. Then copy all that you selected.  By using this technique it does not matter if your source code is written in some version of hypertext markup, or is built from 100 PHP script files.

Now switch to the W3C Validator and click the tab “Validate by Direct Input.”  Now paste your copied page source into the box marked “Enter the Markup to validate:”

I would also suggest clicking on “More Options” and “Show Source.” Then click the “Check” button.

The W3C Validator Results

It will now display the results for the testing done on your page as info, warnings and errors. You must fix errors and should fix warnings also.

Converting a document to HTML5

Your goal should always be to convert your documents to well formed valid HTML5 – in steps!

For documents older than HTML5, you should give them a DOCTYPE of XHTML1.0 Strict or XHTML1.1.  Test and fix all warnings and coding errors.  Always fix the first error first and down the list.  When the document passes the W3C Validator wit NO errors, then switch the DOCTYPE to HTML5 – <DOCTYPE html> – and begin testing again – this will catch the maximum number of errors.  Again, test, fix and repeat, until there are no more errors.

HTML5 Pitfall

Do NOT try to convert a document directly to HTML5 at the start before testing it as XHTML first. Using the W3C Validator to test and fix your code in XHTML is a crucial and critical step in converting any hypertext to HTML5, because to date, there is no XHTML5 Validator.

WordPress Best Practices

The WordPress Core Team has a number of Best Practices and Coding Standards that are worth reading and following in all coding. The WordPress HTML Coding Standards begin by saying…


“All HTML pages should be verified against the W3C validator to ensure that the markup is well formed. This in and of itself is not directly indicative of good code, but it helps to weed out problems that are able to be tested via automation. It is no substitute for manual code review. (For other validators, see HTML Validation in the Codex.)”

Now let’s take a quick look at Bitesize HTML5 – Self-closing Elements.