Create Animated Effects on The Web Without Flash

Now it has a lot of animation on the web to implement its web interface, but no doubt much to save a lot of animation effects louding result pages to be slow. By karana that we need to optimize existing resources.
There are many ways to optimize web pages to quickly look without losing its animation effects. I explain that just a little to make the animation, not only can we use flash, but

there is a miraculous way more simple and easy to use. You can use JQuery in making certain effects that would effect has been packaged in one unit and we just call the function in order to use these effects.
In addition to the more rapid development of this web, web developers have created HTML5 and CSS3. A cross between HTML5 and CSS3 can make a powerful animation. But there are disadvantages of the use of HTML5 and CSS3 is the lack of compatible web browsers for some time and there are some HTML5 and CSS3 are not too good at parsing a web browser.
This is an option for those who want to use effects or animation in your web. You can estimate how much resource, compatible, and so forth that may affect your website.
OK that's it from me, antikan again next article

Read more.....

Ordered List and Unordered List

There are two kinds of list items is an ordered list and unordered list, or also called the numbering and bullets.

Sample list of an ordered list :

1. First item
2. The second item
3. The third three

Example of unordered list items list:

• First item
• The second item
• The third three

To create a sequential list of items we use the tag <OL> while to create a sequential list of items not used tags <UL>. and for each item marked with a tag <LI>.

Sample code for a list of items ordered or ordered list.

<ol>
<li>First item</li>
<li>The second item</li>
<li>The third three</li>
</ol>

And sample code for a list of items not ordered or unordered list.

<ul>
<li>First item</li>
<li>The second item</li>
<li>The third three</li>
</ul>

We can also create a stratified list of items or list items in the list of items. Examples are as follows:

• First item
• The second item
• The first sub-item
• The second sub-item
• The first sub sub item
• The second sub sub item
• The third sub sub item
• The third sub-item
• The third item

To create a multilevel list of items as above, no additional tags or attributes. Has to do is place the tags into lower-level list item in the list of items level on it. For more details, below is the source code :

<ul>
<li>First item</li>
<li>The second item</li>
<ul>
<li>The first sub-item</li>
<li>The second sub-item</li>
<ul>
<li>The first sub sub item</li>
<li>The second sub sub item</li>
<li>The third sub sub item</li>
</ul>
<li>The third sub-item</li>
</ul>
<li>The third item</li>
</ul>

The browser will display the list using a space slightly to the inside to the levels below it.

We can use the same way to create a multilevel sequential list of items using an ordered list. We simply replace the tag <ul> with the tag <ol> , then it will be like this:

1. First item
2. The second item
1. The first sub-item
2. The second sub-item
1. The first sub sub item
2. The second sub sub item
3. The third sub sub item
3. The third sub-item
3. The third item

From the sample list of items not ordered or unordered list that rise above, we see that by default, the browser will display the picture (bullet) black dots for the first level items, circle for the items to the second level, and black boxes for the items third-level items. Actually we can choose what type of bullet you want to use to add a TYPE attribute in the tag <UL>. Code: <UL TYPE="bullet type">. Where a bullet there are three kinds: "disc" for the black dots, "circle" to the circle, and "square" to kotam black. So if we want to list these items:

• First item
• The second item
• The third item

So the HTML codes that must be specified as below.

<ul type="square">
<li>First item</li>
<li>The second item</li>
<li>The third item</li>
</ul>

For a list of items ordered or ordered list (numbering), type the numbers can be changed by using the same attribute. So the code: <OL TYPE="number type">. While the types of figures can be filled with 1, A, a, I, or i depending on our tastes. Example:

<ol type="I">
<li>First item</li>
<li>The second item</li>
<ol type="A">
<li>The first sub-item</li>
<li>The second sub-item</li>
<ol type="1">
<li>The first sub sub item</li>
<li>The second sub sub item</li>
<li>The third sub sub item</li>
</ol>
<li>The third sub-item</li>
</ol>
<li>The third item</li>
</ol>

Will produce a list of items as follows:

1. First item
2. The second item
1. The first sub-item
2. The second sub-item
1. The first sub sub item
2. The second sub sub item
3. The third sub sub item
3. The third sub-item
3. The third item

Lessons on the bullet / unordered lists and numbering / ordered list .

sorry produced results inconsistent with my desire, because setting my template does not comply with this practice examples

DKBAAK3V7XP4

Read more.....

Indent

Besides the set alignment, we can adjust the position of the lines of paragraphs from the margin (the edge of the page). There are three kinds of indented paragraphs.

First, the first line just a little inside. To create paragraphs of this kind we use the tag <dd>. Example:

<HTML>
<BODY>
<DD> Paragraph </DD> is a collection of sentences or paragraphs that contain one main thought. Between one paragraph to other paragraphs are usually separated by blank lines. But that paragraph is also commonly characterized by its first row position rather go into.
<BODY>
<HTML>

The results will be generated in the browser as shown below.

Paragraph

is a collection of sentences or paragraphs that contain one main thought. Between one paragraph to other paragraphs are usually separated by blank lines. But that paragraph is also commonly characterized by its first row position rather go into.

sorry the results produced are not liking me, because my templates are not supported with the code above. You can try it yourself by copying the code above and then run your browser with html format.

Second, create a paragraph that all rows, just inside the inside. To create paragraphs of this kind we use tags that flank <blockquote> paragraphs shall we make go into.

<HTML> <BODY>

<P> This is a normal paragraph </P>

<blockquote> <P> This is the paragraph that somewhat get into. </P>

<P Align="left"> This is also an example paragraph rather go into. With a rather long sentence, we see that <b> all rows </b> in this paragraph is located just inside the inside. Same <i> average as far </i>.

</Blockquote>

<P> This paragraph is normal, because the tag <i> blockquote </i> has been closed at the top. do you understand? </P>

</BODY></HTML>

So that will be displayed in the browser as shown below.

This is a normal paragraph

This is the paragraph that somewhat get into.

This is also an example paragraph rather go into. With a rather long sentence, we see that all rows in this paragraph is located just inside the inside. Same average as far .

This paragraph is normal, because the tag blockquote has been closed at the top. do you understand?

