!"# $ !"#%%# %&' # # ) *# ( , %), +%" ( % ( ( / 01 ( ) Client Application Server Browser (HTML) User Interface Controller Definition Handheld Device User Interface Controller Definition PDF, RTF, Excel MDS Repository Service Bean Interface XML Publisher $ 4 5 Data ( # ! " $ %& ' ( ) ' # % * + & - & & % 0+6 + ! " 7 ,* 1 9 0 3 3 0 5 & * '; 0 5 3 0 1- : 3 3 . & # 5 3 :' &, #. 8 ' & " . . 9,,* 9,,* :,* :,* ,* 1 1 * '* : : & & 0 ,($ + ' / 0% , '* 1 '* 1 2 3 33 4 5 * . ! * . ! ! " , ' :' &, 1 ' (7 ( " 8 9 : , / 0< , : ; * ? / 0! ? 8 ? 1 : #3 , ; 4 / < !& 0: B 2 !" ,( ,: B % !" 5 B , % = MODELO Encapsula el estado de la app Responde a consultas de estado Expona la funcionalidad de la app Notifica al Viwe de cambios #A A A A - % A A A A A / * ; 9= , #@ :#" ! $ 4: = ' > -- 61 ' .. ) Web Services -- + (3 1 Data Server Model: Business Components . +!" / 2- -- VIEW Dibuja el modelo Pide updates al modelo Envia pedidos del usuario al controler Permite al controler elegir la vista 3 $ " &B , = CONTROLLER Define el comportamiento de la app Mapea acciones del usuario con updates al modelo Elije la Vista para cada respuesta Un controller para cada funcionalidad & % 0 ) , : ! 9 ( C 8 / 0 * ; B :, D E " 7 A A A 4 : A A A , %%", 3% , @( ,: : 0 & 3 8 ,: B , ( = = $ - 8 B, , B , ,A A A >7 = ? '3 , ,% , +!"4 = / A A A A @ :0 = 4 8 = %%"- % = % : B ( 7 4 # 3 C * ! ' <>3 >7 8 , = = , 1% , A ) = = 4 % * !3 ! 4 2 A : %%" > > > @( @ 3 % 5 "4 !F "(2# @(2 3 : % >7 :/ 3% - % , (% , % , $ 9 ? 3 : !", + !" , $ !", %%, @!", % +, ( , ) *, % B F % = = * ( ( @( Servidor Web % 7 3 / : : 3 : $= 3% 0 %%" 0 %%" %%" !" 9 : ? Internet WML sobre HTTP/SSL @!" @% 7 %%" # 3 WML sobre WSP/WTLS @ "% "7 Red inalámbrica Gateway del Carrier , !" 4 ( ' " , %%", 3% , @( 3 = ( !", + !" , $ !", %%, @!", % +, ( , ) *, , , (% , % , ,% , ! !" !"H : B : / 1 ? = :9 <h2>T&iacute;tulo menos importante</h2> / !" / ! <html> <h1>T&iacute;tulo importante</h1> = 7 %: <title>Prueba</title> +!"4 +!" 4 = $ ! 5 " ( % ? ! 5 %'!" / % '3 , @!" @ 8! 5 " <p>P&aacute;rrafo con <em>texto destacado</em></p> 5 9 <a href="http://www.w3c.org">El Consortium</a> </html> %% / @!" %4 %* / %% Heading1 <?xml version="1.0"?> <!DOCTYPE wml PUBLIC "-//WAPFORUM//DTD WML 1.1//EN" <body> 1 % "http://www.wapforum.org/DTD/wml_1.1.xml"> <wml> <card id="Bien" title="Bienvenida"> <do type="accept" label="Seguir"> !" = <go href="#despe"/> </do> %% 9 <p align="center"> 4 </p> Heading4 <H3>Heading3</H3> Heading5 Text %% <P>Text</P> : = Bienvenidos! Heading3 <H2>Heading2</H2> <H5>Heading5</H5> C <go href="http://www.wap.org"/> </card> </body> C * Heading 1 H1 {color:blue;} H2 {color:navy;} H3 {color:olive;} H4 {color:purple;} H5 {color:maroon;} P {font-weight:bold;} PRE {font-weight:bold; color:navy;} > <card id="despe" title="Despedida"> Heading2 %% <H4>Heading4</H4> <do type="options" label="WAP"> </do> % <H1>Heading1</H1> <p align="center"> Chau! </p> </card> Heading 2 Heading 3 Heading 4 Heading 5 Text </wml> : !" % /= 8 * : =/ " 8 4 9 9 ( " = !" 7 " 4 ? / 4 - * % C 4 F = % F: B !" 9 ( ( / / : B ,& , 3 8 7 " 2 " 4 =? 4 " + = =? 1! 4 = @ : :: , / !" A 4 , 8 ,A A A G / ( 8 ( / 4 7 ( 2 IJ --! ($( ( K LM $ I1 I (>(! 2(! LM R8 +M&(" < LM E I (>(! 2(! LM R8 KM&(" < LM GGD M Q I (>(! 2(! LM $ 4 I (>(! 2(! LM > I (>(! 2(! LM % / I% M&(" < LM M Q 2 I (>(! 2(! LM < ( I# 1 M&(" < LM M Q Q M&(" < LM ' " % :' M Q 1 4M&("< LMM Q / A LS &% T Q BA ' M MP A M @ B MB M P M , P V M B "4 M , MB M , "4 P B ) B"4 P : $ <h1 align="center">Magnus Force and Projectile Motion <applet code="MagnusG.class" width="480" height="320"> </applet> $ !" $4 * : ! !" :/ 4 / / % @ : 4 B$ %? , W W $ !"4 <script language="JavaScript1.2"> 7 = 9 = = <head> 7 : % 9 function hi(elm) {elm.style.color="red";} function lo(elm) {elm.style.color="blue";} </script> @ : 7 = </head> <body> <span id="texto" class="caption" onMouseOver="hi(this)" onMouseOut="lo(this)"> Hola </span> </body> '3 ' + , : P B A :/ ( V B W ) * " $ 4 P M 2 *M , "4 Q ( V P 4 A - %: I# % P ! B W : B :8 R1 ! B A ( 8 "4 L &! E $M GM Q M&("< LM M Q I (>(! 2(! LM % / AB A UP / A "4 M LM 0NN) G) - O )- $ - NDN)E 4 LM 3 ' 0 N 8 P@3 $ 0G 8 M Q L' ( " '3 = 7 :F " " = % '3 , , (% , % , ,% $ +!"4 = = @ :% 4 #HH, ) , 9 * @ : !", + !" , $ !", %%, @!", % ( +, ( , ) *, 7 !" , %%", 3% , @( 3 B43 / / , , / " ,< 8 ,& A A A 3 >7 5 % = : 4( ? % 4 4 4 !" ; 9= >" , V P void print_error(char *reason) { / printf("<TITLE>Error en la selección/TITLE>%c",LF); '3 % printf("<H1>No se pudo procesar</H1>%c",LF); printf("Se ha producido el error%s.<P>%c",reason,LF); /* ( 7 / 1 3 ( (3 > : !" exit(1); * Ejemplo de cgi } * main(int argc, char *argv[]) { * Respuesta de Errores register int x,m=0; * Lista de opciones " / % 8 ) 4 char *cl; */ char w[256]; #include <stdio.h> char tfile[L_tmpnam]; #define LF 10 printf("Content-type: text/html%c%c",LF,LF); void dumpListaOpciones_htm(char *opcion) { printf("<HEAD>",LF); int x; printf("</HEAD>",LF); char l; cl=getenv("QUERY_STRING"); printf("<OL>", LF); printf("<BODY>",LF); for(x=0;x<5;x++) if((!cl) || (!cl[0])) char *_itoa( x, l, 1); print "$_ es cta de resultado\n"; print_error("Faltan parametros") exit(1); } else { printf("</BODY>",LF); print } "$_ es cta de orden\n"; } } % { } elsif ( /^[4..7]/ ) { if(!(tfp=fopen(tfile,"w"))) { printf("</OL>", LF); 4 print "$_ es cta de balance\n"; tmpnam(tfile); } = ''3 if ( /^[1..3]/ ) dump_ListaOpeciones(cl); printf("<LI> ", Opción , l,LF); : =? % / % % ( <%@ LANGUAGE="VBSCRIPT"%> % !" 9 9= / ; * " <HTML> 9 = 3 " <h1>P&aacute;gina din&aacute;mica</h1> <% for i=1 to 5%> <font size=<%=i%>> </font> :/ 9 & / 4 (% ( % % % 4 !" = /, / $ Hola )9 ) <br> <%next%> </HTML> <?php if(strstr($HTTP_USER_AGENT,"MSIE")) { ?> <center><b>You are using Internet Explorer</b></center> <? } else { ?> <center><b>You are not using Internet Explorer</b></center> <? } ?> 8 , , : , 4 B 5 : % 6 !& " =B +!" & $ 4 , 4 , %%", 3% , @( : ' 3 2 $ 4 B , 7 % 7 * 4 ( 3 !% : / 0 '3 , +!" , % !", + !" , $ !", %%, @!", % +, ( , ) *, % : 2 & = ( A , (% , % , ,% $ +!"4 = / , , " & 2 " / +!" 0$ $, %* / 4 9 & %4 4 0+ 5, + *, + * 0 %%, +%" = 0+%" '9= 0%&' $1!, %(+ 4: / 0= X ? 5 4 " ( !4 9 OD OED ) 3 %1 , ? %!'" : 2 ? , 8 / 4 :, OO , = % -" 4 !"4 ! 5 5 : %'!" 8 = ( % % , C : @ : 7 : @ : %'!" , 5 %'!" % : / 8 8 9 !" +!" 4 5 3 8 %'!" !" ? I Q : = < " */ */ " : +!" : , 9 , 4 4 9 , = : 4 / : - @@@ 9 / +!" & = Estructura de datos en una interfaz típica (EDI, por ejemplo) " !" I Q = I ! >' 2 3 ( = / "ABC47-Z", "100", "STL", "C", "3", "28" F LY Estructura de datos en XML Z Q 0 9 <InventoryItem> <PartNum>ABC47-Z</PartNum> <Quantity>100</Quantity> <Warehouse>STL</Warehouse> <Zone>C</Zone> <Aisle>3</Aisle> <Bin>28</Bin> </InventoryItem> : 4 = & <memo> <to>Todos</to> <from>Juan Carlos Gómez </from> <date>5-NOV-2001</date> <subject>Perros y gatos </subject> <text>Por favor, acuérdense de dejar todos los perros y gatos atados. </text> </memo> $$ +!": < / A 0I = : QI# Q +!" : +!" 9 " / = 0 9 / 4 7 4 9 9 , = $$ / " = = : : 4 [F $ +!" , / A 0 !" * +!" ( = %4 $= List Un Item : : 2 2 +!"$ 8 <!ELEMENT List (Item)+> <!ELEMENT Item (#PCDATA)> = *7 7 %4 8 9 Item 8 $ $4 * F +!"3 <!DOCTYPE <!ELEMENT <!ELEMENT <!ELEMENT <!ELEMENT <!ELEMENT <!ELEMENT ]> ( memo [ memo (to, from, date, subject?, text+) > text (#PCDATA) > to (#PCDATA) > from (#PCDATA) > date (#PCDATA) > subject (#PCDATA) > 4= <!ELEMENT text (#PCDATA|citation|figref)+ > <!ELEMENT citation (#PCDATA) > <!ELEMENT figref (#PCDATA) > 1 <!ELEMENT <!ELEMENT <!ELEMENT <!ELEMENT memo (to, from, date, subject?, (text|figure)+ > figure (graphic, caption?) > graphic EMPTY > caption (#PCDATA) > D / $$ = 3 %1 * * / : : * < $$ % % +!" [ 5 8* / 5 * 4 * 5 +!"%* <xsd:annotation> <xsd:documentation xml:lang="en"> Purchase order schema for Example.com. Copyright 2000 Example.com. All rights reserved. </xsd:documentation> </xsd:annotation> / +" 5 <mythology xmlns:xlink="http://www.w3.org/1999/xlink" xlink:type="extended"> <hero xlink:type="locator" xlink:href="http://www.greece.antique/database/heracles.xml" xlink:role="http://www.greece.antique/hero" xlink:title="Heracles" xlink:label="heracles"> </hero> <god xlink:type="locator" xlink:href="http://www.greece.antique/database/zeus.xml" xlink:role="http://www.greece.antique/god" xlink:title="Zeus" xlink:label="zeus"> </god> <relation xlink:type="arc" xlink:from="zeus" xlink:to="heracles" xlink:arcrole="http://www.greece.antique/relations/father"> xlink:title="is father of" </relation> </mythology> %* ) * , C =? +!"%* , ,$$ 4 %* , 8 A 1 / 2 : , 7 9 * 2 8 * < +!" " 9 : C 0Y $A Z Y $ A 54 !A 4 Z " = = 2 : 2 $: <xsd:element name="comment" type="xsd:string"/> * +!" : , > % <xsd:element name="purchaseOrder" type="PurchaseOrderType"/> <xsd:complexType name="PurchaseOrderType"> <xsd:sequence> <xsd:element name="shipTo" type="USAddress"/> <xsd:element name="billTo" type="USAddress"/> <xsd:element ref="comment" minOccurs="0"/> <xsd:element name="items" type="Items"/> </xsd:sequence> <xsd:attribute name="orderDate" type="xsd:date"/> </xsd:complexType> = " %* %* = \ 2 *4 2 % " <xsd:schema xmlns:xsd="http://www.w3.org/2001/XMLSchema"> $$ ! !/ = <?xml version="1.0" encoding="UCS2" standalone="yes"> <!DOCTYPE memo SYSTEM "http://www.myco.com/dtds/memo.dtd"> * EG * +!"%* " = < / : +!" 4 + ! " # +%" +!"%* C / =/ <?xml version="1.0"?> <bk:book xmlns:bk='urn:loc.gov:books xmlns:isbn='urn:ISBN:0-395-36341-6'> <bk:title>Cheaper by the Dozen</bk:title> <isbn:number>1568491379</isbn:number> </bk:book> / % : + 4 A 8 * 1 % = ! * !" = ( # Q # Q # Q # Q %[" 4 1 $ 4 4 + <link xmlns:xlink="http://www.w3.org/2000/xlink" xlink:type="simple" xlink:href="mydocument.xml#xpointer(//AAA/BBB[1])"> </link> I(((Q I I I I I# (((Q +[ * %% C * C 9 : > N : ( 1 7 4 * / $%! %& +!" <?xml version="1.0"?> <ejemploXSL> <title>XSL</title> <author>Nico</author> </ejemploXSL> = %% 4 7 %%, : : +%" %% 7 %% = +%" +!" Nico !" = <xsl:stylesheet version='1.0' xmlns:xsl='http://www.w3.org/1999/X SL/Transform' > <xsl:template match="/"> <H2> <xsl:value-of select="//author"/> </H2> <H1> <xsl:value-of select="//title"/> </H1> </xsl:template> </xsl:stylesheet> +%" +%" $%! %& <?xml version="1.0"?> <ejemploXSLT> <text tipo="H1">Head1</text> <text tipo="H3">Head3</text> <text tipo="b">Bold</text> </ejemploXSLT> <HTML> <HEAD> </HEAD> <BODY> <H1>Header1</H1> <H3>Header3</H3> <b>Bold text</b> </BODY> </HTML> <xsl:template match="/"> <xsl:for-each select="//text"> <xsl:element name="{@tipo}"> <xsl:value-of select="."/> </xsl:element> </xsl:for-each> </xsl:template> </xsl:stylesheet> +!" = , = +!" 7 = 7 " * / %&' <?xml version="1.0" encoding="iso-8859-1"?> $ 9= : <svg xml:space="preserve" width="400" height="400"> <desc>Círculos</desc> +!" <circle style="fill:black" cx="100" cy="70" r="50"/> :, 3 4 = = , 9 = , A $1! 9 = :F , <circle style="fill:yellow;stroke:green;" cx="130" cy="120" r="45"/> 9 ,= <circle style="fill:none;stroke:red;" cx="160" cy="70" r="50"/> </svg> , / %(+ +!" " 7 4 : * :/ & 3 8 , / = : ' <xsl:stylesheet version='1.0' xmlns:xsl='http://www.w3.org/1 999/XSL/Transform' > * = XSL / = !F %(+ +!" / 4 :/ = F :/ 3= 2 =/ %(+ : 7 !" , +!" :/ : , E -- -- [F @ : \ 3 A Radio Television new s 7 facts = 7 4 / = ,4 é new s advertising facts : á transactions entertainment transactions personal communications news (source: Prof. Nils Englund, 1997) facts advertising facts new s entertainment personal communications Newspaper $ advertising ? Internet advertising facts new s advertising + global + interactive transactions transactions entertainment entertainment transactions personal communications entertainment personal communications personal communications @ : " ! : > , 4 7 ? F , ; , 4 = 4 Archive or Destroy ? 4 / ? = : 4 Banners $ ; [ S Aggregate & Manage 8 Publicidad basada en categoria T Ayudas $ ; [ Review = *: : & Create , 4 ( : 4 : ? : Ofertas Links ( , 4 Informacion y campañas Distribute & Deliver Basadas en el segmento Basados en el perfil personal ) B 5 ? F < Categorizacion Del contenido User Profiling = 8 3 Multi-channel Delivery = ? Web Matching de contenido Con el Entreda de profile contenido correspondiente +!" ! USAR * & % Call Center RECOLECTAR (loop) $ ! WAP * 5 -: 8 = $ 4 >= ANALIZAR % > = O ? 0& Lead ers Chall eng er s • • El cuadrante Mágico de Gartner, es una representacion gráfica de la performance de un vendedor en un segmento del mercado. Microsoft Lotus Vignette • • Platinum Netscape WP • Execute •B ro ad vi sion • Interwoven • OM/FutureTense • Los cuadrantes caracterizan: •Leaders funcionan bien hoy, y tienen una clara vision de la direccion del mecrcado, y estan activamente sosteniendo su posicion de lideres NetObjects • Abilit y to El eje vertical indica la habilidad de ejecutar su estrategia, y el horizontal, indica lo completo de su visión. Inso •Visionarios tienen conciencia de la dirección del mercado, y se preparan para eso, pero no pueden – todavia- ofrecer un servicio optimo en terminos de entrega •Challengers funcionan bien hoy, pero no tiene claro hacia donde cambia el mercado, y en consecuencia no son agresivos en su preparación para el futuro. •Niche Players estan en un segmento particular de su base de clientes (por tamaño, segmento vertical, complejidad de proyecto, etc). Niche Players Adapted from Gartner Group, 7/99 Completeness of Vision Visionaries I) Q I( QI# ( Q I QI# Q I Q \I# I> # Q JI# > I# ) Q Q Q