CN102047247A - 灵活的网页模板构建系统和方法 - Google Patents

Abstract

本公开涉及灵活的网页模板和生成按照用户内容的量增长和缩减的模板的模板构建工具。

Description

灵活的网页模板构建系统和方法

技术领域

本发明涉及电子文档的创建和设计，更具体地，涉及灵活的网页模板构建技术和系统。

背景技术

用于设计网站的、可定制的网页模板帮助人们快速设计用于发布给web托管服务器的网页。

设计其内容可以由最终用户定制的网页模板时的一个挑战在于，可被插入到网页的可编辑区域的内容的尺寸或文本量可以随用户而变化。因为网页通常提供标题区域，导航区域和围绕可被用户定制的可编辑区域的底部边界，模板设计需要对于可编辑区域的尺寸的某些了解。以前，这使得模板供应商设置固定尺寸的可编辑区域，由此限制了用户可插入到可编辑区域中的内容量。

对于网页模板设计者的另一个挑战是使得网页主题在所有类型的浏览器中都行得通的客观需要。

因此，希望提供具有简单的用户接口的网页生成工具，该网页生成工具允许网页设计者创建根据被插入到可编辑区域中的内容量而增长和缩减的灵活的自动扩展的可编辑区域，以及设计在各种各样的浏览器中都行得通的主题。

发明内容

本发明的实施例针对灵活的网页模板构建技术和系统，该技术和系统允许网页设计者构建按照被插入到其中的用户内容的量而增长和缩减的自动扩展的网页。

附图说明

图1是网页模板构建插件的图形表示。

图2是显示本发明的实施例运行于其中的网络环境的框图。

图3是显示电子发布工具可以运行于其中的用户计算机环境的框图。

图4是示例性网页模板构建工具的示例性用户接口显示器400的屏幕截图图示。

图5A是显示标示的应用——特别是对于在标示之间的内容的垂直方向上的变化的应用——的示例性自动扩展用户可编辑内容容器。

图5B显示图5A的自动扩展用户可编辑内容容器，其中标示被设置在一个位置，该位置包括在标示之间的内容的垂直方向上的变化。

图6A是显示标示的应用——特别是对于重复图案的应用——的示例性自动扩展用户可编辑内容容器。

图6B显示图6A的自动扩展用户可编辑内容容器，其中标示被设置在导致非重复的图案的位置。

图7A显示因为导航按钮被添加和去除而增长和缩减的垂直导航区域的分割。

图7B显示因为导航按钮被添加和去除而增长和缩减的水平导航区域的分割。

图8是被创建来描述网页模板的外部背景和内部背景的示例性表格。

图9是示例性网页模板布局。

图10是显示被栅格化成分开的图像的网页模板的分段的图。

图11是显示示例性网页模板的HTML表格。

图12是当内容被最终用户添加时自动扩展的用户可编辑的内容容器的运行的示例性实施例的流程图。

图13是当最终用户在导航区域上去除和添加导航按钮时自动扩展的导航区域的运行的示例性实施例的流程图。

具体实施方式

本发明的实施例实施灵活的网站模板构建工具。在一个实施例中，被使用来设计定制的电子设计(其可以被电子地发布或被打印以生成打印产品)的电子文档设计工具包括网站模板构建器外加插件，它允许设计者根据电子设计的单元来定制网站模板。例如，图1图形地显示用于打印产品的电子设计工具2，该电子设计工具接收或创建打印产品设计1的电子版本。电子设计工具2包括网站外加插件控件3，它在被激活时生成网页模板4，该模板4包括来自打印产品设计1的至少一个单元。

网页模板4对于提供工具给构建他们的网站的顾客的网站托管服务供应商可能是重要的。网页模板4对于希望交叉销售网站给电子、打印、或其它类型的产品的顾客而同时保持其它产品的某些设计特性的电子、打印、或其它类型的产品的设计者也可能是重要的。

例如，图2显示联网系统10。客户端系统11代表用户的计算机系统，例如，网站托管服务的顾客。客户端系统11是参照图3讨论的、典型配备的现代个人计算机，其被配置成通过Web和运行现代Web浏览器程序12而进行通信。为了讨论目的，本发明将在运行Microsoft Internet Explorer浏览器的个人计算机的情形下进行描述，但将会看到，本发明可应用于支持HTML、XHTML、DHTML、XML、和其它web功能的其它浏览器程序，以及其它智能设备，诸如能够运行这样的浏览器的PDA。

客户端11与网站托管服务服务器20通信，以经由客户的浏览器12建立账户信息和订购网站托管服务。在建立账户后，网站托管顾客然后可以开始设计和编辑它们的网站。在示例性实施例中，网站托管服务经由网站构建工具服务器30提供网站构建工具。在一个实施例中，客户端11可以下载网站构建工具31，以便在它们的本地浏览器12中执行。

