US008181104B1
`
`(12) United States Patent
`Helfand et al.
`
`(10) Patent N0.:
`(45) Date of Patent:
`
`US 8,181,104 B1
`May 15, 2012
`
`(54) AUTOMATIC CREATION OF CASCADING
`STYLE SHEETS
`
`(75) Inventors: Russ Helfand, Carpenteria, CA (U S);
`Narciso B. J aramillo, Oakland, CA
`(Us)
`
`2/2007 Tunning
`7,178,101 B2
`2003/0025730 A1* 2/2003 Brennan ..................... .. 345/760
`2004/0205605 A1* 10/2004 Adler et al. ................. .. 715/517
`OTHER PUBLICATIONS
`
`Oliver Meyer, ‘aTool-Creating Validated XML Documents on the Fly
`Using MS Word’, published: Oct. 23, 2002, pp. 113-121.*
`
`(73) Assignee: Adobe Systems Incorporated, San Jose,
`CA (U S)
`
`* cited by examiner
`
`( * ) Notice:
`
`Subject to any disclaimer, the term of this
`patent is extended or adjusted under 35
`U.S.C. 154(b) by 384 days.
`
`(21) Appl.No.: 10/930,714
`
`(22) Filed:
`
`Aug. 31, 2004
`
`(51) Int. Cl.
`(2006.01)
`G06F 17/30
`(2006.01)
`G06F 3/00
`(52) US. Cl. ...... .. 715/234; 715/235; 715/236; 715/243;
`715/249
`(58) Field of Classi?cation Search ................ .. 715/517,
`715/513, 522, 51, 510, 234, 235, 236, 243,
`715/249; 707/1
`See application ?le for complete search history.
`
`(56)
`
`References Cited
`
`U-S~ PATENT DOCUMENTS
`7,051,084 B1 *
`5/2006 Hayton et a1. .............. .. 709/219
`7,143,344 B2 * 11/2006 Parker et al. ................ .. 715/236
`
`Primary Examiner * Stephen Hong
`Assistant Examiner * Wilson Tsui
`(74) Attorney, Agent, or Firm *Kilpatrick Townsend &
`Stockton LLP
`
`ABSTRACT
`(57)
`A system and method are described for automatically gener
`ating style sheet formatting for stylistic edits to a Web page in
`a Web development environment. The Web development
`environment detects the user’s selection of particular content
`of the Web page and captures any stylistic changes that the
`user makes to the content. Using the stylistic changes, the
`Web development environment searches a style data structure
`to determine Whether any style rules already exist that corre
`spond to the user’s stylistic changes. If the Web development
`environment does not ?nd a pre-existing style rule, it auto
`matically generates one or more style rules for the stylistic
`edits and associates those rules With the selected content. If a
`pre-existing style rule exists Within the style data structure,
`the Web development environment assigns the pre-existing
`style rule to the selected content.
`
`18 Claims, 25 Drawing Sheets
`
`100
`
`@Mocromediu Dreumweuver MX 2004 — [Untitled Document (MMP64/Exornple t.hlm‘)(XHTML)]
`File
`Edit View Insert Modify Text Commands Site Window Help
`no" e o ll? El EH 2 2
`———i
`-_
`ES lil
`Desi 11
`
`Ill Lorem Ipsum Dolor
`
`TH :
`o re M
`
`- 5' X 1
`UV 09319"
`55v
`“swedwi
`ti"
`divs.css
`— 5 X @- #r0w1 border—bottom:th s...
`r1111 tetra
`“— 00
`0a: e WI
`:
`T” W" n
`
`I
`_ l
`
`
`El N, o. 6’ v 101
`
`102
`
`200
`
`.
`
`\
`
`News
`
`H
`
`r
`
`I
`
`-
`
`_> Code
`:> Application
`
`’VTa <san>
`
`'
`
`'
`
`'i'
`
`Applied Rules Tag
`#col2
`<div>
`style]
`
`Lorem 'ps-Um dalor s't
`Lorem Ipsum dolor sit amet, consectetueradipiscing elit. Donec molestie. Sed
`,
`amet, conseotetuer >
`aliquam sern ut arcu. Phasellus sollicitudin. Vestibulum condimentum tacilisis nulla.
`adipiscing elit. Donec "
`In has habilasse platea dictumsl. Nulla nonummyJ-300 Cras quis libero. Cras
`molestie. Sect aliquam sem
`venenatls. Aliquam posuere lobortis pede. Nullam lringilla urna id Ieo. Praesent
`ut arcu. Phasellus
`aliquet pretlum erat. Praesent non odio. Pellentesque a magna a mauris vulputate
`sollicitudin.
`lacinia. Aenean viverra. Class aptent taciti sociosqu ad litora torquent per conubia nostra.
`per inceptos hymenaeos. Allquam lacus . Mauris magna EVOS, semper a. temper et.
`V301
`rulrum el, torlor.
`<body> <div#main> <div#col2> <div#teature> <p>| <spanvstyle1>
`
`'735X454v 2K/1 SEC
`
`|v Properties
`format: Paragraph
`rgm: Baring, Gnu
`/
`E 104
`
`“Style: stylei
`size:
`/
`105
`
`I _‘ i
`
`In:
`
`107
`
`___
`
`background
`
`.
`
`H
`
`.,
`
`'
`
`color
`ionHamily
`35,, tont»size
`202
`Link: :Elqp font—weight
`i
`“B I
`[#rrwoo lEllllEllEl 1319811 m backgr,un,_,,,m
`\
`\
`.
`,
`106
`201 Page Propertres...
`List Item“, I
`A I], Fuss
`
`001
`
`WhatsApp/Facebook Ex. 1018
`IPR2015-00740
`
`
`
`(12) United States Patent
`Helfand et al.
`
`(10) Patent N0.:
`(45) Date of Patent:
`
`US 8,181,104 B1
`May 15, 2012
`
`(54) AUTOMATIC CREATION OF CASCADING
`STYLE SHEETS
`
`(75) Inventors: Russ Helfand, Carpenteria, CA (U S);
`Narciso B. J aramillo, Oakland, CA
`(Us)
`
`2/2007 Tunning
`7,178,101 B2
`2003/0025730 A1* 2/2003 Brennan ..................... .. 345/760
`2004/0205605 A1* 10/2004 Adler et al. ................. .. 715/517
`OTHER PUBLICATIONS
`
`Oliver Meyer, ‘aTool-Creating Validated XML Documents on the Fly
`Using MS Word’, published: Oct. 23, 2002, pp. 113-121.*
`
`(73) Assignee: Adobe Systems Incorporated, San Jose,
`CA (U S)
`
`* cited by examiner
`
`( * ) Notice:
`
`Subject to any disclaimer, the term of this
`patent is extended or adjusted under 35
`U.S.C. 154(b) by 384 days.
`
`(21) Appl.No.: 10/930,714
`
`(22) Filed:
`
`Aug. 31, 2004
`
`(51) Int. Cl.
`(2006.01)
`G06F 17/30
`(2006.01)
`G06F 3/00
`(52) US. Cl. ...... .. 715/234; 715/235; 715/236; 715/243;
`715/249
`(58) Field of Classi?cation Search ................ .. 715/517,
`715/513, 522, 51, 510, 234, 235, 236, 243,
`715/249; 707/1
`See application ?le for complete search history.
`
`(56)
`
`References Cited
`
`U-S~ PATENT DOCUMENTS
`7,051,084 B1 *
`5/2006 Hayton et a1. .............. .. 709/219
`7,143,344 B2 * 11/2006 Parker et al. ................ .. 715/236
`
`Primary Examiner * Stephen Hong
`Assistant Examiner * Wilson Tsui
`(74) Attorney, Agent, or Firm *Kilpatrick Townsend &
`Stockton LLP
`
`ABSTRACT
`(57)
`A system and method are described for automatically gener
`ating style sheet formatting for stylistic edits to a Web page in
`a Web development environment. The Web development
`environment detects the user’s selection of particular content
`of the Web page and captures any stylistic changes that the
`user makes to the content. Using the stylistic changes, the
`Web development environment searches a style data structure
`to determine Whether any style rules already exist that corre
`spond to the user’s stylistic changes. If the Web development
`environment does not ?nd a pre-existing style rule, it auto
`matically generates one or more style rules for the stylistic
`edits and associates those rules With the selected content. If a
`pre-existing style rule exists Within the style data structure,
`the Web development environment assigns the pre-existing
`style rule to the selected content.
`
`18 Claims, 25 Drawing Sheets
`
`100
`
`@Mocromediu Dreumweuver MX 2004 — [Untitled Document (MMP64/Exornple t.hlm‘)(XHTML)]
`File
`Edit View Insert Modify Text Commands Site Window Help
`no" e o ll? El EH 2 2
`———i
`-_
`ES lil
`Desi 11
`
`Ill Lorem Ipsum Dolor
`
`TH :
`o re M
`
`- 5' X 1
`UV 09319"
`55v
`“swedwi
`ti"
`divs.css
`— 5 X @- #r0w1 border—bottom:th s...
`r1111 tetra
`“— 00
`0a: e WI
`:
`T” W" n
`
`I
`_ l
`
`
`El N, o. 6’ v 101
`
`102
`
`200
`
`.
`
`\
`
`News
`
`H
`
`r
`
`I
`
`-
`
`_> Code
`:> Application
`
`’VTa <san>
`
`'
`
`'
`
`'i'
`
`Applied Rules Tag
`#col2
`<div>
`style]
`
`Lorem 'ps-Um dalor s't
`Lorem Ipsum dolor sit amet, consectetueradipiscing elit. Donec molestie. Sed
`,
`amet, conseotetuer >
`aliquam sern ut arcu. Phasellus sollicitudin. Vestibulum condimentum tacilisis nulla.
`adipiscing elit. Donec "
`In has habilasse platea dictumsl. Nulla nonummyJ-300 Cras quis libero. Cras
`molestie. Sect aliquam sem
`venenatls. Aliquam posuere lobortis pede. Nullam lringilla urna id Ieo. Praesent
`ut arcu. Phasellus
`aliquet pretlum erat. Praesent non odio. Pellentesque a magna a mauris vulputate
`sollicitudin.
`lacinia. Aenean viverra. Class aptent taciti sociosqu ad litora torquent per conubia nostra.
`per inceptos hymenaeos. Allquam lacus . Mauris magna EVOS, semper a. temper et.
`V301
`rulrum el, torlor.
`<body> <div#main> <div#col2> <div#teature> <p>| <spanvstyle1>
`
`'735X454v 2K/1 SEC
`
`|v Properties
`format: Paragraph
`rgm: Baring, Gnu
`/
`E 104
`
`“Style: stylei
`size:
`/
`105
`
`I _‘ i
`
`In:
`
`107
`
`___
`
`background
`
`.
`
`H
`
`.,
`
`'
`
`color
`ionHamily
`35,, tont»size
`202
`Link: :Elqp font—weight
`i
`“B I
`[#rrwoo lEllllEllEl 1319811 m backgr,un,_,,,m
`\
`\
`.
`,
`106
`201 Page Propertres...
`List Item“, I
`A I], Fuss
`
`001
`
`WhatsApp/Facebook Ex. 1018
`IPR2015-00740
`
`
`
`U.S. Patent
`
`May 15, 2012
`
`Sheet 1 of 25
`
`US 8,181,104 B1
`
`amx3”Eo:8-_mE8
`
`
`
`2%LE;Em:£8:
`
`.53
`
`
`
`
`
`_:E__xxH2._o_._m.3\§=a.e..e._uoaE____,_a-ram5....?,,E§o__...sso..§@_
`
`
`
`
`
`
`
`
`
`
`
`i%_._ii;2_.n.1%.aee8:2532x_;2_3;.._B
`
`N22.5
`
`
`
`Em.m:8_oE8:8Emm:_om_q_um5=§8m:oo.$Em._m5_ouE_._mQ_E23
`
`
`
`
`
`
`
`
`
`
`
`
`
`
`
`
`
`
`
`
`
`
`
`
`
`
`
`8.25..:_ma:_oma_um.w_§_m$>£5.9mp__23$5.>EE_.Eo:m__:z..mE2o_umafiammmmznmcom;E._.§__.%u§u._H_uem.m__=:m_m___2~_E2$E_u:8E:_B=mm>.:_u3_u___8m:__mmm.E.85SEmmEm=c__w
`
`
`
`
`
`
`
`
`
`
`
`em=c__~u$..u_am_Mos§§_mzammmi.8.E2:.m___a:EE332oumam_:8o_2258E§c__<
`
`
`
`
`
`
`
`
`
`
`
`..m.=__mmEn._...8_m.:_.m_:_om_22a_§m_5mEmEQWEm2a$Em__&.28:8EmmmmiEmE265
`
`
`
`
`
`
`
`;.___B_u__3
`
`
`
`
`
`
`
`..28:m_e:_8.3E398EOEum2.86am:55Emam$20.m:o>_>:$cm<
`
`gm_m_m_.m__m_EH
`
`
`
`AQVAe3$:w>_uvwm_8%>_u\v.A:_mE%>_uvAéfiw
`
`
`
`
`
`3:2.6E_._.=_:
`
`
`
`
`
`.659:3_m.353.83SEEm_Sm_>_.253E§u__<.mo$_$EESE85an
`
`
`
`
`
`002
`
`VVhatsApp/Facebook Ex. 1018
`|PR2015-00740
`
`002
`
`WhatsApp/Facebook Ex. 1018
`IPR2015-00740
`
`
`
`S.»mAn_Vafl»ES__8__&<A_m_
`
` mm.A>_UV38%H.as.83¢E.__&<mmmoEm>m_mm2o_>m__mmm$_s__=<
`
`
`
`.5%.e§2_.m3w,u_..3_qs
`
`.......a=§$m:.oo.._.mEmH......._;__mV.o_%.E=.8_.E.ao.._
`
`8.._%._AQ9___o.m_a_.a
`
`...mE...§m.S
`
`1.}
`
`1B
`
`oo..4.....;19..._%mE._,.u_§o_9:_S.%D_o_oo-E_=99_oEUW258uE_99_o8
`
`1»...moa-_E=29_oS
`
`M3:”.Am
`
`uE_o_9_oS
`
`EmezoouEase:_
`
`5..pA.=.m%vm..H..._;_%H._
`
`
`
`..:_u3_o_._o.m
`
`..953>__EmE_§
`
`EE
`
`U.S. Patent
`
`5:1Y
`
`
`
`aANN“SUEE9.“:8:M...mx3“Eo=B-EEB
`
`,Tm%_p®»»«DBEEBS8:252:@X..mILs__.Z_o_Eem
`
`9&3
`
` $35mwoMpmm=o_$n_:m_
`
`
`Iowammmm
`
`__UDAEEEU@H:3§
`
`
`
`
`
`a_w_._;o_u:§gm$5228:8»36°:52.22>:32E
`
`
`
`EE:xx.§._._2%_.5\§=5E53253.523-38X2Ezissa2822828
`
`
`
`
`
`
`
`mm.U~r.~2:
`
`2H88Am1MmEEQ@
`T1Now§E8E33E95._
`
`
`
`
`
`
`
`Em.m:mm_oEumcoo..__m.oc_om_a._umazxzommcoo_$EmE_.~o._Hou.HE:.wa_.E30,“.
`
`
`
`
`
`
`
`
`.m_§§_m>£5.98:23£5.>EE::o:232.HmE2u_cmama
`
`
`
`
`
`
`8ms_nEU25.m___:_m_m___o£E:EmE_u:ooE:_3:8>.:_c2_o___8w:__a£§.835E8Emzczm
`
`
`
`
`
`
`
`
`
`
`
`.m_:_%_39.5.?m_._..mEmm_amEm2s$_5__$.28:9.E$m£n_.35E233
`
`
`
`
`
`
`
`
`
`
`
`dame:geaoo.8.539229:umscmosom:59Evanmmm_o.m:m>_>cmo$<
`
`
`
`
`
`
`
`
`
`
`
`
`
`.6_oaE2_m:aEmwwasm:mmE2:55..38.Em:U__<.womm:mEEmoamosan
`
`
`
`
`
`
`
`
`
`
`
`
`
`AE_3m...a%vAavAE2$_%>_uvAm_o9.x>_uvAEmE#>_uvA%oav
`
`.522.EE:::._
`
`$_Eaen_>_
`
`
`
`
`
`§§_mEmmmmi.8_2wasm___9_EEm__:z$3m._:Bo_EuzmoaEm_§_<
`
`
`
`
`
`
`
`003
`
`VVhatsApp/Facebook Ex. 1018
`|PR20‘| 5-00740
`
`003
`
`WhatsApp/Facebook Ex. 1018
`IPR2015-00740
`
`
`
`
`
`
`US. Patent
`
`May 15, 2012
`
`Sheet 3 0125
`
`US 8,181,104 B1
`
`21
`/
`
`FIG. ZB-I
`<?xml version="1.0" encoding="iso-8859—1"?>
`<! DOCTYPE html PUBLIC "—//W3C//DTD XHTML 1.0 Transitional/lEN" "http://www.w3.org/TR/
`xhtmlI/DTD/xhtmII-transitional.dtd“>
`<htmI xmlns:"http://www.w3.org/1999/xhtm|">
`<head >
`<titIe>Untit|ed Document</titIe>
`<Iink re|="stylesheet" hrefz"?le:///C I/Program%20Fi|es/Macromedia/Dreamweaver%20MX%
`202004/Samples/GettingStarted/1-Design/Assets/CSS/divs.css“ type = "text/cs5" / >
`<meta http-equiv="Content-Type" content="text/html; charset= iso-8859-1" />
`</head>
`<b0dy>
`<div id="r0w1">
`<h1>Lorem Ipsum Dolor </h1>
`</div>
`<div id="main">
`<div id="coI2">
`<div id="feature">
`<h1>Tit|e </h1>
`<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit: Donec molestie.
`/ Sed aliquam sem ut arcu. Phasellus soIIicitudin. Veslibulum condimentum
`108 facilisis nulla. In hac habitasse platea dictumst. Nulla nonummy. Cras
`quis libero. Cras venenatis. Aliquam posuere lobortis pede. Nullam fringilla
`urna id Ieo. Praesent aliquet pretium erat. Praesent non odio. Pellentesque
`a magna a mauris vulputate lacinia. Aenean viverra. Class aptent taciti
`sociosqu ad Iilora Iorquent per conubia nostra, per inceptos hymenaeos.
`Aliquam Iacus. Mauris magna eros, semper a, temper et, rutrum et, tortor.</p>
`
`102
`
`<p>Lorem ipsum dolor sit amet, consectetuer adipisoing elit. Doneo molestie.
`Sed aquuam sem ut arou. Phasellus sollioitudin.</p>
`</div>
`</div>
`</b0dy>
`</htmI>
`
`I
`23/ STYLE GENERATOR
`
`TO FIG. 25-2
`
`004
`
`WhatsApp/Facebook Ex. 1018
`IPR2015-00740
`
`
`
`US. Patent
`
`May 15, 2012
`
`Sheet 4 0125
`
`US 8,181,104 B1
`
`FIG. ZB-Z
`
`FROM
`FIG. 25-1
`
`'32
`
`< ?xm| version ="1 .0" encoding ="iso-8859-1"?>
`<i DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/
`xhtmll/DTD/xhtmll -transitional.dld“ >
`<html xmlns="http://www.w3.org/1999/xhtml">
`< head >
`< title> Untitled Document</title>
`< link rel ="stylesheet" hrel="file:///C |/Program%20Files/Macromedia/Dreamweaver%20MX%
`202004/Samples/GettingStarted/l -Design/Assets/CSS/divs.css" type="text./css" />
`< meta http-equiv:"Content-Type" c0ntent="text/html; charset=iso-8859-1"/>
`< style type = "text/ess" >
`< !-
`.stylel {
`font-family: Batang, "GoudyOlSt BT", Haettenschweiler;
`font-size: 18px;
`font-weight: bold;
`color: #FFOOUO;
`
`203
`
`‘=*
`
`.
`
`.
`
`\ < p> <span class="sty|e1"> Lorem |psum dolor</span> srt amet, consectetuer
`adipiscing elit. Donec molestie.
`Sed aliquam sem ut arcu. Phasellus soliicitudin. Vestibulum condimentum
`lacilisis nulla. in has habitasse platea dictumst. Nulla nonummy. Cras
`quis libero. Cras venenatis. Aliquam posuere Iobortis pede. Nullam tringilla
`urna id leo. Praesent aliquet pretium erat. Praesent non odio. Pellentesque
`a magna a mauris vulputate lacinia. Aenean viverra. Class aptent taciti
`sociosqu ad litora torquent per conubia nostra, per inceptos hymenaeos.
`Aliquam lacus. Mauris magna eros, semper a, temper et, rutrum et, torior.</p>
`
`108
`
`'
`
`102
`
`<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Donec molestie.
`Sed aliquam sem ut arcu. Phasellus sollicitudin.</p>
`</div>
`</div>
`</b0dy>
`<html>
`
`005
`
`WhatsApp/Facebook Ex. 1018
`IPR2015-00740
`
`
`
`U.S. Patent
`
`May 15, 2012
`
`Sheet 5 of 25
`
`US 8,181,104 B1
`
`
`
`ENNHEu_>>Em:“Ho::93»1.
`AsamvI«O2H523:2Mao:m_8%J.
`
`mmo.m>_u
`
`@@m@
`
`:o:8__&<A_m_
`
`muooA:
`
`vmmA:mamVmm»»m_
`
`
`mwoEm>m_mm2o_>Eom$Sn__£<
`am»mmsmum__%<
`
` “E3295._~%m...w_.§.E..8:oo_.1=_m.a:_%_a_1umMHwHHH_%.§.o%:.8gem“m.wzm.._.o_o.u...E.:_8_
`.E2.3
`
`
`
`
`
`pm_a_§E2%;%=§ea2.55282::22E2.is=32:XE.IE=:_xx.e=_._m_._s_5\$_==¢E5325E____._a-38X2E82585.._Ee§_§@
`
`
`
`
`
`
`
`
`
`wm.U~n~2:
`
`
`
`amXEHEo=S-aE8tsoimIEX@I..EE.—m_qEmxw
`
`
`
`m._0>.m4m®_>uw DE MjEDUm >*:O>U._
`
`
`
`
`
`Ea:s3.I_
`
`
`
`1.28E32:EP_o._
`
`2.5
`
`
`
`
`
`Em.m__mm.._oEomcoo.=_m9__8_q_um_m=_28m:oo_sE$_m_o_ouE:ma_Em:o._ SN
`
`
`
`
`
`
`
`
`
`
`
`
`
`
`
`
`
`
`
`£5.2B__23£5oom.:\,>EE::o:m___._2..mEeo_umamammmsafiBE5.w___=_m_m_beE=EmE_EooE=_E__$>.:_u2_u___omm=__mmEn_jam5EmmEm:U__m
`
`
`
`,EmezoouEesu:_
`
`
`
`
`
`.659:2.m_..aEmm.85samem_5_~_>_..m:om_._Em.:HU_._<.m8mEEE8585ma
`
`
`
`_.om«\J8:2.3E::P_
`
`
`
`
`
`
`
`.§mo:2258an.8232E2:umscmosom:63E23mmso.E$>_>E$E<.m_:_om_
`
`
`Aauw:.
`
`.m2_.m3.n_..3_3_:W.._.....1.:_u3_o__..8.H:.
`
`
`
`
`
`
`292...;m_5mEmm_amEm%32$__$_.o_uoco:_$muEn_.35E365§a.__m
`
`
`
`
`Em$£n_.om_EE5m___9_EEm__:z$8m_:8o_2258Em_§_<.m_§a:m>
`
`
`
`
`
`
`
`
`
`4ooootfi.(Va4332A;_a2_§vAe3$§§_uVAm_o§:,_uVA:_mE%.>_UVA>uon_v03.AQV
`
`
`
`
`
`
`
`
`
`
`
`
`
`
`
`
`
`28...958>__Em_.E8»
`
`_32m~_m-E2amnewNow$282;>_
`
`
`
`
`..mm__u_A_m_o2:3:,Q.1m..1.«.,.=.1.,1.1_M1V_1@1E§aH_m__m_,m__m_o8o__$Q»2gm.soésaea“.
`........_.__....____2so:_§.1
`
`
`
`E811___§1.1g_mmeEHI1m:5.m=m__m=m._1,_.3%1%EE?E5
`
`
`
`005
`
`VVhatsApp/Facebook Ex. 1018
`|PR20‘| 5-00740
`
`006
`
`WhatsApp/Facebook Ex. 1018
`IPR2015-00740
`
`
`
`
`
`
`
`
`U.S. Patent
`
`May 15, 2012
`
`Sheet 6 of 25
`
`US 8,181,104 B1
`
`FIG. 3B-I
`
`<?xml version="1.0'' encoding ="iso—8859—1 "?>
`<! DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/
`xhtml1/DTD/xhtmI1—transitiona|.dtd">
`< html xmlns="http://www.w3.org/1999/xhtml">
`< head >
`<titIe> Untitled Document</title >
`<Iink re|="sty|esheet" hret="fi|e:///C I/Program%20FiIes/Macromedia/Dreamweaver%20MX%
`202004/Samples/Gettingslarted/1—Design/Assets/CS8/divs.css" type ="lext/css" />
`< meta htlp—equiv="Conten1-Type" conlenl="lexI/hlml; charsetz iso—8859—1 " />
`<sty|e type="text/css">
`< !—
`.sty|e1 {
`font—tamiIy: Batang, "Goudy01St BT", Haettenschweiler;
`tonl—size: 18px;
`tonl—weighl: boid;
`color: #FFO00O;
`
`203
`
`304
`
`}.
`
`sty|e2 {
`tont—fami|y: Batang, "Goudy01St BT", Haettenschweiler;
`font-size: 18px;
`font-weight: bold;
`color: #U0O0FF;
`
`}-—>
`</sty|e>
`</head>
`<body>
`<div id="row1">
`<h1>Lorem|psum Dolor </h1>
`</div>
`<div id="main">
`<div id="co|2">
`<div id="feature">
`<h1>Til|e</h1> 204
`
`200
`
`204
`
`< p> <span c|ass="sty|e1"> Lorem ipsum do|or</Span> sit amel, consectetuer
`adipiscing elit. Donec moleslie.
`Sed aliquam sem ut arcu. Phasellus sollicitudin. Vestibulum condimentum
`tacilisis nulla. In hac habitasse platea dictumst. <span cIass="styIe2">
`Nulla nonummy.</span> Qras
`‘——:\/L-1"
`
`300 quis libero. Cras venenatis. Aliquam posuere lobortis pede. Nullam fringilla
`urna id Ieo. Praesent aliquel pretium erat. Praesent non odio. Pellentesque
`a magna a mauris vulputate Iacinia. Aenean viverra. Class aptent taciti
`sociosqu ad Iitora lorquent per conubia nostra, per inceplos hymenaeos.
`Aliquam lacus. Mauris magna eros, semper a, tempor et, rulrum et, Iortor.</p>
`
`</C“V>
`</div>
`<div id="C0|1">
`<h2>News</h2>
`<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elil. Donec molestie.
`Sed aliquam sem ut arcu. Phasellus sollicitudin.</p>
`</div>
`</div>
`</body>
`<html>
`
`STYLE GENERATOR
`
`FIG. 3B—2
`
`007
`
`VVhatsApp/Facebook Ex. 1018
`|PR20‘| 5-00740
`
`007
`
`WhatsApp/Facebook Ex. 1018
`IPR2015-00740
`
`
`
`U.S. Patent
`
`May 15, 2012
`
`Sheet 7 of 25
`
`US 8,181,104 B1
`
`FIG. 3B—2
`
`<?xml version="1.0" encoding="iso—8859—1"?>
`<l DOCTYPE html PUBLIC "—//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/
`xhtmll/DTD/xhtmll—transitiona|.dld">
`< html xmlns="http://www.w3.org/1999/xhtmI">
`<head>
`<tit|e>Unlitled Documenl</lille>
`< link rel="stylesheel" href="fi|e:///C |/Program%2OFi|es/Macromedia/Dreamweaver%20MX%
`202004/Samples/Getlingstarted/1—Design/Assets/CSS/divs.css" type="texvcss" />
`<meta htlp-equiv="C0nlenl—Type" conlent="lexl/html; charset=iso—8859—1 " />
`<style type="text/css">
`<!--
`.style1 {
`font—family: Batang, "Goudy01St BT", Haettenschweiler;
`fonl—size: 18px;
`font-weight: bold;
`color: #FF0000;
`
`203
`
`304
`
`}.
`
`sty|e2 {
`font—family; Batang, "Goudy01St BT", Haettenschweiler;
`fonl—size: 18px;
`fonl—weighl: bold;
`color: #0000FF;
`
`}—->
`</style>
`</head>
`<body>
`<div id="row1">
`<h1>Lorem Ipsum Dolor </h1>
`</div>
`<div id="main">
`<div id="co|2">
`<div id="leature">
`<h1>Tit|e</h1> 204
`
`200
`
`204
`
`<p> <span class="sty|e1">Lorem ipsum dolor</span> sit amet, consectetuer
`adipiscing elit. Donec moleslie.
`Sed aliquam sem ut arcu. Phasellus solliciludin. Vestibulum condimentum
`facilisis nulla. In hac habitasse platea dictumst. <span c|ass="sty|e2">
`Nulla nonummy.</span> Cras
`L1
`
`300 quis libero. Cras venenalis. Aliquam posuere lobortis pede. Nullam fringiiia
`urna id Ieo. Praesent aliquel pretium erat. Praesent non odio. Pellemesque
`a magna a mauris vulputale Iacinia. Aenean viverra. Class aptenl tacili
`sociosqu ad Iitora torquent per conubia noslra. per inceptos hymenaeos.
`<span class="style1">AIiquam lacus </span>. Mauris magna eros, semper a,
`
`102
`
`301
`
`303
`
`303
`tempor et, rutrum et, tortor.</p>
`</div>
`</div>
`<div id="coI1">
`<h2>News</h2>
`<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Donec molestie.
`Sed aliquam sem ut arcu. Phasellus sol|iciludin.</p>
`</div>
`</div>
`</body>
`<htm|>
`
`008
`
`VVhatsApp/Facebook Ex. 1018
`|PR20‘| 5-00740
`
`008
`
`WhatsApp/Facebook Ex. 1018
`IPR2015-00740
`
`
`
`U.S. Patent
`
`May 15, 2012
`
`Sheet 3 of 25
`
`US 8,181,104 B1
`
`NE.
`
`mfl33¢om__%_<
`1111111M11c_1u12_o___om1
`1%1.1_113.12%5015.1:
`
`
`11..8_an_11.__m9§,._.a_1%
`
`HE_m1m1_EH§_u__.m1.uu1m11.u_._3_o&
`
`pm.558»3X%|
`
`m5>m._msammwo
`
`55.;
`
`
`
`.1.»5:HEo:8-aEBtsorwl_
`
`.a.8.m>_uE
`x.mI
`
`:o__8__&<A
`
`muooA
`
`
`
` AgawvI$2“£23:2“.8:N33»J111%%_,;_.,._:.11.___:8#-._
`_1.m%_.
`
`V»GE
`
`8
`
`
`
`
`
`
`
`
`
`x.EE._2n_Eoxm\.B._2_5EoE3oouo=_E3nvoomxz._o>3;Eo2o2uwEo._uu26
`
`vmmAQVam»>1
`
`
`MW1..~1_m.1.o._o.u1E:8_HEua1_1
`
`
`.1.1uom..m=m1m1_oE18:81
`
`
`
`
`
`11111....11..11....1.1_1»9%a_%_a22§._8gem.11m11
`
`1021/g
`
`®.4...pm._§E_8oB_s_552:.@
`Ea\E..E:_.—2253
`
`S—
`
`._o_on_E32E95
`
`NS
`
` 2+:
`
`
`
`EDDmmmmWM:UE.E1_§é_§Uflfl:25
`
`
`
`
`
`2»:E2;em2.8258t$._.€32tom...32>:3u__.._
`
`
`
`
`
`mmoEm>2mxw_o_>Emmm2_5_E<
`
`
`
`
`
`1a=§$m:oo.sEm11m2mmasE3$.E_u.:1oo1E:_B_.mm>sues.om1w=__mmEn_..5:ES
`
`
`
`
`
`1111111111111.11.1...1_,%e1_>11w1...o119$...21,1.“as1.5%?11.13z.E:_1u__.1%.§1a_§1a._
`
`
`
`._1_._._.1H.§a__21__§31.8.H_is1=11m___18____92:21.1331m1_:.ono1_H21%1no1qEm1_1a__1<H
`
`EmE:ooUE056:_
`
`
`
`4>5EmO__>__Em_..E2
`
`..1m:w-u::29_oS
`cE_o_9_oS
`l.E
`E
`
`DI.
`
`SEE8a1§_..§1
`
`
`
`
`
`11_..._o:91..$E:.Ed_
`
`mm_Eao_n_>_
`
`».11m8-u:=29_oS
`
`1111D_o_oo-u.599_o8
`
`..1_._...1§s1_1.1u1§e31§
`
`
`maefiflta,m__m__m,m_EB
`
`>mgbm2%__%a_%n_umE5m
`
`
`
`EU“swamootoofi.11..“>3am>1.832.150as
`
`ms:1:
`
`4
`
`_iu_€B_E1t..$E8oi%mn__BF
`
`9:2:
`
`
`
`V9gum
`
`
`
`
`
`u§31_:>m__.=1mEagame._§%2$__$111o_u1o1:o:E03131.1§9E2.$1a111H...§w1o.._m_§.:oSHma1Egg§__11§§_§1_H_.§1.a1.§a1_1111s_19_:__1§_.m.,.sHH.1m1._.:1_u1m_H
`
`
`
`
`
`
`
`
`
`
`
`
`
`
`
`009
`
`VVhatsApp/Facebook Ex. 1018
`|PR20‘| 5-00740
`
`009
`
`WhatsApp/Facebook Ex. 1018
`IPR2015-00740
`
`
`
`
`
`
`
`
`
`
`
`US. Patent
`
`May 15, 2012
`
`Sheet 9 0125
`
`US 8,181,104 B1
`
`'3‘
`
`FIG. 4B-1
`<?xml version="1.0" encoding="iso-8859—1"?>
`<! DOCTYPE html PUBLIC "—//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/
`xhlmll/DTD/xhtmll -transili0nal.dtd">
`<html xmlns ="http://www.w3.org/1999/xhtml">
`<head>
`<lit|e>Untitled Document</tille>
`<link rel="stylesheet" href=“file:///C |/Program%20Files/Macromedia/Dreamweaver%20MX%
`202004/Samples/GettingStarted/l -Design/Assets/CSS/divs.css" type:"text/css“ />
`<meta http-equiv="Content-Type" content="text/html; charset=iso-8859—1"/>
`</head>
`<b0dy>
`<div id="r0w1">
`<h1>Lorem Ipsum Dolor </h1>
`</div>
`<div id="maln">
`<div id="col2">
`<div id="fealure">
`<h1>Tille </h1>
`<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Donec molestie.
`/ Sed aliquam sem ut arcu. Phasellus sollicitudin. Vestibulum oondimentum
`108 facilisis nulla. In hac habitasse platea dictumsl. Nulla nonummy. Cras
`quis libero. Cras venenatis. Aliquam posuere lobortis pede. Nullam lringilla
`urna id Ieo. Praesenl aliquet pretium erat. Praesent non odio. Pellentesque
`a magna a mauris vulputate Iacinia. Aenean viverra. Class aptent taciti
`sociosqu ad litora torquent per conubia nostra, per lnceptos hymenaeos.
`Aliquam Iacus. Mauris magna eros, semper a, tempor e1, rulrum et, tortor.</p>
`</div>
`</div>
`<div id="00|1">
`<h2>News</h2>
`<p>Lorem ipsum dolor sit amet, consectetuer adipisclng elit. Donec molestie.
`Sed aliquam sem ut arcu. Phasellus sollicitudin.</p>
`</div>
`</div>
`</b0dy>
`</html>
`
`102
`
`108
`
`l
`43/ STYLE GENERATOR
`
`TO FIG. 48—2
`
`010
`
`WhatsApp/Facebook Ex. 1018
`IPR2015-00740
`
`
`
`US. Patent
`
`May 15, 2012
`
`Sheet 10 0125
`
`US 8,181,104 B1
`
`FIG_ 4B_2
`
`FROM
`FIG. 4B-1
`
`41
`/
`
`<7me version ="1.0" encoding ="iso-8859—1"?>
`<l DOCTYPE html PUBLIC "—//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/
`xhtmll /DTD/xhtml1 -transiti0nal.dtd">
`< html xmlns:"http://www.w3.org/1999/xhtml">
`< head >
`< title > Untitled Document </title >
`< link rel="stylesheet" href="lile:///C |/Program%20Files/Macromedia/Dreamweaver%20MX%
`202004/Samples/GettingStarled/1-Design/Assets/CSS/divs.css" type="texl/css" />
`< meta http—equiv="Content-Type“ content: “text/html; charset=iso-8859-1" />
`
`<style type="texl/css">
`<1——
`.style3 {
`font-family: "Century Gothic";
`font-size: 14px;
`color: #OOFFOO;
`
`402
`
`}
`-->
`</slyle>
`</head>
`<body>
`<div id=“r0w1">
`<h1>Lorem lpsum Dolor </h1>
`</div>
`<div id:“maln">
`<div id="col2">
`<div ld="feature“>
`<h1>Title</h1>
`401
`==
`108 \ <p class="slyle3“>Lorem ipsum dolor sit amet. consecletuer adipisclng elit.
`Donec molestie.
`Sed aliquam sem uI arcu. Phasellus solliciludln. Vestibulum condimenlum
`facilisis nulla. In hac habitasse platea dictumsl. Nulla nonummy. Cras
`quis libero. Cras venenatisv Aliquam posuere loborlis pede. Nullam fringilla
`urna ld leo. Praesent aliquet pretium erat. Praesent non odio. Pellentesque
`a magna a mauris vulputate lacinia. Aenean viverra. Class aptent tacili
`sociosqu ad litora torquent per conubia nostra, per inceptos hymenaeos.
`Aliquam lacus. Mauris magna eros, semper a, tempor et, rutrum et, t0rtor.</p>
`</div>
`</div>
`<div id="col1">
`<h2>News</h2>
`<p>Lorem ipsum dolor sit amet, consecleluer adiplscing elit. Donec molestie.
`Secl aliquam sem ut arcu. Phasellus sollicitudin.</p>
`</div>
`</div>
`</b0dy>
`<html>
`
`108
`
`102
`
`011
`
`WhatsApp/Facebook Ex. 1018
`IPR2015-00740
`
`
`
`U.S. Patent
`
`May 15, 2012
`
`Sheet 11 of 25
`
`US 8,181,104 B1
`
`
`
`
`
`m8.m>_um_XE
`
`
`
`§>oix1.I.Emm“Eu?Em:so::81»L...mx3HEo:B-_m.EB
`
`EMQ@
`
`Am_bmVI«.35E_3=228:98%IJ
`
`
`
`S_§__%<1mH1.
`
`
`
`2.8.3...NS2.5
`
`%§HW__EBM__
`
`EcoE32Eo._o._
`
`
`
`..E=:2aEmxm_31EE._.m_aEmxm_
`
`
`
`pm_a_mmo>_m_..__o_._.52;ea...2ass8two»$2.2E2;32>=3c__.._
`
`
`
`
`
`
`
`m_m>m4mmzbwwwo avgWM7DEUm_E>¢3o>U._
`
`Ew>m_mmm5_>mEmwB:£_=<
`
`
`
`
`
`
`
`
`
`
`
`I..,Em..mfimEE8:3..SmgamfifimEemammzeo.mEE.a§%E33E33
`
`.u2,?E.5 __,,,.,,._%,_,...,_,,,._.533.151
`
`
`
`
`
`
`,.H,..H.o_2_.o.n_.gm9_._%_..___..m.m.¢m%:.§$9.93.:manQ6.>.EE::o:$32.mE:B.SEmu%.§.5Eum:E.,H.....§...m..a.m_.m__.._ou.gem$3:m_5\.G&EEtmEE:ouE:S§mm\_.:_.n:__u.on_m=_.a2_a..353E3.Emzgm
`
`
`
`
`
`
`
`
`
`
`
`
`
`
`
`
`
`E%HEm_E__mHuom.o_wm_HoE§§E=%..§m.3Ewasm\\.5:.SE332«EumfionsEmawoqEm:E\<
`
`H.........:_u=._u.___%
`
`
`
`......§..S=NBESQanE338SSSE38.6%.c.a.&Emfimmmmfi....S.§.:zmmcflx
`
`
`
`
`
`
`
`
`
`
`
`
`
`.H..........._m:__8m_#__.:8.3=,.m.E.a$&m.sq\§m.§mEwm§mEmm3m$:$Bn..23SEEmmmfiu.«maEacmi
`
`
`
`
`
`
`
`
`
`
`
`
`
`x.mIE..==xx.e_,_._m_._e3\$.§3.5233_:_._.._a-:8X:Ea_;e3a%2__§§@
`
`
`
`
`
`
`
`
`
`VbGE8
`
`
`
`Eoeaoou25:8E
`
`4_m__<.§2_$>__Em_-E20%_.\v:.vvmvxmmx
`
`
`
`
`
`
`ANm_2m.:m%vAaVAm::m2%>_uVAm_o§:,_uvA:_mE%>_uvA>UonV
`
`2529.08»
`
`_..mzm-u::o_9_oEpmNewmommu_Eao_n_>._
`
`
`
`
`HHHH._.I.........mT_uE.._o_._..m..m_.2.__..1..__...2_U_.m..V__um_._..EDES.Hmm".mm88%,,EEEEEm»_m__<_§2_8:3..xomnIE.I
`
`
`
`
`
`
`
`
`
`
`
`
`_H_a_8-E8_9_§©@9_E_H_.2:ml”mm~m.mmém.m_a3fll___%a2$E58
`
`
`
`
`
`$_:A:4...e2_;m:__p..$_t8oi2§_5m9:wowwig.
`
`3:2.3ESE
`
`
`
`
`
`
`
`..$.BQEm<.m$qEmm.86w:umEm.::m§.m:..§Emapsx.m8w=mE\E8_§8E>3
`
`
`
`
`
`
`
`
`
`012
`
`VVhatsApp/Facebook Ex. 1018
`|PR2015-00740
`
`012
`
`WhatsApp/Facebook Ex. 1018
`IPR2015-00740
`
`
`
`
`
`
`
`US. Patent
`
`May 15, 2012
`
`Sheet 12 0f 25
`
`US 8,181,104 B1
`
`FIG. 53-1
`
`’3‘
`
`<?me version ="1.0" encoding ="iso-8859-1"?>
`<l DOCTYPE html PUBLIC "—//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.0rg/TR/
`xhtmll/DTD/xhtmll -transitional.dtd" >
`<htm| xmlns="http://www.w3,org/l 999/xhtm|">
`< head >
`<title > Untitled Document </tit|e >
`<|ink rel="sly|esheet" hrei="file:///C |/Program%20Files/Macromedia/Dreamweaver%20MX%
`202004/Samples/GettingSiarIed/1-Design/Assets/CSS/divsoss" type="text/css" />
`< meta http-equiv="C0ntent—Type" content: “text/hlml; charset=iso-8859-1" />
`
`.
`.
`.
`.
`.N 501
`108
`\ <p> <|>Lorem lpsum dolor srt amet, consectetuer adipiscmg ellt.
`Donec molestie.
`Sed aliquam sem ut arcu. Phasellus soliicitudin. Vestibulum condimentum
`facilisis nulla. In hac habitasse platea dictumsl. Nulla nonummy. Cras
`quis libero. Cras venenatis. Aliquam posuere lobortis pede. Nullam fringilla
`urna id leo. Praesent aliquei pretium erat. Praesent non odio. Pellentesque
`a magna a mauris vulputate lacinia. Aenean viverra. Class aplenl lacili
`sociosqu ad Iitora lorquent per conubia nostra, per inceptos hymenaeos.
`Aliquam lacus. Mauris magna eros, semper a, tempor et, rulrum et, tortor.<i> </p>
`</div>
`
`<div id="col1">
`<h2>News </h2>
`<p>L0rem ipsum dolor sit amet, consectetuer adipiscing elit. Donec molestie.
`Sed aliquam sem ut arcu. Phasellus sollicitudin.</p>
`</div>
`</div>
`</b0dy>
`</htm|>
`
`l
`53/ STYLE GENERATOR
`
`TO FIG. 58—2
`
`013
`
`WhatsApp/Facebook Ex. 1018
`IPR2015-00740
`
`
`
`U.S. Patent
`
`May 15, 2012
`
`Sheet 13 0125
`
`US 8,181,104 B1
`
`FIG. 5B—2
`
`<?xml version ="1.0" encoding = "iso—8859—1 "?>
`<! DOCTYPE html PUBLIC "—//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.0rg/TR/
`xhtmll/DTD/xhlmll —transitional .dld">
`<html xmlns="hllp://www.w3.org/1999/xhtml">
`< head >
`<title > Untitled Documenl</title >
`
`< link re|="sty|esheel" hrel="fi|e:///C I/Program%20Files/Macromedia/Dreamweaver%20MX%
`202004/Samples/Getlingstarled/1—Design/Assets/CSS/divs.css" type="texl/css" />
`< meta http—equiv= "C0nlent—Type" content: "lext/html; charsel= iso—8859—1 " />
`
`="text/css" >
`
`lont—family: Geneva, Arial, Helvetica, sans—seril;
`font—weight: bold;
`color: #FF0000;
`
`505
`
`}-
`
`->
`
`</sly|e>
`</head>
`<body>
`<div ld="row1">'
`<h1>Lorem ipsum Dolor </h1>
`</div>
`<div id="main">
`<div id="col2">
`<div id="feature">
`<h1>Title</h1>
`
`<p> <i > Lorem ipsum dolor sit amet, consecletuer adipiscing elit. Donec
`
`504‘/\ Sed aliquam sem ul arcu. </i> <span class="style2">Phasellus sollrcitudm.
`</span> <i> Veslibulum condimentum
`L’:
`=5(~‘)2=’
`lacilisis nulla. In hac habitasse platea dictumsl. Nulla nonummy. Cras 500
`quis libero. Cras venenatis. Aliquam posuere lobortis pede. Nullam fringilla
`urna id leo. Praesent aliquet pretium erat. Praesent non odio. Pellentesque
`a magna a mauris vulpulale lacinia. Aenean viverra. Class aptenl tacili
`sociosqu ad lilora torquenl per conubia noslra, per inceplos hymenaeos.
`Aliquam lacus. Mauris magna eros, semper a, temper et, rutrum et, tor‘lor.</i>
`\
`501
`
`102
`
`<div id="col1">
`<h2>News</h2>
`<p>Lorem ipsum dolor sit amet, consecteluer adipiscing elit. Donec moleslie.
`Sed aliquam sem ul arcu. Phasellus sollicitudin.</p>
`</div>
`</div>
`</body>
`<hlm| >
`
`014
`
`VVhatsApp/Facebook Ex. 1018
`|PR20‘| 5-00740
`
`014
`
`WhatsApp/Facebook Ex. 1018
`IPR2015-00740
`
`
`
`U.S. Patent
`
`May 15, 2012
`
`Sheet 14 of 25
`
`US 8,181,104 B1
`
`vmmAQV3>:
`
`,.:._m.22..E:8_.E23.
`
`mwOEw>m_mmm_o_>m__mmm$:n_E<
`
`
`
`H....aam§..w:8_...:_e.m..
`
`2.8An
`
`_._o_=8__%<A_u_
`
`HM__..__....._$3.2
`
`9:.mm_=m_um_aq<
`
`
`
`
`_E3.E£a.__mEm..m_.w2o_E..
`
`
`._.oa_._.oo..__m9.__8a_um.
`
`1x%I
`
`pmsame»E
`
`933mmrcmwwo
`
`
`
`
`
`Smxa_._Eo=8-.mEoptsoim-1.
`
`m8.m>_u_.w_
`XEI
`
`
`
`
`
`
`
`SE_._xx.s:_._o_._eea>.$=5E233B_.__.=a-33X:E232352.3228...6v665%
`
`
`
`
`
`
`
`»EmmmmWM:H_D_E.m_§__.§EEmH:35
`
`
`
`1EE._.maEmxm_as.‘E23m_qEmxm
`
`
`
`
`
`&o_._sees,gm35258tsp£32E2;22>=32:
`
`@EQG
`
`~_8%J2%NEE;Em:28::8%-._
`
`
`AgzmvIE:“£2;:2£8:
`
`TmAWT®JéDEEes8E___=52:@
`
`BE,3.I
`
`
`
`::
`
`
`
`L28EsmeEm._o._
`
`coo»/Q...
`
`
`
`NS25
`
`
`
`...m§§.§.a&ES=mE§Bu.EE:§wm\___.SbEBSom_w§mmm§..\.§.m..35%E333H.._H.Em..m.cw.m.€E..§a_qam.u.S%.§mmEambmmcou_..~..wE3.a§%_8:3»E83.
`
`
`
`
`
`
`
`
`
`
`
`
`
`
`
`...,§%=§.m._G_._a....§E%.§u.xEE::8.m§.2...mE.z.§u.megmmmmfissume.5
`
`
`
`
`
`
`
`
`
`
`
`
`
`
`
`
`
`....gmaofiEmmmfio...3‘.E.«:3.wS%.SEmizfl.3333,Emameq.E332».
`
`
`
`.u__2_m_am-E2.
`
`_2_:e9_...spmmeNewm2:mqo.n_>_
`
`>II.II
`
`;.D..§e._EU_E9m._.nlmwluMmUEm>soodcfimmEon.
`
`I
`.._o_ov.u.::o:_.,..E.I
`
`
`
`
`
`
`
`n,,,.._w:m.u::o_.mv_o.mn._%AN_@_E_H_2::WHMMHmNm>mmwam£5€239.umE5u_
`
`mma|E1:S:
`mow
`
`
`
`
`
`
`
`4sow:dcswm>__Em_.E298Iv:émimfiAmmsfivAQVA2_._:w2%>_uvAw._8%>_cvA:_mE%>_uvAéopv
`
`
`
`
`
`
`
`
`
`
`
`
`
`
`
`....An_V.:w.m_am_........=_E:_.o____.omH.M..§%§€§uafifiauewasR_§%%_s§.§%_.&mG_.§§:%%$x
`
`:..........:.....,,..;:..€.sqE$.535%..mEm.m§mE..m§§..8m:.:.§§.<..w8m§E\s.8E8£Eu,
`
`
`
`_:mE:uoUEm:._:uE.....i....§.0_tE.__\m..EhgS\,
`
`
`A>_uv38%...m2._mm§..:eS=....m.§§m.§:s:\__m§m.E.mEQEw_m§m$=§mm..&E%=.s%,.,.$,_.§_..s§%.
`
`
`
`
`
`
`
`
`
`
`015
`
`VVhatsApp/Facebook Ex. 1018
`|PR2015-00740
`
`015
`
`WhatsApp/Facebook Ex. 1018
`IPR2015-00740
`
`
`
`
`
`
`
`
`
`US. Patent
`
`May 15, 2012
`
`Sheet 15 0125
`
`US 8,181,104 B1
`
`<?me version ="1.0" encoding ="iso-8859—1"?>
`<l DOCTYPE html PUBLIC "-//WSC//DTD XHTML 1.0 Transitional//EN" "http://www.w3,0rg/TR/
`xhtmli/DTD/xhtmlt -transiti0nal.dtd">
`<htm| xmlns=“http://www.w3.org/1999/xhtml">
`< head >
`<tit|e > Untitled Document </tit|e >
`< link rel ="stylesheet" hret="ti|e:///C |/Program%20Files/Macromedia/Dreamweaver%20MX%
`202004/Samples/GetlingStarted/t -Design/Assels/CSS/divs.css" type="lext/css“ />
`< meta http-equlv="Content—Type" content: "text/hlml; charsel= iso-8859-1" />
`
`-
`P5501
`108
`\ < p> < l > Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
`Donec molestie.
`Sed aliquam sem ut arcu. Phasellus sollicitudin. Vestibulum condimentum
`facilisis nulla. ln hac habitasse platea dictumst. Nulla nonummy. Cras
`quis libero. Cras venenatis. Aliquam posuere lobortis pede. Nullam tringilla
`urna id leo. Praesent aliquet pretium erat. Praesent non odio. Pellentesque
`a magna a mauris vulputate lacinia. Aenean viverra. Class aptent taciti
`sociosqu ad litora torquent per conubia nostra, per inceptos hymenaeos.
`Aliquam Iacus. Mauris magna eros, semper a, tempor et, rutrum et, tortor.<i> </p>
`
`<p>Lorem ipsum dolor sit amet, oonsectetuer adipiscing elit. Donec molestie.
`Sed aliquam sem ut arcu. Phasellus sollicitudin.</p>
`</div>
`</div>
`</b0dy>
`</htm| >
`
`l
`53 _/ STYLE GENERATOR
`
`TO FIG. 68—2
`
`016
`
`WhatsApp/Facebook Ex. 1018
`IPR2015-00740
`
`
`
`US. Patent
`
`May 15, 2012
`
`Sheet 16 0125
`
`US 8,181,104 B1
`
`FIG_ 6B_2
`
`FROM
`FIG. 6B-1
`
`61
`
`<?xml version="1.0" encoding ="iso-8859-1"?>
`<! DOCTYPE html PUBLIC "-//WSC//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/
`xhtmll/DTD/xhtmll -transitional.dtd“ >
`< html xmlns="http://www.w3.0rg/1999/xhtml">
`< head >
`< title > Untitled Document </tit|e>
`<|ink rel=“sty|esheet" hret="file:///C l/Program%20Files/Macromedia/Dreamweaver%20MX%
`202004/Samples/GettingStarled/l -Design/Assets/CSS/divs.css" type="text/css" />
`< meta http-equiv= "Content-Type" content= "texVhtml; charset=iso-8859-1" />
`
`<style type="text/css">
`<!——
`.styleZ {
`font-family: Batang, "Goudy01St BT", Haettenschweiler; 602
`} iont style. italic, \ 603
`
`-->
`</sty|e>
`</head>
`<b0dy>
`<div id="row1">
`<h1>Lorem lpsum Dolor </h1>
`
`<div id="teature">
`108
`<h1>Title </h1>
`\<p class=“style2">Lorem ipsum dolor sit amet, consectetuer adipiscing elit.
`=V=
`Donec molestie.
`601
`Sed aliquam sern ut arcu. Phasellus sollicitudin. Vestibulum condimentum
`facilisis nulla. ln hac habitasse platea dictumst. Nulla nonummy. Cras
`quis libero. Cras venenatis. Aliquam posuere lobortis pede. Nullam tringilla
`urna id leo. Praesent aliquet pretiurn erat. Praesent non odio. Pellentesque
`a magna a mauris vulputate lacinia. Aenean viverra. Class aptent taciti
`sociosqu ad litora torquent per conubia nostra, per inceptos hymenaeos.
`Aliquam lacus. Mauris magna eros, semper a, temper et, rutrum et, tortor.</p>
`</div>
`</div>
`<div id="col1">
`<h2>News </h2>
`<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Donec molestie.
`Sed aliquam sem ut arcu. Phasellus sollicitudin.</p>
`</div>
`</div>
`</body>
`<html >
`
`108
`
`102
`
`017
`
`WhatsApp/Facebook Ex. 1018
`IPR2015-00740
`
`
`
`U.S. Patent
`
`025:1W
`
`U
`
`1B4010}1
`
`
`
`M...mm_£u_>>Ea_Zmo__:8%1amx3”Eo=B-aEBtsorw1.
`
`
`
`m8.w>_u_m_
`
`E:
`
`
`
`max:._o>uo:am_\o_u.o.Eo._ou2
`
`nwe25
`
`
`
`
`
`....Hwmagm..Emmm.fin..T..e.$.a....m.Eq.m\.%.=EHE§:z..%.wq.&Eqs0:‘§:m:__m8E...:eS=.7553.fissawfimfi£e@£w§_aau\\m_m$3.5:§.§nZ.§.§§aU._B_.%wo.u..E§§.\H..:wc.m.Em..s.a._mm.\.u_..A£EEo:m§>\HwssusHmmG..Em.£\..
`
`
`
`
`s_...Esassass.%38%aaVm._aa_a_.w~_M.._~_m._=_;m_mms\n.u.eEMea&
`
`
`
`
`
`$.a.E$3.53.23S.MH..m.\3:T.m_a..$n®...Ee.=.m£.s:.8.E:\:§mm\_..=.se..a.$.q.mm.:.\_\mwmE58m.3.s%s_§s.~
`
`
`
`
`
`02);
`
`
`
`W_,_m__<_m>m:mm>__EE-Eo_
`
`I22.32
`
`fltaco?8I”s
`
`msaa..S.§§_S2.&%§_%8§2.§Euam3%_.m§.:.%%%.35.Em:§_\...momm:mE\EmoE8Eg3H;;..__AmxfiG..c_u2_o___8_H;.§w8
`
`
`
`
`
`
`
`.$mqEmm.wE.mm:mmE.m§§\.;5E8oE_§=_S__MA‘.._£...u_...._.§%.€§_5.Eks.Ee
`
`018
`
`VVhatsApp/Facebook Ex. 1018
`|PR20‘| 5-00740
`
`018
`
`WhatsApp/Facebook Ex. 1018
`IPR2015-00740
`
`
`
`US. Patent
`
`May 15, 2012
`
`Sheet 18 0125
`
`US 8,181,104 B1
`
`FIG. 7B-]
`<7me version ="1.0" encoding = "iso-8859-1 "?>
`<! DOCTYPE html PUBLIC "-//WBC//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/
`xhtmli /DTD/xhtml1 -transitiona|.dtd" >
`< html xmlns ="http://www.w3.org/1999/xhtml">
`< head >
`<tit|e > Untitled Document</title >
`<|ink re|:"stylesheet" href="tile:///C |/Pr0gram%20Files/Macromedia/Dreamweaver%20MX%
`202004/Samples/GettingStarted/i -Design/Assets/CSS/dlvs.css" type="text/css" />
`< meta http-equiv=“Content-Type" content: "text/html; charset=iso-8859-1" />
`
`<style type="text/css">
`<!—
`.style2 {
`
`color: #OOOOFF; 701
`font-style: italic;
`
`<h1>L0rem lpsum Dolor </h1>
`</div>
`<div id="main">
`
`<div id="feature">
`08 <h1>TitIe </h1>
`1
`'\ <p class="sty|e2">Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Donec
`molestie. ‘=V="
`702
`Sed aliquam sem ut arcu. Phasellus soilicitudin. Vestibulum condimentum
`facilisis nulla. In hac habitasse platea dictumst. Nulla nonummy. Cras
`quis libero. Cras venenatis. Aliquam posuere lobortis pede. Nullam iringilla
`urna id leo. Praesent aliquet pretium erat. Praesent non odio. Pellentesque
`a magna a mauris vulputate lacinia. Aenean viverra. Class aptent taciti
`sociosqu ad litora torquent per conubia nostra, per inceptos hymenaeos.
`Aliquam lacus, Mauris magna eros, semper a, temper et, rutrum et, iortor.</p>
`</div>
`</div>
`<divid:"co|1">
`<h2>News</h2>
`<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Donec molestie.
`Sed aliquam sern ut arcu. Phasellus sollicitudin.</p>
`</div>
`</div>
`</body>
`<html>
`
`108
`
`019
Accessing this document will incur an additional charge of $.
After purchase, you can access this document again without charge.
Accept $ Charge
Still Working On It
This document is taking longer than usual to download. This can happen if we need to contact the court directly to obtain the document and their servers are running slowly.
Give it another minute or two to complete, and then try the refresh button.
A few More Minutes ... Still Working
It can take up to 5 minutes for us to download a document if the court servers are running slowly.
Thank you for your continued patience.
This document could not be displayed.
We could not find this document within its docket. Please go back to the docket page and check the link. If that does not work, go back to the docket and refresh it to pull the newest information.
Your account does not support viewing this document.
You need a Paid Account to view this document. Click here to change your account type.
Your account does not support viewing this document.
Set your membership
status to view this document.
With a Docket Alarm membership, you'll
get a whole lot more, including:
- Up-to-date information for this case.
- Email alerts whenever there is an update.
- Full text search for other cases.
- Get email alerts whenever a new case matches your search.
One Moment Please
The filing “” is large (MB) and is being downloaded.
Please refresh this page in a few minutes to see if the filing has been downloaded. The filing will also be emailed to you when the download completes.
Your document is on its way!
If you do not receive the document in five minutes, contact support at support@docketalarm.com.
Sealed Document
We are unable to display this document, it may be under a court ordered seal.
If you have proper credentials to access the file, you may proceed directly to the court's system using your government issued username and password.
Access Government Site
