WILSOL LLC



Great Links . . .
Constant Contact(R)
Trusted Email Marketing & Online Surveys
Speakeasy Speed Test
INTERNET TECHNOLOGIES

This page is here to outline the different kinds of technologies available to you on the web, what they do, and how you might best make use of them.

HTML/XHTML
Over the years Web Technologies have continued to develop so that now, virtually any type of audio-visual media can be 'carried' via the Internet.

Most of these technologies however, have effectively been 'bolted-on' to the original web page construction language; Hyper Text Markup Language (HTML). You'll notice most web addresses begin with 'http://' which means 'Hyper Text Transfer Protocol', and end with .HTM or .HTML. (In case you're wondering, the 'HTM' extension is for backward-compatibility with older 'Windows' DOS computers, which had a limit of only 3 letters).

It should be noted that even addresses that end with other extensions (PHP, etc) are still essentially 'serving' HTML pages, only via a database.

HTML is still what is used for 80% of today's websites, and in isolation can be used to produce static web pages. This allows for text and images to be arranged on a page, with 'hyperlinks' linking to other pages within the website. Hyperlinks also allow you to link to other websites elsewhere on the web. Though it may not sound like very much, a skilled designer can do a lot with these basic building blocks, and in many cases a static HTML website will be all that you need to create a professional looking brochure style web presence.

HTML is what your web 'Browser' is designed to interpret, regardless of whom makes the Browser or what computer the Browser is being used on. Unlike other web technologies, HTML is the standard and guarantees your website can be seen by anyone accessing the web.

XHTML is just a 'stricter' version of HTML that adheres to SGML 'well-formed', making it compatible with XML and other Mark-Up languages. The use of the XHTML stricter syntax is recommended for all new websites.

Beyond HTML - An Overview
So HTML will be enough for many, but there are many other technologies that can be 'embedded' into HTML and used to enhance your website in a whole variety of ways.

It should be noted that all web technologies, apart from HTML, have some limitations in terms of their scope and compatibility. What is meant by this is that these technologies will only work under a certain set of circumstances. For example, Java script scripting can be disabled by the user on his or her Browser. Very few people do this but they do have that option. Another example; Flash 'Movies' are used on many websites these days, but Flash requires a small piece of software to be 'plugged-in' to a browser before Flash Movies can be viewed. Again, nearly everyone has and uses this plug-in, but a few may not.

Another important consideration relates to your hosting costs, and what are termed 'Server-Side' technologies. A basic hosting package is designed to 'serve' basic HTML pages. If you wish your host to 'enable' certain other 'Server-Side' technologies, such as .Net, JSP, CF, PHP, etc, then you may have to pay for these as extras to your basic hosting package.

(Note: Flash and JavaScript are 'Client-Side' technologies, and are not affected by your hosting package.)

For more on 'Server-Side' and 'Client-Side, go to: Web Terminology

Having written all this, most of the web technologies mentioned so far, and those to be listed below, are widespread and in common use. Most modern, major Browsers can deal quite happily with them all. You should however, do a little research to find the technology that most closely matches your needs.

The list below gives only a basic outline of some of the web technologies available. For a more detailed view go to: Resources for links to specialist websites covering each technology. Or search via the web.

Javascript, Ajax
JavaScript - is a basic scripting language (programming), specifically created to work with web pages. Although capable of creating quite complex programming procedures, JavaScript tends to be used to make small but important enhancements to a website. These enhancements are most often centered around usability; the idea of developing a website that is more intuitive and user-friendly.

JavaScript works well with CSS, enabling tricks and enhancements that would be impossible to achieve with HTML alone (See CSS Below).

Ajax - isn't a web technology in itself. Ajax (Asynchronous JavaScript and XML) is the name given to a a group of existing technologies that can be used to exchange web based data in a particular way. The main advantage of using Ajax techniques is that data can be updated without the need for the Web Browser to request a whole new webpage. Only part of a page is updated giving it functionality more akin to 'desktop' applications.

CSS
CSS - stands for Cascading Style Sheets. CSS is a standard extension to HTML (Version 4) designed primarily to help designers, by allowing greater flexibility in web page layouts and formatting.

Another important feature is in the ability CSS allows, by separating form from content and meaning. In relation to the 'Semantic Web', CSS can help as a method for 'serving' the same data in different formats to different media - a computer screen or a hand-held device for example.

When combined with JavaScript, CSS gives you further options. For example, the ability to hide text or images that are only revealed when a visitor requests to see them. You could use this in a diagram perhaps, where the diagram includes 'hot spots' that reveal an explanation of the parts when a user places their cursor over them.

Flash, Video & Audio Streaming, etc
Flash is the 'de facto' multi-media technology for the web. It is capable of 'streaming' almost any media including animation, illustration, audio, music, images, video, etc. The plug-in required to view Flash 'Documents' is already on 95% of peoples web enabled systems, so compatibility is not really an issue. However, for important information you should still provide an alternative.

Flash is ideal for interactive projects. In this respect it has huge potential for educational (e-learning) work, computer games, video and audio jukeboxes, etc.

A Flash project can range from a simple short animation to a full blown web 'application' that links and interacts with other web technologies. Design and development times will therefore vary tremendously, as will the costs involved.

Flash is a true, extremely flexible, multi-media tool, but there are other more specialized technologies. Quicktime and RealVideo, for example, are technologies especially designed to stream video across the web. There are others also for music, e-learning, etc.

Database, Middleware Powered Websites
The last major area covered here relates to websites that are built around database technologies. Just like 'desktop' database applications, this technology enables websites to collect information, store information and recall information.