网站构建工具31允许网站托管服务顾客从网站构建工具服务器30下载网页模板(被存储在网页模板库40中)。网站模板是电子网页设计，其包括可编辑区域，以允许顾客定制文本、图像、和设计内容。它们典型地包括带有或不带有设计的背景、标题区域、导航菜单区域、和一个或多个用户可编辑内容区域。网站托管服务顾客可以编辑和设计多个定制的网页，以形成可被发布给托管网站数据库50的定制网站。当网页被发布给托管网站数据库50时，网站托管服务器60将把定制的托管网站的网页提供给在网络上的其它联网客户端，诸如客户端70。

网页模板可以由操作内容供应商计算机系统80的内容设计者创建，该内容供应商计算机系统80可以是任何传统的计算机系统，例如，参照图3描述的。电子文档创建和编辑应用82在内容供应商系统80上本地地或经由传统的联网配置(未示出)远程地执行，并允许内容供应商创建电子文档，例如，可以是被打印的或在显示器上被观看的文档。电子文档创建和编辑应用82也可以打开和编辑以前设计的文档。例如，网站托管销售服务器20也可以是在线打印产品和电子产品零售商，该零售商提供诸如名片、明信片、小册子等等那样的产品给顾客，例如客户端70。服务器20因此可以提供可定制的设计或模板(被存储在产品模板数据库42中)并传递给顾客，这些设计或模板可以被在线打印产品和电子产品零售商的顾客编辑，然后被订购以进行打印/发布。定制的产品设计随后可被存储(在顾客定制的产品数据库44中)，以供零售商将来存取，从而允许顾客返回到该网站和重新订购所定制的产品。

电子文档创建和编辑应用82本身可以提供，或可以仅仅提供对网页模板构建工具84的接入。例如，传统的电子文档出版系统可包括外加插件(add-in)或插件(plug-in)。插件是与主应用(例如，电子文档创建和编辑应用82)进行交互以便“按要求”提供功能的计算机程序。可替换地，电子文档创建和编辑应用82本身可以实施用于自动创建网页模板的功能。

网页模板构建工具84根据电子文档自动生成网页模板，其细节在后面给出。

现在转到图3，图上给出适当的计算系统环境100的例子，该环境100可实施客户端11、70，服务器20、30、60和内容供应商系统80中的任一个或全部。计算系统环境100仅仅是适当的计算环境的一个例子，不打算对于本发明的使用的范围或功能提出任何限制。计算环境100不应当被解释为对于在示例性运行环境100中显示的任一个部件或部件的组合具有任何依赖性或要求。

本发明的实施例可在许多其它通用或专用计算系统环境或配置下运行。可以适用于本发明的熟知的计算系统、环境、和/或配置的例子包括，但不限于，个人计算机、服务器计算机、手持型或膝上型设备、微处理器系统、基于微处理器的系统、机顶盒、可编程消费电子设备、网络PC、小型计算机、大型计算机、和包括任意上述系统或设备的分布计算环境，等等。

本发明的实施例，尤其是网站构建工具31及其被集成在其中的目标-对准-和-放下控件32可以在由计算机执行的、诸如程序模块那样的计算机可执行指令的一般情形下进行描述。通常，程序模块包括执行特定任务或实施特定抽象数据类型的子程序、程序、对象、部件、数据结构等等。本发明的实施例也可以在分布式计算环境下被实践，其中任务由通过通信网或其它数据传输介质而被链接的远端处理设备执行。在分布式计算环境下，程序模块和其它数据可以位于本地的和远端的计算贮存介质中，该介质包括存储器贮存设备。

参照图3，用于实施本发明的示例性系统包括计算机110形式的通用计算设备。计算机110的部件可包括，但不限于，处理单元120、系统存储器130、和系统总线121，总线121把包括系统存储器在内的各种系统部件耦合到处理单元120。系统总线121可以是数种总线结构中的任一种，包括存储器总线或存储器控制器、外设总线、和使用各种总线体系结构中的任一种的本地总线。

计算机110典型地包括各种计算机可读介质。计算机可读介质可以是可由计算机110存取的任何可供使用的介质，包括易失性和非易失性介质、可拆卸和不可拆卸介质。作为例子，而不是限制，计算机可读介质可包括计算机贮存介质和通信介质。计算机贮存介质包括以任何用于贮存诸如计算机可读指令、数据结构、程序模块、或其它数据那样的信息的方法或技术实施的易失性和非易失性、可拆卸和不可拆卸介质。计算机贮存介质包括，但不限于，RAM、ROM、EEPROM、快闪存储器或其它存储器技术、CDROM、数字通用盘(DVD)或其它光盘贮存装置、盒式磁带、磁带、磁盘贮存装置或其它磁性贮存装置、或可被使用来存储想要的信息和可由计算机110存取的任何其它介质。通信介质典型地包括有计算机可读指令、数据结构、程序模块、或在诸如载波或其它输送按钮之类的调制数据信号中的其它数据，并包括任何信息传递介质。