Sorry for my style has changed blockquote customize the template that I have. for more details, please create a html file with contents as above, the results you can see in the browser.

Third, make paragraphs in the composition of the list of definitions (definition list). List of definitions is the composition of paragraphs alternating between normal paragraphs, which is a sentence that would be explained by the paragraph that somewhat get into which is the explanation or definition of the phrase on it. For more details, here is an example list of definitions:

To create a list of definitions used three kinds of tags marking the beginning of <dl> or an end to the list definition, <dt> a normal paragraph mark (described) and <dd> a paragraph mark rather go into (which explains the paragraph above) .

Examples of the use of definition list.

<HTML> <BODY>

<P Align="center"> <B> Glossary Important: </B> </P>

<DL>

<DT> <B> Internet </B>

<DD>Stands <i> interconnection network </i> or the relationship between networks. Internet is a global computer network and is the largest computer network in the world for being able to connect all computers in the world.

<DT> <B> HTTP </B>

<DD>Stands <i> Hypertext Transfer Protocol </i> is one of the protocol language used to communicate between the server computer on the internet. Protocols other language in the internet for example: Telnet, News, Gropher, FTP.
</DL>

<P> Because only an example, just two definitions only. Ok, this paragraph back to normal. </P>

</BODY></HTML>

The results will be displayed in the browser like this below

 

Glossary of Term Important:

Internet

Abbreviations of the interconnection network or network relationships. Internet is a global computer network and is the largest computer network in the world for being able to connect all computers in the world.

HTTP

It stands for Hypertext Transfer Protocol is one of the protocol language used to communicate between the server computer on the internet. Protocols other language in the internet for example: Telnet, News, Gropher, FTP.

sorry the results produced are not liking me, because my templates are not supported with the code above. You can try it yourself by copying the code above and then run your browser with html format.

Because only an example, just two definitions only. Ok, this paragraph back to normal.

Read more.....

Display As You Wish

Although browsers do not recognize the tabulation, a space more than once, and making a line with enter, but by using tags <pre> then the browser will display the text as it is, that space is considered a space, tabulation considered tabulation and enter regarded enter. Even his font appeared in the original. This is an example:

<HTML>
<BODY>

<PRE>

<B>Song Lyrics </B>

I have a dream, a song to sing 
To help me cope with anything 


         If you see the wonder of a fairy tale
         You can take the future even if you fail 

</PRE>

</BODY>
</HTML>

Save the file above as an HTML file and then display in the browser, then it will be like this:

Song Lyrics 

I have a dream, a song to sing 
To help me cope with anything 


         If you see the wonder of a fairy tale
         You can take the future even if you fail 

<pre> tag is necessary if we want to display in ASCII character set of web pages in a specific arrangement, such as the following example:

Car Pick-up

                                          .------.
                                         :|||"""`.`.
                                         :|||     7.`.
                      .===+===+===+===+===||`----L7'-`7`---.._
                      []                  || ==       |       """-.
                      []...._____.........||........../ _____ ____|
                      \____/,---.\_       ||_________/ /,---.\_  _/
                       /_,-/ ,-. \ `._____|__________||/ ,-. \ \_[
                          /\ `-' /                    /\ `-' /
                            `---'                       `---'

The picture above is ASCII art. There are other examples of ASCII art Here.

Read more.....

Make Superscript and Subscript

Subscript is writing a rather small and located slightly below while the superscript is writing a rather small and located slightly above. To write a subscript we use <SUB> tag is to write us use superscript tag <SUP>. Here's an example:

Normal writing _{subscrip writing}

Normal writing ^{superscrip writing}

So who will appear in the browser as below.

Normal writing _{subscrip writing}

Normal writing ^{superscrip writing}

Writing subscrip and superscrip usually used in writing a chemical formula and powers. For example:

Sulfuric acid chemical formula is H ₂ SO ₄

150 m² wide field and the volume of a sphere 300 m <sup>3 </ sup>

Then the results will be displayed in the browser as shown below.

Sulfuric acid chemical formula is H ₂ SO ₄

150 m² wide field and the volume of a sphere 300 m³

Read more.....

Create a Link

The command to create a link is to <A HREF="http://weblearning27.blogspot.com"> Link Name </ A>. You see that the tag starts with A which is an abbreviation of the Anchor, then HREF (hypertext reference), which after it resumed the destination address. Keep in mind this destination address should be between quotation marks. After that

you write his name freely link up to you, and finally closing with a closing </ A>. So how to make a link.

Here's an example link that you click. Please:

My Links

Links above will take you to the site with the address: http://irnanto-ilmupengetahuan.blogspot.com

Based on the location of destination, the link can be divided into:

1. Link to the homepage of a site
2. Link to other pages within the same site
3. Link to another page in another site
4. Link to a particular section (bookmark) in the same page.
5. Link to a particular section (bookmark) in different pages
6. Links that point to a file that can be displayed in the browser, such as image files or animations such as GIF, JPG, BMP and so on.
7. The link leads to a specific file that can not be displayed or executed in the browser for example: program files (EXE), file compression (ZIP), audio files (like MP3, RM), video files, and others. If such a link is clicked, a dialog box will appear asking if you want to save the file in your hard drive or run it with the appropriate programs. The process of retrieval and storage of such files is called downloading.
8. Links pointing to your email address. If this link is clicked will open a window sending mail from an email program installed on the user's computer (eg Microsoft Outlook). In an email destination box (To:) has listed the destination mail address.

 

For each type of link above, the important thing to note is the way of writing the address or location (URL) of the site or file designated by the link. This location is written between the quotes after the href= attribute. Provisions are as follows:

1. Link to the homepage of another site, simply write the URL address of the website, for example: href = "http://irnanto-ilmupengetahuan.blogspot.com".
2. Link to another page in another site, then should we write the URL address and the location of the file.
   For example: href = "http://irnanto-ilmupengetahuan.blogspot.com/2010/04/ptc-list.html".
