(12) United States Patent
`Kagle
`
`USOO67791.53B1
`(10) Patent No.:
`US 6,779,153 B1
`(45) Date of Patent:
`Aug. 17, 2004
`
`(54) CREATION OF WEB PAGES THROUGH
`
`SYNCHRONIZATION
`
`-
`
`OTHER PUBLICATIONS
`Lemay “Teach Yourself Web Publishing with HTML in 14
`days”, 1995, pp. 381-391.*
`(75) Inventor: Jonathan Kagle, Redmond, WA (US)
`Mack et al., “HTML 4.0 No Experience Required”, 1997,
`(73) Assignee: Microsoft Corporation, Redmond, WA pp. 542–546.*
`(US)
`Rodenthal, Adobe SiteMill 1.0: Site Managment Made Easy,
`Internet 1998, pp. 1-2.
`Lemay, Teach Yourself Web Publishing with HTML 3.0 in
`a Week, Sams.net Publishing 1996, pp. 46-47.
`Adams et al., “Template Style Considerations for Sea-of
`Gates Layout Generation", 26". ACM/IEEE Design Auto
`mation Conference(R), pp. 31-36, 1989.
`Fernández et al., “Catching the Boat with Strudel: Experi
`ences with a Web-Site Mangement System”, pp. 414-425,
`1998.
`Primary Examiner Stephen S. Hong
`(74) Attorney, Agent, or Firm-Banner & Witcoff, Ltd.
`(57)
`ABSTRACT
`
`(*) Notice:
`
`-
`Subject to any disclaimer, the term of this
`patent is extended or adjusted under 35
`U.S.C. 154(b) by 0 days.
`
`(21) Appl. No.: 09/300,141
`(22) Filed:
`Apr. 27, 1999
`
`Related U.S. Application Data
`(60) Provisional application No. 60/111.999, filed on Dec. 11,
`1998.
`
`(51) Int. Cl. ................................................ G06F 17/21
`
`(52) U.S. Cl. ....................... 71.5/522; 71.5/517; 715/530;
`71.5/513; 715/501.1
`
`(58) Field of Search ................................. 707/513,522;
`709/218; 71.5/522,501.1, 513,517, 523,
`530, 531; 34.5/751, 733
`
`(56)
`
`References Cited
`U.S. PATENT DOCUMENTS
`
`5,845,299 A 12/1998 Arora et al.
`5,864,338 A * 1/1999 Nestor et al. ............... 345/866
`5,893,127 A 4/1999 Tyan et al.
`5,898,836 A 4/1999 Freivald et al.
`5.937,418 A 8/1999 Ferris et al.
`5,966.535 A 10/1999 Benedikt et al.
`6,021,426 A 2/2000 Douglis et al. ............. 709/200
`6,026,433 A
`2/2000 D’Arlach et al. ............. 707/10
`6,035,323 A * 3/2000 Narayen et al. ......... 707/501.1
`6,112,242 A 8/2000 Jois et al.
`6,122,661 A 9/2000 Stedman et al.
`6,141,666 A * 10/2000 Tobin .......................... 705/27
`6,185.587 B1
`2/2001 Bernardo et al.
`(List continued on next page.)
`
`
`
`Creation of web pages on hand-held devices Such as digital
`cameras and personal digital assistants (PDAS) is made
`feasible by a System for generating mark-up language based
`on a compact template mapping file created on the hand-held
`device. Through a user interface, a user of the hand-held
`device creates the template mapping file, which asSociates a
`Selected on of the templates stored on the host computer with
`one or more Source files, which may include text, image and
`audio files. HTML templates (files containing the actual and
`usually lengthy formatting commands that accomplish the
`Style Selected by the user) and other large files needed to
`create compelling web pages reside on the host computer,
`not on the hand-held device. In a Synchronization operation,
`where the hand-held computer is operably connected to the
`host computer, the Source files are merged with the Selected
`Style templates according to mapping information in the
`template mapping file. The invention is especially applicable
`to digital cameras having features of a PDA and provides
`users with the capability to remotely create their own
`websites which incorporate images they have obtained with
`the digital camera.
`
`57 Claims, 8 Drawing Sheets
`
`( START
`
`Bf
`N-generatepancre
`
`MERGEAsef Awolo
`FLENAMES AND PAHs
`828
`tNEAPPROPRATE N-7
`reRPA's
`
`MERSEBAK3ROUN
`as
`FATTERNANDogs
`NTHEArprFRAT
`Efisic.N/
`TRPAF:
`
`results
`A
`83
`to AAL
`File
`N-/
`
`es
`
`RETPLATES
`Reference N
`THEAPPNs FE2
`No
`
`83.
`/
`
`SPY HEAtNHTML
`Ferae wesERVERN
`
`884.
`
`GENERAFMPLATE
`82
`R-1
`
`88
`
`t
`orrisThiske
`
`1FLEs useo NWEBPAGE
`
`88
`S-
`
`PLAdised As
`AN Audis is
`seyr
`T
`l
`IRMINETH
`88
`\-SEEEEEEN
`Ka Assis
`
`828
`
`A HE TRATE
`iNT-list ERY
`
`terERAINE THESERs
`FILEs Associated with
`822
`v1 THEELATE THE
`RAPPNSFE
`
`824
`MERSETEXTFLs into
`AppropRATE
`\-place insected
`TEPATs
`
`SAP Exhibit 1030
`SAP v. Express Mobile, Inc.
`IPR2021-01145
`Page 00001
`
`

`

