Internet publishing Ing. Petr Zámostný, Ph.D. místnost: A-72a tel.: 4222 e-mail: petr.zamostny@vscht.cz
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 � Comprehensibility � Use of hypertext � Readability � Structure – is there clear hierarchy of presented information (chapters, lists, tables)? � Language � 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 � Content storage HTTP protocol Static � � handling Dynamic � Content parsing, � displaying
Uniform Resource Locator http://www.vscht.cz/seznam/SeznamVSCHT/index.html � HOW? WHERE? WHAT? http:// www.vscht.cz /seznam/SeznamV SCHT/index.html Communication Source, server Identification within scheme 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:petr.zamostny@vscht.cz �
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://3 rd level.2 nd level.1 st level � 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 Dynamic � Database � File system � Documents are � Permanent � generated dynamically documents Documents are created � Represent static non- � specifically according to specific information the user requirements http://www.vscht.cz/informatika-chemie 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 time- � consuming than with the WYSIWYG editors, but it is not true for an experienced coder
Recommend
More recommend