3. Link to other pages within the same site, then simply written down the location of the file, without writing the URL address of the site. In this case there are several possibilities:
   a) If the file is located in the same folder with the files from the link then simply write the name of the file, for example: href = "ptc-list.html".
   b) If the target file is located in another folder under the folder that is occupied by the link, it must be written the name of the folder. For example: href = "04/ptc-list.html".
   c) Conversely, if the target file is located in another folder above the folder that is occupied by the file from the link is then written as follows: href ="../ ptc-list.html ".
   d) If the file is located two levels above the double-colons are written like this: href ="../../ irnanto.jpg " and so on.
4. To create a link to a particular section of a web page, before we have to give names to the places or locations to be addressed it by putting tags <a name="lokasi"> </ a> on line that will link it. Only then we can make the link to that section. In this case there are two possibilities.
   a) If the destination is contained within the same page with the link then simply write the name of the field. For example: href = # locations.
   b) If the destination is located on another page it must be written the name of the file from that page just name the place. For example: href = "other.htm # location".
5. Links that point to a file that is not an HTML file for example program files, audio, image, and others. The way writing is tantamount to an HTML file as in point 1, 2 and 3 above.
6. Link that contains the email addresses are written like this: href = "mailto: irnanto@yahoo.com".

 

We already know that, if a link is clicked, the browser will display the target page by the link. How to bring up the browser page, there are two kinds of purposes.

1. Published in the same window. That is, the page where the link is replaced by the target page by the link. This is the way the default appearance.
2. Published in another window. That is, a new window will appear that displays the intended page. To create a link of this kind, we must add the attribute TARGET = "_blank" in the tag <A HREF>. Example: href="webpage.html" target="_blank">.

A few lessons about the links, especially text links. and then We'll learn about creating image links and links with more specific targets.

Read more.....

Examples of ASCII Art

Toyota Cars

    ___________________
   |,-----.,-----.,---.\
   ||     ||     ||    \\
   |`-----'|-----||-----\`----.
   [       |    -||-   _|    (|
   [  ,--. |_____||___/.--.   |
   =-(( `))-----------(( `))-==
      `--'             `--'

Clouds and sun

              .
                    
              |     
     .               /    
      \       I         
                  /
        \  ,g88R_
          d888(`  ).                   _
 -  --==  888(     ).=--           .+(`  )`.
)         Y8P(       '`.          :(   .    )
        .+(`(      .   )     .--  `.  (    ) )
       ((    (..__.:'-'   .=(   )   ` _`  ) )
`.     `(       ) )       (   .  )     (   )  ._
  )      ` __.:'   )     (   (   ))     `-'.:(`  )
)  )  ( )       --'       `- __.'         :(      ))
.-'  (_.'          .')                    `(    )  ))
                  (_  )                     ` __.:'
                                         
--..,___.--,--'`,---..-.--+--.,,-,,..._.--..-._.-a:f--.

Buildings

__                  __                 __
___  .-~~'.      ___~~-_.-~~'.    ___~  ~~-.-~~'.  ___ -~  ~~-.-~~' ___
| ''|`-...--' ~' | ''|  `-...--'  | ''|    `-...-- | ''|      `-... | ''|
|' '| -'     ': _|' '| ..--'      |' '| _....--'   |' '| ___....--' |' '|
| ''|_   _     | | ''| _   _     || ''|  _   _     | ''|   _   _    | ''|
| ''| |_| |____| | ''|| |_| |____|| ''|_| |_| |____| ''||_| |_| |___| ''|
|'' | | | |    | |'' || | | |    ||'' | | | | |    |'' || | | | |   |'' |
| ''|____ |    | | ''|____  |    || ''|____ | |    | ''|____  | |   | ''|
| ' |'' '|_______| ' |'' '|_______| ' |'' '|_______| ' |'' '|_______| ' |
|' '|' ' |''''  '|' '|' ' |''''  '|' '|' ' |''''  '|' '|' ' |''''  '|' '|
| ' | '''| ''  ''| ' | '''| ''  ''| ' | '''| ''  ''| ' | '''| ''  ''| ' |
____  ______________  ______________  ______________  ______________  ___
=||=)(=||===||===||=)(=||===||===||=)(=||===||===||=)(=||===||===||=)(=||
#########################################################################
| \\#//  |'' '''  \\#//   |'' ''' \\#//    |'' '' \\#//     |'' ' \\#//
|' |#| ''| ''''  | |#|  ''| ''''   |#|   ''| ''''  |#| |  ''| '''' |#| '|
|''|#| ' |'''   '|'|#| '' |'''   ' |#| ''' |'''    |#|'|''' |'''   |#| '|
|' |#|  '| '  '' |'|#| ' '| '  ''  |#|  ' '| '  '' |#|'| ' '| '  ' |#| '|
   |#|             |#|             |#|             |#|             |#|

Geert-Jan Thomas  

Apartement

       _._._._    ^  _._._._       _._._._ ^
       | ___ |_._._._| ___ |_._._._| ___ |
       | |_| |  ___  | |_| |  ___  | |_| |
       |_III_|  |_|  |_III_|  |_|  |_III_| ^!^
 ^     | ___ |__III__| ___ |__III__| ___ |
    ^  | |_| |  ___  | |_| |  ___  | |_| |   ^!^
       |_III_|  |_|  |_III_|  |_|  |_III_|
       | ___ |__III__| ___ |__III__| ___ | _)o(_
       | |_| |  ___  | |_| |  ___  | |_| | /(|)\
   /)  |_III_|  |_|  |_III_|  |_|  |_III_|   H
 _/ )  | ___ |__III__|_____|__III__| ___ |   H
 ~^~^~ | |_| |"""""""||~|~||"""""""| |_| |   H
    ^~'|_III_|@@@@@@@||_|_||@@@@@@@|_III_|^~^H '
 @@@@@@@@@@@@@@     @/=====\@     @@@@@@@@@@@@@@

