Introduction to Web Session 01 Subject: L0182 / Web & Animation Design Year: 2009.

Slides:



Advertisements
Similar presentations
Chapter 11 Designing the User Interface
Advertisements

WEB DESIGN TABLES, PAGE LAYOUT AND FORMS. Page Layout Page Layout is an important part of web design Why do you think your page layout is important?
MMDE5011 – INTERACTIVE MEDIA PRACTICE 1 WEEK 1: INTRODUCTION TO HTML5
LIS 677 Interface Critique LIS 677 Presented by Blanca Polo.
What is a User Interface?  Everything in a device with which a human being interacts.  The total “user experience”  Not necessarily tied to computers.
Project 1 Introduction to HTML.
INTRODUCTION 1: Hypertext, Hypermedia and Multimedia J394-PERANCANGAN SITUS WEB Program Studi Manajemen Universitas Bina Nusantara.
Dialog Styles. The Five Primary Styles of Interaction 4 Menu selection 4 Form fill-in 4 Command language 4 Natural language 4 Direct manipulation.
Dialog Styles. The Six Primary Styles of Interaction n Q & A n Menu selection n Form fill-in n Command language n Natural language n Direct manipulation.
CIS101 Introduction to Computing Week 05. Agenda Your questions Exam next week - Excel Introduction to the Internet & HTML Online HTML Resources Using.
Project Pertemuan 13 Matakuliah: L0182 / Web & Animation Design Tahun: 2008.
CIS101 Introduction to Computing Week 05. Agenda Your questions CIS101 Survey Introduction to the Internet & HTML Online HTML Resources Using the HTML.
Top 10 Website design mistakes Joseph Mitchum. Website Design Mistakes #10 Inadequate Photo Enlargement Lack of details of products for sale #10 Inadequate.
Introduction to HTML 2006 CIS101. What is the Internet? Global network of computers that are connected and communicate via a series of Protocols Protocols.
Introduction to HTML 2006 INT197B. What is the Internet? Global network of computers that are connected and communicate via a series of Protocols Protocols.
Introduction to Web & HTML Pertemuan 08 Matakuliah: L0182 / Web & Animation Design Tahun: 2008.
Introduction to HTML 2004 CIS101. What is the Internet? Global network of computers that are connected and communicate via a series of Protocols Protocols.
T.Sharon-A.Frank 1 Multimedia Hypertext and Hypermedia.
Introduction 2: Internet, Intranet, and Extranet J394 – Perancangan Situs Web Program Sudi Manajemen Universitas Bina Nusantara.
1st Project Introduction to HTML.
Chapter 13: Designing the User Interface
CIS101 Introduction to Computing Week 06. Agenda Your questions Excel Exam during second hour Our status after the snow day Introduction to the Internet.
HTML 1 Introduction to HTML. 2 Objectives Describe the Internet and its associated key terms Describe the World Wide Web and its associated key terms.
Chapter ONE Introduction to HTML.
Web Design Basic Concepts.
Website Content, Forms and Dynamic Web Pages. Electronic Portfolios Portfolio: – A collection of work that clearly illustrates effort, progress, knowledge,
Systems Analysis and Design in a Changing World, 6th Edition
What is Web Design?  Web design is the creation of a Web page using hypertext or hypermedia to be viewed on the World Wide Web.
CHAPTER 2 Communications, Networks, the Internet, and the World Wide Web.
What Is the Internet? The Internet is a worldwide collection of computer networks that links together millions of computers used by businesses, the government,
Website Development. Internet Internet (Net) – Global network connecting millions of computers. Network – Group of computers and associated devices that.
Copyright © Allyn & Bacon 2008 POWER PRACTICE Chapter 8 Using the Web for Teaching and Learning START This multimedia product and its contents are protected.
Tutorial 1: Getting Started with Adobe Dreamweaver CS4.
WEB TERMINOLOGIES. Page or web page: a file that can be read over the world wide web Pages or web pages: the global collection of documents associated.
What is the Internet? Internet: The Internet, in simplest terms, is the large group of millions of computers around the world that are all connected to.
The Internet. An interconnected network of computers globally Computers are able to communicate and share information with one another from remote locations.
What is Multimedia?. Today’s objectives Define multimedia Work with XHTML Work with CSS.
Web Designing By Bhupendra Ratha, Lecturer School of Library & Information Science D.A.V.V., Indore.
HTML, XHTML, and CSS Sixth Edition Chapter 1 Introduction to HTML, XHTML, and CSS.
Types of Usability Testing or Usability Inspection Chapter 10.3.
IT Introduction to Information Technology CHAPTER 01.
Chapter 8 Introduction to HTML and Applets Fundamentals of Java.
Objective Understand concepts used to web-based digital media. Course Weight : 5%
Web software. Two types of web software Browser software – used to search for and view websites. Web development software – used to create webpages/websites.
INFORMATION X INFO425: Systems Design Chapter 14 Designing the user interface.
Multimedia ITGS. Multimedia Multimedia: Documents that contain information in more than one form: Text Sound Images Video Hypertext: A document or set.
14 Chapter 11: Designing the User Interface. 14 Systems Analysis and Design in a Changing World, 3rd Edition 2 Identifying and Classifying Inputs and.
HYPERTEXT and HYPERMEDIA By Steven Geist and Larnic Ransom.
Web Design. What is the Internet? A worldwide collection of computer networks that links millions of computers by – Businesses (.com.net) – the government.
Chapter 22 - Browsing The World Wide Web Introduction Description Of Functionality –Obtain textual information, recorded sounds, or graphical images from.
HTML Concepts and Techniques Fifth Edition Chapter 1 Introduction to HTML.
Computer-based Media Language Elements Understanding how we communicate through media Stewart.C. (2007). Media: New Ways and Means. John Wiley & Sons:
Website Design, Development and Maintenance ONLY TAKE DOWN NOTES ON INDICATED SLIDES.
Chapter 1 Introduction to HTML, XHTML, and CSS HTML5 & CSS 7 th Edition.
Microsoft Office 2008 for Mac – Illustrated Unit D: Getting Started with Safari.
The Internet Salihu Ibrahim Dasuki (PhD) CSC102 INTRODUCTION TO COMPUTER SCIENCE.
Web Design Vocabulary #3. HTML Hypertext Markup Language - The coding scheme used to format text for use on the World Wide Web.
Glencoe Introduction to Multimedia Chapter 2 Multimedia Online 1 Internet A huge network that connects computers all over the world. Show Definition.
HTML PROJECT #1 Project 1 Introduction to HTML. HTML Project 1: Introduction to HTML 2 Project Objectives 1.Describe the Internet and its associated key.
Principles Determine users' skill levels Novice or first-time users - Knowledgeable intermittent users - create templates Expert frequent users-
Chapter 10 Multimedia and the Web.
Project 1 Introduction to HTML.
Chapter 1 Introduction to HTML.
Warm Handshake with Websites, Servers and Web Servers:
E-commerce | WWW World Wide Web - Concepts
Project 1 Introduction to HTML.
E-commerce | WWW World Wide Web - Concepts
Web software.
Creating a Successful Web Presence
Introduction to computers
Presentation transcript:

