The very first time one opens Macromedia Dreamweaver, he is greeted with an array of different options - HTML, CSS, XHTML and Javascript to name just a few. Trying to make sense of all these different (but apparently important) elements of web design can be a bit daunting at first. For someone trying to simply learn the ropes of basic web design, the thought of all these languages and scripts might be overwhelming but this blog post will try and reveal the 'method' behind this apparent 'madness.'
At the very basic level a web site is a collection of text, images, sounds and videos. Advanced web sites then include features like interactive videos, username/password logins and links to other videos. Evidently the more advanced the website the more features and formats it needs to be able to integrate seamless and efficiently. This is where the different languages and scripts come to play.
A very basic website with only a few images and text can be handled sufficiently with HTML. However, start adding videos (that use flash or silverlight), interactive menus, secure encryption channels for password logins and then the complexity increases exponentially. This is why it clearly makes more sense to have separate mediums to edit and create separate aspects of web design, aspects I will try and clarify.
MARKUP LANGUAGES: (HTML, XHTML, XML)
The key function of a markup language is to enable the designer to annotate text which is syntactically distinguishable from that text. This is why HTML (Hyper Text Markup Language) uses '<>' and '<>/' to distinguish the content from the annotations. These annotations (which lie within the '<>') indicate information regarding a particular text. Examples of markup languages are HTML (the standard) and newer languages like XHTML and XML.
STYLE SHEET LANGUAGES: (CSS, XSL)
Markup languages help annotate text, style sheet languages help edit and manage the layout of structured documents (this includes text and other 'marked up' content as well). Style sheet languages essentially describe how the content is to be displayed on your browser. However, the function of style sheet languages is much more than just basic visual presentation of content. They allow the designer to process the content and provide a suitable output when options like the font size, font type, colors as well as orders of appearance are changed. A good designer is able to create logical structures that help clearly and easily edit the positioning and design of his content. The primary language used is Cascading Style Sheets (CSS).
SERVER SIDE SCRIPTING: (PHP, ASP)
Okay, you now have a great looking site with text all beautifully organized, images in the right locations and the overall layout is just perfect. But, wait a minute, isn't the website no better than a wallpaper? Think about it, you can't interact with it and you can't explore anything. This is where server side scripting comes into play. Suppose you go to the Apple home page. Now you click on the tab that leads you to the iPod section. After an instant the page with information on iPods loads up. Server side scripting just kicked into action the moment you clicked the iPod tab. Essentially programs, these scripts are made to identify when a user performs a specific action or request (like opening the iPod page) and accordingly loads up the correct page. Scripts understandably include much more complicated functions but for all practical purposes their essential function is to detect certain user requests and actions, transfer the necessary data from the data server to the user's computer and display them as a web page.
CLIENT SIDE SCRIPTING: (Javascript, VBscript)
Anyone who is even the least bit savvy about computers must have heard about Javascript or Java in short. Java is a scripting program that dictates how the webpage interacts to the user. For example you go onto the Sony website (www.sony.com). When you take the mouse button over the PLAYSTATION tab the tab expands to 'reveal' sub options like the PS3/PS2/PSP. I use the word reveal because the content is already present in the web page. Scrolling the mouse button over the particular tab activated the 'hidden' content to be revealed. Client side scriptin allows web designers to pack in a lot more extra content that is revealed according to the actions of the user. Client side scripting is primarily conducted by the browser (since it involves analysing and displaying ouput already present in the webpage). But server side scripting and client side scripting sound similar right?
Take this example:
Stay on the sony website. Scroll over the PLAYSTATION tab, almost instantly an attached sub group appears with further options (PS3/PS2/PSP). Now scroll over and press the PS3 sub-tab, again almost instantaneously another sub group (systems/accessories/features)
appears. Now click on the systems sub-tab, this will lead to the page reloading (which takes considerably longer time) as it opens the requested page. Can you guess which parts involved client side scripting and which part involved server side scripting?
Client side scripting essentially enable web sites to have different and changing content depending on user input or other variables. They are faster as well as more efficient than server side scripting for the same purpose. Imagine a web page reloading every time you scroll over a tab just so that the page can be displayed with that particular tab highlighted.
At the very basic level a web site is a collection of text, images, sounds and videos. Advanced web sites then include features like interactive videos, username/password logins and links to other videos. Evidently the more advanced the website the more features and formats it needs to be able to integrate seamless and efficiently. This is where the different languages and scripts come to play.
A very basic website with only a few images and text can be handled sufficiently with HTML. However, start adding videos (that use flash or silverlight), interactive menus, secure encryption channels for password logins and then the complexity increases exponentially. This is why it clearly makes more sense to have separate mediums to edit and create separate aspects of web design, aspects I will try and clarify.
MARKUP LANGUAGES: (HTML, XHTML, XML)
The key function of a markup language is to enable the designer to annotate text which is syntactically distinguishable from that text. This is why HTML (Hyper Text Markup Language) uses '<>' and '<>/' to distinguish the content from the annotations. These annotations (which lie within the '<>') indicate information regarding a particular text. Examples of markup languages are HTML (the standard) and newer languages like XHTML and XML.
STYLE SHEET LANGUAGES: (CSS, XSL)
Markup languages help annotate text, style sheet languages help edit and manage the layout of structured documents (this includes text and other 'marked up' content as well). Style sheet languages essentially describe how the content is to be displayed on your browser. However, the function of style sheet languages is much more than just basic visual presentation of content. They allow the designer to process the content and provide a suitable output when options like the font size, font type, colors as well as orders of appearance are changed. A good designer is able to create logical structures that help clearly and easily edit the positioning and design of his content. The primary language used is Cascading Style Sheets (CSS).
SERVER SIDE SCRIPTING: (PHP, ASP)
Okay, you now have a great looking site with text all beautifully organized, images in the right locations and the overall layout is just perfect. But, wait a minute, isn't the website no better than a wallpaper? Think about it, you can't interact with it and you can't explore anything. This is where server side scripting comes into play. Suppose you go to the Apple home page. Now you click on the tab that leads you to the iPod section. After an instant the page with information on iPods loads up. Server side scripting just kicked into action the moment you clicked the iPod tab. Essentially programs, these scripts are made to identify when a user performs a specific action or request (like opening the iPod page) and accordingly loads up the correct page. Scripts understandably include much more complicated functions but for all practical purposes their essential function is to detect certain user requests and actions, transfer the necessary data from the data server to the user's computer and display them as a web page.
CLIENT SIDE SCRIPTING: (Javascript, VBscript)
Anyone who is even the least bit savvy about computers must have heard about Javascript or Java in short. Java is a scripting program that dictates how the webpage interacts to the user. For example you go onto the Sony website (www.sony.com). When you take the mouse button over the PLAYSTATION tab the tab expands to 'reveal' sub options like the PS3/PS2/PSP. I use the word reveal because the content is already present in the web page. Scrolling the mouse button over the particular tab activated the 'hidden' content to be revealed. Client side scriptin allows web designers to pack in a lot more extra content that is revealed according to the actions of the user. Client side scripting is primarily conducted by the browser (since it involves analysing and displaying ouput already present in the webpage). But server side scripting and client side scripting sound similar right?
Take this example:
Stay on the sony website. Scroll over the PLAYSTATION tab, almost instantly an attached sub group appears with further options (PS3/PS2/PSP). Now scroll over and press the PS3 sub-tab, again almost instantaneously another sub group (systems/accessories/features)
appears. Now click on the systems sub-tab, this will lead to the page reloading (which takes considerably longer time) as it opens the requested page. Can you guess which parts involved client side scripting and which part involved server side scripting? Client side scripting essentially enable web sites to have different and changing content depending on user input or other variables. They are faster as well as more efficient than server side scripting for the same purpose. Imagine a web page reloading every time you scroll over a tab just so that the page can be displayed with that particular tab highlighted.
Thank you for the positive comments. Glad to be of help.