Classic Home

                           (   )
                          (    )
                           (    )
                          (    )
                            )  )
                           (  (                  /\
                            (_)                 /  \  /\
                    ________[_]________      /\/    \/  \
           /\      /\        ______    \    /   /\/\  /\/\
          /  \    //_\       \    /\    \  /\/\/    \/    \
   /\    / /\/\  //___\       \__/  \    \/
  /  \  /\/    \//_____\       \ |[]|     \
 /\/\/\/       //_______\       \|__|      \
/      \      /XXXXXXXXXX\                  \
        \    /_I_II  I__I_\__________________\
               I_I|  I__I_____[]_|_[]_____I
               I_II  I__I_____[]_|_[]_____I
               I II__I  I     XXXXXXX     I
            ~~~~~"   "~~~~~~~~~~~~~~~~~~~~~~~~

Bedroom

            _      ()              ()      _
           / \     ||______________||     / \
          /___\    |                |    /___\
            |      |      ~@@~      |      |
           (_)     |_______  _______|     (_)
        ___/_\___  {_______}{_______}  ___/_\___
         |__~__|   %%%%%%%%%%%%%%%%%%   |__~__|
      ___|_____|__%%%%%%%%%%%%%%%%%%%%__|_____|___
         |     | %%%%%%%%%%%%%%%%%%%%%% |     |
          `=====%%%%%%%%%%%%%%%%%%%%%%%%=====`
         `=====%%%%%%%%%%%%%%%%%%%%%%%%%%=====`
        `=====%%%%%%%%%%%%%%%%%%%%%%%%%%%%=====`
       `=====/||||||||||||||||||||||||||||\=====`
      `======||||||||||||||||||||||||||||||======`
     `=======||||||||||||||||||||||||||||||=======`
    `==============================================`
   `================================================`

Toilet

                                                         |
                                            __________   |
                           _    __    _    |          |  |
                          /_\  /  \  /_\   |          |  |
                          =|= | // | =|=   |          |  |
                           !   \__/   !    |          |  |
                                 _         |          |  |
 ___               ___          //'        |          |  |
[___]       _   :=|   |=:   __T_||_T__     |p=        |  |
|  ~|     =)_)=   |   |    [__________]    |          |  |
|   |      (_(    |xXx|     \_      _/     |          |  |
|   |      )_)    """""       \    /       |          |  |
\___|                          |  |        |          |  |
 |  `========,                 |  |        |          |  |
__`.        .'_________________|  |________|_____________|
    `.    .'                  (____)                      \
    _|    |_...             .;;;;;;;;.                     \
   (________);;;;          :;;;;;;;;;;:
        :::::::'            '::::::::'

Cup Of Coffee

                       .
                        `:.
                          `:.
                  .:'     ,::
                 .:'      ;:'
                 ::      ;:'
                  :    .:'
                   `.  :.
          _________________________
         : _ _ _ _ _ _ _ _ _ _ _ _ :
     ,---:".".".".".".".".".".".".":
    : ,'"`::.:.:.:.:.:.:.:.:.:.:.::'
    `.`.  `:-===-===-===-===-===-:'
      `.`-._:                   :
        `-.__`.               ,' 
    ,--------`"`-------------'--------.
     `"--.__                   __.--"'
            `""-------------""'

Syrup Bottles

               __
              )==(
              )==(
              |H |
              |H |
              |H |
             /====\
            / Dr S \
           /========\
          :HHHHHHHH H:
          |HHHHHHHH H|
          |HHHHHHHH H|
          |HHHHHHHH H|
   \______|=/========\________/
    \     :/oO/      |\      /
     \    / oOOO  Le | \    /
      \__/| OOO Grape|  \__/
       )( |  O       |   )(
       )( |==========|   )(
       )( |HHHHHHHH H|   )(
       )( |HHHHHHHH H|   )(
      .)(.|HHHHHHHH H|  .)(.
     ~~~~~~~~~~~~~~~~  ~~~~~~

Mineral Water Bottle

            _________
           |_-_-_-_-_|
           |_________|
            )_______(
           (_________)
           |uuuuuuuuu|
           /         \
          /           \
         /             \
        /               \
       /                 \
      /                   \
     (_____________________)
      )___________________(
     (_____________________)
     |                     |
     |_____________________|
      )___________________(
     |_____________________|
      )___________________(
     |                     |
     |_____________________|
      )___________________(
     |_____________________|
      )___________________(
     |                     |
     |                     |
     |_____________________|
     (_____________________)
     |_____________________|
     (_____________________)
     |                     |
     |                     |
     \_____________________/
      '-------------------'

Suspension bridge

                                           ^^
      ^^      ..                                       ..
              []                                       []
            .:[]:_          ^^                       ,:[]:.
          .: :[]: :-.                             ,-: :[]: :.
        .: : :[]: : :`._                       ,.': : :[]: : :.
      .: : : :[]: : : : :-._               _,-: : : : :[]: : : :.
  _..: : : : :[]: : : : : : :-._________.-: : : : : : :[]: : : : :-._
  _:_:_:_:_:_:[]:_:_:_:_:_:_:_:_:_:_:_:_:_:_:_:_:_:_:_:[]:_:_:_:_:_:_
  !!!!!!!!!!!![]!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!![]!!!!!!!!!!!!!
  ^^^^^^^^^^^^[]^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^[]^^^^^^^^^^^^^
              []                                       []
              []                                       []
              []                                       []
   ~~^-~^_~^~/  \~^-~^~_~^-~_^~-^~_^~~-^~_~^~-~_~-^~_^/  \~^-~_~^-~~-
  ~ _~~- ~^-^~-^~~- ^~_^-^~~_ -~^_ -~_-~~^- _~~_~-^_ ~^-^~~-_^-~ ~^
     ~ ^- _~~_-  ~~ _ ~  ^~  - ~~^ _ -  ^~-  ~ _  ~~^  - ~_   - ~^_~

Curved Bridge

                             ___....___
   ^^                __..-:'':__:..:__:'':-..__
                 _.-:__:.-:'':  :  :  :'':-.:__:-._
               .':.-:  :  :  :  :  :  :  :  :  :._:'.
            _ :.':  :  :  :  :  :  :  :  :  :  :  :'.: _
           [ ]:  :  :  :  :  :  :  :  :  :  :  :  :  :[ ]
           [ ]:  :  :  :  :  :  :  :  :  :  :  :  :  :[ ]
  :::::::::[ ]:__:__:__:__:__:__:__:__:__:__:__:__:__:[ ]:::::::::::
  !!!!!!!!![ ]!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!!![ ]!!!!!!!!!!!
  ^^^^^^^^^[ ]^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^^[ ]^^^^^^^^^^^
           [ ]                                        [ ]
           [ ]                                        [ ]
           [ ]                                        [ ]
   ~~^_~^~/   \~^-~^~ _~^-~_^~-^~_^~~-^~_~^~-~_~-^~_^/   \~^ ~~_ ^

Six Aspects Tiles

\__/  \__/  \__/  \__/  \__/  \__/  \__/  \__/  \__/  \__/  \_
/  \__/  \__/  \__/  \__/  \__/  \__/  \__/  \__/  \__/  \__/ 
\__/  \__/  \__/  \__/  \__/  \__/  \__/  \__/  \__/  \__/  \_
/  \__/  \__/  \__/  \__/  \__/  \__/  \__/  \__/  \__/  \__/ 
\__/  \__/  \__/  \__/  \__/  \__/  \__/  \__/  \__/  \__/  \_
/  \__/  \__/  \__/  \__/  \__/  \__/  \__/  \__/  \__/  \__/ 
\__/  \__/  \__/  \__/  \__/  \__/  \__/  \__/  \__/  \__/  \_
/  \__/  \__/  \__/  \__/  \__/  \__/  \__/  \__/  \__/  \__/ 
\__/  \__/  \__/  \__/  \__/  \__/  \__/  \__/  \__/  \__/  \_
/  \__/  \__/  \__/  \__/  \__/  \__/  \__/  \__/  \__/  \__/ 
\__/  \__/  \__/  \__/  \__/  \__/  \__/  \__/  \__/  \__/  \_
/  \__/  \__/  \__/  \__/  \__/  \__/  \__/  \__/  \__/  \__/ 
\__/  \__/  \__/  \__/  \__/  \__/  \__/  \__/  \__/  \__/  \_
/  \__/  \__/  \__/  \__/  \__/  \__/  \__/  \__/  \__/  \__/ 
\__/  \__/  \__/  \__/  \__/  \__/  \__/  \__/  \__/  \__/  \_

Tiles Aspects 12

 \__   \__   \__   \__   \__   \__   \__   \__   \__   \__   \_
_/  \__/  \__/  \__/  \__/  \__/  \__/  \__/  \__/  \__/  \__/ 
 \     \     \     \     \     \     \     \     \     \     \
_/   __/   __/   __/   __/   __/   __/   __/   __/   __/   __/
 \__/  \__/  \__/  \__/  \__/  \__/  \__/  \__/  \__/  \__/  \_
 /     /     /     /     /     /     /     /     /     /     / 
 \__   \__   \__   \__   \__   \__   \__   \__   \__   \__   \_
_/  \__/  \__/  \__/  \__/  \__/  \__/  \__/  \__/  \__/  \__/ 
 \     \     \     \     \     \     \     \     \     \     \
_/   __/   __/   __/   __/   __/   __/   __/   __/   __/   __/
 \__/  \__/  \__/  \__/  \__/  \__/  \__/  \__/  \__/  \__/  \_
 /     /     /     /     /     /     /     /     /     /     / 
 \__   \__   \__   \__   \__   \__   \__   \__   \__   \__   \_
_/  \__/  \__/  \__/  \__/  \__/  \__/  \__/  \__/  \__/  \__/ 
 \     \     \     \     \     \     \     \     \     \     \
_/   __/   __/   __/   __/   __/   __/   __/   __/   __/   __/
 \__/  \__/  \__/  \__/  \__/  \__/  \__/  \__/  \__/  \__/  \_

Bicycle Racing

            /'=----=           ______
            ((    ||          "--.__."
             "  @>||_____________//
          _______ /^\"""""""""""//\========)
         _--"""--/-. "\        // _\-:::-/_-.
       ." .-"""-/ "_\  "\  == // ;::\:::/::".\
      ; /     _/ "  \\   "\-+//--..._\_/:::::\\
      . ;    o    . ||   ( ()/)======(o)::::::.
      . \         ; .|    -|.;____...."b:::::;
       . -._  _ -  ;       ==    :::::::::::;
        "-..____.'     ls         ":::::::'