Introduction to Web Session 01 Subject: L0182 / Web & Animation Design Year: 2009

Bina Nusantara Learning Outcomes At the end of this session, the students will be able to : Understand the basic of a good web design

Bina Nusantara Course Outlines Hypertext and Hypermedia User Interface Good Interaction Design World Wide Web Home Page Website Top Ten Mistakes in Web Design Advantages of Using Web

Bina Nusantara Introduction Hypertext was first introduced by Vannevar Bush, on July 1945, in his paper which titled “As We May Think”. Bush said that: –There would be information rush –Necessity to build a tool that would allow easily cross reference inside and inter documents –The proposed information exploration tool was named Memex.

Bina Nusantara Hypertext and Hypermedia Hypertext is: –A series of text chunks connected by links which offer the reader different pathways. Hypermedia is: –Derived from hypertext, extends the notion of hypertext link to include links among any set of multimedia objects, including sound, motion video, and virtual reality.

Bina Nusantara Hypertext and Hypermedia Hypertext extends traditional linear text with: –Chance to jump to any connected articles –Easy to backtracking –index and table of content that can be click –String searching –Bookmarks (favorites) –The other navigation tools

Bina Nusantara Hypertext The first step to build an effective hypertext is to choose a project in which includes The Golden Rules of Hypertext : –There is a large body of information organized into numerous fragments –The fragments relate to each other –The user needs only a small fraction at any time

Bina Nusantara User Interface User Interface is a linkage between a human and a device or system that allows the human to interact with that device or system. The user interface provides means of : –Input, allowing the users to manipulate a system –Output, allowing the system to produce the effects of the users' manipulation. Currently, the following types of user interface are the most common : –Graphical User Interface (GUI) accept input via devices such as computer keyboard and mouse and provide articulated graphical output on the computer monitor. –Web User Interface (WUI) accept input and provide output by generating web pages which are transmitted via the Internet and viewed by the user using a web browser program.

Bina Nusantara Good Interaction Design To improve the usability of an application it is important to have a well designed interface. Ben Shneiderman's "Eight Golden Rules of Interface Design" : –Strive for consistency –Enable frequent users to use shortcuts –Offer informative feedback –Design dialog to yield closure –Offer simple error handling –Permit easy reversal of actions –Support internal locus of control –Reduce short-term memory load

Bina Nusantara Good Interaction Design According to Patrick Lynch, 1995 –Balancing the structure and the connection between menu or home page and the content of the page or between graphic and the linked document. –The purpose is to build a natural and well structured menu hierarchy and pages for users, and not to divert the usage of the web site.

Bina Nusantara World Wide Web World Wide Web (commonly shortened to the Web) is a system of interlinked hypertext documents accessed via the Internet. With a Web browser, a user views Web pages that may contain text, images, videos, and other multimedia and navigates between them using hyperlinks.

Bina Nusantara Home Page Home Page is the main page of a Website. Typically, the home page serves as an index or table of contents to other documents stored at the site.

Bina Nusantara Website Website is a site (location) on the World Wide Web. Each Website contains a home page, which is the first document users see when they enter the site. The site might also contain additional documents and files. Each site is owned and managed by an individual, company or organization.

Bina Nusantara Top Ten Mistakes in Web Design Jakob Nielsen's Top Ten Mistakes in Web Design (2005) : –Legibility Problems –Non-Standard Links –Flash –Content that is not Written for the Web –Bad Search –Browser Incompatibility –Cumbersome Forms –No Contact Information or Other Company Info –Frozen Layouts with Fixed Page Widths –Inadequate Photo Enlargement

Bina Nusantara Advantages of Using Web Global audience Operates 24 hours, 7 days a week Relatively inexpensive Product advertising Distribute product catalogs Online surveys Announcements Online discussion forums Obtain customer feedback Immediate distribution of information Multimedia Formatting capabilities

Bina Nusantara