Html Presentation
- 2. HyperText Markup Language (HTML) ■ HTML is used to create web documents including text, images, formatting, and hyperlinks to other documents. ■ HTML documents consists of text and ‘markup’ tags which are used to define the structure, appearance, and function of the information. ■ There are two types of markup tags: • Container tags – Define a section of text using a start tag and an end tag. For example, text placed inside of these tags would appear in bold: <B>Hello</B> • Empty tags – represent a single occurrence of an instruction. For example, the <BR> or break tag is used to indicate that you want to include a single space following the text.
- 3. Text Authoring Tools ■ Any text editor can be used to create HTML documents. ■ The most commonly used text editors are: • Notepad (Windows) • WordPad (Windows) • Simpletext (Macintosh)
- 4. WYSIWYG Authoring Tools ■ What You See is What You Get (WYSIWYG) authoring tools provide graphical user interfaces to simplify the creation of HTML documents. ■ Examples of WYSIWYG authoring tools are: • FrontPage by Microsoft • Dreamweaver by Macromedia • PageMill by Adobe • Netscape Composer
- 5. Structure of an HTML Document ■ An HTML document is divided into two main sections: • Heading - The HEADing contains information describing the document, such as its title. The heading section is indicated by the <HEAD> and </HEAD> tags. • Body - The BODY section is where the Web document text, graphics, and other elements are placed. The body section is indicated by the <BODY> and </BODY> tags.
- 6. Example of an HTML Document <HTML> <HEAD> <TITLE>Career and Technical Education Home Page</TITLE> </HEAD> <BODY>This is the part of the Web page that viewers would see!</BODY> </HTML>
- 7. Graphic Files ● HTML supports two main graphic file formats: ● GIF - Graphics Interchange Format (CompuServe, pronounced GIF/JIF) —GIF files provide a maximum of 8-bit (256 colors), use indexed color, can be interlaced (image displayed in four passes), and support transparency and animation. GIF files should be used for images such as logos, cartoons, and icons. ● JPG – Joint Photographic Expert Group (A jpg encoded graphics file - pronounced JAY-PEG) — JPG files provide a maximum of 24 bit color (true color), can handle grayscale images, allow you to control compression, and are progressive (a designer can specify the number of passes to use when displaying the image (like GIF interfacing). JPG files should be used for photographs and paintings.
- 8. Graphic Files ● A newer format was introduced in 1995-- PNG – Portable Network Format. – PNG is an open standard. – Use has been restricted because of limited browser support. It is generally supported by version 4.0 browsers and above. – Provides 48 bit color, a compression system, interlacing (7 passes), and support for 8-bit transparency
- 9. Multimedia File Formats ■ Multimedia files are used to provide audio and video. ■ Audio and video may be supplied in two ways: • Streaming • Non-Streaming ■ Non-streaming files must be downloaded in their entirety to the hard disk drive of the user’s machine before playing can begin. ■ Streaming technology was developed to overcome the issue of download time.
- 10. Multimedia File Formats ■ AVI – Audio-Video Interleaved (A standard format for computers) ■ MOV – QuickTime Video (Format developed by Apple Computer that displays video, audio, and animation on Mac and Windows) ■ MIDI – Musical Instrument Digital Interface (Audio format used for synthesized music rather than recordings. Files are smaller than WAV files ■ MPG/MP3 – MPEG (Moving Picture Experts Group) – High quality compressed format for audio and video ■ WAV – Used for high quality recordings for both mono and stereo audio tracks. Creates relatively large files.
- 11. Plug-Ins and Multimedia Extensions ■ Browsers can be extended using additional software known as plug-ins. Plug-ins work as part of the browser. ■ Plug-ins are available for audio and for displaying special effect images. Examples include: • Shockwave • Flash • RealPlayer • QTVR (Quick Time)
- 12. Plug-Ins and Multimedia Extensions ■ Shockwave by Macromedia • Used to provide interactive multimedia, graphics, animations, and streaming audio on the Web. Applications include games, business presentations and advertisements. Files containing sound and video are very large. ■ Flash Player by Macromedia • Provides support for animations, interactive images and presentations, all with integrated audio clips and streaming technology. Its main benefit is the small file size, which is achieved using vector-based graphics instead of bitmaps. Vector graphics are scalable, high quality, and interactive.
- 13. Plug-Ins and Multimedia Extensions ■ RealPlayer by RealNetworks • Provides live and on-demand streamed audio and video content on the web. It is widely used and is optimized for slow connections. RealPlayer can provide various audio qualities up to CD quality using ISDN and faster connections. Minimum support for reasonable quality is 28.8 Kbps. ■ QuickTime Viewer from Apple • Supports the viewing of graphics, audio, and video. NetScape Navigator 3+ and Internet Explorer 3+ are shipped with Quick viewer as part of the application. Quick time movies are popular because of their small file size.
- 14. Extensible Markup Language (XML) ■ XML is the universal language for data formatting on the Web. The limited capabilities of HTML mean that many data types cannot be presented in a consistent and sophisticated manner, while XML can be customized by developers for any particular task such as: —Financial data —Scientific data —Legal information
- 15. Virtual Reality Modeling Language (VRML) ■ VRML is used to create three dimensional objects with different colors and textures which can be placed in a virtual reality space through which the user can move. ■ Like HTML, the VRML language is interpreted by the browser. VRML supports Java and JavaScript as well as sound and animation.