Sedan Cars

                                              _____________
                                  ..---:::::::-----------. ::::;;.
                               .'""""""                  ;;   \  ":.
                            .''                          ;     \   "\__.
                          .'                            ;;      ;   \\";
                        .'                              ;   _____;   \\/
                      .'                               :; ;"     \ ___:'.
                    .'--...........................    : =   ____:"    \ \
               ..-""                               """'  o"""     ;     ; :
          .--""  .----- ..----...    _.-    --.  ..-"     ;       ;     ; ;
       .""_-     "--""-----'""    _-"        .-""         ;        ;    .-.
    .'  .'                      ."         ."              ;       ;   /. |
   /-./'                      ."          /           _..  ;       ;   ;;;|
  :  ;-.______               /       _________==.    /_  \ ;       ;   ;;;;
  ;  / |      """"""""""".---."""""""          :    /" ". |;       ; _; ;;;
 /"-/  |                /   /                  /   /     ;|;      ;-" | ;';
:-  :   """----______  /   /              ____.   .  ."'. ;;   .-"..T"   .
'. "  ___            "":   '""""""""""""""    .   ; ;    ;; ;." ."   '--"

 ",   __ """  ""---... :- - - - - - - - - ' '  ; ;  ;    ;;"  ."
  /. ;  """---___                             ;  ; ;     ;|.""
 :  ":           """----.    .-------.       ;   ; ;     ;:
  \  '--__               \   \        \     /    | ;     ;;
   '-..   """"---___      :   .______..\ __/..-""|  ;   ; ;
       ""--..       """--"                      .   ". . ;
             ""------...                  ..--""      " :
                        """"""""""""""""""    \        /
                                               "------"

Hot rod

                                 _..-------++._
                             _.-'/ |      _||  \"--._
                       __.--'`._/_\j_____/_||___\    `----.
                  _.--'_____    |          \     _____    /
                _j    /,---.\   |        =o |   /,---.\   |_
               [__]==// .-. \\==`===========/==// .-. \\=[__]
                 `-._|\ `-' /|___\_________/___|\ `-' /|_.'     hjw
                       `---'                     `---'

Car Pick-up

                                          .------.
                                         :|||"""`.`.
                                         :|||     7.`.
                      .===+===+===+===+===||`----L7'-`7`---.._
                      []                  || ==       |       """-.
                      []...._____.........||........../ _____ ____|
                     c\____/,---.\_       ||_________/ /,---.\_  _/
                hjw    /_,-/ ,-. \ `._____|__________||/ ,-. \ \_[
                          /\ `-' /                    /\ `-' /
                            `---'                       `---'

Ambulance Car

    EeeiiiiiEEiiiii.....
       \|/
        n______     .....iiiiiEEiiiieeEE
       :~;     :                  \|/
-----;``~'  +  ;------------ ______n --------------------------------
     `-@-----@-=            :     :~:
=========================== ;  +  '~``; =============================
                            =-@-----@-'
jgs------------------------------------------------------------------

       _____,_                __________  __,_
------ |  +  |\__       ----- | ||||||| | | |_|
 ----- | _   ' _ |       ---- |  _ . _. |_|tre|
   --- `(o)---(o)'        --- `-(o)-(o)----(o)'

______________________________________________________________________

Train

                 __,-_-_--_-.___         ___,-----._
               /,--'   ||  `,---.'-._ -''       .   
              //    \  ||  /     | | _-.         `  
             /'--.--,-'.`---...__| || | `-.         
           ,'      ((_ ))           H |    `-.      
           |o       `--'         o  H`|-._   |`-.   
    ,--._ ,---..            ,,-----.  |   `-.|   `-.
  ,'    _ |_`_||    ,--.    ||_81__|. | -.   |`-._  
     ,-'   |       ((_ ))         | : | -. -.| -_ `-
   ,'      |--...__,`--'.__..._-_-. : |-...__|   _- 
           |=_= -_-\::::/-_--_-=_=' : |      |`''---
      ,'   |    \-_/||||\-_/         _|      |      
           |_______`----'_________ ______.... ......
           |=======[____]=========|       __ | -- __
        _, |     ||  ||  | |     --   --'  __/'--'  
   _,-     |     ||  ||  | |      | ___,--'         
           `--.  ''--''--'-' ,----' -               
            _ '_----_-------','-  _                 

Warship

                                     |__
                                     |\/
                                     ---
                                     / | [
                              !      | |||
                            _/|     _/|-++'
                        +  +--|    |--|--|_ |-
                     { /|__|  |/\__|  |--- |||__/
                    +---------------___[}-_===_.'____                 /\
                ____`-' ||___-{]_| _[}-  |     |_[___\==--            \/   _
 __..._____--==/___]_|__|_____________________________[___\==--____,------' .7
|                                                                     BB-61/
 \_________________________________________________________________________|
  Matthew Bace

Aircraft

                                            |
                                      --====|====--
                                            |  

                                        .-"""""-. 
                                      .'_________'. 
                                     /_/_|__|__|_\_\
                                    ;'-._       _.-';
               ,--------------------|    `-. .-'    |--------------------,
                ``""--..__    ___   ;       '       ;   ___    __..--""``
                 jgs      `"-// \\.._\             /_..// \\-"`
                             \\_//    '._       _.'    \\_//
                              `"`        ``---``        `"`

Keyboard

               ________________________________________________
               |      _____________________________           |
               | [][] _____________________________ [_][_][_] |
               | [][] [_][_][_] [_][_][_][_] [_][_] [_][_][_] |
               |                                              |
               | [][] [][][][][][][][][][][][][][_] [][][][]  |
               | [][] [_][][][][][][][][][][][][][] [][][][]  |
               | [][] [__][][][][][][][][][][][][_] [][][][]  |
               | [][] [___][][][][][][][][][][][__] [__][][]  |
               |          [_][______________][_]              |
               |______________________________________________|

Flower Blooms

                       ___ .
                   _~"|  ~~ ~.\.~
                  /   :   /   /  \_
                 ?""  ;  `  ,'     )
        /-,      /    .   .     .  |
       /   ~-_  /   dp   .    .    |
    .%"":    .? |:    . .   .      |
   %    '.   . \|:. . ..  .   .   /
 /  '.   '.: : :| :   .. . .    _/