`US 6,779,153 B1
`Page 2
`
`U.S. PATENT DOCUMENTS
`
`2/2001 Yasumura
`6,192,363 B1
`CE R ;: Epist al.
`2- - - 2
`f
`errel et al.
`6,223,190 B1
`4/2001 Aihara et al. ............... 348/207
`6.253,228 B1
`6/2001 Ferris et al.
`6,304.886 B1 * 10/2001 Bernardo et al. ........... 707/517
`6,313,835 B1 11/2001 Gever et al.
`6,324,521 B1
`11/2001 Shiota et al. ................. 705/27
`
`6,330,575 B1 12/2001 Moore et al.
`6,336,210 B1
`1/2002 Taima et al.
`6,344.853 B1 * 2/2002 Knight ....................... 345/629
`6,397,387 B1
`5/2002 Rosin et al.
`6,429.880 B2
`8/2002 Marcos et al.
`6,449.260 B1
`9/2002 Sassin et al.
`6,466,970 B1 10/2002 Lee et all
`2 : - / 2
`ee et a
`
`* cited by examiner
`
`IPR2021-01145 Page 00002
`
`

`

`US. Patent
`
`Aug. 17, 2004
`
`Sheet 1 0f 8
`
`US 6,779,153 B1
`
`EOEZOE
`
`car
`
`Empm>m
`
`>mOEm=2
`
`2:30$
`
`SF2596
`
`
`
`mmkm<o<t2:
`
`
`
`Omo_>Ozammoomm
`
`map
`
`02.25%
`
`or;95%
`
`
`wmfifin.Eon.mamamamaxwaxwa
`
`
`
`moEmemoEmmESEES.BEEF;
`
`
`.EEwm._<o_Eo9529392:
`
`
`m2<mGOIa
`
`oarZOF<anE<
`
`
`
`hmrSEEOOEQ
`
`waDQOE
`
`EMF—.0
`
`
`
`.3.wVmFNo_.<H<D/mmF359%.
`
`EmQOE
`
`Fm
`
`nwe“
`
`
`
`w._.0_2wm
`
`mwSQEOO
`
`E2:
`
`
`
`
`
`KEOEmZ<wm<13004
`
`ZO_.~<O_.En_<
`
`om<0m>mx
`
`m2<mwOCuwMJDn—OE
`
`
`
`
`
`_>_<I60mmmmIkOZO_._.<0_._mn_<wz_._.<mmm0
`
`<._.<n_hawSEEGOEQmmwm§<m00mammrEwkw>w
`
`
`IPR2021-01145 Page 00003
`
`IPR2021-01145 Page 00003
`
`
`
`
`
`
`
`
`
`
`
`

`

`U.S. Patent
`US. Patent
`
`2
`
`US 6,779,153 B1
`1B3m,
`
`6SU
`
`
`gull.¢lal-§n,rw5.
`
`0p950EEG£.O_DDO.9.58_
`
`mSN2:...
`
`€ 102 0||||
`
`n,.l-.-052ona:.......Ax9EN93058538
` 2llllllllM$2.23:mSN22:23,2305syIMEi‘igizsgusgiiigAUUFONmewt\gmhfizoml
`uxwémwzfiv0F.gingg.....inn-2.2lllllllllllllI
`
`
`
`
`
`
`8.............JHMtow062.4
`
`
`
`
`
`39:5092....>5“ago9.llllllllllllll
`
`
`
`9E:_mco_gmm_>mz
`
`
`9.mNGE
`
`IPR2021-01145 Page 00004
`
`aSm
`
`
`
`IPR2021-01145 Page 00004
`
`
`
`
`

`

