Web Technology- Fundamentals

Web technologies is a general term referring to the many languages and multimedia packages that are used in conjunction with one another, to produce dynamic web sites such as this one.

Each separate technology is fairly limited on its own, and tends to require the intertwined use of at least one other such technology. Therefore we can conclude that all of the components that make up a site are interdependent on one another. This article is intended to briefly introduce the beginner to each of these separate technologies, without attempting to teach anyone how to program.

HTML: The Foundation of any Web Site:

If we think Web Site as a House, HTML (Hyper Text Mark-up Language) is its foundation. HTML is an open source language (i.e. not owned by anyone), which is easy to learn, and requires no fancy packages to start using it. All you need is something to type with, such as Windows Notepad, and a lot of time and patience.

HTML works on a 'tag' system, where each tag effects the content placed within that tag, 

e.g. <TAG>What the tag effects</TAG>.

• Although relatively limited by itself, it is the flexibility of HTML that allows web sites to grow in complexity. Like the foundation of your house, HTML is robust enough to support many kinds of languages integrated within your HTML pages.

DHTML:

DHTML (Dynamic HTML) is just as the name suggests, it adds dynamic, moving or changing content to your plain old HTML pages. It is a more advanced version of HTML, although DTHML is in fact not a programming language in itself.

• DHTML is a broad term used to describe a group of applications; the main ones are described below:

JavaScript: 

JavaScript is a 'scripting' language. A bit like a script in a feature film, it is used to decide 'what happens next'. 

• This may be a sequence of screen events, where one event is initiated by the end of another, or it could be a programmed response to a user interacting with the page in some way, e.g. moving their mouse over a link. 
• JavaScript is a complex and powerful language, and may be placed directly inside an HTML page, or in a separate JavaScript file.

CSS and CSS-P: CSS (Cascading Style Sheets) is a relatively new language, designed to expand upon the limited style properties of HTML. Easy to learn and implement, CSS is an excellent way to control the style of your site, such as text styles like size, colour and font.

• CSS may also be placed inside the HTML page or in separate files. The real advantage of having all of the style properties for your entire site in one single CSS file is that you may edit that single file to effect changes on the whole site, rather than having to go through each HTML file one at a time. 
• For this reason, it is perhaps the most useful web technology and certainly one of my favorites.
• CSS-P (CSS-Positioning) is a sub-set of CSS, and is concerned mainly with the layout of your HTML pages. It allows the web designer to place any element (text, graphic etc.) exactly on the screen where they want it, to the pixel.

DOM: 

DOM (Document Object Model) allows the designer to access any element in a HTML page, such as an image, layer or table. Each element may be assigned a unique 'id' name to identify it by, e.g. 1 <TAG ID="My Tag">Content of My Tag</TAG>

• When combined with CSS and JavaScript, the DOM may be used to make changes to only "My Tag" and no other element, such as increasing text size or the position of "My Tag" on the screen. 
• JavaScript may also be used to animate such changes to any identified element, such as gradually increasing the size of the text on screen.
• Each different browser has its own DOM, and this is often used to determine which browser the visitor is using. A particular action may be carried out if the person is using NS6, for example, and ignored if the person is using IE5.

Flash

Unlike all of the above technologies, Flash is not an open source technology. Flash is owned by Macromedia, and they produce the application required to produce Flash content for your web site. 

• Furthermore, a web browser on its own will not display Flash content; a 'plug-in' must be downloaded (for free) and installed by the visitor to your site before they can view it properly. 
• This plug-ins (miniapplications) must also be updated to ensure that they can display the most up-to date Flash content on the Net.

While I have discussed the drawbacks of Flash, there are many positives. Flash is currently one of the only true multimedia packages for the Net, providing support for animation, video, sound and truly impressive interactive web site experiences.

• The one real pity about Flash is that it may never become a standard technology. 
• That is not to say that its future is not bright, with many web users having the plugin installed, and with most web designers quoting Flash as the application of choice.

The Backend: CGI and Perl

If you will forgive me for continuing with the house analogy; if HTML forms the foundation of the house, with the various flavours of DHTML and Flash forming the structure of the house above ground which is visible, then CGI (Common Gateway Interface) would form the functional workings parts of the house that you cannot see such as the plumbing, electrical wiring and heating.

