Archive for December, 2007


Page 3 of 3«123

CSS for styling FORMS

A form with style- using CSS for styling FORMS.
Launch Demo/site

A Script to give nice forms in styling and in HTML structure. Download the script here. Download
Launch Demo/site

Comments

The Web 2.0 Effect: the Characteristics of a Web2.0 Website

The term web2.0 was originally presented by O’Reilly Media (A well known media company publishing books and websites on various computer technology topics). It’s a term that refers to a new generation of websites (social networking websites, wiki-based websites etc). These websites take advantage of web application technologies and give web users the ability to collaborate and share their experiences, views, opinions and interests while they surf the web.

The web2.0 is a revolutionary phenomenon. Let’s talk about the most basic characteristics of the websites using the web2.0 concept:

- A web2.0 website should be completely interactive and dynamic with a friendly user-interface based on the latest web2.0 technologies like AJAX.

- Web2.0 websites should deliver web based applications to Internet users and allowing them to make use of these applications through a web browser.

- A web2.0 website should implement social networking capabilities allowing users to interact with each other and create friend lists.

- A web2.0 website should be a democratic website where users will be able to add value by interacting with the web based application.

- A Web2.0 websites should allow it’s users to exercise various controls over the website data and content (adding/deleting/editing content).

The conclusion is that web2.0 websites are build on participatory web based applications focusing basically on user experience and collaboration.

Examples of successful web2.0 websites

Although this new Internet revolution or trend is not widespread among web developers or Internet marketers yet, millions of users are actually participating in such websites. Not a lot of them are aware of the web2.0 concept but they are already an active part of it.

Here are some super-successful websites utilizing the web2.0 technologies:

- YouTube.com : The concept of YouTube is very simple. It allows Internet users to share their favorite video files with the entire world. YouTube gained so much popularity in such a little time. Everyone was surprised when the giant search engine Google bought the YouTube company for over 2 billions dollars!

- Wikipedia: The most famous online encyclopedia. It’s free, it’s huge, it’s quite a resource for everyone and it’s updated every single minute since anyone can edit it’s contents. Which is why it became such a popular web place.

- Social Bookmarking websites like Digg.com : These type of websites like Digg.com offer users the ability to create friend lists and share their favorite websites, opinions, stories etc with people all over the globe. The popularity of these social bookmarking websites is increasing every day, making the website owners rich!

- MySpace.com: I bet you’ve heard of MySpace.com. This website will allow you to create your own profile, friend list and personal homepage adding whatever you want on it (text, images, videos, links, etc). It will also allow to share your profile and web page with other MySpace users. Amazingly simple but so clever. MySpace.com is now one of the most visited websited in the entire Internet.

What do all these websites have in common?

The web2.0 concept. These websites are active web based applications. They all allow internet users to actively participate and customize the way the website looks and feels, thus giving the pleasure and impression of collaborating to the online community. The web2.0 is so evolutionary because of it’s simplicity and it will become even more widespread among website designers and internet marketers.

About the Author:
M.Markell is a webmaster of DigitalStarProducts Product Directory

Comments

Ajax — Bring your Website to Life

Chances are that whether or not you are not a technology guru, you keep hearing talk of internet technologies in terms of a never ending stream of acronyms. XHTML, CSS, J2EE, PHP, ASP.NET, JSP, SQL, HTTP, SSL, VOIP, P2P, XML, RSS… Sound familiar — or a bit like Klingon?

Well, this article is about another really cool acronym, only this time for the average Joe. I’ll be focusing on only one acronym in this article, and only because it’s one you’ll be hearing a lot more about, and because it can really breathe life into your business’ website.

AJAX. Asynchronous JavaScript and XML, if you must know what it stands for. Don’t let that put you off. Even if it is comprised of technical words and yet another acronym, more importantly, what is it, and why do you need it?

Remember the internet up until recently? Virtually all web pages were lifeless objects, similar to pages in a magazine, with no intelligence. In order to get a response from a website, you would click a link or press a submit button, and your computer would send a message to the computer hosting the site that it needs to send you back the next page. A little bit like turning to a new colourful but lifeless page in your magazine.

Sure, there were some really great new technologies that came along to make the internet more interesting. Animated images, Flash animations, small embedded applications, and scripts downloaded with the page certainly made the pages a lot more interesting. Yet, when compared to the highly responsive environment of your desktop computer, a web page really could not compete. Click anywhere in your local pc environment and you get an immediate and logical, virtually instantaneous response from the object you clicked, without your entire screen flashing blank and reappearing again from scratch. Do the same on a web page until recently, and usually at best you would have to wait a few seconds for a completely new page to reappear, a newly turned page in your virtual magazine.