系统存储器130包括易失性和/或非易失性存储器形式的计算机贮存介质，诸如只读存储器(ROM)131和随机存取存储器(RAM)132。基本输入/输出系统133(BIOS)通常被存储在ROM 131中，该系统133包含帮助在计算机110内的单元之间，诸如在启动期间，传送信息的基本子程序。RAM 132典型地包含处理单元120立即可接入的和/或由处理单元120现在操作的数据和/或程序模块。作为例子，而不是限制，图3显示操作系统134、应用程序135、其它程序模块136、和程序数据137。

计算机110还可包括其它可拆卸/不可拆卸、易失性/非易失性计算机贮存介质。仅仅作为例子，图3显示硬盘驱动器141，用于从不可拆卸的、非易失性磁介质读出或向其中写入；磁盘驱动器151，用于从可拆卸的、非易失性磁盘152读出或向其中写入；和光盘驱动器155，用于从可拆卸的、非易失性光盘156，诸如CD ROM或其它光介质，读出或向其中写入。可以在示例性操作环境中使用的其它可拆卸/不可拆卸、易失性/非易失性计算机贮存介质包括，但不限于，盒式磁带、快闪存储卡、数字通用盘、数字视频磁带、固态RAM、和固态ROM等等。硬盘驱动器141典型地通过不可拆卸存储器接口，诸如接口140被连接到系统总线121，以及磁盘驱动器151和光盘驱动器155典型地通过可拆卸存储器接口，诸如接口150，被连接到系统总线121。

以上讨论的和在图3上显示的驱动器及其相关联的计算机贮存介质提供计算机可读指令、数据结构、程序模块和用于计算机110的其它数据的贮存。在图3上，例如，硬盘驱动器141被显示为存储操作系统144、应用程序145、其它程序模块146、和程序数据147。应当指出，这些部件可以是与操作系统134、应用程序135、其它程序模块136、和程序数据137相同的，或是与它们不同的。操作系统144、应用程序145、其它程序模块146、和程序数据147在这里被给予不同的标号，以表明它们至少是不同的拷贝。用户可以把命令和信息通过输入设备，诸如键盘162和指示设备161(通常被称为鼠标)、跟踪球或触摸板，输入到计算机20。其它输入设备(未示出)可包括麦克风、操纵杆、游戏手柄、卫星无线、或扫描器等等。这些和其它输入设备常常通过被耦合到系统总线的用户输入接口160被连接到处理单元120，但它也可以通过其它接口和总线结构，诸如并行端口、游戏端口、或通用串行总线(USB)被连接。监视器191或其它类型的显示设备也经由接口，诸如视频接口190被连接到系统总线121。除了监视器以外，计算机还可包括其它外设输出设备，诸如扬声器197和打印机196，它们可以通过输出外设接口190被连接。

通过利用与一个或多个远程计算机，诸如远程计算机180的逻辑连接，计算机110可在联网环境中工作。远程计算机180可以是个人计算机、服务器、路由器、网络PC、对等设备或其它常见网络节点，并且一般包括上面关于计算机110描述的元件中的多个或全部，不过图3中只图解说明了存储器贮存装置181。图3中描述的逻辑连接包括局域网(LAN)171和广域网(WAN)173，不过也可包括其它网络。这种联网环境在办公室、企业范围(enterprise-wide)计算机网络、内联网(intranet)和互联网中是常见的。

当用在LAN联网环境中时，计算机110通过网络接口或适配器170与LAN 171连接。当用在WAN联网环境中时，计算机110一般包括调制解调器172或者其它装置，以通过WAN 173，诸如因特网建立通信。可在内部或外部的调制解调器172可通过用户输入接口160与系统总线121连接，或者连接到其它适当的按钮。在联网环境中，相对于计算机110描述的程序模块，或其多个部分可被保存在远程存储器贮存装置中。例如，但不限于，图3把远程应用程序185图解说明成驻留在贮存装置181上。要认识到所示的网络连接是示例性的，可以使用建立计算机之间的通信链路的其它手段。

回到图2，在网页模板库40中的每个网页模板代表网站的单个网页的主题设计。如前所述，为了网站构建工具122提供网页模板，首先必须创建这样的模板。在一个实施例中，电子文档创建与编辑应用82，诸如将要用于要打印产品的设计的Adobe

InDesign，被用来利用为打印产品开发的内容。在一个实施例中，电子文档创建与编辑应用82被配置有网站插件，按照这里描述的发明，该网站插件帮助顾客根据打印产品或电子产品的设计来生成网站模板。

