Unit 1

Introduction to Web Design

Topics

Website Web Application Web Design Web Development W3C Web 2.0 Web Design Strategies Audio Stream Video Stream

Website

Website is a collection of related web pages containing images, videos or other digital assets. A website is hosted on at least one web server, accessible via a network such as the Internet or a private local area network through an Internet address known as a Uniform Resource Locator. All publicly accessible websites collectively constitute the World Wide Web. Website can be also referred to as Front Office or Showroom software because visitors come in to browse and sometimes make a purchase . Organized by function, a website may be a personal website a commercial website a government website a nonprofit organization website

Types of website

There are 2 types of websites:1. 2.

Static website Dynamic Website

Static Website:A static website is one that has web pages stored on the server in the format that is sent to a client web browser. It is primarily coded in Hypertext Markup Language (HTML). This type of website usually displays the same information to all visitors. A static website will generally provide consistent, standard information for an extended period of time. Website owner may make updates periodically, it is a manual process to edit the text, photos and other content and may require basic website design skills and software.

Types of website
Dynamic website:

A dynamic website is one that changes or customizes itself frequently and automatically, based on certain criteria. A dynamic website can operate more effectively, be built more efficiently and is easier to maintain, update and expand. Dynamic websites can have two types of dynamic activity: Dynamic Code :

The code is constructed dynamically using active programming language instead of plain, static HTML. A dynamic web page is generated on the fly by piecing together certain blocks of code, procedures or routines. In this dynamic content are displayed with the plain view. Variable content is displayed dynamically based on certain criteria, usually by retrieving content stored in a database.

Dynamic Content :

Web Application

A web application is an application that is accessed over a network such as the Internet or an intranet. A computer software application that is hosted in a browser-controlled environment or coded in a browser-supported language and reliant on a common web browser to render the application executable. The web application can be also referred as the Back Office software because it is there to provide support services for the front office, such as processing customer orders and maintaining, issuing and replenishing inventory. The front office is open to anyone, access to the back office is restricted to authorized personnel only. Front office software is web only, the back office software can be either desktop or web, or a mixture of the two.

Relationship between Website and Web Application

It is possible that a website exists without web application as well as its vice versa is true.

Comparison between Website and Web Application

Website Will usually be available on the internet, but may be restricted to an organization's intranet. Web Application Will usually be restricted to the intranet owned by a particular organization, but may be available on the internet for employees who travel beyond the reach of that intranet. May have exactly the same functionality as a desktop application. It may in fact be a desktop application with a web interface. Can be accessed by authorized users only. Any authorized user may submit updates, subject to his/her authorization level, and these updates would immediately be available to all other users.

Can never be implemented as a desktop application. Can be accessed by anybody. May be updatable by a single person with everyone else having read-only access.

May have parts of the system which can only No part of the system can be accessed be accessed after passing through a login without passing through a login screen screen.

Comparison between Website and Web Application

Website Web Application Users may be able to self-register in order to Users can only be registered by a system pass through the login screen. administrator. All users may have access to all pages in the The application may cover several aspects of web site, meaning that there may be no need an organization's business, such as sales, purchasing, inventory and shipping, in which for any sort of access control. case users will usually be restricted to their own particular area. This will require some sort of access control system, such as a Role Based Access Control (RBAC) system. Execution speed may need to be tuned so that the site can handle a high number of visitors/users. As the number of users is limited to those who are authorized then execution speed should not be an issue. In this case the speed, and therefore cost, of application development is more important. In other words the focus should be on developer cycles, not CPU cycles.

Web Design

Web design is used as a general term to describe any of the various tasks involved in creating a web page. It refers to jobs focused on building the front-end of a web page. The web consists of myriad pages, presenting information using different technologies and linked together with hyperlinks. For designing a good website you should keep in mind the following factors: Borders and rules Texture Colors,etc. There are two basic aspects to any web page found on the Internet 1. a presentation that the user interacts with 2. back-end that includes information.

Principles of good web designing

1. 2. 3. 4. 5. 6. 7. 8. 9. 10. 11. 12.

Keep your audience in mind. Purpose for the site Location of the site Types of content Information provided on the "home" page Content Level of Web technology to best suit the purpose Style to best suit the purpose Page design - consistency, clarity, user friendliness Resolution: Background & Text Color Avoid use of frames.

Web Development