Until Ajax. Technically Ajax is actually not a new technology, but a clever grouping of a few existing technologies. What has made Ajax a workable solution is that most people have started using browsers capable of supporting these technologies, often without even realising that their browser wields these dormant superpowers.

Ajax allows your internet page to respond to a user very similarly to the way your local computer desktop environment would. In a well-developed Ajax-based site, when you click on a page object, it responds almost immediately. Any changes to the page happen there and then, without the page disappearing and a new one replacing it. The result? A much more pleasant user experience. Once more, computers are becoming more interactive and responsive.

The concept can be a bit difficult to grasp initially, so here’s a simple example from the RealmSurfer website to demonstrate the concept: Ajax example: search page. At first glance this looks like any other search page. Notice that advanced search link underneath the search box? When you click it, notice that you instantly get a whole lot more functionality inserted into the page — no page refresh. Click the link again and the process reverses itself.

This is just a very simple example of the benefits of building Ajax functionality into your site. To get a look at some really powerful applications, have a look at a few popular Ajax-enabled websites:

Google Calendars — a really great online calendar and event scheduler. Without Ajax, this would be one of the most irritating developments since email spam, however with its Ajax capabilities it’s well on it’s way to becoming an online Outlook killer. Kiko is another excellent site utilising virtually the same concept.

Flickr — one of the first sites to popularise the Ajax phenomenon, it’s still one of the best ways to share pictures with your friends and family online. Yahoo was quick to realise the potential, and purchased the company a while back.

Protopage — create your own customised, interactive home page. From the moment you land on the site, you can move objects around the page as if they are windows on your desktop, and interact with them just as easily.

There are plenty more Ajax-powered sites, and every day a whole lot more become available. What makes this technology so special? Here are a few good contributers:

* It uses relatively well established browser technology — no plugins are needed, and most browsers these days are fully capable of supporting Ajax-enhanced pages.

* For the most part pages are still recognisable by search engines, meaning that unlike technologies like Flash, search engines will still understand what your page is about.

* It’s economical. Instead of downloading a whole page when all you want to know is the weather, a well designed Ajax-based site will only download the information you need, leaving everything else perfectly intact.

* It’s fast and responsive. Because much of the programming code that makes an Ajax-based page so useful is downloaded onto your local computer, much of your functionality is very fast and responsive, the same as any locally installed program.

* It’s non-proprietary technology. Ajax is a combination of established web standards. You will never have to pay to use it, and neither will the people who program it for you.

A new era in internet-based computing has begun. Many have dubbed this new wave of powerful and responsive technologies Web 2.0 (fortunately not another acronym this time!). What does this mean for you as a business owner? The tools for turning your business website into a highly interactive, responsive and powerful application are now here. And your customers will love the fact that it’s more responsive than their local telco representive…

About the Author:
David Malan is an expert author and business owner. He owns and runs RealmSurfer Consulting, an internet marketing and web design, development and consulting business based in Perth, Western Australia.
Website: Web Design Perth

More information about Australian ugg boots.
Sheepskin ugg boots — care instructions.

Comments

What is the Ajax Enabled Google Tool-kit?

First things first, Asynchronous JavaScript and XML (AJAX) is not a technology. AJAX is a technique that has brought about a great change in the world of web development.

The AJAX technique comes in response to the increasing demand of interactive web applications. With AJAX, web page exchange small amount of data with the server behind the scene. This means that every time a new piece of data is entered by the user, or there is a request for a change, the entire page does not have to be reloaded. Usability is also greatly affected thanks to AJAX. After all, AJAX creates conditions that are conducive to a complex scenario that is both data-centric and user-centric. The difference between web pages and other applications has been thinned down with the help of AJAX.

As already mentioned, AJAX is not a technology and this technique fuses together various existing technologies such as XHTML (or HTML), CSS, the DOM, XMLHttpRequest (or alternatively IFrame), XML.

Here is how these individual technologies play a role in AJAX:

• XHTML (or HTML) and CSS are used for mark up and styling information.

• The DOM (Document Object Model) is employed for the actual interaction that happens with the information that is presented.

• The exchange of data asynchronously with the web server happens with the use of XMLHttpRequest. Although there are many cases where an IFrame object is used in its place.

• Even though even preformatted HTML would work, XML is the format often used for the transfer of data between the server and the client.

The advantages and disadvantages of using AJAX are in fact open for interpretation. Here are some of the reasons that are cited as advantages of using AJAX.

• The main reason for using AJAX is to enhance the user experience, and to make web pages behave more like standalone applications.