• So CGI is concerned with the working parts of your web site, which may include hit counters, form processors or web statistics tools. There are many different languages that may be termed 'CGI', the most popular of which is Perl.
• Perl is the language of choice for adding function to your site. HTML, DHTML and Flash are fine for controlling the look and presentation of your site, but Perl is needed to run the mechanics of it behind the scenes. 
• We can differentiate between the presentational (the bit the visitor sees) and the functional (the bit they don't see) parts of a site using the terms 'front-end' and 'back-end' respectively. 
• Therefore, Perl is often referred to as a back-end technology. It operates on the server that hosts your site, rather the within the browser window of a visitor to your site.

The Future: SVG and XML

The nature of web technology is constantly changing to meet the demands of web users and web designers alike. 

• It is hard to predict with any real accuracy what will become the norm in future developments, and what will fade to obscurity. 
• The decisions for future developments lay largely with the World Wide Web Consortium, found at www.w3.org.
• As well as being responsible for HTML and CSS, the W3C are also developing a potential rival to Flash, SVG (Scalable Vector Graphics). 
• SVG is currently in its infancy, but when completed it will offer web designers an alternative to Flash while possessing many of its versatile qualities. 
• Furthermore like HTML and CSS, SVG will be an open source standard with nobody owning exclusive rights to produce the packages used to generate SVG content. Currently no browser supports it, and a plug-in from Adobe is needed to run sites using SVG.

XML (Extensible Mark-up Language) has been around a little longer than SVG.

Uses for Real time Web Technologies

1. Real time web analytics

Google has already started pushing into this market with Google Analytics, but there are a lot of other startups exploring this space. If you think about it, there is a ton of opportunity there, as you have the ability to capture and transmit interactive user data like never before. You can track where the mouse floats across the screen, the orientation of a mobile device, and any number of other user interactions. Not only could you track them, but you could actually watch them as they happen!

2. Digital Advertising

The digital advertising world has long been a solid revenue generator for webbased businesses. With real time web technologies, advertisers can move towards more interesting advertising paradigms, such as charging for ads based on the amount of time the ad is visible on a user’s screen or other real time interaction metrics vs the CPM and CPC metrics that have long been the standard.

3. E-Commerce

E-commerce has always been the place for engaging customers and customer interactions. Showing shoppers what other shoppers are looking at online, or pushing out online deals directly to all connected browsers are the types of real time features that e-commerce platforms will look to adopt in the future.

4. Publishing

Keeping eyeballs on the screen is the primary goal on any online publisher, and one way to keep visitors on your site is to keep them engaged. Real time data can lead to some very interesting info graphics, and it can also help connect viewers like never before. A great example is some of the real time comments like Disqus.

5. Massively Multiplayer Online Games

Those big MMO games are making their way on to the web, and they will surely find a friend in real time web technologies. Many multiplayer games depend on low latency communications between individual gamers, and for this technologies like Web Sockets are ideal.

6. Backend Services and Messaging

Our backend systems have grown in scale and complexity over the last decade, and it is becoming increasingly important to propagate messages across very large systems effectively and efficiently. The real time web is going to be great for these types of functions.

7. Project Management & Collaboration

Google docs and other platforms have already demonstrated the value (and potential complexity) in implementing real time collaborative environments on the Web. The new era of real time web technologies will hopefully make the development of these types of applications simpler and easier to build. Which is great because most web applications are not built in a vacuum, so having the ability to connect all those users together in constructive and insightful ways should be able to add value their workflows.

8. Real time Monitoring Services

The bi-directional communication channel is great for remote devices or servers to stay connected to a central monitoring service. This gives technologists and administrators the ability to watch what their endpoints are doing in real time without logging into the machine, and also gives the ability to send real time alerts.

9. Live Charting and Graphing

Charts and graphs have always been a great way to visualize data. Now you can have those graphs and charts connected to real time data flows. The possibilities are literally endless, from displaying temperature data measured from a connected home device to streaming stock prices to real time chart.

10. Group and Private Chat

Chat has long been the de-facto example for real time since by its very nature it requires real time bi-directional communication. Chat is a great use for real time web technologies, and variations on group chats and private chats could lead to more innovation in this area over the coming years.

What is Mobile Web Technology?

Mobile web technology - With mobile web technology, you get to target the more than 1 billion people worldwide who have cell phones or other mobile devices with an internet connection. Instead of letting those mobile users surf your traditional website, you can use mobile web technology to create a site that's specifically created for them - with a design that's more compatible with small screens, and a layout that offers easy-access information for people on the go. So, now that you know the basics about mobile websites, what exactly can they do for you? When it comes to using mobile web technology for your business, there are 5 things you need to know and they are:

1. Mobile web technology is growing faster than PC-based internet ever has. New phones and mobile devices are constantly being introduced, and it seems like the entire world cannot get enough mobile technology. According to studies, there are nearly as many mobile devices as there are PC's around the world. That's an amazing statistic, when you consider that PC's have been on the market for far longer!

2. Mobile web services, like click-to-call and click-to-map, are resulting in higher sales conversions. With a mobile website, all you have to do is click on the phone number on the screen, and it automatically dials for you. Or, click on the address, and immediately see a map of the business' location. Mobile services are making it easier than ever for people to contact or visit retail locations. And, experts say that using a mobile device to search for a business' location is one of the biggest reasons that people use them.

3. Mobile web technology sets your business ahead of the pack. While it seems like people are using the internet anywhere and everywhere, offering mobile websites is still a new idea for many businesses. By taking advantage of this new technology, you can send a message to visitors that you're on the cutting edge. Effectively targeting mobile users can instantly make you a leader in your industry or region.

4. Mobile web technology makes it easy to shop online - from anywhere. Some of the internet's biggest players - like PayPal, Amazon, and Google Checkout - all have mobile versions for their retailers. That means you don't have to worry about finding a separate payment processor for your mobile website.

5. Mobile websites are designed a little differently.

If you do plan on going mobile, there are several design issues that you need to be aware of. Websites are totally different on tiny screens. The state-of-the-art flashy website you have may look great on a 17-inch computer monitor - but it will not transfer well onto a mobile device. If you really want to make the most out of mobile web technology, you have to design your site for mobile users. That means making your site load quickly, with a font that looks good on smaller screens, and getting rid of the Flash and Java script that can't be read by most mobile devices. If your mobile site is too difficult to use, users will just leave and find a different site that meets their needs.