`U.S. Patent
`US. Patent
`
`Aug. 17, 2004
`
`Sheet3 0f8
`
`US 6,779,153 B1
`US 6,779,153 B1
`
`FNm
`
`
`
`mNNm
`
`nmmm
`
`oNNm
`
`
`
`1Es.Sanctumnv
`
`m5
`
`029
`
`omm
`
`m.07...
`
`
`
`:m
`
`com
`
`IPR2021-01145 Page 00005
`
`IPR2021-01145 Page 00005
`
`
`

`

`U.S. Patent
`US. Patent
`
`Aug. 17, 2004
`Aug. 17, 2004
`
`Sheet 4 of 8
`Sheet 4 0f 8
`
`US 6,779,153 B1
`US 6,779,153 B1
`
`
`
`Emx3:$3530.83Pa9:4
`
`
`
`.-EE,tea—EgoIvEm:
`
`figfiwnwgfiw
`
`flWEE“
`
`:v
`
`
`
`
`
`
`
`m5N5
`€ 19Ø 19
`
`
`
`.962899bmm5m.EQBDEEwenB69:50
`
`
`
`mmmm
`
`ommm
`
`am;my:
`
`QNNmN3
`
`
`
`is;uBm_mL-EmE390E
`
`
`um;55.BOLmEumgmoposn
`5%ncmEms$583.38900v
`
`v.OE
`
`omv
`
`o;
`
`IPR2021-01145 Page 00006
`
`IPR2021-01145 Page 00006
`
`
`
`
`
`

`

`U.S. Patent
`
`Aug. 17, 2004
`
`Sheet 5 of 8
`
`US 6,779,153 B1
`
`MACRO
`TEMPLATE?
`50
`
`
`
`
`
`
`
`DISPLAY
`DEFAUTPAGE
`MAGE
`502
`
`SEECT
`HEAL
`
`
`
`
`
`
`
`
`
`
`
`
`
`
`
`
`
`
`
`
`
`
`
`
`
`DISPLAY MACRO
`TEMPLATE
`BRARY
`50
`
`SELECT MACRO
`TEMPLATE
`511
`
`SELEC
`HORIZONAL
`REGON
`512
`
`ENTER
`NFORMATION
`513
`
`STORE MACRO
`TEMPAE
`508
`
`CREATE
`MACRO
`507
`
`
`
`UPLOAD
`SO9
`
`F.G. 5
`
`
`
`
`
`IPR2021-01145 Page 00007
`
`

`

`U.S. Patent
`US. Patent
`
`Sheet 6 of 8
`
`US 6,779,153 B1
`
`m
`
`62.2meW332m45.9%»m3.:onm,2:65m3.3.5
`
`mgdoa
`
`E
`
`jllk
`
`m,093mm
`
`9 ?un61–
`
`05
`
`{ is
`{CD
`
`“N“
`...
`cn
`
`Y
`1-
`
`n
`r
`
`CN
`N
`
`n
`r
`
`-\
`r
`
`of
`In M}
`
`IPR2021-01145 Page 00008
`
`IPR2021-01145 Page 00008
`
`

`

`U.S. Patent
`
`Aug. 17, 2004
`
`Sheet 7 of 8
`
`US 6,779,153 B1
`
`
`
`
`
`
`
`
`
`
`
`
`
`
`
`
`
`
`
`
`
`
`
`ETIH CENÝ
`
`SMELNIOd
`
`
`
`SETIH LXE LZ!!!
`
`IPR2021-01145 Page 00009
`
`

