Introduction to HTML Outline

Total Page:16

File Type:pdf, Size:1020Kb

Introduction to HTML Outline Introduction to HTML (adapted from Laurent Falquet) VI, October 2006 Page 1 Outline Definitions Tags, structure • HTTP, MIME, URL... • Text formatting • Tables • Images History • Links • Forms, example Browsers HTML forms & CGI • Mosaic, Netscape, Lynx, Internet Explorer, other CSS Client <-> Server JavaScript vs Java Apache server Dynamic vs Static Future: XHTML? VI, October 2006 Page 2 HTML - Definitions HTTP HTML • HyperText Transfer Protocol • HyperText Markup Language MIME CSS • Multipurpose Internet Mail • Cascading Style Sheet Extension XML URL (URI) • eXtended Markup Language • Uniform Resource Locator FTP • File Transfer Protocol VI, October 2006 Page 3 HTML - History 60s ARPANET 1989-90 HTML and World-Wide-Web concept • Tim Berners-Lee at CERN 1992 Definition of HTTP 1993 First graphic browser 1994 Foundation of W3 consortium 1995-… Start of WWW economy... 2004 Internet2 and the GRID VI, October 2006 Page 4 HTML - Little network reminder IPv4 Tools • Internet Protocol ver. 4 • 192.42.197.31 • nslookup • traceroute • IPv6 (Internet2) Root DNS 3 • ifconfig 2 *.org 5 4 Local DNS Primary DNS dns.anywhere.net www.expasy.org 1 6 www.expasy.org ?? Client query Target server client.anywhere.net 129.194.8.64 DNS •domain name server •Convert a URL to an IP and vice-versa VI, October 2006 Page 5 HTML - Client <-> Server VI, October 2006 Page 6 HTML - Browsers (client) Mosaic Internet Explorer • First graphic browser by NCSA • From Microsoft Netscape Others • Son of Mosaic also called • Firefox, Opera, iCab, OmniWeb, Communicator or Mozilla Chimera, Galeon, Safari, Webstar… Lynx • Text only browser WAP • Wireless Application Protocol VI, October 2006 Page 7 HTML - The Apache server Receives calls from port 80 or other Answers by sending back html or images Process dynamic pages (php, jsp) Calls executables (cgi-bin) Check authorizations (.htaccess, .htpasswd) Encrypt data (SSL) Sends cookies VI, October 2006 Page 8 HTML - Tags, structure VI, October 2006 Page 9 VI, October 2006 Page 10 HTML - Tags, structure <HTML> minimal tags: <HEAD> <HTML> <TITLE>title of the page </TITLE> <BODY> </HEAD> </BODY> <BODY> </HTML> <FRAMESET> <FRAME> </FRAMESET> </BODY> </HTML> Example: <tagname> xxxxx </tagname> The <B>bold</B> word ---> The bold word Attributes: <IMG src="../images/logo.gif" height=’320’ width=‘576’> VI, October 2006 Page 11 HTML - Frames Ability to conserve some parts of the page (e.g., headers, menus, etc…) VI, October 2006 Page 12 HTML - Frames http://www.htmlhelp.com/design/frames/whatswrong.html Potential problems •some browsers What's wrong with frames? … •keeping bookmarks •Printing In depth Unaddressable resources On the Web, everything can be accessed (or addressed, at least) using a!n Uniform Resource Locator (URL). This makes it possible to link to anything, anywhere. At least, asE loSng as the anything in question does not use frames. M A Totally incompatible R The general rule for HTML is that if an element is nFot understood by a browser, it should be ignored. This way, a browser that does not understand the elemenDt can still show the rest of the document. The reader may miss some of the meaning of the text, or get a docuIment that is formatted a bit strangely. Unfortunately, this is not the O case with frames. V A The FRAMESET and FRAME elements do not have textual content. A browser that does not support frames will simply skip over these tags. But as there is nothing else to show, this browser would display nothing in place! The NOFRAMES element allows an author to specify content for such a browser, but this often means that the author has to do double work. VI, October 2006 Page 13 HTML - Text formatting Format Lists <LI> • <Hn> header (n = 1 to 6) • <UL> unordered list <P> paragraph • • <OL> ordered list • <CENTER> center • <DL> definition list • <BR> line break • <HR> horizontal rule </UL> Style <LI>first line</LI> • <B> bold </B> <LI>second line</LI> • <I> italic </I> <LI>last line</LI> • first line </UL> • <PRE> fixed width text </PRE> • second line • last line deprecation • <U>, <S>, <FONT>, … <DL> • Use CSS ! <DT>spam <DD>annoying unrequested email </DL> spam annoying unrequested email VI, October 2006 Page 14 HTML - Table formatting CAPTION - Table caption TR - Table row TH - Header cell TD - Table cell <TABLE BORDER=1> <CAPTION>A test table with merged cells</CAPTION> <TR><TH ROWSPAN=2><TH COLSPAN=2>Average<TH ROWSPAN=2>other<BR>category<TH>Misc <TR><TH>height<TH>weight <TR><TH ALIGN=LEFT>males<TD>1.9<TD>0.003 <TR><TH ALIGN=LEFT ROWSPAN=2>females<TD>1.7<TD>0.002 </TABLE> A test table with merged cells /--------------------------------------------------\ | | Average | other | Misc | | |-------------------| category |--------| | | height | weight | | | |-----------------------------------------|--------| | males | 1.9 | 0.003 | | | |-----------------------------------------|--------| | females | 1.7 | 0.002 | | | \--------------------------------------------------/ VI, October 2006 Page 15 HTML - Table formatting <TABLE> Attributes: • <CAPTION>…</CAPTION> • align, width, cellpading, cellspacing, border • <TR> • colspan, rawspan, nowrap • <TH>…</TH> • … • </TR> • <TR> Tables within tables? • <TD>…</TD> (http://www.isb-sib.ch) • </TR> </TABLE> VI, October 2006 Page 16 HTML - Tables example VI, October 2006 Page 17 HTML - Tables example 56 tables !!! VI, October 2006 Page 18 HTML - Tables example 3 tables … VI, October 2006 Page 19 HTML - Images Images types: GIF • GIF87, GIF89, Animated • 256 indexed colors, interlacing, transparency, animated, (logos, flat (Graphics Interchange Format) colors) • JPEG (Joint Photographic Experts Group) JPEG • PNG (Portable Network Graphic) • 24 bits, 16.8 mio colors, no interlacing or transparency, static, <IMG src="../images/logo.gif" (photographic images) height=‘320’ width=‘576’> PNG • 48 bits colors, interlacing, transparency, static, smaller files Image Maps • See links VI, October 2006 Page 20 HTML - Links Internal • Allows redirection inside of a (long) page <A HREF="#nextchapter">click here</A> ...Some HTML code... <A name="nextchapter"></A> External • Allows redirection to another page or site <A HREF="http://www.expasy.ch"> click here</A> E-mail • Allows direct email <A HREF="mailto:[email protected]"> click here</A> Image maps • Allows clickable regions in an image <IMG width="48" height="24" src="../images/map.gif" usemap="#anymapname"> <MAP name="anymapname"> <AREA href="otherpage.html" coords="33,2,43,22" shape="rect"> </MAP> VI, October 2006 Page 21 HTML - Links: Image Maps VI, October 2006 Page 22 HTML - Forms Forms allow user to enter data and transmit them to the server <FORM name="FormName" action="/cgi-bin/dea-test.pl" method="post"> ...Some HTML code... ...With form tags... </FORM> GET or POST ? (with the Get, all the form data is included in the URL. So we can directly access this program without the form, by using the following URL: http://www.expasy.org/cgi-bin/mailform/Swiss-Prot_Helpdesk&&[email protected] ) INPUT tag options: • Text, Password, Hidden Other tags • Radio •TEXTAREA • Checkbox •SELECT, OPTION • Submit, Reset • File, Button, Image VI, October 2006 Page 23 HTML - Forms Example VI, October 2006 Page 24 HTML - Forms Example source part 1 <html> <head> <meta http-equiv="content-type" content="text/html;charset=iso-8859-1"> <meta name="generator" content="Adobe GoLive 4"> <title>DEA: Example of a form</title> </head> <body bgcolor="#afeeee"> <center> <form name="FormName" action="/cgi-bin/dea-test.pl" method="post"> <h1>Example of a form :</h1> <hr width="580"> <p><b>Your name:</b> <input type="text" name="nom" size="24"> <b>Your password:</b> <input type="password" name="motdepasse"size="24"> </p> <p><b>Your sex:</b> male<input type="radio" value="homme" name="sexe"> female<input type="radio" value="femme" name="sexe"> <b>Your university:</b> <select name="universite" size="1"> <option value="empty" selected>select please <option value="unibas">Basel <option value="unige">Geneva <option value="unil">Lausanne </select> </p> VI, October 2006 Page 25 HTML - Form Example source part 2 <p><b>Your interests:</b> <input type="checkbox" value="biochimie" name="interets">biochemistry <input type="checkbox" value="scrabble" name="interets">scrabble <input type="checkbox" value="bouffe" name="interets">food <input type="checkbox" value="voiture" name="interets">cars <input type="checkbox" value="autre" name="interets">other </p> <p> <input type="submit" name="submitButtonName" value="send data to cgi-bin"> <input type="reset"> </p> </form> <p> <hr width="580"> </center> </body> </html> VI, October 2006 Page 26 HTML - Client <-> Server <-> CGI VI, October 2006 Page 27 HTML - Modules for cgi-bin CGI.pm CGI::Lite.pm use CGI; use CGI::Lite; $cgi=new CGI; $cgi=new CGI::Lite; my $seq=$cgi->param(’sequence'); %val = $cgi->parse_form_data; my @database=$cgi->param('database'); my $seq=$val(’sequence'); my @database=$cgi->get_multiple_values ($val{’database'}); Carp.pm use CGI::Carp q(fatalsToBrowser); VI, October 2006 Page 28 HTML - cgi-bin Example #!/usr/local/bin/perl ### import modules use CGI::Carp q(fatalsToBrowser); # makes debugging more easy use CGI; ### read arguments ### $cgi=CGI->new(); ### create CGI instance my @interets=$cgi->param('interets'); my $nom=$cgi->param('nom'); my $pass=$cgi->param('motdepasse'); my $genre=$cgi->param('sexe'); my $universite=$cgi->param('universite'); select(STDOUT); ### configure output stream... to possibly send error message ### $| = 1; ### flush buffering to true ### start HTML output print "Content-type:
Recommended publications
  • Cache Files Detect and Eliminate Privacy Threats
    Award-Winning Privacy Software for OS X Every time you surf the web or use your computer, bits of Recover Disk Space data containing sensitive information are left behind that Over time, the files generated by web browsers can start could compromise your privacy. PrivacyScan provides to take up a large amount of space on your hard drive, protection by scanning for these threats and offers negatively impacting your computer’s performance. multiple removal options to securely erase them from PrivacyScan can locate and removes these space hogs, your system. freeing up valuable disk space and giving your system a speed boost in the process. PrivacyScan can seek and destroy internet files used for tracking your online whereabouts, including browsing history, cache files, cookies, search history, and more. Secure File Shredding Additionally, PrivacyScan can eliminate Flash Cookies, PrivacyScan utilizes advanced secure delete algorithms which are normally hidden away on your system. that meet and exceed US Department of Defense recommendations to ensure complete removal of Privacy Threat: Cookies sensitive data. Cookies can be used to track your usage of websites, determining which pages you visited and the length Intuitive Interface of time you spent on each page. Advertisers can use PrivacyScan’s award-winning design makes it easy to cookies to track you across multiple sites, building up track down privacy threats that exist on your system and a “profile” of who you are based on your web browsing quickly eliminate them. An integrated setup assistant and habits. tip system provide help every step of the way to make file cleaning a breeze.
    [Show full text]
  • Apple Has Built a Solution Into Every Mac
    Overview Mac OS X iPhone iPod + iTunes Resources Vision Mac OS X solutions VoiceOver from third parties. Browse the wide variety of To make it easier for the blind and those with low-vision to use a accessibility solutions supported computer, Apple has built a solution into every Mac. Called VoiceOver, by Mac OS X. Learn more it’s reliable, simple to learn, and enjoyable to use. In Depth Device Support Application Support Downloads VoiceOver Application Support VoiceOver. A unique solution for the vision-impaired. Every new Mac comes with Mac OS X and VoiceOver installed and includes a variety of accessible More than 50 reasons to use applications. You can also purchase additional Apple and third-party applications to use with VoiceOver. VoiceOver. Learn more While this page lists a few of the most popular applications, many more are available. If you use an application with VoiceOver that’s not on this list, and you would like to have it added, send email to [email protected]. Unlike traditional screen readers, VoiceOver is integrated into the operating system, so you can start using new accessible applications right away. You don’t need to buy an update to VoiceOver, install a new copy, or add the application to a “white list.” Moreover, VoiceOver commands work the same way in every application, so once you learn how to use them, you’ll be able to apply what you know to any accessible application. Apple provides developers with a Cocoa framework that contains common, reusable application components (such as menus, text fields, buttons, and sliders), so developers don’t have to re-create these elements each time they write a new application.
    [Show full text]
  • Tutorial URL Manager Pro Tutorial
    Tutorial URL Manager Pro Tutorial Version 3.3 Summer 2004 WWW http://www.url-manager.com Email mailto:[email protected] Copyright © 2004 Alco Blom All Rights Reserved - 1 - Tutorial Installation Requirements URL Manager Pro 3.3 requires Mac OS X 10.2 or higher. On Mac OS X 10.1 you can use URL Manager Pro 3.1.1. URL Manager Pro 2.8 is still available for Mac OS 8 users. The bundle size of URL Manager Pro 3.3 is around 8 MB, including this user manual and localizations for English, Japanese, German, French, Spanish and Italian, which are all included in the default package. Installing Installation is very easy, just move URL Manager Pro into the Applications folder. To start using URL Manager Pro, simply double-click the application icon. Optional: You may want to install the Add Bookmark Contextual Menu Item plug-in. The Add Bookmark plug-in can be installed using the URLs tab of the Preferences Window of URL Manager Pro. The plug-in will then be copied to: ~/Library/Contextual Menu Items/ Where ~ is the customary Unix shorthand to indicate the user's home directory. For more information, go to the Add Bookmark Web page or the Contextual Menu Item section in the Special Features chapter. The Bookmark Menu Extra While URL Manager Pro is running, it automatically adds the Bookmark Menu Extra to the menu bar. With the Bookmark Menu Extra you have access to your bookmarks from within any application, including your web browser. The Bookmark Menu Extra is located in the right part of your menu bar (see below).
    [Show full text]
  • Web Browsing and Communication Notes
    digital literacy movement e - learning building modern society ITdesk.info – project of computer e-education with open access human rights to e - inclusion education and information open access Web Browsing and Communication Notes Main title: ITdesk.info – project of computer e-education with open access Subtitle: Web Browsing and Communication, notes Expert reviwer: Supreet Kaur Translator: Gorana Celebic Proofreading: Ana Dzaja Cover: Silvija Bunic Publisher: Open Society for Idea Exchange (ODRAZI), Zagreb ISBN: 978-953-7908-18-8 Place and year of publication: Zagreb, 2011. Copyright: Feel free to copy, print, and further distribute this publication entirely or partly, including to the purpose of organized education, whether in public or private educational organizations, but exclusively for noncommercial purposes (i.e. free of charge to end users using this publication) and with attribution of the source (source: www.ITdesk.info - project of computer e-education with open access). Derivative works without prior approval of the copyright holder (NGO Open Society for Idea Exchange) are not permitted. Permission may be granted through the following email address: [email protected] ITdesk.info – project of computer e-education with open access Preface Today’s society is shaped by sudden growth and development of the information technology (IT) resulting with its great dependency on the knowledge and competence of individuals from the IT area. Although this dependency is growing day by day, the human right to education and information is not extended to the IT area. Problems that are affecting society as a whole are emerging, creating gaps and distancing people from the main reason and motivation for advancement-opportunity.
    [Show full text]
  • "ITL Rept 87-5-77 1 H Fire Endurance Test Conducted on Ladder Cable
    l L> M V iD L D L A Lr C n ~ tnl ~ ta TKSTING. LABORATORIES. Enyln ~ ~ ra ivi ~ tallur y I ate 1 Xl C ~ 2%0 Seventh Blvd. ~ St. Loula, Mlaaouri 53104 31'/771-7111 I.T.L. REPORT NO. 87-5-77 ONE HOUR FIRE ENDURANCE TEST CONDUCTED ON A LADDER CABLE TRAY WITH h P-1000 UNISTRUT ATTACHMENT PROTECTED PITH THE THERMO-LAG 330 FIRE BARRIER SYSTEM DATE OF ISSUE: 26 JUNE 1987 REVISION I: 29 JUNE 1987 +502070099 870y07 PDR ADOCK 05000397 PDR I N DUSTRI A I~ TESTINO LABORATORIES I no. I.T.L. REPORT NO. 87 5-77 ONE HOUR FIRE ENDURANCE TEST CONDUCTED ON h ihDDER CABlZ TRAY PITH h P-1000 UNISTRUT ATTACHMENT PROTECTED WITH THE THERMO-LAG 330 FIRE BARRIER SYSTEM TEST DATE: 7 MAY 1987 TEST LOCATION: THERMAL SCIENCE, CASSENS DRIVEIN'200 ST. LOUIS, MISSOURI 63026 hPPROVED BY: INDUSTRIAL TESTING LABORATORIES, INC» 2350 SEVENTH BQ)LEVARD ST+ LOUIS~ MISSOURI 63104 hLLAN M. SIEGEL, P.E. DIRECTOR DATE OF ISSUE: 26 JUNE 1987 REVISION I: 29 JUNE 1987 In no event shall Industrial Testing Laboratories, Inc. be responsible to anyone for vhatever use or nonuse is made of the information contained in this Report and in no event shall Industrial Testing Laboratories, Inc., its employees, or its agents incur any obligation or liability for damages including, but not limited to, consequential damages, arising out of or in connection vith the use, or inability to use, the information contained in this Report. I T.L. REPORT NO. 87-5-77 TABLE OF CONTENTS SECTION TITLE PAGE NO ~ leO INTRODUCTION AND SUMMARY 1.1 Introduction 1 2 Summary 2 0 PURPOSE 3 0 TEST LOCATION 4 0 TEST PLAN STANDARDS AND REFERENCES 3 4 1 ASTM E119 Fire Endurance Test 4 2 Mater Hose Stream Test 4 ~ 3 Electrical Circuit Integrity Monitoring 5 0 DESCRIPTION OF TSI'S HIGH TEMPERATURE TEST FURNACE 5 1 Transfer Cart 6.0 TEST ASSEMBLY 13 6 1 Cable Installation 13 6.2 Opening Sealant 13 I.ToL.
    [Show full text]
  • Giant List of Web Browsers
    Giant List of Web Browsers The majority of the world uses a default or big tech browsers but there are many alternatives out there which may be a better choice. Take a look through our list & see if there is something you like the look of. All links open in new windows. Caveat emptor old friend & happy surfing. 1. 32bit https://www.electrasoft.com/32bw.htm 2. 360 Security https://browser.360.cn/se/en.html 3. Avant http://www.avantbrowser.com 4. Avast/SafeZone https://www.avast.com/en-us/secure-browser 5. Basilisk https://www.basilisk-browser.org 6. Bento https://bentobrowser.com 7. Bitty http://www.bitty.com 8. Blisk https://blisk.io 9. Brave https://brave.com 10. BriskBard https://www.briskbard.com 11. Chrome https://www.google.com/chrome 12. Chromium https://www.chromium.org/Home 13. Citrio http://citrio.com 14. Cliqz https://cliqz.com 15. C?c C?c https://coccoc.com 16. Comodo IceDragon https://www.comodo.com/home/browsers-toolbars/icedragon-browser.php 17. Comodo Dragon https://www.comodo.com/home/browsers-toolbars/browser.php 18. Coowon http://coowon.com 19. Crusta https://sourceforge.net/projects/crustabrowser 20. Dillo https://www.dillo.org 21. Dolphin http://dolphin.com 22. Dooble https://textbrowser.github.io/dooble 23. Edge https://www.microsoft.com/en-us/windows/microsoft-edge 24. ELinks http://elinks.or.cz 25. Epic https://www.epicbrowser.com 26. Epiphany https://projects-old.gnome.org/epiphany 27. Falkon https://www.falkon.org 28. Firefox https://www.mozilla.org/en-US/firefox/new 29.
    [Show full text]
  • Web Browsers
    WEB BROWSERS Page 1 INTRODUCTION • A Web browser acts as an interface between the user and Web server • Software application that resides on a computer and is used to locate and display Web pages. • Web user access information from web servers, through a client program called browser. • A web browser is a software application for retrieving, presenting, and traversing information resources on the World Wide Web Page 2 FEATURES • All major web browsers allow the user to open multiple information resources at the same time, either in different browser windows or in different tabs of the same window • A refresh and stop buttons for refreshing and stopping the loading of current documents • Home button that gets you to your home page • Major browsers also include pop-up blockers to prevent unwanted windows from "popping up" without the user's consent Page 3 COMPONENTS OF WEB BROWSER 1. User Interface • this includes the address bar, back/forward button , bookmarking menu etc 1. Rendering Engine • Rendering, that is display of the requested contents on the browser screen. • By default the rendering engine can display HTML and XML documents and images Page 4 HISTROY • The history of the Web browser dates back in to the late 1980s, when a variety of technologies laid the foundation for the first Web browser, WorldWideWeb, by Tim Berners-Lee in 1991. • Microsoft responded with its browser Internet Explorer in 1995 initiating the industry's first browser war • Opera first appeared in 1996; although it have only 2% browser usage share as of April 2010, it has a substantial share of the fast-growing mobile phone Web browser market, being preinstalled on over 40 million phones.
    [Show full text]
  • Why Websites Can Change Without Warning
    Why Websites Can Change Without Warning WHY WOULD MY WEBSITE LOOK DIFFERENT WITHOUT NOTICE? HISTORY: Your website is a series of files & databases. Websites used to be “static” because ​ there were only a few ways to view them. Now we have a complex system, and telling your webmaster what device, operating system and browser is crucial, here’s why: TERMINOLOGY: You have a desktop or mobile “device”. Desktop computers and mobile ​ ​ ​ devices have “operating systems” which are software. To see your website, you’ll pull up a ​ ​ ​ ​ “browser” which is also software, to surf the Internet. Your website is a series of files that ​ ​ needs to be 100% compatible with all devices, operating systems and browsers. Your website is built on WordPress and gets a weekly check up (sometimes more often) to ​ ​ ​ see if any changes have occured. Your site could also be attacked with bad files, links, spam, comments and other annoying internet pests! Or other components will suddenly need updating which is nothing out of the ordinary. WHAT DOES IT LOOK LIKE IF SOMETHING HAS CHANGED? Any update to the following can make your website look differently: There are 85 operating ​ systems (OS) that can update (without warning). And any of the most popular roughly 7 ​ ​ ​ browsers also update regularly which can affect your site visually and other ways. (Lists below) ​ Now, with an OS or browser update, your site’s 18 website components likely will need ​ ​ updating too. Once website updates are implemented, there are currently about 21 mobile ​ devices, and 141 desktop devices that need to be viewed for compatibility.
    [Show full text]
  • Webkit and Blink: Open Development Powering the HTML5 Revolution
    WebKit and Blink: Open Development Powering the HTML5 Revolution Juan J. Sánchez LinuxCon 2013, New Orleans Myself, Igalia and WebKit Co-founder, member of the WebKit/Blink/Browsers team Igalia is an open source consultancy founded in 2001 Igalia is Top 5 contributor to upstream WebKit/Blink Working with many industry actors: tablets, phones, smart tv, set-top boxes, IVI and home automation. WebKit and Blink Juan J. Sánchez Outline The WebKit technology: goals, features, architecture, code structure, ports, webkit2, ongoing work The WebKit community: contributors, committers, reviewers, tools, events How to contribute to WebKit: bugfixing, features, new ports Blink: history, motivations for the fork, differences, status and impact in the WebKit community WebKit and Blink Juan J. Sánchez WebKit: The technology WebKit and Blink Juan J. Sánchez The WebKit project Web rendering engine (HTML, JavaScript, CSS...) The engine is the product Started as a fork of KHTML and KJS in 2001 Open Source since 2005 Among other things, it’s useful for: Web browsers Using web technologies for UI development WebKit and Blink Juan J. Sánchez Goals of the project Web Content Engine: HTML, CSS, JavaScript, DOM Open Source: BSD-style and LGPL licenses Compatibility: regression testing Standards Compliance Stability Performance Security Portability: desktop, mobile, embedded... Usability Hackability WebKit and Blink Juan J. Sánchez Goals of the project NON-goals: “It’s an engine, not a browser” “It’s an engineering project not a science project” “It’s not a bundle of maximally general and reusable code” “It’s not the solution to every problem” http://www.webkit.org/projects/goals.html WebKit and Blink Juan J.
    [Show full text]
  • HTML/Cgi-Bin
    Introduction to HTML (adapted from Laurent Falquet) 2005 VI, March 2005 Page 1 Outline Definitions Tags, structure • HTTP, MIME, URL... • Text formatting • Tables History • Images • Links • Forms, example Browsers • Mosaic, Netscape, Lynx, Internet CSS Explorer, other JavaScript vs Java Client <-> !Server Dynamic vs Static Apache server Future: XHTML? VI, March 2005 Page 2 HTML - Definitions HTTP HTML • HyperText Transfer Protocol • HyperText Markup Language MIME CSS • Multipurpose Internet Mail • Cascading Style Sheet Extension XML URL (URI) • eXtended Markup Language • Uniform Resource Locator VI, March 2005 Page 3 HTML - History 60s ARPANET 1989-90 HTML and World-Wide-Web concept • Tim Berners-Lee at CERN 1992 Definition of HTTP 1993 First graphic browser 1994 Foundation of W3 consortium 1995-0x Start of WWW economy... 2004 Internet2 and the GRID ?? VI, March 2005 Page 4 HTML - Little network reminder I IPv4 Tools • Internet Protocol ver. 4 • 192.42.197.31 • nslookup • traceroute • IPv6 (Internet2) Root DNS 3 • ifconfig 2 *.org 5 4 Local DNS Primary DNS dns.anywhere.net www.expasy.org 1 6 www.expasy.org ?? Client query Target server client.anywhere.net 129.194.8.64 DNS •domain name server •Convert a URL to an IP and vice-versa VI, March 2005 Page 5 HTML - Client <-> Server VI, March 2005 Page 6 HTML - Browsers (client) Mosaic Internet Explorer • First graphic browser by NCSA • From Microsoft Netscape Others • Son of Mosaic also called • Firefox, Opera, iCab, OmniWeb, Communicator or Mozilla Chimera, Galeon, Safari, Webstar… Lynx •
    [Show full text]
  • Building a Browser for Automotive: Alternatives, Challenges and Recommendations
    Building a Browser for Automotive: Alternatives, Challenges and Recommendations Juan J. Sánchez Automotive Linux Summit 2015, Tokyo Myself, Igalia and Webkit/Chromium Co-founder of Igalia Open source consultancy founded in 2001 Igalia is Top 5 contributor to upstream WebKit/Chromium Working with many industry actors: automotive, tablets, phones, smart tv, set-top boxes, IVI and home automation Building a Browser for Automotive Juan J. Sánchez Outline 1 A browser for automotive: requirements and alternatives 2 WebKit and Chromium, a historical perspective 3 Selecting between WebKit and Chromium based alternatives Building a Browser for Automotive Juan J. Sánchez PART 1 A browser for automotive: requirements and alternatives Building a Browser for Automotive Juan J. Sánchez Requirements Different User Experiences UI modifications (flexibility) New ways of interacting: accessibility support Support of specific standards (mostly communication and interfaces) Portability: support of specific hardware boards (performance optimization) Functionality and completeness can be less demanding in some cases (for now) Provide both browser as an application and as a runtime Building a Browser for Automotive Juan J. Sánchez Available alternatives Option 1) Licensing a proprietary solution: might bring a reduced time-to-market but involves a cost per unit and lack of flexibility Option 2) Deriving a new browser from the main open source browser technologies: Firefox (Gecko) Chromium WebKit (Safari and others) Mozilla removed support in their engine for third
    [Show full text]
  • Printcentral Pro App Help
    Our quick Help Desk Support is available every day 2021-09-10 Search Getting Started ► Getting started printing For a start, you can print the "Quick start" file inside PrintCentral Pro. PrintCentral Pro will print directly to most printer models without extra software, but we recommend you install the free WePrint printer sharing software if you have any problems connecting to your printer, or if your printer has a USB connection. Install WePrint on your Mac or PC from here. http://esz.us/wp 1. Tap on the 3 lined button at the top left of the screen to open the left side panel and tap on "Files" 2. Tap on the "Quick start" file to view it. 3. Tap on the Print button in the top right of the screen to open the Print window. 4. If you are not taken to the choose "Printers" screen automatically, tap on the "Choose" button 5. Your network will be searched for available printers. Tap to select your printer 6. If you did not select the green WePrint printer, you can use the "Setup" screen to choose the best printer option for your printer. Tap on "Test" beside each option to test it. Tap on "More" to select more options. This option supports most printers. eg. most Epson, Canon, Brother, HP, Lexmark, Dell, Samsung, Kodak etc. If you printer prints a lot of blank pages, pull the paper tray out and restart your printer. 7. For some printer models, the setup test may not be compatible. You can still print though. Install WePrint on your Mac or PC from here http://esz.us/wp 8.
    [Show full text]