Basic Properties of a Web Page Teppo Risnen

Basic Properties of a Web Page Teppo Räisänen LIIKE/OAMK

Client-server model

Basic concepts n The Web n n n World Wide Web, WWW A system of interlinked hypertext documents accessed via the Internet Hypertext n is text displayed on a computer or other electronic device with references (hyperlinks) to other text that the reader can immediately access, usually by a mouse click or keypress sequence. Apart from running text, hypertext may contain tables, images and other presentational devices.

Basic concepts n HTML n n Hyper. Text Markup Language HTML is used to represent the content (text, images) and the links in the Web

Basic concepts n HTML can be used to create HTMLdocuments n n Document name ends with. htm or. html One HTML-document contains one Web page

Basic concepts n HTTP n n n Hyper. Text Transfer Protocol Networking protocol that is used to transfer the web pages from server to client http: //www. oamk. fi/

Basic concepts n n Web pages can be static or dynamic Static web page n n The content of the page does not change Dynamic web page n The content of the page can change as it is created based on some criteria

Web Server (1) n The development work of static web pages can be implemented using a local workstation n n Dynamic pages often require server end some more testing At the publishing stage the pages must be transferred to a public server n File transfer

Web Server (2) n n The instructions of file transfers are usually provided by the Internet Service Provider (ISP) Web server space can be obtained e. g. from: n n n ISP (Baana, Elisa, Saunalahti…) Work/Study organization Web hotel service

File Transfers n The file transfers can be committed using: n n A FTP client (Core. FTP, WSFTP, SSH Client) A Web Editor (Dreamweaver, Front. Page) FTP functionalities of a browser (restricted) Browser based application provided by the ISP

Web Material (1) n Besides HTML-pages browsers know how to work with n n Image files Sound files Text files (e. g. . pdf) Have a look at n http: //www. oamk. fi/~teraisan/K 1047 BI/

Web Material (1) n Many formats of files can nowadays be embedded within a web page n n Flash, Java, Silverlight, … The content needs plug-ins to work n If the plug-in is not installed an error message is displayed

Web Material (2) n It is still to be remembered that n n n Not all file formats are supported by the browsers Not all browsers support same kinds of file formats Depending of the browser type the same kind of material (e. g. sound files) may be presented in a different manner

Web Material (3) n Companies providing free server space may restrict the use of some file formats: n n Mp 3. zip, . rar

Web Addresses (1) n n n The initial part of a web address consists of the protocol and the server’s name (e. g. http: //www. oamk. fi) The following parts of the address reveal the site’s hierarchial structure (e. g. http: //www. oamk. fi/english/intra/) Have a look at file structure at n http: //www. oamk. fi/~teraisan/K 1047 BI/

Web Addresses (2) n n The web applications might generate complex addresses like http: //pan. kaha. oamk. fi/intra/harjoitt. nsf/0 bbcbb 05402 f 06 c 242256958 00354 d 8 c/03 cc 4567 f 8 fa 7869 c 22570 b 5003 eb 77 b? Open. Document n n In principle the protocol definition (http: //) is a part of web address The part of address that declares the actual file (e. g. index. htm) is called a relative address

Web Addresses (3) n The names of the relative addresses should be kept simple: n n n myhobbies. htm vs. abcsd 1789234. htm One might have to pronounce the addresses during phone conversations Relative addresses belonging to the same group may be named logically n letter 11012006. htm, letter 11012006…

Web Addresses (4) n http: //www. googleguide. com/web_addr ess. html

Media Types n n n The server will send information of a requested files media type The browser will use the information about the media type to decide, how to present the file (Open Media. Player, open Acrobat Reader etc. ) Sometimes the browser doesn’t know how to treat a file, so a mp 3 file might be displayed in a browser window…

File and Media types Type File Extension Media Type HTML-page . htm/. html Text/html Plain Text . txt Text/plain PDF-document. pdf Application/pdf Gif-image . gif Image/gif Mpeg-video . mpg Video/mpeg

File Types n n n Even with faster connections, the large file sizes are still problematic It is usually more sensible to provide a link to a large file instead of embedding the file into a HTML page For large images, sounds, and videos one might want to provide thumbnails and preview opportunities.