图4是示例性网页模板构建工具的示例性用户接口显示器400的屏幕截图图示。例如，网页模板构建工具可以作为独立的应用存在，或被集成在电子文档创建与编辑应用中，或可以是给这种应用的插件。如图4所示，用户接口显示器400包括在电子文档创建与编辑应用82内已知的和标准地使用的编辑控件401，以及用于设计网页模板410的工作区402。

网页模板410假设800个像素宽的可显示的页区域，但当然应当理解，可以依赖于想要的浏览器和显示器类型以及显示技术的未来进展，改变这个数目。网页模板410包括外部背景411，它代表在显示器上应当出现在800个像素宽的可显示的页区域之外的内容；以及内部背景412，它覆盖在800个像素宽的区域内的外部背景；标题区域415；导航区域420；和至少一个自动扩展的用户可编辑的内容容器430。在示例性实施例中，标题区域415包括文本的两个“标题行”区域：一个区域416用于“公司名称”，一个区域417用于“公司消息”。优选地，虽然自动扩展的用户可编辑的内容容器只允许web安全字体，但标题区域415可以支持非web安全字体，例如，在顾客的图标或名片中使用的字体。

为了使得在标题行区域416、417中输入的文本的尺寸最大化，通过使用Rich Text(富文本)编辑器确定在文本区域中输入的文本的当前尺寸，以及网页模板构建工具82自动确定为了使得文本占用可用文本区域的全部宽度而缩放当前尺寸的文本的量，然后确定为了使得文本占用可用文本区域的全部高度而缩放当前尺寸的文本的量。网页模板构建工具82然后选择水平尺度和垂直尺度中的较小尺度，把用户输入文本缩放所选的较小尺度，以及用缩放后的文本替换在文本区域中用户输入的文本。

为了支持在自动扩展的用户可编辑的内容容器(一个或多个)430中内容的增长和缩减，存在有在网页模板设计中必须应用的某些规则。例如，外部背景只可以包含单色、垂直梯度、或重复的图案，以使得当自动扩展的用户可编辑的内容容器(一个或多个)增长时，在用户的显示器上的任何可见的外部背景区域将显现为连续的。而且，如果使用梯度并且该页很长，则优选地将在梯度的底部的彩色用作为在梯度被指定的地方之下的单色。内部背景优选地只可以包括单色。

自动扩展的用户可编辑的内容容器430被显示为具有一对水平标示—上部水平标示431和下部水平标示432。用户内容必须与上部标示和下部标示交叉。优选地，样本文本的几行被插入在自动扩展的用户可编辑的内容容器中，以向用户显示缺省的类型和字体。在一个实施例中，用户内容样本文本只可以包括web安全字体(约八种字体的受限列表)，已知所述web安全字体得到大多数web浏览器的支持。

在一个实施例中，插图可以扩展到用户内容区域，以及被呈现在用户内容之后。

上部标示431必须在下部标示432的上面。穿过上部标示431或下部标示432的任何单元必须穿过这两个标示。穿过标示431、432的任何单元必须是“可增长的(growable)”。为了是可增长的，或者单元是重复的图案，或者在两个标示431、432之间在垂直方向上没有变化(也就是，在标示之间的每行像素每隔一行是相同的)。

为了说明有关标示431、432的规则，图5A显示遵从以上规则的插入在自动扩展的用户可编辑的内容容器500中的内容。也就是，插入在自动扩展的用户可编辑的内容容器500中的帧510在两个标示531、532之间的各部分在垂直方向上没有变化。图5B显示违反用户内容规则的、插入在自动扩展的用户可编辑的内容容器500中的内容。在这个实施例中，帧511的中心突出的部分515a、515b在两个标示531、532之间在垂直方向上有变化。如果希望的话，在图5B上的“坏”设计可以通过简单地移动上部标示531到帧511的突出部分515a、515b之下而使其遵从规则。然而，通过这样做，由于帧511的底下的半个部分可被扩展以适合于更多的用户内容，帧511的突出部分515a、515b将不会保持相对于帧511的顶部和底部在垂直方向上位于中心。

在跨越两个标示431、432的自动扩展的用户可编辑的内容容器400的各单元中，如果有多个重复的图案，则在垂直方向上的重复频率必须是相同的，并且重复应当尽可能小。这是因为在最终的网页中，穿过底部标示的任何图案必须与在底部标示之下的插图相匹配。

图6A和6B还显示关于标示，尤其是对于重复图案，的规则。如图6A所示，自动扩展的用户可编辑的内容容器600包括重复的圆形图案。如果标示631、632如显示的那样放置，则在标示之间的图案可以如显示的那样被增长。在图6B上，标示被放置成使得在标示631、632之间的图案不是重复的图案。因此，当自动扩展的用户可编辑的内容容器通过把图案的实例添加在标示之间而被增长时，结果是不希望的。

