1 / 23

Pertemuan 18 Programming Languages for E-Business/E-commerce

Pertemuan 18 Programming Languages for E-Business/E-commerce. Matakuliah : M0284/Teknologi & Infrastruktur E-Business Tahun : 2005 Versi : <<versi/revisi>>. Learning Objectives. Distinguish between the static and dynamic modes of a Web page

adah
Download Presentation

Pertemuan 18 Programming Languages for E-Business/E-commerce

An Image/Link below is provided (as is) to download presentation Download Policy: Content on the Website is provided to you AS IS for your information and personal use and may not be sold / licensed / shared on other websites without getting consent from its author. Content is provided to you AS IS for your information and personal use only. Download presentation by click this link. While downloading, if for some reason you are not able to download a presentation, the publisher may have deleted the file from their server. During download, if you can't get a presentation, the file might be deleted by the publisher.

E N D

Presentation 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= 100 height=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

More Related