1 Pertemuan 18 Programming Languages for E-Business/E-commerce Matakuliah : M0284/Teknologi & Infrastruktur E-Business Tahun : 2005 Versi : <<versi/revisi>>
Pertemuan 18 Programming Languages for E-Business/E-commerce
Jan 19, 2016
Pertemuan 18 Programming Languages for E-Business/E-commerce. Matakuliah: M0284/Teknologi & Infrastruktur E-Business Tahun: 2005 Versi: . Learning Objectives. Distinguish between the static and dynamic modes of a Web page - PowerPoint PPT Presentation
Welcome message from author
This document is posted to help you gain knowledge. Please leave a comment to let me know what you think about it! Share it to your friends and learn new things together.
Transcript
1
Pertemuan 18 Programming Languages
forE-Business/E-commerce
Matakuliah : M0284/Teknologi & Infrastruktur E-Business
Tahun : 2005
Versi : <<versi/revisi>>
2
Learning Objectives
• Distinguish between the static and dynamic modes of a Web page
• Define the current state of the practice in Web page composition
• Practice with the most common events of DHTML• Describe how the choice of image format affects
performance in the context of limited bandwidth• Have a brief overview of programming options• Understand the important trends coming in the near
future• Comprehend the standardization effort of various
associations
3
Chapter Overview
• Languages used on the WWW
• Similarities and dissimilarities
• Advantages and disadvantages
• Understanding the newer technologies in the offing
4
HTML editors
• Many editors available, range of attributes starting from simple Windows Notepad
5
Business should consider
• Use of standards
• Style sheets
• Dynamic HTML
• Support for the scripting language
6
Features of HTML editors
• Collaboration and site management• Database features (ODBC, email options)• Deployment features• Design features (JavaScript & VBScript support, easy
integration with CSS1 and CSS2, DHTML)• Visual wizard for forms, tables and frames • Support for image composition and mapping• Pixel-precise positioning• Drag and drop support• Preview• Syntax checking• Site navigation overview
7
HTML editing features
• Customizable templates• HTML validation and cross XML
compliance tool.• Search, replace, replace all features• Supports Java applets, ActiveX, CGI• Syntax coloring• In-built DHTML scripts or wizard• Import, view, play multi-media files (GIF,
JPEG, BMP, WAV and MIDI)
8
HTML editors
• MS FrontPage (integration with Microsoft IIS and Windows NT platform) from Microsoft
• HomeSite with WYSIWYN (what you see is what you need) from Macromedia/Allaire is very easy and intuitive
• 1rst Page 2000 from evrSoft (a freeware)• XMetaL 2.0 and HoTMetaL PRO 6.0 from SoftQuad• HotDog Professional from Sausage Software• PageMill, GoLive from Adobe. GoLive provides websites
with dynamic links.• Ultradev from Macromedia. Ultradev & Dreamweaver
and Fireworks. Ultradev has all the best features required to build a fine site.
• Barebones for Apple users.
9
Advanced HTML and DHTML
• Dynamic behavior of a web page can be created using many technologies, e.g. JavaScript, VBScript, Document Object Model (DOM), and Cascading Style Sheets (CSS).
• The display of the web page can be changed after the page loads.
• Use of CSS for a uniform look and feel of the whole website.
• Event-driven animation can be interactive and interesting.
10
Additional HTML tags
• Tags <div> and <span>
• Advisable to use <div> as a generic container.
• Box can be placed anywhere in the page
11
<!DOCTYPE HTML PUBLIC “-//W3C//DTD HTML 4.0 Transitional //EN”><HTML><STYLE type = “text/css”><!--#pic1{
POSITION: absolute;Z-INDEX: 1;LEFT: 30px;TOP: 30px;Visibility: visible}
-- ></STYLE><BODY><div id= pic1><img src= “http://mis.mgmt.umb.edu/euni.gif” width= 100height=50 alt= “ ” border = “0”></div></BODY></HTML>
12
DHTML contd.
• Both absolute positioning and relative positioning are possible.
• With DHTML, less data has to be downloaded, as there are no large bitmap files.
13
Elements that DHTML can control
• Ability to hide and unhide portions of pages.
• Display attributes of style sheets (text, background, form field, images, frames, tables and paragraphs).
• Animation effects, make them more interactive and engaging
• Scroll bars, ticker objects
14
Events
• OnBlur
• OnFocus
• OnLoad
• OnAbort
• OnChange
• OnClick
• OnError
• OnKeyDown
15
Portable Document Format (PDF)
• PDF writer and distiller• On any computer platform
– (DOS, Mac, Unix, Windows)• Preserves the format and looks• Can’t be modified, tampered with if protected• PDF Reader available free of cost to any user. • FrameMaker and Illustrator are able to write
PDF format.• Corel with WordPerfect can export to the original
PDF format but cannot modify existing documents.
• Can be setup as an add-in to MS Word
16
Cascading Style Sheets (CSS)
• More powerful
• More flexible
• Useful for designing consistent looking web pages, like templates
• Designers will create style sheets and apply them to any web page.
• Developers can define their own classes, and new HTML elements.
17
CSS Fundamentals
• Style sheets have a defined order of precedence
• CSS1 – by W3C, a set of style sheets or statements that may determine how a given element is presented in a web page format, using Netscape and I.E. browsers.
18
Advantages of CSS
• Separation of style and layout of HTML files from their informational content.
• Provides relative measurement for any size of monitor screen or resolution.
• Avoid breaking existing pages because older browsers simply ignore style sheets.
• Allow readers to influence the presentation of HTML documents.
• Enable companies to implement a house look and feel on their site, promote branding.
• Improve the printing of web documents instead of having unpredictable HTML transfer to paper.
• Enable access to the web for people with disabilities (larger fonts, variation of colors)
19
CSS2
• A newer standard proposed by W3C and agreed upon by the industry for richer and more accessible web pages.
• See latest news:– http://www.w3.org/Style/CSS/#news
• New features – sidebars, navigation scrollbars
• Images can be layered
• Control over table layout
20
Useful features of CSS
• Both absolute and relative measurements can be applied
• Color control
• Fonts and texts can be formatted
• Position, alignment properties
• Spacing and areas (which includes borders, margins, padding, width, height, float property and clear property).
21
Example of a simple style
<html><head><title>Style sheet</title><style type = “text/css”><!--
body {background: #FFFFFF}A:link {color: #80FF00}A:visited {color: #FF00FF}H1 {font-size: 24pt; font-family: arial; color:blue}H2 {font-size: 18pt; font-family: braggadocio}H3 {font-size: 14pt; font-family: Desdemona}
-- ></style></head><h1>this is heading 1 </h1><h2>heading 2</h2><h3>heading3</h3></body></html>
22
Tools supporting DHTML and style sheets
• GoLive
• Dreamweaver and Ultradev
• Netobjects Fusion
23
Some Sharewares for creating style sheets
• TopStyle
• CoffeeCup StyleSheet Maker + +
• Prime Style
• Style Master
Related Documents