• AJAX enabled pages load faster because it generates HTML within the browser. The net result of the page loading in a staggered manner is the bandwidth consumption for a web page is considerably reduced.

• The third advantage is widely critiqued because of a common misconception about AJAX – that it is a mix n’ match of various techniques, not leaving room for any consistency. Yet with AJAX programmers tend to create a distinct separation between the methods and formats that are employed for the purpose of information delivery. In other words separation between the content that is to be delivered, the structure and style elements of the webpage, and the functionality of the webpage.

On the flip side are the disadvantages that people associate with the use of AJAX.

• Given that, with AJAX, the page does not register with the history engine of the browser, the user is often unable to use the ‘Back’ function of the browser. Additionally, AJAX also makes it difficult for users to ‘Bookmark’ a page at a certain stage of us. The solutions created to tackle these problems have not been adequate, and these issues remain unresolved for the most part.

• The possible delay between user request and server response, is an obvious drawback of AJAX. This lag, known as network latency is made worse by a phenomenon that has nothing to with the technologies involved. When a page is rendered in entirety the human eye naturally re-adjusts itself to identifying the changed elements of refreshed page. On the other hand, when smaller portions of the page are rendered individually the user may not see the change immediately and imagine latency when it in fact does not exist.

• Another possible problem is that search engines cannot execute the JavaScript that is a part of the AJAX functionality. It is important to note that this particular problem is not restricted to AJAX.

• Yet another issue with AJAX is compatibility. JavaScript, which AJAX depends on, may be implemented differently by different browsers.

At the face of it, the disadvantages seem to weigh over the advantages making AJAX seem a less viable option for developers. There is no doubt that AJAX is complex, and there are still not many developers who are acquainted with its language. Yet a change has been brought about with Google slotting AJAX in their applications.

Google’s move is a landmark event in the web development arena. Google applied compilers to help them carry out this mammoth task. Compilers give developers the chance to code/develop in a higher-level language, which it converts to a lower-level language which the computer understands. A Java to JavaScript compiler was created so that developers could work in the former and leave it to the compiler to convert the same into the latter. This technology was freely shared with the developer community and is known as the Google Web Toolkit (GWT).

The GWT development cycle is rather straightforward:

1. Use Java to design, develop, debug, and test. In this process you may or may not choose to employ GWT libraries that seem of use. You are free to use any of the Java tools that you feel comfortable with – Eclipse, IntelliJ, JProfiler, JUnit.

2. Use the GWT’s compiler that distills the application from Java to a set of JavaScript and HTML files which can work with any web sever.

3. Ensure compatibility of the application with the browsers you want to support.

GWT can be run in two modes – hosted mode and web mode.

Hosted mode: Most of the development time ordinarily would be spent in this mode because since your application is run as Java byte code within the Java Virtual Machine (JVM), you can have the benefit of employing the debugging facilities in Java.

Web mode: In this mode, the application is run as pure JavaScript and HTML

If AJAX is meant to ease the surfing experience of users, GWT is meant to ease the process of developing to the farthest possible limit. And GWT has made it easy for developers to use AJAX for creating applications. For instance, common errors that occur with JavaScript such as typos and type mismatches can be identified at the time of compilation. There is often a conflict between what is easy for developers to do, and what is beneficial for users. This conflict, needless to say must end in the favor of what is beneficial for users. And the net result of using GWT and making things more convenient for developers would of course a better web experience for users.

The main features of the Google Web Toolkit are:

• Even though, unlike traditional HTML web applications, GWT applications do not need to fetch new HTML pages as they execute, they do in fact need to get data from the server. Also referred to as a server call, this mechanism is better known as Remote Procedure Call (RPC) and enables interaction with the server across a network.

• The presence of dynamic and reusable UI (User Interface) frameworks. The key difference between UI frameworks in GWT in comparison to others is the way widgets (Java classes on the client-side that are used to build user interface) are rendered.

• Full-featured debugging in the hosted mode.

• Allows for the appropriate management of browser history.

• Automatic compatibility with different browsers is yet another attractive feature of GWT applications.

• Yet another feature of the GWT is that it helps you internationalize your applications and libraries.

• GWT allows you to unit test in a debugger and browser.

• With the help of the JavaScript Native Interface (JSNI) you can add handwritten JavaScript in the Java code.

• The most important feature of the GWT is the fact that it is completely open source code.