被放置在自动扩展的用户可编辑的内容容器中的内容在使用网页模板构建工具时是将在最终模板中显现为背景层的内容。因此，在最终模板中，在自动扩展的用户可编辑的内容容器中的任何内容被平铺在背景层中。因此，当最终用户利用模板作为设计网页的开始点时，最终用户将把文本和其它内容插入在自动扩展的用户可编辑的内容容器中，其将出现在由网页模板设计者插入的平铺内容之上。

现在转到图4的导航区域420，导航区域420包括为导航项设计的两层—第一层是导航按钮层，第二层是导航背景层。导航按钮层包括六个结构项：按钮的每个“状态”(常规、当前工作页、和“悬浮(hover)”)有两个结构项。对于每个状态，有代表按钮背景的一个项和代表按钮文本的文本帧项。

当设计网站模板时，设计者优选地保持三个按钮整齐、等间隔且在点边界上对准。按钮应当水平地或垂直地对准，这依赖于导航区域的取向。插图可被添加到按钮项，或以相同的空间绘制到导航按钮层上。在按钮背景对象的边界之外的导航按钮层中的任何插图被忽略。

导航背景层包含代表整个导航区域的结构项。这个区域必须在上部标示之上且在内容区域的左面。在它周围的间隔量确定在按钮的尺寸之外在每个方向上多少空间要被添加到导航区域。

优选地，网页模板支持导航区域的两个取向：水平的和垂直的。在这两种情形下，按钮常常被设置为由设计者确定的固定尺寸。在一个实施例中，只支持单行按钮或单列按钮。

垂直导航区域常常向下增长。水平导航区域如下增长：如果导航区域靠近页的左面边缘，则导航区域将向右面增长；如果导航区域靠近页的右面边缘，则导航区域将向左面增长；否则，导航区域将(从中心开始)向左面和右面增长。

为了支持导航按钮的增长和缩减，导航区域700被自动分割成三个“部分”，如图7A所示。所述部分包括从导航区域的顶部(或左面712b，对于水平导航区域，在图7B上显示)到顶部按钮的中部的区域712a，从顶部按钮的中部到第二按钮的中部(或左面按钮的中部到第二按钮的中部)的区域714a，和从最后的按钮的中部到导航区域的底部(或右面716b，对于水平导航区域，在图7B上显示)的区域716a。

当导航区域被呈现时，第二部分714a(或714b)被重复对于容纳所有按钮705所必需的那么多次。

在示例性实施例中，网页模板构建工具配置导航区域420，其具有允许模板的最终用户在水平或垂直菜单取向之间进行选择并选择和编辑所选择的导航按钮的名称的控件。而且，所述控件可被配置成自动检测如下状况：导航区域在水平方向上不能完全显示，并且生成给顾客的对于改变导航菜单取向为垂直取向的请求。可替换地，当这个状况发生时，所述控件可以简单地自动改变导航菜单取向为垂直取向。

导航区域控件可被配置成自动调整导航按钮的尺寸，相同地且自动地确定具有相同尺寸的字体的导航按钮名称并调整其尺寸。在示例性实施方案中，导航区域控件执行以下步骤：对于每个相应的导航按钮，自动确定用于导航按钮名称的文本的尺寸，确定为了使得文本占用导航按钮的全部宽度而缩放当前尺寸的文本的量，确定为了使得文本占用导航按钮的全部高度而缩放当前尺寸的文本的量，选择水平尺度和垂直尺度中的较小尺度；选择所有导航按钮上的每个所选尺度中的最小尺度作为全局导航按钮尺度；以及把每个导航按钮名称缩放到全局导航按钮尺度。

网页模板构建工具84创建HTML页，其处理可变数量的顾客文本，按需要增长所述页，以及使用在各种浏览器中可靠地呈现的HTML。

在一个实施例中，网页模板构建工具84创建图8上显示的最外面的表格，来描述外部和内部背景。“主体”标签被使用来描述外部背景，以使得外部背景也可以在主题内容之下扩展。在任一种情形下，内容的剩余部分进入主要内容单元(cell)中。

图9显示网页模板的单元。如图所示，模板900包括外部背景901、内部背景902、和具有上部标示931和下部标示932的自动扩展的用户可编辑的内容容器930。在两个水平标示931、932之间的部分是“可增长的部分”。

为了创建网页模板，在主题中出现的所有插图被栅格化成11个图像，在图10上被显示为1、2a、2b、2c、3a、3b、3c、4a、4b、4c、5。图像3a、3b、3c是在垂直方向上重复的图案(所以，可以以小于所指示的整个高度的高度呈现)。在把网页栅格化成上述的图像后，网页模板构建工具然后构造HTML表格，该表格具有如图11所示的、标记为顶部、左面、主体、右面和底部的单元。