Web based systems are usually two-tiered (ignoring the Web Server layer). First is the actual database which holds and structures all your data. Common web based databases include; MySQL, PostgreSQL, and Oracle. Second, is the 'middleware' or 'application layer' technology used to build the interface that allows interaction and control between the website administrator, the database and website visitors. Middleware technologies include; PHP (Hyper Processor PHP), .Net, Java Server Pages (JSP) and Cold Fusion (CFML).

Most of these database and middleware technologies are interchangeable, for example PHP will work both with MySQL or PostgreSQL. You should however double check your hosting options for any incompatibility issues that may exist.

Websites built on these kinds of 'technology stacks' are becoming more and more common, having more and more applications. Terms like 'Web 2.0', 'Web Applications' and 'Social Networking Websites' all relate to the utilization of these technologies to create more sophisticated websites and better web based services. Facebook®, YouTube®, Amazon and Twitter are just some of the better known examples. But even small, fairly simple websites can benefit massively from these developments, especially as implementation has become far easier and costs have fallen (See CMS below).

Content Management System (CMS)
A Content Management System is a special category of a Database/Middleware application, designed primarily to allow a 'standard' website to be easily updated and maintained.

The application model is similar to a desktop application in that it offers a simple interface for making edits and updates to a website. A website's editor for example, is able to 'login' to their CMS application via the Web, make editorial changes and have them instantly update on the public website. Having a CMS included as part of their website's development, has become a standard requirement for many people, as it makes it easier for maintenance tasks to be done in-house and gives them greater overall control.

Other advantages of a CMS, is that they make it easier to include interactive functionality on your website. This interactivity could include feedback forms and surveys, event calendars, blogs and forums, member's protected content, etc.


Web Site Design...
Needs analysis
To start, a brief discovery phase identifies the website's marketing goals, technical requirements, branding strategy and measurements of success. Careful attention is paid to market competitors, customer feedback (when available), and input from client team members.

WILSOL design then works with the client to identify a delivery date and implementation timeline, after which an extranet site for the project is established to make project deliverables available to the client.
Architecture
Existing and proposed content, functional/navigational elements, and inter-site promotions are all factored into the site's information architecture. Ideally, the sitemap maintains a balance between breadth and depth, requiring as few clicks as possible to any given piece of content, while not overwhelming the user with too many choices at once.

Content that may be featured on the site's home page is identified, as is lead-generating "premium content" and any related forms.
Design
Once an information architecture has been finalized, the site's page layout, look and feel, and branding are designed through a series of Photoshop screen mockups. Typically, three or four mockups are produced for a given design, including the site's home page and two or three prominent content pages.

Feedback is solicited from the client, after which one or more rounds of iteration are made to the design. Depending on the project's scope and timetable, multiple design directions may be produced.
Production
With a final design in hand, cascading style sheets are written to define text formatting, screen layout, and navigation elements. Content pages are authored in HTML/PHP, and images are optimized for efficient download times.

Throughout production, SEO best practices are followed to ensure the site's code is optimized for search engines. WILSOL design will work with the client to identify opportunities within the site where search keywords can be applied and optimized.
QA & launch
The website is tested and debugged on the latest general-release version of Internet Explorer, Firefox, Chrome and Safari, along with any additional browsers and versions identified by the client during the needs analysis phase.

Once all revisions, additions, and testing are completed, the site is uploaded to the client's production server for public deployment. WILSOL design will then work with the client to ensure a clean site launch, identifying and correcting any issues that may arise.
Options such as an interactive database & much more...
Needs analysis
Discussions are held with the client's project managers to identify the goals, technical requirements, and measurements of success for the application's user interface. A usage model is mapped out, existing user feedback (when available) is reviewed, and navigation alternatives are considered.

WILSOL design then works with the client to identify a delivery date and implementation timeline, after which an extranet site for the project is established, though which project deliverables available to the client.
Specification
The application's features and functionality are mapped to an information architecture, defining the navigation pathways throughout the user interface. Ideally, the architecture strikes a balance between breadth and depth, minimizing clicks to commonly-used features, without bombarding the user with too many options at once.

Where possible, redundant means of accessing commonly used features are built into the information archicture, accounting for differences in usage patterns among users.
Design
Once an information architecture is finalized, the application's screen layout, look and feel, and navigation are designed through a series of Photoshop screen mockups. Typically, 3-4 mockups are initially produced, focusing on unique screen types or high-value functionality.

Feedback is solicited from the project team, after which one or more rounds of iteration are made to the design. Depending on the project's scope and timetable, additional screens may be mocked up prior to prototyping.
Prototyping
With a final design in hand, a clickable model of the application's user interface is prototyped. CSS is written to define text formatting, screen layout, and navigation elements such as menus and dialogs. Key screens are authored in HTML/PHP, while custom icons are designed for inclusion in the user interface. If desired, end-user testing is conducted to validate navigation and usability.

Depending on the scope of the web application, all or some of its features and functionality may be prototyped, at the discretion of the client.
Integration
The application prototype is tested and debugged on the latest general-release version of Internet Explorer, Firefox, Chrome and Safari, along with any additional browser versions identified by the client during the needs analysis phase.

As application modules and discreet UI components are finalized, prototype code is delivered to the client's production engineers for integration. WILSOL design will then work with the client to ensure the UI is grafted onto the application framework, identifying and correcting any issues that may arise.





























































Sign up for PayPal and start accepting credit card payments instantly.