Home / Articles / Programming languages / Markup languages / HTML & CSS / How to validate a document and correctly mark up HTML pages (Transitional vs Strict)

How to validate a document and correctly mark up HTML pages (Transitional vs Strict)

How to validate a document and correctly mark up HTML pages (Transitional vs Strict)
 
How to validate a document and correctly mark up HTML pages (Transitional vs Strict)
  • Currently 5 out of 5 Stars.
  • 1
  • 2
  • 3
  • 4
  • 5
Rating: 5/5 (1 votes cast)

Thank you for rating!

You have already rated this page, you can only rate it once!

Your rating has been changed, thanks for rating!

Log in or create a user account to rate this page.


This article will focus on a seemingly out-of-date topic - validation of a web document by one of DTD-markup declarations, which in turn are defined by DOCTYPE.

This topic is not trivial, advantages and disadvantages of a particular validation method are at first not apparent.

In recent years, many editors and CMS's automatically markup DOCTYPE for documents, which is a breakthrough, but unfortunately this is not enough, because often this is only a Transitional markup. Beginner developers neglect this or just don't realize that they have any other choice.

Before we go to the very heart of the matter let us recall what Transitional markup is. It was created to facilitate the transition from HTML3.2 to HTML4, keeping the previous elements and attributes.

Setting aside the matter whether it's HTML or XHTML language, the main Transitional disadvantage is that the transitional markup validation allows the presents of the elements responsible for the presentational (visual) display.

Modern web development rests on three pillars - the markup (html/xhtml/xml), design (css) and functionality with effects (javascript). The emphasis falls on a clear separation between these pillars. The markup is a logical division of the document into semantic components. Style rules given as separate files, are responsible for issuing the document with display devices. Scripts are responsible for interaction between the document and the user, as well as for the effects, also given as separate files. Mixing all of these components in a single document is considered to be a bad manner and considerably complicates life for web developer and increases the load and display time of a document in the browser.

Unfortunately we are all far from perfect, and all the above problems were always present. But as the time goes, markup languages evolve. Developers are moving forward as well, but the legacy should not be forgotten. That is why the transitional markup declarations were developed. They allow to validate documents containing a mess of elements, styles, attributes, and scripts.

This was done in hope that the developers would move to the new standard, and in time rearrange their projects. But in this case, unfortunately, a well-known expression is in place "there is nothing more permanent than temporary."

What to do? Use Strict DTD - document markup validation, which was especially designed to separate the content from the styles and scripts. How to do this?
It's very simple. In your next project just change DOCTYPE to one of these:

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">

By the way, the W3C explicitly recommends using Strict.

"This is the HTML 4.01 Transitional DTD, which includes presentation attributes and elements that W3C expects to phase out as support for style sheets matures. Authors should use the Strict DTD when possible, but may use the Transitional DTD when support for presentation attribute and elements is required. "

What are the disadvantages, using the strict markup validation:

List of forbidden elements: applet, basefont, center, dir, font, iframe, isindex, menu, noframes, s, strike, u.

List of forbidden attributes:

  • The attribute alink is forbidden for body;
  • The attribute background is forbidden for body;
  • The attribute bgcolor is forbidden for body, table, td, th, tr;
  • The attribute border is forbidden for img, object, but can be used in the <em> table;
  • The attribute clear is forbidden for br;
  • The attribute language is forbidden for script;
  • The attribute link is forbidden for body;
  • The attribute name is forbidden for form, img, but can be used in a, button, input, map, meta, object, param, select, textarea;
  • The attribute noshade is forbidden for hr;
  • The attribute nowrap is forbidden for td, th;
  • The attribute start is forbidden for ol;
  • The attribute target is forbidden for a, area, base, form, link;
  • The attribute text is forbidden for body;
  • The attribute type is forbidden for li, ol, ul, but can be used in a, button, input, link, object, param, script, style;
  • The attribute value is forbidden for li, but can be used in button, input, option, param;
  • The attribute vlink is forbidden for body.

