Transcript Slide 1
Internet publishing Ing. Petr Zámostný, Ph.D. místnost: A-72a tel.: 4222 e-mail: [email protected] Syllabus 1. Introduction – web servers and web browsers 2. HTML – basic page structure 3. HTML – basic constructions, data transfers via FTP 4. HTML - forms 5. CSS 6. CSS vs. HTML comparison 7. JavaScript - basics 8. Graphical data and multimedia - formats (GIF, PNG, JPEG), usage 9. Usability - homepage 10. Usability - navigation, search, JavaScript 11. Usability – web design for handicapped users (lowered sight or movement capabilities, older persons, etc.) 12. Anonymity of internet users, personal data protection, spam 13. Legal and moral aspects - quotation, referring, responsibility for published content 14. Presentation of created projects http://www.vscht.cz/informatika-chemie What is needed to pass the exam Project – make your own website Evaluation of third-party website Choose preffered form One-page written text 5-10 min presentation Project Compulsory requirements Structured document At least 3 separate documents XHTML or HTML 4.01 standards Valid documents (http://validator.w3.org). Use external CSS. Use some graphics in separate folder. Make it available at http://web.vscht.cz/… Recommended features Minimize XHTML attributes formatting, use CSS instead. Follow recommendations for making the pages accessible by handicapped users (http://www.w3.org/WAI/quicktips/). Website evaluation Technical quality Navigation – placement, usability, logic, ... Content, information value Language Comprehensibility Use of hypertext Readability Structure – is there clear hierarchy of presented information (chapters, lists, tables)? Grammar Composition Objectivity Graphics, design: Font size Colors, contrast, readability Design quality Impact of screen resolution, page weight Impression (subjective) Information sources Information systém on ICT http://student.vscht.cz Materials for seminars http://www.vscht.cz/kot/cz/studijni-materialy.html Webdesign Jakob Nielsen: Web design WWW standards http://www.w3.org/ History of WWW 1950 – Douglas Engelbert – interlinked documents 1980 – Ted Nelson – „Xanadu“ project 1989 – CERN - Tim Berners-Lee Software for developing hypertext documents Term „World-Wide Web“ Internet infrastructure HTML, HTTP, URL technologies WWW – key principles File (document) transfer, HTTP protocol Global document address - URL Hypertext, HTML World-Wide Web WWW server HTTP request - URL Client HTTP response - document Browser HTTP protocol handling Content parsing, displaying Content storage Static Dynamic Uniform Resource Locator http://www.vscht.cz/seznam/SeznamVSCHT/index.html HOW? WHERE? WHAT? http:// www.vscht.cz /seznam/SeznamV SCHT/index.html Communication scheme Source, server Identification within the scope of source Scheme 1/2 http:// http://www.vscht.cz/kot/cz/index.html HyperText Transfer protocol ftp:// ftp://ftp.vscht.cz/pub/antivir/Blaster/FixBlast.exe File Transfer Protocol file:/// file:///c|/windows/win.ini Local file mailto: mailto:[email protected] Scheme 2/2 Scheme is important ftp://ftp.vscht.cz/pub/antivir/Blaster/FixBlast.exe http://ftp.vscht.cz/pub/antivir/Blaster/FixBlast.exe http://ifis.vscht.cz/ https://ifis.vscht.cz/ Browsers complete missing scheme, so that it works in most cases Server IP address http://147.33.2.8/ Domain name http://3rdlevel.2ndlevel.1stlevel http://www.vscht.cz http://student.vscht.cz Řád domény Each domain has own registrar that controls domain names asignment Location (path) Corresponds to the real or the virtual location of the document in the server file system Paths are case-sensitive http://www.vscht.cz/homepage http://www.vscht.Cz/homepage http://www.vscht.cz/Homepage Content Static File system Permanent documents Represent static nonspecific information http://www.vscht.cz/informatika-chemie Dynamic Database Documents are generated dynamically Documents are created specifically according to the user requirements http://www.google.com/search?q=internet Browser Browser manages transfers and interprets the content Common browsers Microsoft Internet Explorer Opera Mozilla Firefox Safari … Webpage Webpage – document (file) containing text data and formatting instructions The formatting instructions are interpreted by the browser Standards – a way to ensure the browsers will understand the formatting instructions W3C – World Wide Web Consortium http://www.w3.org/ What does make a webpage? HyperText Markup Language – HTML Text Tags Formatting instructions Information about the document structure References to other data (binary) <html> <head> <title>Title of page</title> </head> <body> This is my first homepage. <b>This text is bold</b> </body> </html> HTML versions and development Markup language SGML Standard Generalized Markup Language ISO 8879:1986 2.0 – the first standardized version 3.0 – unimplemented design Specifications were too difficult for browser developers 3.2 – Standardized as subset of 3.0 design + selected browser-specific features that were already implemented by browser developers 4.0, 4.01 – final version Cascading style sheets (CSS) used for formatting Recent web problems Mixing content and format in HTML Poor documents structure Difficult search for specific information Potential remedy = XML XML eXtensible Markup Language SGML „light“ Can be used as standard to define other languages based on XML Can create content oriented structure More strict syntax than SGML = much easier implementation XHTML eXtensible HyperText Markup Language HTML 4.01 restandardized to follow XML rules Meets XML standard specifications But does not require full XML support by the browser More strict Web pages development/coding Text processors Notepad, PSPad HTML editors HomeSite WYSIWYG editors FrontPage FrontPage Notepad HomeSite Readable HTML code „Less readable“ HTML code Editors comparison WYSIWYG Relatively easy operation „Precise“ control of appearance, but poor platform independence Problems with standard compatibility Document is not created transparently – code cannot be fully controlled Documents contain editor-specific markup Editors comparison Text and HTML editors Require active knowledge of standards Full control over the code Page development may seem more timeconsuming than with the WYSIWYG editors, but it is not true for an experienced coder