Web development is a broad term for the work involved in developing a web site for the Internet (World Wide Web) or an intranet (a private network). This can include web design, web content development, client-side/server-side scripting, web server and network security configuration, and e-commerce development. Web development usually refers to the main non-design aspects of building web sites: writing markup and coding. Web Development can be split into many areas and a typical and basic web development hierarchy might consist of: 1. Client Side Coding 2. Server Side Coding 3. Client + Server Side Coding 4. Database Technology.

Typical and Basic Web Development Areas

Client Side Coding:

Ajax, JavaScript, Microsoft SilverLight, Flash, Flex,HTML 5, CSS 3. Java EE,PHP, Python, Ruby, ASP,IBM WebSphere. Google Web Toolkit. DB2, MS SQL Server, Postgre SQL, SQLite, Sybase.

Server Side Coding:

Client + Server Side Coding :

Database Technology :

W3C

W3C Stands for the World Wide Web Consortium W3C was created in October 1994 W3C was created by Tim Berners-Lee (Inventor of the Web) W3C is organized as a Member Organization W3C is working to Standardize the Web W3C creates and maintains WWW Standards W3C Standards are called W3C Recommendations W3C is working to make the Web accessible to all users (despite differences in culture, education, ability, resources, and physical limitations) W3C is hosted by three universities:

Massachusetts Institute of Technology (MIT) in the U.S. The French National Research Institute in Europe Keio University in Japan

W3C

W3C validates the files in the following 3 ways:1. 2. 3.

Validate by URI Validate by File Upload Validate by Direct Input HTML files CSS files XHTML files XML files WML files

W3C validates following types of files:

W3C Specification Approval Steps

When W3C is publishing a new Web standard, the specification has worked its way from an idea through a lot of refining processes including the following: W3C receives a Submission W3C publishes a Note W3C creates a Working Group W3C publishes a Working Draft W3C publishes a Candidate Recommendation W3C publishes a Proposed Recommendation W3C publishes a Recommendation

Web 2.0

Web 2.0 is the latest trends in the usage of World Wide Web technology and launched in internet market in 2004 . Web 2.0 is associated with web applications that facilitates participatory information sharing, interoperatibility, user-centered design and collaboration on the World Wide Web ( WWW). Aim of web 2.0 is to enhance creativity and functionality of web design and web development. Web 2.0 site allows users to interact and collaborate with each other in a social media dialogue as creators of user-generated content in a virtual community, in contrast to websites where users are limited to the passive viewing of content that was created for them. Web 2.0 leads many important concepts such as communications.

Web 2.0

Web 2.0 makes searching and access of your web design, development and content very flexible and user friendly. Web 2.0 is not only web platform but it helps a lot to make user friendly. Examples of Web 2.0 include social networking sites, blogs, wikis, video sharing sites, hosted services, web applications, mashups,Secure information sharing and evolution of web development and designing communities. Web 2.0 websites allow users to do more than just retrieve information. By increasing what was already possible in "Web 1.0", they provide the user with more user-interface, software and storage facilities, all through their browser. This has been called "Network as platform" computing.

Web Design Strategies

A good Web strategy works with your business strategy to create a website that meets your business goals. Once you've started building a Web presence, you need to think about how your website can improve your business. Strategy includes community, personalization, your content, ecommerce, even your intranets.

Audio Streaming

Streaming audio is audio (speech, music,etc.) that plays back as it is downloaded. when you click on the link to hear the song, the song starts playing right away - or at least before the entire song has been sent to your computer. Streaming playback was invented to solve a problem: downloading an entire song or album takes time, and users get tired of waiting. Problems with Audio Streaming: For streaming audio you must have faster internet connection because to play a sound file you need to have certain number of bytes per second. In case if your internet connection is faster but the server is overwhelmed then in that case when server has to response many users then too you may not be able to play the audio stream properly. Bottleneck problem arises.

Video Streaming

Streaming video is content sent in compressed form over the Internet and displayed by the viewer in real time. With streaming video or streaming media, a Web user does not have to wait to download a file to play it. Instead ,the media is sent in a continuous stream of data and is played as it arrives. The user needs a player, which is a special program that uncompresses and sends video data to the display and audio data to speakers. Major streaming video and streaming media technologies include RealSystem G2 from RealNetwork, Microsoft Windows Media Technologies.