`

`U.S. Patent
`
`Aug. 17, 2004
`
`Sheet 8 of 8
`
`US 6,779,153 B1
`
`MERGE MAGE AUDIO
`FLENAMES ANO PAHS
`INTO THE APPROPRIATE
`PACE IN THE SELECTED
`TEMPLATE
`
`826
`
`MERGE BACKGROUND
`PATTERNS AND LOGOs
`NTO THE APPROPRIATE
`PLACE IN THE SELECTED
`TEMPAE
`
`828
`
`ADO THE RESULTNG
`HTML TO A MAN HTML
`FE
`
`830
`
`
`
`
`
`
`
`
`
`
`
`
`
`
`
`
`
`
`
`
`
`
`
`
`
`
`
`
`
`
`
`S
`YE
`
`MORE TEMPLATES
`REFERENCED IN
`THE MAPPING FILE
`
`832
`
`NO
`
`
`
`COPY THE MAN HML
`FILE TO THE WEB SERVER
`
`834
`
`810
`
`GENERATE MAPPING FILE
`
`812
`
`GENERATEMPLATE
`
`814
`
`816
`
`818
`
`820
`
`822
`
`824
`
`DETERMINE THE SOURCE
`FILES USED IN WEB PAGE
`
`UPLOAD NEEDED IMAGE
`AND AUDIO FILESTO
`SERVER
`
`DETERMINE THE
`SELECTED TEMPLATE IN
`THE MAPPING FILE
`
`LOAD THE TEMPLATE
`NTO HOST MEMORY
`
`DETERMINE THE SOURCE
`FLES ASSOCATED WITH
`THE TEMPLATE IN THE
`MAPPNG FILE
`
`MERGE TEXT FILES INTO
`THE APPROPRIATE
`PLACE IN THE SELECTED
`TEMPLATE
`
`
`
`
`
`
`
`Figure 8
`
`IPR2021-01145 Page 00010
`
`

`

`1
`CREATION OF WEB PAGES THROUGH
`SYNCHRONIZATION
`
`This application receives the benefit of U.S. Provisional
`Application No. 60/111,999, filed Dec. 11, 1998.
`TECHNICAL FIELD
`The invention relates to Systems and methods for gener
`ating web pages to be displayed on distributed networks,
`such as the World WideWeb. More particularly, the inven
`tion relates to Systems and methods for providing users of a
`hand-held device, Such as a personal digital assistant (PDA)
`or digital camera, with the capability to author web pages
`without being limited by the system resources of the hand
`held device.
`
`BACKGROUND OF THE INVENTION
`The distributed network known as the Internet is a global
`array of cooperatively interconnected computer networks. It
`includes the World Wide Web, which is a collection of
`websites defined by web servers-computers that store and
`retrieve computer files that represent web pages that are
`requested by and displayed to users of the Internet. Web
`pages combine text, graphic images, animation, audio and
`other multimedia forms for presentation to viewers. In the
`Web environment, client machines communicate with Web
`servers using Hypertext Transfer Protocol (HTTP), which
`uses a Standard page description language known as Hyper
`text Markup Language (HTML). HTML provides basic
`document formatting and allows the developer to Specify
`“links to other Servers and files.
`It is known to provide web page authoring tools, Such as
`“FRONTPAGE” and “FRONTPAGE EXPRESS” developed
`by Microsoft Corporation of Redmond Wash., which give
`web page authors the ability to quickly and efficiently create
`compelling web pages. Much of the power of these tools is
`derived from the use of Style templates, which contain
`predefined HTML formatting commands for predetermined
`Styles. With templates, a web page author avoids the tedious
`task of manually entering hundreds of HTML formatting
`commands. Because of the need to Store large libraries of
`templates and other large files, Such as background bitmaps,
`State-of-the-art web-authoring tools require computer plat
`forms with relatively large amounts of System resources, i.e.
`memory.
`There is a recent growing trend towards the use of
`portable hand-held computing devices that offer portability,
`but which provide Somewhat limited computing features.
`Known hand-held devices, such as PDAs, provide for the
`Storage and retrieval addresses and other information, Send
`ing and receiving of e-mail via communications link and
`other functionality defined by resident Software applications.
`PDAs offer the capability of remote connectivity to a desk
`top computer or to the Internet using a communications link,
`enabling users to upload and download information, and to
`synchronize information stored in the PDA with information
`on a host computer, from Virtually any geographic location.
`Hand-held devices also include rather specialized platforms,
`Such as digital cameras, which provide users with the
`capability of instantly recording electronic images on a
`removable Storage device, Such as a floppy diskette, for later
`Viewing on a desktop computer. From the desktop computer,
`users may send the image files to their friends via e-mail,
`post them to an existing website on the World WideWeb, or
`incorporate them into their own website. AS the user inter
`faces and features of digital cameras become more
`
`15
`
`25
`
`35
`
`40
`
`45
`
`50
`
`55
`
`60
`
`65
`
`US 6,779,153 B1
`
`2
`Sophisticated, they may tend to incorporate much of the
`functionality of PDAs
`One consequence of the compact designs and low weights
`consumerS desire in hand-held electronic devices is that Such
`devices are limited in the amount of System resources,
`namely memory and Screen size, that they provide. Although
`the portability of hand-held devices make them attractive as
`web-authoring platforms, they have not heretofore been
`considered as feasible platforms for web creation, primarily
`because of their limited system resources. It would therefore
`be desirable to provide a web-authoring System and method
`which are Suitable for implementation on a hand-held
`device, Such as a PDA or a digital camera. Such a System and
`method would permit users of digital cameras, for example,
`to create compelling web pages that incorporate digital
`images they have recorded “on-the-Spot' and provide their
`own textual information for presentation to others on the
`World Wide Web.
`SUMMARY OF THE INVENTION
`The invention provides for the creation of web pages on
`hand-held devices Such as PDAS and digital cameras. In
`general, the invention provides for the downloading of data
`from a hand-held device (client) while simultaneously, in a
`one-step operation, Substituting user-defined data into tem
`plates Stored on a larger computer platform (host). A user of
`the invention will be able to remotely author, on their
`hand-held device (client), a web page Styled according to
`their own preference.
`One aspect of the invention involves the generation of
`large HTML files on the host computer under control of a
`compact mapping file that is a generated on a hand-held
`client computer. The mapping file may be created using a
`graphic user interface on the hand-held device which allows
`the user to associate particular ones of a library of templates
`with text and images, which may be Stored on the hand-held
`device. In a one-step Synchronization operation when the
`hand-held device is connected to a host computer, the
`mapping file controls the creation of a main HTML file.
`Specifically, templates referenced in the mapping file are
`retrieved from host memory and “filled in” with the appro
`priate information according to the mapping file. Finally, the
`main HTML file and any Source files (e.g. images, audio
`files) it points to are transferred from the host to the
`appropriate location on the Web Server to create the web
`page.
`A primary advantage provided by the invention is that
`HTML templates (files containing the actual and usually
`lengthy formatting commands that accomplish the Style
`Selected by the user) and other large files needed to create
`compelling web pages reside on the host computer, not on
`the hand-held device. Another advantage provided by the
`invention is that web creation may occur automatically,
`using a one-step Synchronization operation, thereby elimi
`nating the need for a web author to manually orchestrate the
`transfer of appropriate Source files and text. In the case of a
`digital camera, the invention provides users with the capa
`bility to create web page content incorporating digital
`images Stored in the camera and, from a location remote
`from the host computer, present those images in a compel
`ling format on the World Wide Web. This solution also
`reduces the amount of data (bandwidth) that needs to be
`transferred from the hand-held device and the main PC.
`BRIEF DESCRIPTION OF THE DRAWINGS
`The present invention is illustrated by way of example in
`the accompanying Figures, which should not be construed as
`limiting, in which:
`
`IPR2021-01145 Page 00011
`
`

`

