Many people find it hard to imagine a website as more than a bunch of content. This often makes explaining the language mixture used and the way everything comes together a very difficult task.

Because what makes up a website can be related and linked to the human body basic anatomy, this article’s comparison should help clients and beginners alike understand the complex nature of a site’s development and components.

Designer DNA: Schemas and DTDs

Humans have predefined characteristics for how we look. These building blocks of life are passed down to us via genetics, and when arranged properly, give us our unique appearance.

This process of evolution takes millions of years to adapt to changing environments and certainly plays a part in limiting both our visual appearance and structural.

In terms of the Web, the regulators of code “genetics” are commonly known as Concepts/Schemas.

Of course, while the process of creating a schema doesn’t take millions of years, it does take a certain length of time for new languages to appear and become widely adopted, thereby evolving the building blocks of your website.

As a consequence, while sites may look different, you can be assured that they only use one of a family of structural languages that predefine many of its characteristics, and at the end you will share common elements and tags with many millions of others.

Bonus: The very inclusion of a DTD in your document can set standards for your code and avoid the obscurities that quirks mode can present to your web browser. Therefore, having this DNA, which describes the language used, can prove beneficial in inheriting Web standards.

Skeletal Structure: The Structural Markup

The structure of the human body is made up of bones that define our basic shape — the same is true of web documents in the sense that they are shaped from various interlinking elements that form the backbone of the Web.

Most web documents are formed through languages which describe the skeletal structure of the document, such as HTML and XML.

Without these core markup languages, your website would not be able to maintain its layout.

While each bone in the human body serves a specific purpose, entire groups of bones can serve a single job, such as the ribs (each protects your lungs) or your finger bones which help you grasp objects.

Because this repeating purpose can exist within a website’s body, they can be distinguished by attaching conventions like microformats that can give additional semantic characteristics and value beyond what a “generic” or reused element would offer, acting as a point of bodily recognition.

Bonus: Micro-formats are descriptive elements (usually as class or ID values) which give your structure some recognizable semantic values — this is much like recognizing each finger bone by its appearance and unique characteristic. It’s labeling your anatomy for referral!

Mechanical Muscles: Client-side Scripting

Being able to move allows you to interact and engage with people you meet. Without muscles, we can’t turn thoughts into a reaction.

As people expect a certain level of involvement with your site, not enough interactivity could make your site appear unemotional.

Muscles work between the skin and bones to allow both to fluidly play their part in the interaction. The same is true about sites where behavior underpins the style and structure of a site to “flex” only when interaction is required.

Client-side scripting is the muscular component of a site. Languages like JavaScript allow interaction when visitors click, move their mouse, press a key on their keyboard or make any other noticeable gesture. This response mechanism functions just like the body in that it reacts based on its surroundings.

Simply put, the “muscles” act as a way to interact and make noticeable changes in structure (standing up rather than sitting down) or appearance (smiling instead of frowning).

Bonus: Just as humans have multiple methods of input (such as sensory mechanisms like touch, taste, sight, smell and hearing), JavaScript and other client-side scripting languages can interact and react based on its own input methods like touch, speech, automated actions and movement.

Nervous Reactions: The Web Browser

With scripting included in your website comes the need to send and receive information that acts upon the interaction occurring within your design. In a website, the mechanism of communicating these signals belongs to the user-agent or server that handles the requests and reflects those requests to act into a mechanism that is visible to the end user. In short: Your web browser works the mojo!

In the human body, such requests are sent as electrical signals that pass through the various organs and are broadcaster to conduct the action determined from the receptor, such as when you feel pain.

In a website, while pain doesn’t exist (except for the end user who encounters an unusable interface element like a nasty webform) the code fires signals to the browser upon examination and triggers structure, style and behavioral reactions in turn.

Bonus: The rendering engine of a browser does everything from ensuring the sites “body” appears correctly, right down to reacting upon interaction. Even the likes of Flash,which attach themselves to a browser, have their own method of “nerve”-based interaction!