Pobierz prezentację
Pobieranie prezentacji. Proszę czekać
1
Projekt współfinansowany przez Unię Europejską w ramach Europejskiego Funduszu Społecznego Projektowanie warstwy klienckiej aplikacji internetowych Podstawy. HTML i XHTML Prezentacja jest współfinansowana przez Unię Europejską w ramach Europejskiego Funduszu Społecznego w projekcie pt. Innowacyjna dydaktyka bez ograniczeń - zintegrowany rozwój Politechniki Łódzkiej - zarządzanie Uczelnią, nowoczesna oferta edukacyjna i wzmacniania zdolności do zatrudniania osób niepełnosprawnych Prezentacja dystrybuowana jest bezpłatnie Projektowanie warstwy klienckiej aplikacji internetowych Podstawy. HTML i XHTML Prezentacja jest współfinansowana przez Unię Europejską w ramach Europejskiego Funduszu Społecznego w projekcie pt. Innowacyjna dydaktyka bez ograniczeń - zintegrowany rozwój Politechniki Łódzkiej - zarządzanie Uczelnią, nowoczesna oferta edukacyjna i wzmacniania zdolności do zatrudniania osób niepełnosprawnych Prezentacja dystrybuowana jest bezpłatnie Politechnika Łódzka, ul. Żeromskiego 116, 90-924 Łódź, tel. (042) 631 28 83 www.kapitalludzki.p.lodz.pl
2
Projekt współfinansowany przez Unię Europejską w ramach Europejskiego Funduszu Społecznego Podstawy. HTML i XHTML. Client-server Client-server is network architecture which separates the client (often an application that uses a graphical user interface) from the server. Each instance of the client software can send requests to a server or application server. There are many different types of servers; some examples include: a file server, terminal server, or mail server. While their purpose varies somewhat, the basic architecture remains the same.. Web browser Web server request response
3
Projekt współfinansowany przez Unię Europejską w ramach Europejskiego Funduszu Społecznego Podstawy. HTML i XHTML. URL http://www.dmcs.p.lodz.pl:80/index.jsp#id http:// - protocol name www.dmcs.p.lodz.plwww.dmcs.p.lodz.pl – server domain address 80 – port number index.jsp – name of a resource #id – identiffier of part of the resource Few parts in the name has defaults, so browser (default protocol and port number) and server (default resource name, aliases for server name) can simplify it.
4
Projekt współfinansowany przez Unię Europejską w ramach Europejskiego Funduszu Społecznego Podstawy. HTML i XHTML. Copyrights According to the polish law, you cannot copy anything from Internet, even if it is written on web page that you can You cannot put any hyperlinks pointing other sites But ussually: if you copy text or pictures from the page, that allows for it if you put a link pointing to the main page of other web service it shouldn't be any troubles.
5
Projekt współfinansowany przez Unię Europejską w ramach Europejskiego Funduszu Społecznego Podstawy. HTML i XHTML. Golden rules avoid spelling mistakes create pages using utf-8 character encoding do not use any web page generators size does matter. Each page should be smaller that 70 (???) kb put information about sizes of downloaded files put on your page last modification date
6
Projekt współfinansowany przez Unię Europejską w ramach Europejskiego Funduszu Społecznego Podstawy. HTML i XHTML. HTML i XHTML HTML 2.0 HTML 3.2 HTML 4.01 XHTML 1.0 XHTML 1.1 XHTML 2.0 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> some part of document OR :
7
Projekt współfinansowany przez Unię Europejską w ramach Europejskiego Funduszu Społecznego Podstawy. HTML i XHTML. HTML i XHTML(2) HTML: XHTML: or: XML style: Each tag has to be completely nested Each attribute should be doublequoted Other differences: Many tags attributes moved to the CSS All tags should be written using small letters Global attributes: style, type, id, class
8
Projekt współfinansowany przez Unię Europejską w ramach Europejskiego Funduszu Społecznego Podstawy. HTML i XHTML. DTD a) Strict: <!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/tr/xhtml1/DTD/xhtml1-strict.dtd"> b) Transitional: <!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/tr/xhtml1/DTD/xhtml1-transitional.dtd"> c) Frameset: <!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/tr/xhtml1/DTD/xhtml1-frameset.dtd">
9
Projekt współfinansowany przez Unię Europejską w ramach Europejskiego Funduszu Społecznego Podstawy. HTML i XHTML. Header elements Page title
10
Projekt współfinansowany przez Unię Europejską w ramach Europejskiego Funduszu Społecznego Podstawy. HTML i XHTML. Text formatting (HTML4.01) bold italic underline monotype superscript subscript strike red, font size 5, font family: Arial bold,underline, italic bold and underline only bold nothing
11
Projekt współfinansowany przez Unię Europejską w ramach Europejskiego Funduszu Społecznego Podstawy. HTML i XHTML. Text formatting (XHTML) All tags and attributes related to fonts has been moved to CSS Headers: from: up to The biggest The smallest Tooltip over headers: Some title... Paragraph: It is new paragraph New line tag: Horizontal line:
12
Projekt współfinansowany przez Unię Europejską w ramach Europejskiego Funduszu Społecznego Podstawy. HTML i XHTML. Text formatting (XHTML) (2) Preformatting text: Here is 20 spaces Address: Al. Politechniki 11 Box over text: Box over text Table of contents first element second element third element
13
Projekt współfinansowany przez Unię Europejską w ramach Europejskiego Funduszu Społecznego Podstawy. HTML i XHTML. Special characters NoNameDescriptionVisualized as &&Ampersand& <<Less than< >>Greater than> Non-breaking space Full list is easy to find in Internet.
14
Projekt współfinansowany przez Unię Europejską w ramach Europejskiego Funduszu Społecznego Podstawy. HTML i XHTML. Hyperlinks Label: Hyperlink: Some description Hyperlink to label: Some description Other hyperlinks:...
15
Projekt współfinansowany przez Unię Europejską w ramach Europejskiego Funduszu Społecznego Podstawy. HTML i XHTML. Hyperlink as an email Write to the author... Send
16
Projekt współfinansowany przez Unię Europejską w ramach Europejskiego Funduszu Społecznego Podstawy. HTML i XHTML. Hyperlink as a bitmap Other shapes:
17
Projekt współfinansowany przez Unię Europejską w ramach Europejskiego Funduszu Społecznego Podstawy. HTML i XHTML. Unordered list First point Second point Third point Point 1 Point 2 Point 2.1 Point 2.2 Point 2.2.1 Point 2.2.2 Point 3 Point 1 Point 2 o Point 2.1 o Point 2.2 Point 2.2.1 Point 2.2.2 Point 3 =>
18
Projekt współfinansowany przez Unię Europejską w ramach Europejskiego Funduszu Społecznego Podstawy. HTML i XHTML. Ordered list First point Second point Third point Numbering type: big latin letters small latin letters big roman numerals small roman numerals arabian numerals Start of numbering: 1.First point 2.Second point 3.Third point =>
19
Projekt współfinansowany przez Unię Europejską w ramach Europejskiego Funduszu Społecznego Podstawy. HTML i XHTML. Definition list first term first term explanation second term second term explanation Visualised as: first term first term explanation second term second term explanation
20
Projekt współfinansowany przez Unię Europejską w ramach Europejskiego Funduszu Społecznego Podstawy. HTML i XHTML. Tables table starts here start of first row start of first column end of first column start of second column end of second column end of first row start of second row start of first column end of first column start of second column end of second column end of second row table ends here It is not correct table definition!
21
Projekt współfinansowany przez Unię Europejską w ramach Europejskiego Funduszu Społecznego Podstawy. HTML i XHTML. Table attributes - border width - cell spacing - cell padding - table width Horizontal align: Merging cells:
22
Projekt współfinansowany przez Unię Europejską w ramach Europejskiego Funduszu Społecznego Podstawy. HTML i XHTML. Nested tables 100 200 300 AAA BBB CCC DDD 400 500 600
23
Projekt współfinansowany przez Unię Europejską w ramach Europejskiego Funduszu Społecznego Podstawy. HTML i XHTML. Header, footer and body of the table It is header Some cell It is footer
24
Projekt współfinansowany przez Unię Europejską w ramach Europejskiego Funduszu Społecznego Podstawy. HTML i XHTML. Outside borders Outside borders: x=void - no outside border x=above - only upper border x=below - only lower border x=vsides - left and right border x=hsides - upper and lower border. x=lhs - left border x=rhs - right border. x=box - all borders
25
Projekt współfinansowany przez Unię Europejską w ramach Europejskiego Funduszu Społecznego Podstawy. HTML i XHTML. Inside borders Inside borders: x=none - no borders x=rows - only horizontal borders x=cols - only vertical borders x=all - all borders
26
Projekt współfinansowany przez Unię Europejską w ramach Europejskiego Funduszu Społecznego Podstawy. HTML i XHTML. Frames <!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN" "http://www.w3.org/tr/xhtml1/DTD/xhtml1-frameset.dtd"> DMCS Some text for browsers, which don't support frames
27
Projekt współfinansowany przez Unię Europejską w ramach Europejskiego Funduszu Społecznego Podstawy. HTML i XHTML. Frames(2) Frame spacing and frame borders: Scrollbars: - scrollbars always visible - scrollbars never visible - scrollbars visible when needed Blocking changes of frame size: Nesting frames:
28
Projekt współfinansowany przez Unię Europejską w ramach Europejskiego Funduszu Społecznego Podstawy. HTML i XHTML. Inline frames Your browser doesn't support inline frames!
29
Projekt współfinansowany przez Unię Europejską w ramach Europejskiego Funduszu Społecznego Podstawy. HTML i XHTML. Grouping elements, – grouping elements - local grouping - logical grouping Examples: some text some other text some text OR: text some other text some text
30
Projekt współfinansowany przez Unię Europejską w ramach Europejskiego Funduszu Społecznego Podstawy. HTML i XHTML. Images Width and height: Borders: Spacing from other elements: Is there any sense to make image smaller than original?
31
Projekt współfinansowany przez Unię Europejską w ramach Europejskiego Funduszu Społecznego Podstawy. HTML i XHTML. Multimedia objects Flash: MP3: WAV:
32
Projekt współfinansowany przez Unię Europejską w ramach Europejskiego Funduszu Społecznego Podstawy. HTML i XHTML. Forms.... Attributes: action - address of the resource, where the form will be sent (the same page, other page, or just other url). Requiered attribute. method - HTTP method (usually GET or POST) enctype - encoding standard. Default value: application/x-www-form-urlencoded. If form consist from at list one field of type file, enctype should be: multipart/form- data.
33
Projekt współfinansowany przez Unię Europejską w ramach Europejskiego Funduszu Społecznego Podstawy. HTML i XHTML. Input fields Text field: Button: Attributes: type - type. Default type is text. Allowed types: text, password, checkbox, radio, submit, reset, file, hidden, image, button. name - name of the field value - usually default value size - size in pixels or characters
34
Projekt współfinansowany przez Unię Europejską w ramach Europejskiego Funduszu Społecznego Podstawy. HTML i XHTML. Select i textarea fields Textarea: Select: one two Multiple choice select:
35
Projekt współfinansowany przez Unię Europejską w ramach Europejskiego Funduszu Społecznego Podstawy. HTML i XHTML. Scripts and styles <!-- body {margin-left: 2cm; margin-right: 2cm} P {font-size: 14pt; font-family: Arial, Helvetica; font-weight: normal} --> function pushbutton() { alert("Hello!"); }
36
Projekt współfinansowany przez Unię Europejską w ramach Europejskiego Funduszu Społecznego Podstawy. HTML i XHTML. Web 1.0 / 2.0 / 3.0 36 XHTML,CSS AJAX/SOAP/Web Serices/JSON RDF "Tom is Mary's husband"
37
Projekt współfinansowany przez Unię Europejską w ramach Europejskiego Funduszu Społecznego Podstawy. HTML i XHTML. WEB 2.0/AJAX/Web Services/JSON Used for Rich User Interface creation Fast response on queries Dynamic content creation Unavailable in previous web applications Possibility of development user interface comparable to stand-alone technologies
38
Projekt współfinansowany przez Unię Europejską w ramach Europejskiego Funduszu Społecznego Projektowanie warstwy klienckiej aplikacji internetowych Podstawy. HTML i XHTML Prezentacja jest współfinansowana przez Unię Europejską w ramach Europejskiego Funduszu Społecznego w projekcie pt. Innowacyjna dydaktyka bez ograniczeń - zintegrowany rozwój Politechniki Łódzkiej - zarządzanie Uczelnią, nowoczesna oferta edukacyjna i wzmacniania zdolności do zatrudniania osób niepełnosprawnych Prezentacja dystrybuowana jest bezpłatnie Projektowanie warstwy klienckiej aplikacji internetowych Podstawy. HTML i XHTML Prezentacja jest współfinansowana przez Unię Europejską w ramach Europejskiego Funduszu Społecznego w projekcie pt. Innowacyjna dydaktyka bez ograniczeń - zintegrowany rozwój Politechniki Łódzkiej - zarządzanie Uczelnią, nowoczesna oferta edukacyjna i wzmacniania zdolności do zatrudniania osób niepełnosprawnych Prezentacja dystrybuowana jest bezpłatnie Politechnika Łódzka, ul. Żeromskiego 116, 90-924 Łódź, tel. (042) 631 28 83 www.kapitalludzki.p.lodz.pl
Podobne prezentacje