/ ~~~::.   .:: ::. . .::.:. ..'~
\::... `'.. : : : " . :. .  ~~|    _____
(:::. ..   '.: .:.::. : . : "/__-""     --
 )"".>  --~~~__. ::::*## :.:.:)  :    .:` ~\
|..::'      >>    #######  '.: .' .  .`     ?
\_.___      :''> ######### ::.".    ~ ..~'" |,
     _">~____~~::. #* )#### :  ..~       .   )
    /:.:'';.:::_-  _-#####*:;: ::>,,          }
   o__o___q~_-" _-"###### .:.''     ..~~ ~    |
  ( o() &@&__--"  *::####::"  ";..    ~~...::.)
 (o& O& O?S).`   .:':::*: :      ~~~...     "/
   oS %@&>/    .:'  ::::: :.       .~  "'.  {
   \~*~~""   __:/   "::::..L        ~     ''/
    |::'    /##)     :':::::\         .   %
    \:; .  |#/       : :::::::-___      -"

     \::::: |        : :::::::::::\----"
     \::::::|:.      : :::::::::::|
     \::::::|'     . : ::::::::::::|
      -::::/ \     :.'::::::::::::/
        ~__/  \.   ;:.::::::::::_/       
               \::.::::::::::::/
                 --_;::::::_-~/
                     """"""

Laras shoes

      .-'\
   .-'  `/\
.-'      `/\
\         `/\
 \         `/\
  \    _-   `/\       _.--.
   \    _-   `/`-..--\     )
    \    _-   `,','  /    ,')
     `-_   -   ` -- ~   ,','
      `-              ,','
       \,--.    ____==-~
        \   \_-~\
         `_-~_.-'
 _ Seal _ \-~

Frame Chest

       __________________
      /\  ______________ \
     /::\ \ZZZZZZZZZZZZ/\ \
    /:/\.\ \        /:/\:\ \
   /:/Z/\:\ \      /:/Z/\:\ \
  /:/Z/__\:\ \____/:/Z/  \:\ \
 /:/Z/____\:\ \___\/Z/    \:\ \
 \:\ \ZZZZZ\:\ \ZZ/\ \     \:\ \
  \:\ \     \:\ \ \:\ \     \:\ \
   \:\ \     \:\ \_\;\_\_____\;\ \
    \:\ \     \:\_________________\
     \:\ \    /:/ZZZZZZZZZZZZZZZZZ/
      \:\ \  /:/Z/    \:\ \  /:/Z/
       \:\ \/:/Z/      \:\ \/:/Z/
        \:\/:/Z/________\;\/:/Z/
         \::/Z/____________\/Z/
          \/ZZZZZZZZZZZZZZZZZ/

Plaid

              ______________________
             /\    _______  _______ \
            /  \  /\      \/\      \ \
           / _  \   \      \ \      \ \
          / /\   \   \      \ \      \ \
         / /  \   \   \______\ \______\ \
        / /    \   \  / _____/_/ _____/_ \
       / /      \_  \  /\      \/\      \ \
      / _\      / _  \   \      \ \      \ \
     / /\ \    / /\   \   \      \ \      \ \
    / /  \ \  / /  \   \   \______\ \______\ \
   / /    \ \/_/    \   \  /      / /      /  \
  / /      \_ /      \_  \_____________________\
  \ \      / _\      /   /                     /
   \ \    / /\ \    /   /  \______\ \______\  /
    \ \  / /  \ \  /   /   /      / /      / /
     \ \/_/    \ \/_  /   /      / /      / /
      \  /      \_   /   /      / /      / /
       \ \      /   /  \/______/\/______/ /
        \ \    /   /  \______\ \______\  /
         \ \  /   /   /      / /      / /
          \ \/_  /   /      / /      / /
           \    /   /      / /      / /
            \  /  \/______/\/______/ /
             \/_____________________/

Read more.....

Create a Link to E-mail

Link does not need to go to another site addresses, but can also be directed to E-mail address. For example the link below, if you click will open the software to send e-mail and send to the destination email address.

Link to send E-mail

The difference link to an email and a link to a website address is if there is an email link mailto words before an email address. examples of writing his tag as below.

<a href="mailto:kesatria270491@yahoo.com"> Link to send E-mail </ a>

Read more.....

Create a Link to a Word

To create a link to a particular section of a web page, before we have to give names to the places or locations to be addressed it by putting tags <a name="location"> </ a> on line that will link it. Only then we can make the link to

that section. In this case there are two possibilities.

1. If the destination is contained within the same page with the link then simply write the name of the field. For example: href = # locations.
2. If the destination is located on another page it must be written the name of the file from that page just name the place. For example: href = "other.htm # location".

Scheme code HTML programs like this.

<HTML>
<BODY>
statement
...............................................
...............................................
..............................................
<A HREF="#goal">Links origin</A>
statement
..............................................
..............................................
..............................................
<A NAME="goal">Goal position </A>
statement
.............................................
............................................
............................................
</BODY>
</HTML>

Read more.....

Make Font Color

To make writing more interesting on the web, we can add color to the text. Example:

<FONT COLOR="red"> This red color. </ FONT>
<FONT COLOR="blue"> It's blue. </ FONT>
<FONT COLOR="green"> This green color. </ FONT>
<FONT COLOR="yellow"> This yellow color. </ FONT>
<FONT COLOR="cyan"> This is the color of cyan. </ FONT>
<FONT> This black color (without writing a color, you are writing a black as default. </ FONT>

Then the results will be displayed on the web brouser is:

This red color.
It's blue.
This green color.
This yellow color.
This color cyan.
This black color (without writing a color, you are writing a black as default.)

his black color (no color writing, your writing is black as the default.)

We can only make some colored paper using color names, to use another color, we can use colors using hexadecimal code. Examples of the use of colors using hexadecimal:

This color="#99FF00"> <font faded green color </ font>
This color="#663300"> <font brown </ font>

Then the results will be displayed in a web browser is:

This green color faded
This brown color

We can combine the font size, font type, color, and type text simultaneously.

<FONT SIZE="4" FACE="Comic Sans MS" COLOR="green"> <B> This bold, use Comic Sans MS font, size 4, green. </ B> </ FONT>

Then it will be like below.

This bold, use Comic Sans MS font, size , yellow.

Read more.....

Use The Heading Format

Heading is custom-sized letters used to write the title of the chapter or sub chapter. There are six levels of headers from H1 to H6. Header H1 is the largest and H6 is the smallest header. Example header format:

<html>
<body>
<h1>Heading 1</h1>
<h2>Heading 2</h2>
<h3>Heading 3</h3>
<h4>Heading 4</h4>
<h5>Heading 5</h5>
<h6>Heading 6</h6>
</body>
</html>

The results as below.

Heading 1

Heading 2

Heading 3

Heading 4

Heading 5

Heading 6

Read more.....

Change Typeface

Web browsers use the default font, but we can change this using the FACE attribute.

<FONT FACE="Arial"> It uses arial font. </ FONT>
<FONT FACE="Arial Black"> It uses the font arial black. </ FONT>
<FONT FACE="Comic Sans MS"> It uses comic sans MS font. </ FONT>
<FONT FACE="Courier New"> It uses the font courier new. </ FONT>
<FONT FACE="Helvetica"> It uses Helvetica font. </ FONT>
<FONT FACE="Impact"> It uses the font Impact. </ FONT>
<FONT face="Times New Roman"> It uses Times New Roman font. </ FONT>
<FONT FACE="Verdana"> It uses the font Verdana. </ FONT>

The results will be displayed in a web browser like below.

It uses arial font.

It uses the font arial black.

It uses comic sans MS font.

It uses the font courier new.

It uses Helvetica font.

It uses the font Impact.

It uses Times New Roman font.

It uses the font Verdana.

Keep in mind that if we choose a font, must consider compatible with the client computer. Because not all types of letters on each client computer.

We can combine the font size, font type, color, and type text simultaneously.

<FONT SIZE="4" FACE="Comic Sans MS" COLOR="green"> <B> This bold, use Comic Sans MS font, size 4, green. </ B> </ FONT>

Then it will be like below.

This bold, use Comic Sans MS font, size 4, green.

Read more.....

Adjust The Font Size on Web

To create or manage the size of an inscription on a web page, we need to use tags like the following:

<FONT SIZE="1"> Font size 1 </ FONT>
<FONT SIZE="2"> Font size 2 </ FONT>
<FONT SIZE="3"> Font size 3 </ FONT>
<FONT SIZE="4"> Font size 4 </ FONT>
<FONT SIZE="5"> Font size 5 </ FONT>
<FONT SIZE="6"> Font size 6 </ FONT>
<FONT SIZE="7"> Font size 7 </ FONT>

Results of the HTML tags above can be seen below.

Font size 1

Font size 2

Font size 3

Font size 4

Font size 5

Font size 6

Font size 7

We can combine the font size, font type, color, and type text simultaneously.

<FONT SIZE="4" FACE="Comic Sans MS" COLOR="green"> <B> This bold, use Comic Sans MS font, size 4, green. </ B> </ FONT>

Then it will be like below.

This bold, use Comic Sans MS font, size 5, red.

Read more.....

Create a New Line in HTML

Now we will learn how to make a row. We usually hit the Enter key to create a new line. What about an HTML document?.

Enter keystrokes when creating HTML code, do not generate a line in the browser view. Such is the nature of writing HTML documents. So, how do I create a row?. Use tags <BR> or <br />.

The first line
<BR>The second line
<BR>The third line

Then it will be like below

The first line
The second line
The third line

Or

The first line <br />
The second line <br />
The third line

Then it will be like below

The first line
The second line
The third line

Read more.....

Create Bold, Italic, and Underline in HTML

There are three types of writing most frequently used in writing any document. The third type is bold, italics and underlined text. Two types of letters can also be combined

such as bold and italic, bold and underlined or italics and underlined. In fact it could be three types of writing were combined into one form of writing is bold, italic and underlined.

Like the previous article, the code in the HTML file is always limited by the tag <... >. Tags will be used to thicken <B> (bold) text, <I> to tilt (italic) text and <u> to underline (underline) text.

<B> To make bold. </ B>
<I> To create italics. </ i>
<u> To make the bottom line. </ U>

Read more.....

Use of Paragraphs in HTML

In writing the document, we often use your paragraph as a regulator of an article. In HTML use the paragraph could use a crate tag below.

Tag <P> serves to create a new paragraph. </ P>

Tag <P> have the align attribute, such as <P align="left"> that create paragraphs into the left flat, <P align="right"> that create paragraphs into the right flat and <P align="center"> create paragraphs become in the middle.

Examples of the use of paragraphs.

<P Align="right"> <FONT COLOR="red"> <B> This paragraph is using the tag P align = "right" that caused the whole paragraph into the right flat. Use tags FONT COLOR = "red" causes all the red letters, and tag B causes all letters to be bold. </ B> </ FONT> </ P>

<P align="center">Example use of tags align="center". This tag causes the text in the middle. Maybe you can feel the difference between P tags with BR tags. If the BR tag just cause to move to a new line, tag P causes jump to form a new paragraph. </ P>

The results obtained as below

This paragraph is using the tag P align = "right" that caused the whole paragraph into the right flat. Use tags FONT COLOR = "red" causes all the red letters, and tag B causes all letters to be bold.

Examples of the use of tag P align = "center". This tag causes the text in the middle. Maybe you can feel the difference between P tags with BR tags. If the BR tag just cause to move to a new line, tag P causes jump to form a new paragraph.

Read more.....

XHTML

XHTML (eXtensible HyperText Markup Language) is the development of HTML markup language. XHTML has the ability to more

or less similar to HTML, but with strict rules of syntax lebuh. XHTML is an application of XML, a derivative of SGML (Standard Generalized Markup Language) is more limited.

Because XHTML should have a regularity of shape (following the proper syntax), XHTML documents can be automatically processed using standard XML processing, unlike HTML processors that require a fairly difficult and complex.

XHTML can be thought of as a combination between HTML and XML as it is a re-formulation of HTML in XML form.

Read more.....

HTML Tags

<HTML>
<HEAD>
<TITLE> </TITLE>

</HEAD>
<BODY>

</BODY>
</HTML>

Each line above is called a tag. Tag is the code used to his markup ASCII text into HTML file. Each tag flanked with pointy brackets. There is <HTML> opening tag and there is a closing tag is </ HTML> which is marked with a slash in front of his writings. Tag the above means that that will be written between these two tags is the content of an HTML document.

HEAD tag serves to clamp a variety of functions and information that is pleasing to the relevant web pages. TITLE tag is used to flank the sentence that became the title of the web page. There is a body that is <BODY> marker tag and closing tag is </ BODY> which means that as a marker of the body and put the attributes that will influence the format or display web pages as a whole.

Please note that html tags can be written in uppercase or lowercase. That is, writing or <html> or <html> <HTML> same results. However, keep in mind that writing the wrong tags although only one character will affect the HTML document, and can even result in an HTML document can not be displayed in the browser.

Read more.....

HyperText Markup Language (HTML)

HyperText Markup Language (HTML) is a markup language used to create a web page, featuring a variety of information in an Internet web browser and a simple hypertext formatting is written into an ASCII format file to

generate a form of the integrated display. In other words, files created in word processing software and saved into an ASCII format so that it becomes normal home page with HTML commands. Starting from a previously widely used language in the world of publishing and printing called SGML (Standard Generalized Markup Language), HTML is a standard that is widely used to display web pages. HTML is now an Internet standard defined and controlled its use by the World Wide Web Consortium (W3C). HTML created by TEAM Caillau collaboration with Berners-lee robert when they worked at CERN in 1989 (CERN is a high-energy physics research institute in Geneva).

Read more.....