HTML.co.uk

Most people ask some doubts on how to fix problems in the web designs. While the challenge is that, there is only one way to get the right designs but there are many ways to get the design wrong. Problems could be as simple as not being able to upload the files or as difficult as having CSS cascade that cause unexpected conflicts. However, finding out the problem is frustrating.

For the problems if you approach with the methodical methods, you will be able to do two things:
The working aspects should be removed
You have to focus to the areas that are not working.

Ignoring some steps especially the first steps would be tempting. However, you would be surprised to see how many problems would be caused due to the misspelling of a file name. When you are facing the problem, it is always recommended to go through all the steps on the checklist. By verifying the checklist, you can remove what would be the possible error instead of being caught up in the testing process.

Web Design Checklist
Are the files that are related uploaded?
The URL of the relevant file should be pasted in the browser and ensure that it doesn’t get 404 errors. This includes The CSS, The HTML, External JavaScripts, The Images and other external files.

Are the correct URLs used for the files?
If your webpage is not been displayed, go to your host service provider and make sure that there is correct URL. The files linked with HTML, ensure that you refer the exact URL browsed to in first step.

Does your HTML validate?
HTML validator can solve many problems. It is not so important to have valid HTML but if you have valid HTML, you can make sure that it is not causing any problem.

Does your CSS validate?
Just like HTML validation, validating CSS can eliminate the cause of the problems.

Is your page cached?
Many problems will be caused due to Web Caches. If you make any changes in your WebPages will not be displayed. It is easy to clear the caches.
Are you editing the CSS file or correct file?
It is easy to edit and upload the files with same name stored in different directories.
CSS and many other web servers are case sensitive
When you are building a site on the windows machine and uploading the pages to the Linux or UNIX server should be done carefully at filenames on the server, if the HTML references are in lowercase and if the filenames are in upper case, they do not work.
Did you use DOCTYPE or included on at all?
Most of the modern browsers have the quirks mode and this is the mode when the browser enters when the HTML documents do not have DOCTYPE.
Check whether your pages are in the multiple web browsers
It will be always tempting to build the webpage and check whether it is in the favourite browser and it will be worse if it is on the WYSIWYG editor.

HTML History

HTML’s first version didn’t have the version number. HTML was just called as HTML. Back in 1989 to1995 HTML was used to put up some of the simple WebPages. HTML was standardized in the year 1995 by Internet Engineering Task Force (IETF) and numbered it as “HTML 2.0”.

W3C (World Wide Web consortium) presented the next version called “HTML 3.2” in 1997, in 1998 “HTML 4.0” and in 1999 “HTML 4.01” was released. Later on W3C made an announcement that, it would not be developing new versions of HTML and it would focus on extensible XHTML or HTML. W3C recommended web designers to use HTML 4.01 for their (web designers) HTML documents.

At this point of time, development of HTML split off. W3C drew its attention on XHTML 1.0 and from 2000 onwards basics of XHTML was recommended. As web designers weren’t interested to move to rigid parts of XHTML. In 2004, WHATWG (Web Hypertext Application Technology Working Group) began to develop the new version of HTML called HTML 5 which was not as rigid as XHTML. WHATWG are hopeful that their HTML 5 version will be eventually accepted as a W3C recommendation.

Deciding which version of HTML

While writing a Webpage, the first and foremost decision is whether to write in XHTML or HTML. If a webpage designer is using an editor like dreamweaver the choice of HTML is determined by the doctype chosen. If an XHTML doctype is chosen, then the page will be written XHTML or if an HTML doctype is chosen, then the page will be written in HTML.

Now XHTML is HTML 4.0 which has been rewritten as XML application. If XHTML is written, the attributes will be quoted, tags will be closed and it could be edited in XML editor. Than XHTML, HTML is lot looser because it can leave quotes of attributes like leave tags <p> without closing </p>tag and so on.

Why HTML is used

HTML occupies lesser space, where the download speed will be higher
Response of the older browsers will be more effective to HTML than to a XHTML.
Learning HTML is an easy process because it forgives, like if the tags in HTML are left off the codes still work.

Why XHTML is used

XTML is lot clearer at the beginning and at the end by which events and styles can be added in more easily. Because XHTML is XM, it integrates well into other programming languages. Some of the browsers available respond reliably to XHTML, so that the pages are displayed consistently.

Once decided on XHTML or HTML- which of these versions should be used

HTML
In this there are 3 versions still in regular use around the net. They are:
HTML 3.2, HTML 4.0 and HTML 4.01.

XHTML
In this there are 2 versions in current use, they are:
XHTML 1.0 and XHTML 2.0.

Once decided on a version

Ensure to use a doctype. Using a doctype is one more additional line in HTML documents. By using doctype, it ensures the pages are displayed the way they are intended to be displayed

Definition of Doctype: it specifies the version of the HTML used in the document

When a doctype is used in one of your WebPages, you are telling the web browser how your webpage should be displayed in what versions of (X) HTML. Here the browser gets a list of supported tags from the DOCTYPE and it doesn’t include either proprietary tags (the tags of HTML that works on in the internet explorer) or deprecated tags (attributes and elements which has been deprecated in the latest versions of XHTML 1.0 and XHTML) in the list.

But generally HTML editors allow you to write any non HTML or HTML tags you wish to write inside your documents, even if a strict DOCTYPE is specified. Even if it’s incorrect, HTML editors allow you to write and save anything that you want unlike many XHTML editors.

Web Browsers are fairly forgiving

You can write incorrect or invalid HTML codes and get away with it because most of the Web Browsers which are being used are astonishingly forgiving. Web Browsers do not require a well informed or valid HTML because Web Browsers will display anything given to them as long as it is defined as text or HTML.

Unlike xml applications, Web Browser attempts to find at what the Web Page writer is aiming at and it displays however what it can display.

Web Browser Quirks Mode

When most of the Web Browsers are in the quirk mode it will display the WebPages slight differently. If your WebPages doesn’t have a DOCTYPE or a DOCTYPE without DTD attached to it you might notice some of the quirks, they are:
Class names of CSS are case insensitive
Colours of HTML are parsed differently (# is not necessary, missing digits are filled in a different way).
If a unit is left off sizes are calculated in pixels (px).
In its place of Modern Browsers, pages try to view similar to that of Netscape 4.

From where did the scroll bar come from?

IE 6 has an amazing feature to it that it adds to the documents that have got HTML tags which are proprietary from within its page and deprecated. It adds a horizontal bar to it.

One of the possible way to avoid the horizontal scroll bar, is to get rid of the HTML tags which are proprietary and deprecated HTML tags with a DOCTYPE declaration from with in a page

Why Use a DOCTYPE Declarations
It’s a pretty good idea to get in the habit of using DOCTYPE declarations on your web pages. You won’t be amused in that way that, how they display.
Do validate your HTM (to validate CSS, HTML and other web files with these HTML validators, they are: CSS validators, HTML validators, RSS validators, an XHTML validators and a p3p validator. They are all easy to use, just put the URL of the HTML and just click on the validate button to get validated) once you are comfortable using them, by validating the HTML you will not end with the surprises like horizontal scroll bar in IE 6.