Structural changes: elements a, abbr, acronym, b, bdo, big, br, button, cite, code, dfn, em, i, img, input, kbd, label, map, object, q, samp, select, small, span, strong, sub, sup, textarea, tt, var, and text can not be subsidiary for blockquote, body, form, noscript. In other words - the elements blockquote, body, form, noscript may only have block elements in subsidiary elements of the first level.

Reasons for the absence of the attribute target= "_blank" for links. First, to explain to the user how and where one shouldn't open a link. Second, if necessary, the same thing can be achieved in a simple way and more advanced way.

What do you get in return?

  • Well-structured markup;
  • Clear separation of the content and design;
  • Quick and easy operation and code support; 
  • Discipline in writing the code;
  • Respect from others. ;)

When to use Transitional? There are two main reasons. First. The transitional markup is good if you're working with other people's code, without the ability to change their code. A good example - majority of CMS's. In most cases it is impossible to change their codes, without getting into the core. But by doing this you won't have the pleasure of updates.

The second reason - the use of iframe. If you are using in your projects iframe, it gives you no choice. Use Transitional.

In order to ease the transition from the transitional to strict, while marking up the document, think about what is the purpose of a particular element, and not about how the document will look.


 

Read also

Conditional comments for IE

Conditional comments for IE

How to write in HTML

How to write in HTML

Discussion (total 4 comments)