`3
`FIG. 1 is a Schematic diagram of a conventional general
`purpose digital computing environment that may be used to
`implement various aspects of the present invention;
`FIG. 2 illustrates an exemplary web page layout for
`permitting a user to create a web page according to the
`present invention;
`FIG. 3 illustrates an exemplary graphical user interface
`(GUI) for permitting a user to select style templates for a
`web page layout according to the present invention;
`FIG. 4 illustrates an exemplary GUI for permitting a user
`to enter text into a style template according to the present
`invention;
`FIG. 5 illustrates an exemplary flow diagram for gener
`ating an HTML page layout according to the present inven
`tion;
`FIG. 6 illustrates an exemplary format for a compact
`mapping file created on a hand-held device according to the
`present invention;
`FIG. 7 illustrates an exemplary control flow and file
`transfer according to the present invention; and
`FIG. 8 illustrates an exemplary flow diagram for gener
`ating an HTML page layout from a mapping file according
`to the present invention.
`DETAILED DESCRIPTION OF THE
`INVENTION
`Although not required, the invention will be described in
`the general context of computer-executable instructions,
`Such as program modules, being executed by a personal
`computer. Generally, program modules include routines,
`programs, objects, components, data Structures, etc. that
`perform particular tasks or implement particular abstract
`data types. Moreover, those skilled in the art will appreciate
`that the invention may be practiced with other computer
`System configurations, including hand-held devices, multi
`processor Systems, microprocessor-based or programmable
`consumer electronics, network PCs, minicomputers, main
`frame computers, and the like. The invention may also be
`practiced in distributed computing environments where
`tasks are performed by remote processing devices that are
`linked through a communications network. In a distributed
`computing environment, program modules may be located
`in both local and remote memory Storage devices.
`FIG. 1 is a Schematic diagram of a conventional general
`purpose digital computing environment that can be used to
`implement various aspects of the invention. Computer 100
`includes a processing unit 110, a System memory 120 and a
`System buS 130 that couples various System components
`including the System memory to the processing unit 110.
`System bus 130 may be any of several types of bus struc
`tures including a memory bus or memory controller, a
`peripheral bus, and a local bus using any of a variety of bus
`architectures. System memory 120 includes a read only
`memory (ROM) 140 and a random access memory (RAM)
`150.
`A basic input/output system (BIOS) 160 containing the
`basic routines that help to transfer information between
`elements within the computer 100, Such as during Start-up,
`is stored in ROM 140. Computer 100 also includes a hard
`disk drive 170 for reading from and writing to a hard disk
`(not shown), a magnetic disk drive 180 for reading from or
`Writing to a removable magnetic disk 190, and an optical
`disk drive 191 for reading from or writing to a removable
`optical disk 192, such as a CD ROM or other optical media.
`Hard disk drive 170, magnetic disk drive 180, and optical
`
`15
`
`25
`
`35
`
`40
`
`45
`
`50
`
`55
`
`60
`
`65
`
`US 6,779,153 B1
`
`4
`disk drive 191 are respectively connected to the system bus
`130 by a hard disk drive interface 192, a magnetic disk drive
`interface 193, and an optical disk drive interface 194. The
`drives and their associated computer-readable media provide
`nonvolatile Storage of computer readable instructions, data
`Structures, program modules and other data for personal
`computer 100. It will be appreciated by those skilled in the
`art that other types of computer readable media which can
`Store data that is accessible by a computer, Such as magnetic
`cassettes, flash memory cards, digital Video disks, Bernoulli
`cartridges, random access memories (RAMs), read only
`memories (ROMs), and the like, may also be used in the
`exemplary operating environment.
`A number of program modules can be Stored on the hard
`disk, magnetic disk 190, optical disk 192, ROM 140 or
`RAM 150, including an operating system 195, one or more
`application programs 196, other program modules 197, and
`program data 198. A user can enter commands and infor
`mation into computer 100 through input devices, Such as a
`keyboard 101 and a pointing device 102. Other input devices
`(not shown) may include a microphone, joystick, game pad,
`Satellite dish, Scanner, or the like. These and other input
`devices are often connected to the processing unit 110
`through a serial port interface 106 that is coupled to the
`System bus, but may be connected by other interfaces, Such
`as a parallel port, a game port or a universal Serial bus
`(USB). A monitor 107 or other type of display device is also
`connected to System buS 130 via an interface, Such as a video
`adapter 108. In addition to the monitor, personal computers
`typically include other peripheral output devices (not
`shown), Such as Speakers and printers.
`Computer 100 can operate in a networked environment
`using logical connections to one or more remote computers,
`such as a remote computer 109. Remote computer 109, also
`referred to as a “client,” may be a PDA or digital camera
`which includes some of the elements described above rela
`tive to computer 100, although only a memory Storage
`device 111 has been illustrated in FIG. 1. Typically, in
`hand-held devices, the monitor 107 would be in the form of
`a compact liquid crystal display (LCD) and the Storage
`devices, for example, 170 and 191 are omitted in favor of a
`large internal memory or RAM. Moreover, the user input
`device, such as the keyboard 101 take the form of a compact
`keyboard interface or handwriting recognition interfaces. In
`the case of a digital camera, Storage device in the form of a
`floppy disk drive may be provided. The logical connections
`depicted in FIG. 1 include a local area network (LAN) 112
`and a wide area network (WAN) 113. Such networking
`environments are commonplace in offices, enterprise-wide
`computer networks, intranets and the Internet.
`When used in a LAN networking environment, computer
`100 is connected to local network 112 through a network
`interface or adapter 114. When used in a WAN networking
`environment, personal computer 100 and remote computer
`109 may both include a modem 115 or other means for
`establishing a communications over wide area network 113,
`such as the Internet. Modem 115, which may be internal or
`external, is connected to system bus 130 via serial port
`interface 106. In a networked environment, program mod
`ules depicted relative to personal computer 100, or portions
`thereof, may be Stored in the remote memory Storage device.
`It will be appreciated that the network connections shown
`are exemplary and other means of establishing a communi
`cations link between the computers can be used. The exist
`ence of any of various well-known protocols, Such as
`TCP/IP, Ethernet, FTP, HTTP and the like, is presumed, and
`the System can be operated in a client-Server configuration to
`
`IPR2021-01145 Page 00012
`
`