For the uninitiated, all this sounds too technical. But the very purpose of GWT is to extract developers from the web of technicalities and give them space to create something that speaks with their end-user. And the demand for interactive spaces online is only going to increase. The AJAX trend is catching up and thanks to GWT developers are able to slowly but surely get over their initial apprehensions about the difficulties that AJAX poses. The role of developers in the development lifecycle of a web application cannot be undermined, but with AJAX enabled GWT their role actually ceases to be just that of typing together back-end operations. Google Maps is an excellent example of the advantages of working with AJAX within the GWT framework. Google map is definitive example of something that is dynamic, attractive and completely user-friendly. Finding locations and using functionalities such as zoom in/out instantaneously is a tremendous advancement. Imagine, having to interminably wait for the page to reload when you click on a location or search for it in the search bar? The very purpose of having the map would be defeated, if it was going to take just as much time to look for a specific location online as it would on a printed map. There are some detractors who say

AJAX enabled GWT is the practical way forward. End-users hardly take this for granted, but the work that goes behind creating this ultimate user-experience pays off. And indeed, GWT has made ease of development possible without losing out on user-satisfaction. With techniques like AJAX, and systems like GWT the future of web development is one that holds a lot of promise for users and developers alike!

About the Author:
Munish Rathee working on divorce related sites, main sites related topics are new jersey family law attorney, Cleveland Divorce Attorney , Connecticut divorce attorneys , relationships after divorce.

Comments

Link Thumbnail image

Link Thumbnail shows users that are about to leave your site exactly where they’re going. When that curious mouse pointer hovers over a link pointing to somewhere outside of your site, the script displays a small image of the destination page. It’s a nice visual cue that serves a very real purpose: providing a clearer picture (no pun intended) of what’s ahead.
Launch Demo/site

Comments

Collapsing tables

Collapsible tables with DOM and CSS.When you click on the expand icon, all rows will be visible.
Launch Demo/site

Comments

Web 2.0 free buttons maker

Create a web 2.0 button in only 4 steps. Paint your button with preloaded web 2.0 icons or upload your personal icon and customize the font of the text inserted.Launch Demo/site

Comments

CSS Rounded Corners

This collection of techniques to create boxes with rounded corners using CSS. Some of these techniques use CSS and one or more background images, some use CSS, JavaScript and no images, and a couple use only CSS — no images or JavaScript required .

Rounded corners online generator - Generate HTML/CSS code and images for rounded corners.Launch Demo/site


Awesome Rounded Corners Generator .Launch Demo/site


Online Rounded Corners Generator .Launch Demo/site


Rounding Tab CornersLaunch Demo/site


Spanky Corners.Launch Demo/site


Round Corners with javascript.Launch Demo/site


Add Fluid Borders to Your Boxes with CSS Launch Demo/site


Rounded Corner CSS Boxes Launch Demo/site

Comments

Add reflection to the image

Reflection.js allows you to add reflections to images on your webpages. It uses unobtrusive javascript to keep your code clean.Launch Demo/site

Comments

AJAX Star Rating Bar

A rating bar script done with PHP and mySQL that allows users to rate things like can be done on Netflix or Amazon, all web 2.0-like with no page refresh. It is a major improvement on the previous version because it is now unobtrusive, meaning that if Javascript is off it will still work (although the page will refresh). You can also set the number of rating units you want to use (i.e. 4 stars, 5 stars, or 10 stars) on a rater to rater basis (see samples below or read the docs).Launch Demo/site

Comments

AJAX poller script

A poller script that uses Ajax to send vote to the server and receives vote results from the server. The results are displayed in some animated graphs.Launch Demo/site

Comments

DHTML Color Picker

Futuristic color picker for your websiteLaunch Demo/site

Comments

Relay - AJAX directory manager

Nice and small AJAX based online file and directory manager tool.

New features :

  • drag-n-drop files and folders
  • dynamic loading file structure
  • upload progress bar
  • thumbnail view, including pdf
  • reload data every x seconds.
  • multiple users & accounts
Launch Demo/site

Comments

Visitors Chart -pie & donut

Pie & Donut chart is very universal and fully configurable flash chart. Using it you can easily have good looking, animated pies or donuts on your web site.

New features :

  • control chart with JavaScript (reload data and settings, set and get data and separate params, register events);
  • export chart as an image;
  • can load custom overlays and plug-ins;
  • labels texts can be vertical without embedding fonts;
  • reload data every x seconds.
Launch Demo/site

Comments

Ajax Tabs Content script

Ajax Tabs Content script that lets you display content pulled from external files inside a DIV and organized via CSS tabs. A fully unobtrusive, CSS and HTML based script, it supports practical features such as persistence of the active tab (ie: when page is reloaded), an “IFRAME” mode, a “slideshow” mode, ability to expand/contract arbitrary DIVs on the page at the same time, nested tabs, and much more. Launch Demo/site

Comments

Page 3 of 3«123