Monday, 23 September 2013

XHTML 1.0 Strict program with pre tag

This program shows the usage of pre tag so that the developer can have clutter free of paragraph tags(lots of them) across a large project.

1:  <?xml version = "1.0" encoding="utf-8"?>  
2:  <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">  
3:  <html xmlns = "http://www.w3.org/1999/xhtml">  
4:  <head>  
5:  <title> This is the title of the page</title>  
6:  </head>  
7:  <body>  
8:  <pre>  
9:  This is the paragraph tag.  
10:  T h i s i s t h e  p  r  e  t   a   g  
11:  With the pre tag I can place a text                           here   
12:    and   
13:  here   
14:  and              also here   
15:  without any clutter of paragraph tags  
16:  </pre>  
17:  <p>  
18:  This is the second paragraph tag usage  
19:  </p>  
20:  </body>  
21:  </html>

Simple XHTML 1.0 Strict program with 5 tags (html,head,title,body,p)

This program below shows the usage of basic 5 tags/XHTML elements
html | head | title | body | p

1:  <?xml version = "1.0" encoding="utf-8"?>  
2:  <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">  
3:  <html xmlns = "http://www.w3.org/1999/xhtml">  
4:  <head>  
5:  <title> This is the title of the page</title>  
6:  </head>  
7:  <body>  
8:  <p>  
9:  Hello Web!  
10:  </p>  
11:  </body>  
12:  </html>  

Sunday, 22 September 2013

Tags under DTDs

The different set of tags under the different DTD are as below

1:  XHTML 1.0 Strict        XHTML 1.1 Basic  
2:  a                     a  
3:  abbr                  abbr  
4:  acronym               acronym     
5:  address                address  
6:  area                  b  
7:  b                     base  
8:  base                  big  
9:  bdo                   blockquote  
10:  big                   body  
11:  blockquote             br     
12:  body                  button  
13:  br                    caption  
14:  button                cite  
15:  caption               code  
16:  cite                   dd  
17:  code                  dfn  
18:  col                   div  
19:  colgroup              dl     
20:  dd                    dt  
21:  del                   em  
22:  dfn                   fieldset  
23:  div                   form  
24:  dl                    h1  
25:  dt                    h2  
26:  em                   h3  
27:  fieldset                h4    
28:  form                  h5  
29:  h1                    h6  
30:  h2                    head  
31:  h3                    hr  
32:  h4                    html  
33:  h5                    i  
34:  h6                    img  
35:  head                  input  
36:  hr                    kbd  
37:  html                  label  
38:  i                     legend  
39:  img                  li  
40:  input                 link  
41:  ins                   meta  
42:  kbd                  noscript  
43:  label                 object  
44:  legend                ol  
45:  li                    optgroup  
46:  link                  option  
47:  map                  p  
48:  meta                 param  
49:  noscript               pre  
50:  object                q  
51:  ol                    samp  
52:  optgroup              script    
53:  option                select  
54:  p                    small  
55:  param                span  
56:  pre                   strong  
57:  q                    style  
58:  samp                 sub  
59:  script                sup  
60:  select                table   
61:  small                 td  
62:  span                 textarea  
63:  strong                th  
64:  style                 title  
65:  sub                  tr  
66:  sup                  tt  
67:  table                 ul  
68:  tbody                 var  
69:  td                       
70:  textarea                       
71:  tfoot                       
72:  th                       
73:  thead                       
74:  title                       
75:  tr                       
76:  tt                       
77:  ul                       
78:  var                 

Why DTDs?

Why do we need different type of DTDs?

We need them, because as we see from the basic definition they are packages or templates or sets of particular type of tags or more technically referred to as the HTML elements, so if user wants a particular set of tags to be used then the user may opt for that.

Below the meaning of each of them is given.

1. Strict
     It makes the developer follow the standards strictly without any loosely tied up tags or incomplete tags.
 
2. Transitional
    The transitional is used to have the backward compatibility. The designer get more freedom to use deprecated tags in this type of dtd.

3. Frameset
    The frameset standard allows the designer to use the collection of frame elements and their attributes to be included.They can be included even though they are deprecated features.
    If the user would like to have frames in their site then frameset dtd comes into play.
    


Wednesday, 18 September 2013

DOCTYPE-The beginning of all xhtml documents.

The Document Type Definition DTD is used to define the set of markup declarations that define the kind of SGML family markup language you use in your website design.

The different DTD that can be used under different set of user requirements.


For XHTML version 1.0 we have 3 different DTD definitions.
  1. XHTML 1.0 Strict
     <DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">  
    
  2.  Transitional
     <!DOCTYPE html PUBLIC "-W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1-transitional.dtd">  
    
  3. Frameset
     <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/TR/xhtml1-frameset.dtd">  
    
For XHTML version 1.1 we have 2 different DTD definitions
  1. XHTML 1.1
     <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">  
    
  2. XHTML Basic 1.1
     <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML Basic 1.1//EN" "http://www.w3.org/TR/xhtml-basic/xhtml-basic11.dtd">  
    
For XHTML version 2.0 we have
  1. XHTML 2.0
     <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 2.0//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml2.dtd">  
    
For HTML 4.01 we have 3 different DTDs similar to the XHTML 1.0
  1. Strict
     <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">  
    
  2.  Transitional
     <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">  
    
  3. Frameset
     <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Frameset//EN" "http://www.w3.org/TR/html4/frameset.dtd"> 
Next comes the famous HTML5 
Though not a standard yet, but still has a small and simple DTD declaration to it


 <!DOCTYPE HTML>  
 

Yes,that is it.

Why all these different types of DTDs? 
What do they mean? (Strict/Transitional/Frameset/Basic/loose)

Watch the next post.