`

`S
`permit a user to retrieve web pages from a web-based Server.
`Any of various conventional web browsers can be used to
`display and manipulate data on web pages.
`One aspect of the invention provides a method and System
`for generating web pages based on a compact mapping file
`created and Stored on the hand-held device or remote
`computer 109. Another aspect of the invention relates to a
`Simplified layout for a web page Suitable for implementation
`on a hand-held device. The simplified HTML layout will
`first be described with reference to FIGS. 2-5 to illustrate
`one method of creating a template mapping file according to
`the invention. With reference to FIGS. 6-8, the method and
`System for generating a web page according to a template
`mapping file will then be described. It will be recognized
`that the simplified layout described below is intended to
`illustrate one possible method and user interface for creating
`the mapping file. Other methods of creating the mapping file
`will be apparent to those of ordinary skill upon a reading of
`this disclosure.
`FIG. 2 provides a schematic overview of an exemplary
`web page layout Scheme according to an aspect of the
`invention. A web page 200 is divided into horizontal rows or
`regions 201. Each of these horizontal regions 201ag is
`asSociated with a particular Style template, Selected by a
`user. Exemplary Style templates include templates for titles,
`text, audio, pictures, parallel column and navigational bars.
`For example, a title Style template may be associated with
`the top horizontal region 201a. Region 201b may be asso
`ciated with a style template for presenting a centered image.
`Region 201c may be associated with a style template for
`presenting caption text for the centered image above. Each
`style template includes HTML codes for the particular style
`of the template and blank Spaces for information, Such as
`text or pictures.
`One or more Source files, which may include text, image,
`audio or other multimedia files, are also associated with each
`horizontal region 201, and thus associated with the style
`template designated for that region. For example, a Source
`file named “Title1.txt that contains text for a title is
`asSociated with region 201a. Similarly, an image file
`“Pic1.jpg is associated with region 201b. Style templates
`can also be associated with more than one Source file. For
`example, the Style template assigned to region 201d accepts
`both an image file and a text file and is therefore associated
`with text file “Text2..txt” and image file “Pic2.jpg. Similarly,
`the Style template associated with region 201e is associated
`with text file “Text3.txt” and image file “Pic3.jpg.” As
`represented by regions 201f and 201g, style templates for
`audio files and navigational linkS may also be provided.
`Thus, the Simplified page layout according to the invention
`provides for the association of one or more Source files with
`a Selected one of a plurality of Style templates.
`FIG.3 shows an exemplary graphical user interface (GUI)
`300 for permitting a user to associate selected style tem
`plates with one or more source files. GUI 300 may be
`implemented on a Small consumer electronic device having
`limited memory and display area, Such as a WindowS(R)
`CE-based digital camera or a Windows(R CE-based personal
`digital assistant (PDA). In FIG.3, GUI300 is shown divided
`into two display regions 310 and 320. Display region 310
`includes a library of exemplary style icons 311 that are
`Selectable by a user using a user interface Selection device,
`Such as a mouse, a trackball, a joystick or other well-known
`cursor-control/entry-Selection device. AS shown in FIG. 3, a
`library of exemplary style icons 311a–311l are displayed
`when layout tab 312 is selected.
`Each Style icon 311 is a recognizable graphical image that
`represents a particular Style template. For example, Style
`
`15
`
`25
`
`35
`
`40
`
`45
`
`50
`
`55
`
`60
`
`65
`
`US 6,779,153 B1
`
`6
`icon 311a is a graphical image representing a banner or a
`title Style template. Style icon 311b is a graphical image for
`text-only Style template. Style icon 311c is a graphical image
`for a single photographic or graphical image Style template.
`Style icons 311d 311f represent combinations of textual
`and/or image Style templates. Style icons 311g-311i repre
`Sent different exemplary textual Style templates. Of course,
`other recognizable icons can be displayed that represent
`other Style templates that are not described.
`Display region 320 includes a graphical image 321 rep
`resenting a current web page that is being created. AS
`different Style templates are Selected, web page image 321
`changes to reflect the relative position of the Selected
`templates. AS shown, image 321 includes a title Style tem
`plate at the top of image 321 with a text-only, a picture
`W/right text and a picture W/left text Style templates in order
`below the title style template. Display region 320 also
`includes command buttons 322a-322c, which are used for
`performing Selected operations in a well-known manner.
`A particular horizontal region 201 (FIG. 2) is laid out by
`Selecting a horizontal portion of image 321 in a well-known
`manner using the user interface Selection device. Aparticular
`Style for the Selected horizontal portion of image 321 is also
`Selected from Style icons 311 in a well-known manner using
`the user interface Selection device. Each template includes
`HTML codes for the particular style of the template and
`blank Spaces for information, Such as text or pictures,
`depending upon the particular style of the template.
`When a Selected Style template includes a blank Space for
`textual information, text tab 314 will be available to permit
`a user to input text. Text tab displays a library of textual
`formats, attributes and editing functions, Such as centering,
`paragraphing, margins, fonts, sizes, colors, deletion and
`undo functions, for the text that is entered into the corre
`sponding blank space. FIG. 4 shows an exemplary GUI 400
`for entering textual information into a style template accord
`ing to the present invention. Like GUI 300 of FIG. 3, GUI
`400 is preferably displayed on a small consumer electronic
`device having limited memory and display area.
`Alternatively, GUI 400 can be displayed on a personal
`computer (PC) or a workstation.
`In FIG. 4, GUI 400 is shown divided into two display
`regions 410 and 420. Display region 410 includes a library
`of exemplary formatting and editing icons 411 that are
`Selectable by a user in a well-known manner using the user
`interface Selection device. AS shown in FIG. 4, display
`region 410 includes a text entry field 412 in which textual
`information for a particular Style template is entered.
`Alternatively, a pointer to a file containing the desired
`textual information can be entered. Display region 420 is the
`same as display region 320 of FIG. 3.
`When a Selected Style template includes a blank Space for
`pictorial or graphical information, image tab 313 is available
`to display a library of pictorial/graphical formats, attributes
`and editing functions for the picture or graphical image that
`is entered into the corresponding blank Space. Pictorial/
`image information can be entered as a pointer to a locally
`Stored image, which is uploaded with the completed page
`layout, or as a point to a remotely located image that is
`retrieved and merged with the completed page layout after
`uploading. Alternatively, when a Selected Style template
`does not require text, the text tab 313 may be deactivated,
`i.e., be appearing faded or otherwise indicated as not avail
`able to the user.
`FIG. 5 shows an exemplary flow diagram 500 for gener
`ating an HTML page layout according to the present inven
`
`IPR2021-01145 Page 00013
`
`

`

`15
`
`7
`tion. At step 501, it is determined whether a user desires to
`create a web page layout from a previously Stored macro
`Style template or create a new page layout. If a new web
`page layout is desired, flow continues to Step 502 where a
`library of Style templates and a default page layout image
`(i.e., an icon like icon 321, but is only a page outline) are
`displayed (FIG. 3). Flow continues to step 503 where a
`particular horizontal region of the displayed page layout is
`Selected using a user interface Selection device. Flow con
`tinues to step 504 where a particular style template is
`Selected using the user interface Selection device. When the
`Selected Style template has a Space for entering associated
`information, Such as a title, text and/or an image, flow
`continues to step 505. When no information is to be asso
`ciated with the selected style template, step 505 is bypassed
`and flow continues to step 506.
`At step 506, it is determined whether the page layout is
`complete. If so, flow continues to step 507 where it is
`determined whether a macro Style template for the newly
`created page layout should be Stored for later use. If So, flow
`continues to step 508 where the newly-created page layout
`is stored. If not, flow continues to step 509 where the page
`layout is uploaded to a Server.
`If at step 501, a macro style template is desired, flow
`continues to step 510 where a library of previously stored
`macro style layouts are displayed. At Step 511, a particular
`macro style layout is Selected and a page layout image for
`the Selected macro style template is displayed, Similar to
`FIG. 3. Flow continues to step 512 where a particular
`horizontal region of the displayed macro style template is
`Selected using the user interface Selection device. Flow
`continues to step 513 where any information associated with
`the Selected horizontal region, Such as a title, text and/or an
`image, is entered. At Step 514, it is deter