图11中的“顶部”单元只包含图像1(所以单元正好具有与图像相同的尺寸)。图11中的“左面”单元包括作为背景图像的图像3a。它也包含“位置＝相对的”的划分，以及在该划分内“位置＝绝对的”的图像2a。在图11中的“中部”单元是类似的；它包含作为背景图像的图像3b。它也包含“位置＝相对的”的划分。在该划分内是“位置＝绝对的”的图像2b，并且还是用户输入的站点内容的全部。在图11中的“右面”单元完全类似于“左面”单元(因此，图像3c和2c)。图11中的“底部”单元包含“位置＝相对的”的划分。在该划分内，图像4a、4b、4c被绝对地放置(具有负的‘顶部’坐标)以把它们放置在前述表格单元的底部。该划分还包含“位置＝绝对”的图像5。中部行具有指定的高度，以保证它高到足以包含图像2a、2b、2c和图像4a、4b、4c。另外，如果图像3a、3b、和3c比一个像素高，则JavaSript执行增加中间行的高度，以使得文本一旦被添加，它就是图案重复的倍数—这允许图案在整个网站上重复。

导航按钮被呈现在“左面”表格单元中，但对于这些按钮使用绝对定位，所以如有必要，它们可以出现在其它单元中。导航区域还可包括背景影像，根据在该处的按钮的数目而增长或缩减所述影像。垂直取向的导航区域可以垂直地增长。上部标示可以自动向页面下方移动，以使整个导航区域显现在页面的可增长的部分之上。这意味着，导航区域背景将总是仅仅在图像1、2a、2b、和2c中。

组成主题的图像和控件被指定以绝对坐标。对于每个图像(1、2a、2b、...4c、5)，创建适当尺寸的位图，并且使用GDI+复制主题图像的各部分到其中。例如，如果“下部标示”是在垂直位置700处；“主体内容矩形”的底部在位置800处以及它的左边缘在位置200处，则对于图像4a，创建200像素宽×100像素高的图像200，以及平铺在矩形(0，700)-(200，800)中出现的全部主题图像。

结果是按照被最终用户插入在自动扩展的用户可编辑的内容容器中的内容的量而增长和缩减的网页模板，并且该网页面板可以在多种不同浏览器和显示器类型中可靠地显示。

优选地，网页模板构建工具82从可由文档设计工具编辑的电子设计中获得至少一个图形单元(例如，顾客的图标)，并把所述至少一个图形单元插入在网站模板中。在一个示例性实施例中，网页模板构建工具82用从被设计来打印的产品的电子设计中获得的内容预先填充网页模板，所述电子设计在文档设计工具中打开。

图12是当内容被最终用户添加时自动扩展的用户可编辑的内容容器的操作的示例性实施例的流程图。如图所示，监视自动扩展的用户可编辑的内容容器的用户选择(步骤1201)，以及监视添加到容器的文本或其它内容的量(步骤1202)。如果检测到内容的尺寸超过容器的当前尺寸(步骤1203)，则通过在垂直方向上重复可重复的区域(被定义为在水平导引432、433之间的区域)而扩展容器(步骤1204)。如果检测到内容的尺寸是使得可重复区域的实例可以从容器中去除并仍旧适合于其中的内容(步骤1205)，则从容器中去除一个或多个可重复的区域(步骤1206)。容器和用户内容被重新呈现在用户的显示器上(步骤1207)。因此，在标示之间的内容被重复或被去除，以便最有效地匹配在自动扩展的用户可编辑的内容容器中的文本(和/或其它用户插入的内容)的量。自动扩展的用户可编辑的内容容器的实施方案优选地通过使用JavaScript来实施。

图13是当导航按钮被最终用户添加到导航区域或从导航区域去除时自动扩展的导航区域的操作的示例性实施例的流程图。如图所示，监视自动扩展的导航区域的用户选择(步骤1301)。监视用户请求(步骤1302)。如果检测到添加导航按钮的用户请求(步骤1303)，则导航区域被划分成三个部分，包括顶部或左面部分、可重复的中部部分、和底部或右面部分(步骤1304)，如前面参照图7A和7B讨论的。可重复的中部部分被重复一次(如在图7A和7B上显示的)以添加按钮(步骤1305)。如果检测到去除导航按钮的用户请求(步骤1306)，如果只有一个按钮，则阻止行动。如果有至少两个按钮，则从导航区域中去除可重复的中部分段的实例，并且剩余部分加入(步骤1307)。然后在用户的显示器上重新呈现导航区域(步骤1308)。

尽管已经论述了本发明的示例性实施例，不过所说明的实施例应被看作是对本发明的举例说明，而不是对本发明的限制。本发明的范围由下面的权利要求及所有等同的方法和系统限定。