Winstonirold
February 06, 2017 at 02:38 pm
thanks due to the fact that this colossal edifying website, keep up the massive work check out this <a href=http://onlinecasinos-x.com>online casino</a> offers
Jasonrocky
February 08, 2017 at 07:56 am
study doused this <a href=http://onlinecasino-xx.com>online casinos</a> where you can win legitimate kale with the usurp of this guidePlaying <a href=http://onlinecasinos-x.com/free-casino-bonus.html>no deposit bonus</a>
WillSoucK
February 13, 2017 at 02:22 am
Generico Levitra Online Mg <a href=http://doxycycline.rx-cs17.com/vibramycin-prices.php>Vibramycin Prices</a> Levitra Withouth Prescription Zithromax And Coumadin <a href=http://etrobax.com>online pharmacy</a> Achat Kamagra Grenoble Cialis Generico De Confianza <a href=http://giwes.com>cialis</a> Baclofene Quel Dosage where to purchase discount isotretinoin no prior script overseas <a href=http://amoxil.rx-cs17.com/amoxicillin-use.php>Amoxicillin Use</a> 10 Levitra 10mg Prix Cheap Elocon Mometasone Overnight Shipping Internet Shop Overseas <a href=http://xanaxr.com>Cheap Cialis</a> Cialis Precio Farmacia Madrid Order Cialis Without Prescription <a href=http://corzide.com>viagra</a> Cialis Puo Dare Dipendenza Online Pharmacy No Presc <a href=http://priligy.mdsmeds.com/map.php>Priligy Usa Delivery</a> Buy Doxycycline Medication Online Genuine Viagra 100 M <a href=http://demalan.com>buy viagra</a> Propecia Does It Work Hair Growth Viagra Tempo Effetto <a href=http://propecia.inpills.com/purchase-propecia.php>Purchase Propecia</a> Generic Provera Meprate Cheapeast Best Website On Line Cialis Und Priligy <a href=http://amoxil.rx-cs17.com/cheap-amoxil-tablets.php>Cheap Amoxil Tablets</a> Kamagra Oral Jelly Levitra Viagra En Ligne Livraison Express <a href=http://cialis.mdsmeds.com/purchase-generic-cialis.php>Purchase Generic Cialis</a> Swollen Lymph Nodes Neck Keflex Wee Canadian Pharcharmy <a href=http://exdrugs.com>viagra</a> Amoxicillin And Bruising Xenical At Boots <a href=http://propecia.inpills.com/how-to-buy-propecia.php>How To Buy Propecia</a> Amoxicillin Adult Dosage Canadian Pharmacy Price Check <a href=http://visdbs.com>Buy Viagra</a> Zithromax Out Of Pocket Cost Amoxicillin Overdose Cats <a href=http://prozac.mdsmeds.com/buy-prozac-online-usa.php>Buy Prozac Online Usa</a> Us Based Online Pharmacy Purchase Viagra <a href=http://prozac.mdsmeds.com/prozac-buy-online.php>Prozac Buy Online</a> Original Cialis Generika Clobetasol Vitiligo Usa Medicine Online With Free Shipping <a href=http://amoxil.rx-cs17.com/buying-amoxil-online-1.php>Buying Amoxil Online</a> Fluconazole Prices Citotec Comprar <a href=http://prozac.rx-cs17.com/map.php>Prozac Buy Online</a> Acheter Viagra Net En Rouen Amoxicillin 500mg Diareaah <a href=http://fzlaka.com>Buy Cialis</a> Levitra Vs Levitra Kopen Zonder Recept <a href=http://oc-35.com>propecia rapide</a> Zithromax Bladder Infection Secure Tabs <a href=http://clomid.inpills.com/clomiphene-to-buy.php>Clomiphene To Buy</a> Propecia Generico Finasteride 1mg Priligy Posologia <a href=http://prednisone.rx-cs17.com/order-deltasone-pills.php>Order Deltasone Pills</a> Kamagra Wo Bestellen Cialis Comprar Andorra <a href=http://zithromax.mdsmeds.com/azithromycin-tablets.php>Azithromycin Tablets</a> Purchase Doxycycline Online Acheter Cialis Pas Cher <a href=http://antabuse.inpills.com/antabuse-online-store.php>Antabuse Online Store</a> Does Amoxicillin Cause Yeast Infections Se Puede Comprar Viagra Sin Receta Medica <a href=http://nolvadex.inpills.com/where-to-buy-nolvadex-online.php>Where To Buy Nolvadex Online</a> Prednisolone Over The Counter Buy Cialis Online With Prescription <a href=http://mdsmeds.com/cheap-cialis-tablets.php>Cheap Cialis Tablets</a> Cialis Nuchterner Magen New Primatene Mist Inhaler <a href=http://antabuse.rx-cs17.com/antabuse-online-store.php>Antabuse Online Store</a> Clotrimazole Pills Pharmacology Cephalexin <a href=http://feldene.net>viagra</a> Viagra No Prior Prescription Acheter Du Clomid En Ligne Avec <a href=http://bedrugs.net>viagra</a> Keflex Ivpb Tretinoin Cream For Sale <a href=http://clomid.mdsmeds.com/order-clomid-pills.php>Order Clomid Pills</a> Pyridium Best Buy Cheapeast Express Delivery Propecia E Cialis <a href=http://drugseo.com>order levitra at walmart</a> Amoxicillin And Ilads Levrita Gelly Farmacy On Line <a href=http://levitra.rx-cs17.com/levitra-prix.php>Levitra Prix</a> Comprar Cialis Barcelona Drugstore Hong Kong <a href=http://cytotec.mdsmeds.com/cheap-cytotec-generic.php>Cheap Cytotec Generic</a> Buy Stendra Avanafil Online Cod Without A Script Picrolax <a href=http://igf-lr3.com>buy cialis</a> Traitement Cialis 5 Mg Viagra Online Dogana <a href=http://kamagra.inpills.com/buy-kamagra-online.php>Buy Kamagra Online</a> Force Potenzmittel Cialis 20mg <a href=http://dan5325.com>buy viagra online</a> Cephalexin Mixed With Diclofenac Effects Kamagra 200 Mg <a href=http://clomid.rx-cs17.com/clomiphene.php>Clomiphene</a> Cialis In Der Schweiz Cheapest Propecia <a href=http://drugs2k.net>cialis</a> Misoprostol 200 Mcg Online Cialis Livraison Rapide En France <a href=http://cialis.rx-cs17.com/prices-cialis.php>Prices Cialis</a> Finistride 1mg Uk No Prescription Canadian Viagra Pharmacy <a href=http://xenical.rx-cs17.com/order-xenical-in-usa.php>Order Xenical In Usa</a> Brand Viagra
Winstonirold
February 19, 2017 at 05:22 am
thanks for this countless revealing website, obstruct up the skilled undertaking check out this <a href=http://onlinecasinos-x.com>online casino</a> offers

Post comment

basicuse.net
html5_css
106160485398655174790

Quick navigation

General navigation