Claims (24)

1.一种由在一个或多个计算机上执行的web构建工具显示在用户显示器上的灵活的可编辑的网页模板，包括：

自动扩展的用户可编辑的内容容器，所述内容容器自动扩展和缩减以适合于由用户插入在其中的内容，所述内容容器包括预定义的顶部部分、预定义的底部部分、和可重复的中间部分，所述内容容器具有与其相关联的用于监视相对于所述内容容器的尺寸的用户插入在其中的内容的尺寸的控件，如果用户插入的内容的尺寸超过所述内容容器的尺寸，则重复所述内容容器的中间部分的实例以扩展所述内容容器的尺寸，而如果用户插入的内容的尺寸是使得在所述内容容器的中间部分的实例被去除的情况下用户插入的内容将仍旧适合在所述内容容器内的尺寸，则去除所述内容容器的中间部分的实例以缩减所述内容容器的尺寸。

2.如权利要求1所述的网页模板，还包括自动扩展的导航区域，所述导航区域随导航按钮被最终用户添加和去除而扩展和收缩。

3.如权利要求1所述的网页模板，还包括在所有其它模板内容之后呈现的外部背景区域，其中所述外部背景区域仅仅包括单色、重复图案、或垂直梯度。

4.如权利要求1所述的网页模板，还包括在外部背景区域之上但在所有其它模板内容之后呈现的内部背景区域，其中所述内部背景区域仅仅包括单色。

5.如权利要求1所述的网页模板，其中自动扩展的用户可编辑的内容容器允许仅仅使用web安全字体来呈现文本内容。

6.如权利要求1所述的网页模板，还包括至少一个能够支持非web安全字体的文本区域。

7.如权利要求6所述的网页模板，其中所述至少一个文本区域具有与其相关联的自动尺寸控件，所述自动尺寸控件确定在所述至少一个文本区域中输入的文本的尺寸，自动确定缩放当前尺寸的文本以使得所述文本占用可用文本区域的全部宽度的量，确定缩放当前尺寸的文本以使得所述文本占用可用文本区域的全部高度的量，选择水平尺度和垂直尺度中的较小尺度，把用户输入文本缩放所选的较小尺度，以及用缩放后的文本替换在文本区域中的用户输入文本。

8.如权利要求1所述的网页模板，其中可重复的中间部分包括平铺在自动扩展的用户可编辑的内容容器的背景层中并显示在用户插入内容之后的插图，其中在可重复的中间部分中的插图的特征仅仅在于在垂直方向上没有变化或者重复图案具有重复频率。

9.如权利要求1所述的网页模板，其中预定义的底部部分包括平铺在自动扩展的用户可编辑的内容容器的底部部分的背景层中的插图。

10.如权利要求1所述的网页模板，其中预定义的顶部部分包括平铺在自动扩展的用户可编辑的内容容器的顶部部分的背景层中的插图。

11.如权利要求2所述的网页模板，其中自动扩展的导航区域包括与其相关联的导航区域控件，所述导航区域控件允许模板的最终用户选择要在所述导航区域中显示的多个按钮，并自动地使所述导航区域中的所选数目的按钮尺寸相同和显示。

12.如权利要求2所述的网页模板，其中自动扩展的导航区域包括：顶部导航区域部分，包括上半个按钮；底部导航区域部分，包括下半个按钮；以及可重复的中间导航区域部分，包括下半个按钮，其无缝地对准所述顶部导航区域部分或所述中间导航区域部分的另一个实例的上半个按钮，以及上半个按钮，其无缝地对准所述底部导航区域部分或所述中间导航区域部分的另一个实例的下半个按钮，其中所述导航区域控件监视所选数目的按钮，呈现所述顶部导航区域部分，如果多于两个按钮，则对于每个按钮一次呈现所述中间导航区域部分的实例，以及呈现所述底部导航区域部分以使得在导航区域中每一个上半个按钮无缝地对准所述导航区域中的相匹配的下半个按钮。

13.如权利要求12所述的网页模板，其中所述导航区域控件监视所选数目的按钮，以及如果检测到所选数目的按钮发生改变，则重新呈现导航区域，所述重新呈现包括：呈现顶部导航区域部分，如果多于两个按钮，则对于每个按钮一次呈现所述中间导航区域部分的实例，以及呈现底部导航区域部分以使得在所述导航区域中每一个上半个按钮无缝地对准所述导航区域中的相匹配的下半个按钮。

14.如权利要求12所述的网页模板，其中所述导航控件允许模板的最终用户选择和编辑导航按钮的名称，并自动确定具有相同尺寸的字体的导航名称并调整其尺寸，以使得每个名称适合在它各自的相同尺寸的导航按钮内。

15.如权利要求2所述的网页模板，其中所述导航控件允许模板的最终用户在水平的或垂直的导航菜单取向之间进行选择。

16.如权利要求1所述的网页模板，其中自动扩展的用户可编辑的内容容器被实施为HTML表格，所述HTML表格包括顶部单元，所述顶部单元仅仅包括绝对地放置的不可编辑内容；在顶部单元下面且相对于顶部单元放置的用户可编辑的中间单元，所述中间单元被配置成接收用户插入的内容；以及在下面且相对于中间单元放置的底部单元，所述底部单元仅仅包括不可编辑内容。

17.如权利要求16所述的网页模板，其中HTML还包括顶部左面单元，被绝对地放置在所述顶部单元的左面；中间左面单元，被放置在用户可编辑的中间单元的左面并且在顶部左面单元下面且相对于顶部左面单元，所述中间左面单元仅仅包括不可编辑的内容；以及底部左面单元，被放置在底部单元的左面并且在中间左面单元下面且相对于中间左面单元，所述底部左面单元仅仅包括不可编辑的内容。

18.如权利要求16所述的网页模板，其中HTML还包括顶部右面单元，被绝对地放置在顶部单元的右面；中间右面单元，被放置在用户可编辑的中间单元的右面并且在顶部右面单元下面且相对于顶部右面单元，所述中间右面单元仅仅包括不可编辑的内容；以及底部右面单元，被放置在底部单元的右面并且在中间右面单元下面且相对于中间右面单元，所述底部右面单元仅仅包括不可编辑的内容。

19.一种网页构建系统，包括：

一个或多个处理器，所述处理器在用户的显示器上提供可编辑的网页模板，所述网页模板包括：自动扩展的用户可编辑的内容容器，所述内容容器自动扩展和缩减以适合于由用户插入在其中的内容，所述内容容器包括预定义的顶部部分、预定义的底部部分、和可重复的中间部分，所述内容容器具有与其相关联的用于监视相对于所述内容容器的尺寸的用户插入在其中的内容的尺寸的控件，如果用户插入的内容的尺寸超过所述内容容器的尺寸，则重复所述内容容器的中间部分的实例以扩展所述内容容器的尺寸，而如果用户插入的内容的尺寸是使得在所述内容容器的中间部分的实例被去除的情况下用户插入的内容将仍旧适合在所述内容容器内的尺寸，则去除所述内容容器的中间部分的实例以缩减所述内容容器的尺寸；

输入装置，用于接收用户插入的内容和把所述用户插入的内容插入到自动扩展的用户可编辑的内容容器中。

20.权利要求19的网页构建系统，其中所述网页模板还包括自动扩展的导航区域，所述导航区域自动扩展或收缩以容纳由最终用户指定的多个导航按钮。

21.权利要求19的网页构建系统，其中可重复的中间部分包括平铺在自动扩展的用户可编辑的内容容器的背景层中并显示在用户插入内容之后的插图，其中在可重复的中间部分中的插图的特征仅仅在于在垂直方向上没有变化或者重复图案具有重复频率。

22.一种允许用户定制网页的方法，包括：

由一个或多个处理器把可编辑的网页模板显示在用户显示器上；

由一个或多个处理器在可编辑的网页模板内提供自动扩展的用户可编辑的内容容器，所述内容容器自动扩展和缩减以适合于由用户插入在其中的内容，所述内容容器包括预定义的顶部部分、预定义的底部部分、和可重复的中间部分，

由一个或多个处理器接收用户插入的内容，并把所述用户插入的内容插入到自动扩展的用户可编辑的内容容器中；

由一个或多个处理器监视相对于自动扩展的用户可编辑的内容容器的当前尺寸的用户插入在其中的内容的尺寸，并且如果用户插入的内容的尺寸超过所述内容容器的尺寸，则重复所述内容容器的中间部分的实例以扩展所述内容容器的尺寸，而如果用户插入的内容的尺寸是使得在所述内容容器的中间部分的实例被去除的情况下用户插入的内容将仍旧适合在所述内容容器内的尺寸，则去除所述内容容器的中间部分的实例以缩减所述内容容器的尺寸。

23.如权利要求22所述的方法，还包括：

由一个或多个处理器在可编辑的网页模板内提供自动扩展的导航区域，所述导航区域扩展和收缩以呈现由用户指定的多个尺寸相同的导航按钮；

由一个或多个处理器接收用户选择数目的想要的导航按钮；以及

把所选数目的尺寸相同的导航按钮呈现在网页模板中。

24.如权利要求23所述的方法，还包括：

由一个或多个处理器接收用户选择的导航按钮名称；以及

由一个或多个处理器自动确定具有相同尺寸的字体的导航名称并调整其尺寸，以使得每个名称适合并被放置在它各自的相同尺寸的导航按钮内。

Images