Methods of Website Generation

Abstract

Methods of generating websites using any combination of remotely and locally stored content are contemplated. Content is procured by a user on a client computer, and a request to add that content to a source folder is sent to a server. The server adds the content to the source folder, where it is made available for website creation. When a client requests creation of a website using the contents of a source folder, the server then generates that website. In some embodiments, the website can be generated according to a user-selected theme or a default theme.

Description

[0001] This application is a continuation-in-part of and claims priority to U.S. patent application Ser. No. 16/118,289 filed Aug. 30, 2018.

FIELD OF THE INVENTION

[0002] The field of the invention is website generation technologies.

BACKGROUND

[0003] The background description includes information that may be useful in understanding the present invention. It is not an admission that any of the information provided in this application is prior art or relevant to the presently claimed invention, or that any publication specifically or implicitly referenced is prior art.

[0004] Sharing content is an integral part of using the Internet, and the way in which Internet users share content is constantly evolving. Oftentimes, people share single items of content directly with one another, and that is fine for things like news articles, pictures, podcasts, etc. But in many instances, people want to be able to share more than one item of content with many people at once. One of the best ways to do that is to make that content publicly available all in one place by building a website.

[0005] But building a website is not a trivial endeavor. Even when using a service designed to make building a website simple, users are required to do the labor of building each page on a site according to a theme. The content that goes onto a website must be manually entered onto the site according to the restrictions of that theme, which requires a user to do quite a lot more work than is warranted for the simple desire of sharing content.

[0006] Thus, developments in content sharing have failed to appreciate advancements in website building technology that facilitate simple and quick creation of websites for sharing all kinds of content.

[0007] These and all other extrinsic materials discussed in this application are incorporated by reference in their entirety. Where a definition or use of a term in an incorporated reference is inconsistent or contrary to the definition of that term provided in this application, the definition of that term provided in this application applies and the definition of that term in the reference does not apply.

[0008] Thus, there is still a need in the art for improved website generating technologies.

SUMMARY OF THE INVENTION

[0009] The present invention provides systems and methods of website generation using locally and remotely stored content. One aspect of the inventive subject matter contemplates a method of generating a website, where the method includes the steps of: receiving, from a client, a request to add an item to a source folder, the request including an upload file attribute having a filename and a content type where the upload file attribute is associated with the item, and a save-to-folder identifier associated with the source folder; sending, to the client, a response to the request, the response including a source folder identifier and item attributes that include an item type and a URL; receiving, from the client, a website creation request, the website creation request including the source folder identifier; generating the website and a website URL, wherein the website is accessible by the website URL and the website comprises the item in the source folder; and sending, to the client, a website creation response, the website creation response comprising the website URL. In some embodiments, the item attributes can include a MIME type.

[0010] In some embodiments, the request to add an item to a source folder also includes one, or any combination of: an annotation attribute associated with the item; a title attribute comprising a title of the item; a title assignment attribute; an annotation assignment attribute; an image assignment attribute; an add-to-folder type; a URL associated with the item; and a save method attribute.

[0011] In some embodiments, the save-to-folder identifier can include a token that is associated with the source folder. In the same or other embodiments, the save-to-folder identifier is the same as the source folder identifier.

[0012] It is contemplated that the response to the request to add an item to a source folder can additionally include one, or any combination of: a completion status indicator; a created-at indicator; a data-storage-usage indicator; a description; image attributes; a title; and a name.

[0013] In some embodiments, the website creation request further comprises one, or any combination of: a name; a subtitle; a description; an image URL; and a theme. The response to the website creation request can additionally include one, or any combination of: author attributes comprising an author name and an author avatar; an author identifier; an analytics ID; a created-at attribute; a data storage usage attribute; a description; a website image; a website name; the source folder identifier; and a visual completion status.

[0014] Another aspect of the inventive subject matter contemplates a method of generating a website that includes the steps of: receiving, from a client, a set of user-selected items, the set of user-selected items including at least a first website address and a second website address; adding the set of user-selected items to a source folder having an associated source folder identifier; receiving, from the client, a request to create a website, the request comprising the source folder identifier; generating item representatives, each of the item representatives comprising at least one of a text block and an image corresponding to one of the set of user-selected items; generating the website using the item representatives; and sending, to the client, a URL corresponding to the website.

[0015] In some embodiments, the request to create a website can also include a user-selected theme, where the website is generated at least in part according to the user-selected theme. In the same or other embodiments, the source folder identifier comprises a source folder token, and the source folder token can be, or include, a UUID.

[0016] Another aspect of the inventive subject matter contemplates a method of generating a website that includes the steps of: receiving, from a client, a set of user-selected items, the set of user-selected items comprising at least a first website address and a second website address; adding the set of user-selected items to a source folder having an associated source folder identifier, wherein the first website address is assigned to a first subfolder within the source folder, and wherein the second website address is assigned to a second subfolder within the source folder; receiving, from the client, a request to create a website, the request comprising the source folder identifier; generating item representatives for each item of the set of user-selected items, each of the item representatives comprising at least one of a description and an image; and generating a website using the item representatives, where the generated website includes a first section based on the first subfolder and a second section based on the second subfolder.

[0017] In some embodiments, the request to create a website further comprises a user selected theme, and the website can then be generated according to the user-selected theme. The source folder identifier can include a source folder token, and the source folder token can be, or include, a UUID.

[0018] Various objects, features, aspects and advantages of the inventive subject matter will become more apparent from the following detailed description of preferred embodiments, along with the accompanying drawing figures in which like numerals represent like components.

BRIEF DESCRIPTION OF THE DRAWING

[0019] FIG. 1 shows an example of a gallery section of a website.

[0020] FIG. 2 shows a variety of different image styles.

[0021] FIG. 3 shows a variety of different item slot configurations.

[0022] FIG. 4 shows an example of an item slot arrangement having a gap.

[0023] FIG. 5 shows another example of an item slot arrangement having a gap.

[0024] FIG. 6 shows another example of an item slot arrangement having a gap.

[0025] FIG. 7A is a flow chart of an embodiment of the inventive subject matter.

[0026] FIG. 7B shows request and response flow between a client and a server for the flow chart of FIG. 7A.

[0027] FIG. 8A is a flow chart of another embodiment of the inventive subject matter.

[0028] FIG. 8B shows request and response flow between a client and a server for the flow chart of FIG. 8A.

[0029] FIG. 9A is a flow chart of another embodiment of the inventive subject matter.

[0030] FIG. 9B shows request and response flow between a client and a server for the flow chart of FIG. 9A.

[0031] FIG. 10A is a flow chart of an embodiment of the inventive subject matter that incorporates gap reduction.

[0032] FIG. 10B shows request and response flow between a client and a server for the flow chart of FIG. 10A.

DETAILED DESCRIPTION

[0033] The following discussion provides example embodiments of the inventive subject matter. Although each embodiment represents a single combination of inventive elements, the inventive subject matter is considered to include all possible combinations of the disclosed elements. Thus, if one embodiment comprises elements A, B, and C, and a second embodiment comprises elements B and D, then the inventive subject matter is also considered to include other remaining combinations of A, B, C, or D, even if not explicitly disclosed.

[0034] As used in the description in this application and throughout the claims that follow, the meaning of "a," "an," and "the" includes plural reference unless the context clearly dictates otherwise. Also, as used in the description in this application, the meaning of "in" includes "in" and "on" unless the context clearly dictates otherwise.

[0035] Also, as used in this application, and unless the context dictates otherwise, the term "coupled to" is intended to include both direct coupling (in which two elements that are coupled to each other contact each other) and indirect coupling (in which at least one additional element is located between the two elements). Therefore, the terms "coupled to" and "coupled with" are used synonymously.

[0036] It should be noted that any language directed to a computer should be read to include any suitable combination of computing devices, including servers, interfaces, systems, databases, agents, peers, engines, controllers, or other types of computing devices operating individually or collectively. One should appreciate the computing devices comprise a processor configured to execute software instructions stored on a tangible, non-transitory computer readable storage medium (e.g., hard drive, solid state drive, RAM, flash, ROM, etc.). The software instructions preferably configure the computing device to provide the roles, responsibilities, or other functionality as discussed below with respect to the disclosed apparatus. In especially preferred embodiments, the various servers, systems, databases, or interfaces exchange data using standardized protocols or algorithms, possibly based on HTTP, HTTPS, AES, public-private key exchanges, web service APIs, known financial transaction protocols, or other electronic information exchanging methods. Data exchanges preferably are conducted over a packet-switched network, the Internet, LAN, WAN, VPN, or other type of packet switched network. The following description includes information that may be useful in understanding the present invention. It is not an admission that any of the information provided in this application is prior art or relevant to the presently claimed invention, or that any publication specifically or implicitly referenced is prior art.

[0037] Methods of the inventive subject matter are directed to on-demand creation of websites using user-selected content. Users frequently need to quickly put together easy-to-access websites using a variety of content that is either remotely stored (e.g., content stored somewhere on the Internet, such as a website, web server, or cloud server(s)) or locally stored (e.g., content that is stored on a user's computer, such as a photograph or PDF document). Methods of the inventive subject matter facilitate creation of websites using any combination of locally and remotely stored content.

[0038] Each attribute described in this application can include an array of attributes of that kind. "Array" should be interpreted to mean any data structure--either known or discovered in the future--that is capable of storing the data or information that an array is described as being able to store. A linked list, for example, is included in this definition of "array." All attributes in this application, unless otherwise stated, should be interpreted as comprising either a single attribute or an array of attributes.

[0039] Many of the features and attributes discussed in this application can be applied to or used in all embodiments of the inventive subject matter described in this application, regardless of the embodiment where that attribute is discussed. The same is true for all of the subject matter described in this application unless explicitly stated otherwise.

[0040] Further, the steps of methods described in this application can be completed in an order other than that in which they are described, unless specifically described as being executed in a particular order or unless a particular order of execution is necessary to properly carry out the method.

[0041] FIGS. 7A and 7B show an embodiment of the inventive subject matter. In the method shown in these figures, the execution of various steps results in a newly generated website that incorporates user-selected content (e.g., remotely stored content, locally stored content, or some combination thereof). Interactions in the method involve a client and a server, where "client" refers to, for example, a computing device (e.g., a computer, a laptop, a mobile device, or the like) that is controlled by a user, and "server" refers to a computing device intended to host, for example, a website or web service (e.g., a server, cloud server, or other networked computer configured as a host).

[0042] For a server to generate a website using user-selected content, first the user must select and store that content in a way that makes it locally accessible to the server. In step 700, a server receives, from a client, a request to add an item to a source folder. A source folder is managed by the server and can be hosted on the server as well. The source folder is an organizational tool used to group items together, where an "item" is either locally or remotely stored content. An item can be, for example, a photograph, a document (e.g., *.pdf, *.docx, or any other filetype), a website, an audio recording, or any other type of content that can be remotely or locally stored. A user uses their computing device (e.g., where the user's computing device is the "client") to create the source folder (and optionally, one or more subfolders within the source folder), and also to select an item to add to the source folder. With the item identified, the client sends a request to the server, where the request includes information sufficient to identify the item and it requests that the item be added to the source folder.

[0043] Information sufficient to identify the item can include one, or any combination of, the following attributes: an annotation attribute associated with the item; a title attribute comprising a title of the item; an add-to-folder type; an upload file attribute; a URL; a title assignment attribute; an annotation assignment attribute; an image assignment attribute; a save method attribute; a save-to-folder identifier; and a browser attribute.

[0044] The add-to-folder type attribute indicates how the item is to be added to the folder. For example, if locally stored content is to be added (e.g., saved) to the folder, then the add-to-folder type attribute could be set to "upload" (e.g., a descriptor stored as a string), indicating that the item will be added to the folder via upload (e.g., from the client). In another example, if remotely stored content such as a website is to be added to the folder, the, the add-to-folder type attribute could be set to "link," since a website link would be sufficient to identify the website to be added to the source folder. In such a case, the server may then request the relevant item for local storage using the link.

[0045] The upload file attribute includes one or both of a filename and a content type. For example, if the item to be added to the source folder is a PDF, then the content type could be "PDF" and the filename can be the name of the PDF file.

[0046] In an embodiment where the item to be added to the folder is a website or other remotely stored content that can be accessed using a web address, a URL is included as an attribute. The URL attribute indicates a location where the remotely stored item can be located. In some embodiments, the URL can comprise an IP address, a web address, or other type of resource locator.

[0047] A title assignment attribute can also be associated with the item. The title assignment attribute can be a TRUE/FALSE indicator to indicate whether the server or the user will determine the title attribute for the item. For example, if the title assignment attribute is set to TRUE (or 1 or "Yes" or another binary indicator), then the server can automatically extract a title from the corresponding item (e.g., the title of a website, PDF document, etc.) and set that title as the title attribute for the item. If the title assignment attribute is set to FALSE (or 0 or "No" or another binary indicator), then a title provided by the user will be set as the title attribute for the corresponding item. In embodiments, a user can input a title for an item at the time the item is saved to a source folder, or at some later point in time.

[0048] An annotation assignment attribute operates similarly to the title assignment attribute. If the annotation assignment attribute is set to TRUE, then the server can automatically extract an annotation (e.g., snippet, summary, or metadata associated with the item) and set that annotation as the annotation attribute for the item. Otherwise, if the annotation assignment attribute it is set to FALSE, then an annotation provided by the user will be set as the annotation attribute for the corresponding item. In embodiments, a user can input an annotation for an item at the time the item is saved to a source folder, or at some later point in time.

[0049] An image assignment attribute is another indicator attribute. If the image assignment attribute is set to TRUE, then the server can automatically extract a representative image (e.g., an image contained within the item) and set that image as the image attribute for the item. Otherwise, if the image assignment attribute is set to FALSE, then a representative image selected by the user will be set as the image attribute for the corresponding item. For example, if the item to be added to the source folder is a website having an image associated with it (e.g., a Wikipedia entry having a featured image), then the server can automatically extract that image and set it as the image attribute. Alternatively, the user can select some other representative image to be set as the image attribute. In embodiments, a user can select an image for an item at the time the item is saved to a source folder, or at some later point in time.

[0050] A save method attribute indicates how an item is to be saved to the source folder. For example, if an item is locally stored, then the save method attribute can indicate that the save method is "upload." In embodiments where, for example, the item to be saved to the source folder is remotely stored and can be accessed via URL, then the save method attribute can indicate that the save method is "url_only."

[0051] A save-to-folder identifier can identify, for example, the source folder or a non-permanent folder in which an item (or items, if there are more than one) is temporarily stored before adding it to the source folder. In some embodiments, the save-to-folder identifier is associated with a request to add an item to a source folder such that, for example, a server can distinguish between multiple requests from different clients. In some embodiments, the save-to-folder identifier is a Universally Unique Identifier (UUID), and in other embodiments, the save-to-folder identifier is unique within the server, but not universally unique. In some embodiments, the save-to-folder identifier can be used by the server in the process of generating a source folder (e.g., the source folder does not exist until the request is received and processed by the server), and once the source folder is generated, the save-to-folder identifier can become the source folder identifier, or, in some embodiments, the source folder can be given a new source folder identifier.

[0052] Finally, a browser attribute can be included to identify the web browser with which the client sent the request to the server (e.g., Firefox, Chrome, Safari, etc.).

[0053] The server, after receiving the request to add an item to the source folder, then saves the item to the source folder, and responds to the request as shown in step 702. Saving an item to a source folder can include, for example, storing an item to a server in such a way that the item can be accessed via the source folder. This can be accomplished in a variety of ways depending on how the server (or other computing device) is configured (e.g., it can depend on the file structure). The response includes one, or any combination of, the following: a completion status indicator; a created-at indicator; a data-storage-usage indicator; a description; image attributes; a name; a title; a source folder identifier; and item attributes corresponding to the item.

[0054] A completion status indicator informs the client as to whether activities related to the client's request are completed. In some embodiments, the server's response to the client's request to add an item to the source folder can be sent to the client before all of the server's activities related to saving the item are completed.

[0055] A created-at indicator includes information about when the item was created on the server (e.g., when the item was saved to the source folder and recorded in the server as being present in the source folder). In some embodiments, the created-at indicator includes a time and date.

[0056] A data-storage-usage indicator can indicate, for example, the amount of memory or storage being used by the item on the server when it is stored in the source folder. This value can be useful to facilitate optimization during website generation. For example, if the data-storage-usage indicator indicates that the item is relatively large (e.g., the item, when included in a generated website, would consume more data than necessary to send to clients on mobile plans with limited data plans), then the item can be optimized during (or before) the website generation step. In some embodiments, optimization can include compressing images into different formats, optimizing documents (e.g., PDFs) to occupy less space, and the like.

[0057] A description can include a brief description of the item. The description can be pulled from the content of the item itself (e.g., from the contents of a document or website), or it can be pulled from the item's metadata (e.g., a description that exists in a PDF's metadata).

[0058] Image attributes can include information sufficient to describe several aspects of an image associated with an item. For example, the image attributes can include an array of information about an image including a full URL pointing to the original image or to an optimized version of the image, dimensions of the image, a tint, a dominant color of the image, moment data for the image, a URL pointing to a thumbnail of the image, and dimensions of the thumbnail of the image.

[0059] A title attribute can include, for example, the title or name of the item. In embodiments where the item is remotely stored (like a website), the title attribute can include information pulled from the website (e.g., a byline, a header, an article title, etc.). In embodiments where the item is locally stored, the title attribute can include the name of the file that is uploaded, or it can include a name stored in the file's metadata.

[0060] A title can be a title associated with an item. Thus, a title can include a title that is associated with an uploaded item or a title that is associated with a remotely stored item, based on either the content of the item or the item's metadata (e.g., a document title, an article title, etc.).

[0061] A source folder identifier identifies the source folder to which an item or items have been added. A source folder identifier can be a UUID, or it can be unique only at the service-level (e.g., an identifier that is unique to the server, but not universally unique). In some embodiments, the source folder identifier can be a token that is assigned to the source folder by, for example, the server.

[0062] In some embodiments, a client can request to add a plurality of items (of the same or different types) to a source folder at the same time (e.g., the request can relate to a website and an uploaded PDF), or a client can make multiple requests (each request to add one or more items to a source folder) before the server responds. Each item in the request(s) has corresponding item attributes, and the item attributes are returned to the client in the server's response to the client's request(s) to add one or more items to a source folder. The item attributes for each item can include one, or any combination of: a MIME attribute; an item type (e.g., upload, link); and a URL.

[0063] MIME stands for Multipurpose Internet Mail Extensions. A MIME attribute includes a type and a subtype, which are two strings, separated by a `/`. No space is allowed. The type represents the category and can be a discrete or a multipart type. The subtype is specific to each type. MIME types include for example: text, image, audio, video, and application. MIME subtypes include, for example: (for text) plain, HTML, JavaScript, and CSS; (for image) gif, png, jpeg, bmp, and webp; (for audio) midi, mpeg, webm, ogg, and way; (for video) webm and ogg; (for application) octet-stream, pkcs12, vnd.mspowerpoint, xhtml+xml, xml, and pdf.

[0064] An item type attribute can be used to identify an item type for the item in the request to add an item to the source folder. For example, an item type attribute can be "upload" for when the item is locally stored content (e.g., content that has to be uploaded to the server such as a document, a video, or an audio file), a "note" for when an item is a user-defined note (e.g., a grocery list), or a "link" for when the item is remotely stored content that is accessible via a link.

[0065] A URL can be included in the server's response. In embodiments where the item is locally-stored content, the URL can direct a web browser to a location on the server (e.g., on the same domain as the server, or on a sub-domain of the server that directs clients to the server) where the item, or some portion of the item, can be accessed (e.g., a URL of a location where the item was uploaded onto the server). In embodiments where the item is remotely stored, the URL can direct a web browser to a location on an external server where the item (or some portion of the item) can be accessed. A URL can point to a wide variety of content, including webpages, YouTube videos, images, documents, videos, and audio files.

[0066] With the preceding steps completed, the server can add an item to an identified source folder. With one or more items added to a source folder, a user can then request the server to create a website using those items, as shown in step 704. Thus, in step 704, the client sends to the server a website creation request. The website creation request includes one or more of the following attributes: the source folder identifier, the name, a subtitle, a description, an image URL, and a theme.

[0067] The source folder identifier is included in the website creation request to help the server to know which source folder to draw from to create the website. Thus, any item or items that have been added to the source folder can be used to create the website subject to the request.

[0068] The name included in the website creation request can be, for example, the source folder name. It is also contemplated that the name can be a name for the website that is being requested (e.g., a user-defined name). Other possible name attribute properties are described above.

[0069] A subtitle, like other descriptive attributes, can include information that is taken from one or more of the items contained in the source folder, or it can be taken from the source folder itself (e.g., from source folder metadata). In some embodiments, the subtitle attribute can be user-defined.

[0070] A description, like other descriptive attributes, can include information that is taken from one or more of the items contained in the source folder (e.g., it can be algorithmically generated based on the contents of the items in the source folder), or it can be taken from the source folder itself (e.g., from source folder metadata). In some embodiments, the description attribute can be user-defined.

[0071] An image URL attribute includes a URL that points to an image that is stored either on the server or on a remote server, where the image that the URL points to is relevant to the website that is subject to the client's request. The image URL attribute allows the client's website creation request to include a preferred image that can be used on the website as, for example, a featured image (e.g., on a banner, a header, etc.).

[0072] A theme attribute can also be included in the client's request to generate a website. A theme attribute includes a website theme according to which the generated website must be created. A theme can define formatting, styling, colors, fonts, layout, etc. for a website, and inclusion of a theme attribute allows for a user to make a theme selection so that the client's request can include that theme selection in the theme attribute. A theme can also define a general structure for a website. For example, a theme might define whether a website is a flat, scrollable single page of content or a series of interlinked pages. In some embodiments, the theme can be user-selected, but in the absence of a user selection, a default theme can instead be implemented and sent in the request. In some embodiments, if no theme attribute is included in the request, then the server uses a default theme.

[0073] In some embodiments, methods of the inventive subject matter can evaluate a variety of different aspects of items when determining a theme to represents those items. In these embodiments, item type or even aspects of various item representatives such as resolution, length of text, content of text, etc. can be taken into consideration when selecting a theme. For example, if a majority of items that are to be used in generating a website are images, then a theme that better represents images can be used. If titles and descriptions of items are long, then a theme can be selected that is better at representing text-heavy content (e.g., a theme where fonts are more legible and less stylized).

[0074] In some embodiments, some of the items to be used to generate a website are web pages. The domains from which those items originate can be evaluated and considered when determining an appropriate theme. For example, if the web pages to be included in a generated website predominantly originate from fashion websites, then a fashion-centered theme can be implemented for the generated website. If, on the other hand, the web pages to be included are predominantly news web pages, then a theme that is more appropriate for text-based information can be implemented for the generated website.

[0075] Next, the server generates a website in response to the client's request, as shown in step 706. The website that is generated, which can be accessed using a website URL (or other type of resource locator that facilitates access to the website over a network connection), comprises all items that have been added to the source folder.

[0076] Once the website has been generated, the server sends, to the client, a response to the website creation request, as shown in step 708. In some embodiments, actual website generation may alternatively occur when the website is requested by the user via http, https, or other website protocol. The response to the website creation request includes one, or any combination of the following: author attributes; an author identifier; an analytics ID; a created-at attribute; a data storage usage attribute; a description; a website image; a website name; the source folder identifier; total data storage usage; the website URL; and a visual completion status.

[0077] Author attributes can include an author name and an author avatar. In some embodiments, the author is the user that caused the client to send a website creation request to the server. Thus, the author name can be that user's name or username. The author avatar can be a user-defined image that is associated with the user or with the client. In some embodiments, the author and author avatar can both be user-defined.

[0078] An author identifier is used to identify the author of the website. In some embodiments, the author identifier is a token. The author identifier can be a UUID, or it can be an identifier that is unique within the server without being universally unique. The purpose of the author identifier is to allow the server to distinguish between authors of different websites that are generated in response to different website generation requests from different clients (i.e., requests from different authors).

[0079] An analytics ID can be included in some embodiments. The analytics ID can be, for example, an identifier that is specific to a website analytics aggregator (e.g., a Google Analytics ID). It can be useful in allowing an author (i.e., a user) to track data related to the generated website.

[0080] A created-at attribute includes one or both of a time and date at which the website was generated. It can additionally or alternatively include a date and time at which the response to the website generation request is sent to the client.

[0081] A data storage usage attribute includes information about the size of the generated website, which can be measured in bytes (e.g., kilo-, mega-, giga-). This information can be useful for optimization. For example, when a generated website exceeds a certain space threshold, the client can initiate a request to optimize the images on the generated website by changing the format or resolution of each image. This is important to reduce website loading times, which can often drive impatient users away from a website they are otherwise interested in visiting.

[0082] A description attribute is described above in more detail. In the response to the website generation request, the description attribute can include a description of the generated website, for example. In some embodiments, a description of a source folder can be the same as a description of a website that is generated using that source folder.

[0083] A website image attribute can include a featured image for the website. In some embodiments, the website image attribute can include information sufficient to describe several aspects of an image associated with the website. For example, the image attributes can include an array of information about an image including a full URL pointing to the original image or to an optimized version of the image, dimensions of the image, a URL pointing to a thumbnail of the image, and dimensions of the thumbnail of the image. In embodiments, a website image attribute can also include a focal point. The focal point defines the central point of interest for an image. When a focal point is defined, and the featured image is larger than the user's viewport (e.g., the user may be viewing the website on a mobile device), embodiments will avoid cropping the focal point out of the image.

[0084] A source folder identifier can also be included in the response. The source folder identifier identifies the source folder from which the website was created. It can be a UUID or an identifier that is unique within the server without being universally unique.

[0085] The response to the website creation request includes the website URL. The website URL can be used by, for example, a web browser to access the website that the server generated according to the client's request to generate a website from a source folder. The website URL can be used to directly access the generated website, or it can cause one or more re-directs resulting in accessing the generated website. Re-directs to access a generated website can be useful for website analytics including tracking where traffic to the generated website originates.

[0086] A visual completion status can also be included in the response to the website generation request. A visual completion status can indicate to a client whether the generated website's visual features have been completed. In some embodiments, a website's visual features are completed when all of the images on the website are optimized. Optimized images can be stored on the server that handles website generation or on another server for easy access by the generated website.

[0087] In some embodiments, the step of receiving a request to add an item to a source folder can comprise information sufficient to add multiple items to the source folder at the same time. For example, a user on a client computer could select some combination of either remotely stored items, locally stored items, or both, and information sufficient to identify and add those items to a source folder could be transmitted in the request according to the description above.

[0088] It is also contemplated that the step of receiving a request to add an item to a source folder can be carried out multiple times (e.g., in sequence or in parallel), where each request corresponds to a different item that a user on a client computer would like added to a source folder. The step of sending a response to the request to add an item to a source folder can be carried out once in response to multiple requests, or the server can generate a unique response to each request (e.g., each request corresponds to a single item and has a unique corresponding response).

[0089] The end result is that a source folder can hold any number of items, and when the server receives a request to generate a website, the server generates the website using all of the contents of the source folder. In some embodiments, a request to generate a website can also include instructions to include only a subset of items in the source folder.

[0090] In some embodiments, multiple source folders can be used to create a website. When multiple source folders are used in the course of generating a website, the server may use each source folder to create a different section on the website. For example, if a first source folder includes items related to chickens (e.g., articles, research papers, pictures) and a second source folder includes items related to eggs (e.g., articles, research papers, pictures), then the resulting website that the server generates using the first and second source folders would include two sections: a chicken section and an egg section. In the same or alternative embodiments, the server could generate a website where all the content from each source folder is combined into a single section of the website.

[0091] To create a website using multiple source folders, it is contemplated that the request to generate a website can identify multiple source folders by including multiple source folder identifiers. Then, when the server generates the website, it has sufficient information from the request to incorporate the contents of multiple source folders, and it can then incorporate sections into the website where each source folder corresponds to a section on the website.

[0092] In some embodiments, a source folder can additionally or alternatively include any number of subfolders. For example, a "chicken" source folder can include "domesticated chickens" and "chicken history" subfolders, where each subfolder can contain items. In these embodiments, the source folder itself can include one or more items as well as one or more subfolders. In embodiments where a source folder includes one or more subfolders, the request to generate a website includes, at a minimum, a source folder identifier for the main source folder that contains one or more subfolders. By identifying the source folder, the server can get information about all of the contents of the source folder, including information about items and subfolders contained in the source folder. It is also contemplated that the request to generate a website can include one or more source folder identifiers, where each source folder identifier corresponds to a source folder or subfolder (which can be considered a type of source folder).

[0093] As described above with relation to generating a website using multiple source folders, when a source folder includes subfolders, those subfolders can each be used by the server to create subsections on the generated website. For example, a main source folder can be a main section, and each subfolder within that source folder can be a subsection to the source folder's main section. This form of hierarchy can be repeated for any number of source folders and subfolders. It is contemplated that subfolders can themselves contain subfolders, and so on.

[0094] During the step of generating a website, the server can undertake several steps to create item representatives from the items in the one or more source folders used to create the website. For each item, the server can either create or identify one or more item representatives that can be used in the website. An item representative can be (or include), for example, an image, title, subtitle, and description pertaining to an item. In some embodiments, an item representative can also be (or include) a name and a title, as described above. In this way, one item can have one or more item representatives associated with it.

[0095] In some embodiments, the server can create the item representatives from the items in a source folder at the time the client sends a website creation request. In other embodiments, the server can create the item representatives at the time the items are added to the source folder, and then the server can use those item representatives when generating a website. In this case, the server can use the item representatives in both the source folder and the corresponding website.

[0096] In other embodiments, the server can create a shell of a website (i.e., a website that does not include any items) at the time the client sends a website creation request. Then, the server can dynamically create the item representatives at the time that a web browser requests that website from the server and fit the item representatives into the shell.

[0097] Item representatives can then be used by the server in the process of generating a website. For example, websites are generated, at least in part, according to a layout, where the layout includes guidelines about where item representatives (e.g., one or more parts of an item representative) for each item should be placed on the website, as well as how those item representatives should be styled (e.g., fonts, image cropping, location, orientation, border, and any other style information that can be applied using, for example, a CSS sheet). A layout can be included with a user-selected theme, or, if no user-selected theme is defined, a default layout (or, in some embodiments, a set of default layouts) is used.

[0098] With item representatives created for each item, generating a website then becomes a matter of fitting item representatives into corresponding places on the website according to the layout (e.g., placing an item description in an item description slot and fitting a corresponding item image in an item image slot that is positioned above the item description according to the layout).

[0099] Multiple layouts can also be used in the generation of a single website. For example, if a website includes multiple sections (e.g., a website is generated using items from multiple source folders, where each source folder is used for a different section of a generated website), then each section of the website can be generated according to a different layout. It is similarly contemplated that a single layout can be used for multiple sections of a generated website, causing each section to have a similar look and feel. As mentioned above, one or more layouts can be included in a theme.

[0100] Layouts facilitate visually pleasing presentations of item representatives by, for example helping to avoid undesirable image clipping and text truncation/clipping. Layouts also help to achieve variation and variety in the generated website's appearance. To further improve variety, embodiments may use one of several default layouts when a user does not define a layout (e.g., either by selecting a layout or by selecting a theme having one or more layouts). Layouts can help avoid dedicating a large space on a website for a low-resolution image that would not look good in that large space. Layouts can help to eliminate visual gaps on a generated website. Layouts can also be used to determine which item representatives would be appropriate for different areas of the website. For example, a layout can include a requirement that a text description item representative should be placed only if the text description includes fewer than 140 characters. In another example, a layout can require an image item representative to have a resolution that exceeds a certain threshold before it will display that image item representative in an image space on a generated website.

[0101] In some embodiments, layouts can include item slots that can be assessed and changed depending on the needs of the layout. Layouts that can bring about item slot changes to, for example, improve the visual appeal of a website or to eliminate gaps in a website's item slot arrangement can be referred to as auto-layouts. For example, if a layout includes a default item slot that accommodates both an item description and an accompanying item image, but an available item image has a resolution that is too low for the item slot's default configuration, then an auto-layout can cause the item slot to deviate from the default by, for example, changing the item slot to include a smaller image portion and to include a larger text description portion in response to the changed item image portion of the slot. Thus, an auto-layout of the inventive subject matter can, among other things, allow item slot configurations to depend on the item representatives to be shown in the item slots.

[0102] As mentioned above, a layout capable of adjusting item slots (e.g., changing size, shape, configuration, dimensions, etc.) is referred to as an "auto-layout." An auto-layout is thus not necessarily constrained to a particular layout and can automatically adjust to accommodate different item representatives corresponding to items in a source folder. In the course of determining how an auto-layout needs to adjust to accommodate different item representatives, it is convenient to consider the subject matter that can be presented by a layout. Layouts can include both sections and item slots, where a section can contain other sections as well as item slots. Each section can itself include an image, a title, a description, or any combination thereof.

[0103] As discussed above, item slots can accommodate a wide variety of different item types (and item representatives created thereof), including links, notes, and uploads. Links can include web links, streaming video links (e.g., YouTube links), image links, document links, video links, and audio links. Uploads can include uploaded images, uploaded documents, uploaded video, and uploaded audio. Each item slot in a layout can include a representative image, a title, a subtitle, a description, etc. Additional information can also be included in the item slot, depending on the type of information contained in the corresponding item. For example, if the item includes video of any kind, then the item slot can include space for an item representative that includes a preview of the video (e.g., a looping portion of the video, a still from the video, or a still image that, upon hovering the mouse over it, shows segments of the video playing, etc.).

[0104] When a website is generated according to systems and methods of the inventive subject matter, an auto-layout (e.g., the server implementing an auto-layout) can determine whether each section within the layout should be formatted according to one of a plurality of section-level formats. For example, embodiments can include a "gallery" section and a "normal" or default section. Gallery sections present item slots that primarily feature images (e.g., thumbnails), as shown in FIG. 1. In some embodiments, a gallery section can include a title, a description, and one or more images (e.g., where the images are item representatives).

[0105] Auto-layouts can present images in a variety of ways. Images can be used as cover images (e.g., where the image covers an entire space of a section). In some embodiments, an image used as a cover image can be cropped or resized to better fit the area allocated for the cover image. Images can be placed into a container (e.g., an item slot), where the image can be shown uncropped but in a contained area and not shown fully edge to edge within that container. Images can also be presented as stamps, where a stamp is similar to an image container except that the stamp image is smaller (e.g., a thumbnail) than an ordinary container. In some embodiments, no image is used at all (e.g., other item representatives such as a description and title can be used without an associated image). FIG. 2 demonstrates how each image style can be displayed to a user on a website generated according to the inventive subject matter.

[0106] When a website is generated, the auto-layout is used to make a variety of determinations. It is used to determine several image options (e.g., whether the image should be shown, and, if it should be shown, whether it should be shown as a part of a cover, a container, or a stamp). Moreover, the auto-layout must also determine a configuration for each item slot within a layout, e.g., it must determine item slot sizes and whether each item slot should be split between, for example, an image and text, and how an image within an item slot should be presented (e.g., an image can be presented in any of the ways described above and shown in FIG. 2). FIG. 3 shows schematic representations of a variety of different items slots that can include one or any combination of an image, text, a title, and a description.

[0107] In some embodiments, a layout (auto- or otherwise) can dictate that a generated website includes one or more columns for item slots. When a website includes two columns, for example, the item slots making up the two columns can be rearranged depending on screen size and resolution so that the content presented on the website can be dynamically changed to fit into a single column instead of two. This can be useful to ensure easy viewing when the website is accessed from devices with small screens (e.g., cell phones) and also from devices with larger screens (e.g., computers and laptops).

[0108] Item slots within layouts can be arranged in a variety of ways, including: single column width by single row height ("single"); double column width ("double wide"); double row height ("double high"); and double column width and double row height ("two by two"). For example, in a single item slot, the item slot can accommodate a variety of different item representatives including text overlaid on an image, text that is arranged side-by-side with an image, and text below an image within the single column width by single row height item slot. Double wide item slots can accommodate, for example, text overlaid on an image that spans the entire double wide item slot or an image with associated text beside it. A double high item slot can accommodate, for example, text overlaid on an image or text that is above or below an associated image. Two by two item slots can accommodate larger images, more text, or a combination of both with the option of including any other type of item representation.

[0109] When a layout includes double wide item slots, it is possible a gap can emerge in the layout. A gap, in this context, can appear when, for example, two double wide item slots 402, 404 (regardless of item height) appear above and below a one-column-wide item slot 406 (regardless of item slot height), as shown in FIG. 4, thus leaving a gap next to the one-column-wide item slot.

[0110] Gaps can also emerge when an item slot is placed next to another item slot where one of those two items slots has a different height than the other. For example, as shown in FIG. 5, when a double high item slot 502 is placed adjacent to a single item slot 504, the single item slot 504 slot ends up having a gap below it. The gap can similarly appear above item slot 504 or it can appear as two gaps both above and below item slot 504, depending on the alignment of the slots relative to each other. In general, gaps can occur whenever two or more item slots having different dimensions are placed adjacent to each other.

[0111] An auto-layout of the inventive subject matter strives to achieve several goals. Auto-layouts can determine item slot dimensions and which item representatives should be placed within those item slots so as to improve information presentation. Auto-layouts help reduce, for example, image cropping and truncation of an item title or item description. For example, an item title can sometimes be truncated when it includes too much text in relation to the amount of space available in an item slot. An auto-layout can determine that an item having a longer associated title can be placed into either a double wide or double high item slot so there is more space for item representatives, including the longer title.

[0112] In another example, when an item slot has an aspect ratio that necessitates undesirable image cropping that can remove portions of an image that should not be removed (e.g., an image that has two people in it and one person is completely cropped out to accommodate an aspect ratio that is different from the image's natural aspect ratio), the auto-layout can change the item slot's dimensions to better accommodate the image. For example, tall item slots (e.g., item slots where the height is greater than the width) can lend themselves better to accommodating portrait-orientated images, whereas wide item slots (e.g., item slots having a greater width than height) can lend themselves to landscape-oriented images. In embodiments where an item slot is split (e.g., an item slot has an image item representative in one portion and a text item representative in another portion of the slot), the split between different item representatives in an item slot may be horizontal or vertical (e.g., depending on whether the item slot is wider than it is tall, or vice versa). It is also contemplated that the split can be diagonal, or the item slot can be split by a non-linear divider. An item slot's split can affect how item representatives within the item slot are cropped or truncated.

[0113] Auto-layouts can also help to bring about variation and variety in item slot choices. When the same item slots are repeated over and over again, a generated website can look dull. Accordingly, an auto-layout can randomly select different item slot sizes and configurations to help give a generated website the appearance of being human-made. In some embodiments, auto-layouts can also help to avoid allotting a large item slot or portion of an item slot for an image item representative if that image item representative includes an image that has too low of a resolution to look good within the allotted item slot. This helps avoid including low-quality images within layouts to give a generated website a more professional look.

[0114] In some embodiments, auto-layouts can also help reduce gaps by selecting item slot sizes that fit together without creating gaps. In some embodiments, the item slots selected for use within an auto-layout can be selected based on the content that needs to be included within those item slots. For example, images and videos can look better in item slots where the image or video can span the entire width of an item slot. When an item is a document, it can look better in an item slot where an image is separated from text (e.g., an item slot where there is a division between an image item representative and a text item representative). In some embodiments, an image associated with a document can itself be an image of a page in the document instead of an actual image from document (especially in cases where a document does not include any images). In these embodiments, having a text-based item representative overlaid on an image item representative from the document can make the text-based item representative impossible to read (e.g., because it would be laid over other text).

[0115] Webpages of the inventive subject matter are generated according to one or more layouts in phases. A layout, or auto-layout, can be used recursively during generation of each section of a generated website. In some embodiments, sections are considered independently of each other, while in other embodiments, sections can be interrelated such that relationships between sections can be taken into consideration during website generation.

[0116] For a given section to be generated in the course of generating a website, an auto-layout determines the different sizes and configurations of the item slots within the section. In some embodiments, the auto-layout can determine whether a section needs to show more than a cutoff number of items (e.g., more than five, more than 10, or more than 15). If items to be included within a section include media item types (e.g., audio, video, images, etc.), then the auto-layout can make the section into a gallery section. For example, an auto-layout creates a section as a gallery-type section when greater than some threshold quantity of image-type item representatives are to be fit into that section's item slots. In some embodiments, an auto-layout can set the section type to be gallery when the section includes >25%, >50%, or >75% image items. If the number of image items is less than a threshold amount, the section can be created normally.

[0117] In some embodiments, sections can be hybrid sections that include normal item slots and also gallery item slots. The gallery item slots can be grouped together. These embodiments do not require an all-or-nothing approach to section type determination, and thus it doesn't matter how many images there are in a given section--gallery item slots can be included in sufficient numbers to accommodate however many images exist within a section.

[0118] An auto-layout also determines what type of item slots can be used within a particular section. It selects the proper item slots for each item, e.g., it selects item slots having appropriate widths and heights as well as internal item slot configuration (see, e.g., FIG. 3) for the item representatives that are to fit into each slot, depending on attributes of the item representatives for each item. For example, if a website item is included that has an image item representative oriented as a landscape, then an auto-layout can assign that item to a double wide item slot so that the image can span the entire item slot.

[0119] An auto-layout can determine the best, or at least an acceptable, item slot size and configuration (i.e., the item slot type) according to a scoring algorithm. Particularly, for each item representative, the auto-layout can assign a numerical score to each possible item slot type. Item slot types with higher scores are selected over item slot types with lower scores for a particular item representative. Any or all of the attributes discussed herein, including item type, image resolution, title length, description length, etc. can increase or decrease the score of an item slot type based on its compatibility with an item representative. When two item slot types have the same score, an auto-layout can select one at random or one that has not been used recently to improve the variety of item slot types.

[0120] Item slot scores can be improved depending on an item slot's compatibility with one or both of an item's title length and description length. For example, items with short length titles and/or descriptions can be better suited for a single item slot with an image to a side of the title. Items with long length titles and/or descriptions, on the other hand, can be better suited for tall item slots (e.g., an item slot with greater height than width such as a double high item slot). Items with normal length titles and/or descriptions can be suited for all item slots except, for example, single and double item slots with edge-to-edge images and single item slots with an image on a side. Item title lengths can be evaluated according to standardized character lengths, e.g., a short title has at most 75 characters, a normal title can have from 75-115 characters, and a long title can have from 115-175 characters. Description title lengths can be evaluated similarly using corresponding ranges of characters.

[0121] Depending on item type, additional adjustments to item slot scores can also be made. For example, when an item is an image or a video, an auto-layout can ensure that the only item slots considered for those item types are configured to accommodate edge-to-edge image or video. In instances where an item is a document or note, on the other hand, an auto-layout can ensure that the only item slots for those item types are configured to include a split between an image and text.

[0122] In some embodiments, an item slot's score can be adjusted according to the nature of an image that is associated with an item. For example, if an image associated with an item is a screenshot of a web page or of the item itself (or believed to be a screenshot based on, e.g., a naming convention of the image file), the auto-layout can determine not to use an edge-to-edge item slot for that image. Often, edge-to-edge screenshots of a web page or an item can include text (e.g., when an item is a document or note, the only image for that item would be a screenshot of the document or note that includes text) and having an item's title or description overlaid on top of a screenshot of that text-laden item can result in text being overlaid onto text, making it difficult or impossible to read. In some embodiments, text can be detected in an item's image using, for example, OCR software, and when text is detected, an auto-layout can then determine that the affected item should not be placed into an item slot featuring an image overlaid with text.

[0123] In some embodiments, item slot scores can be affected by an aspect ratio or size of an item's image or video, or both. For example, an item slot's score can be improved when it's size or dimensions (or both) better match those of an item's image or video. Likewise, an item slot's score can be diminished when its size or dimensions (or both) do not match those of an item's image or video. For example, when an item representative (e.g., an item video or image) is approximately square, then the auto-layout can determine that an item slot should have a similar aspect ratio (e.g., the same number of columns and rows). When an item is a note or document, then the auto-layout can favor, for example, a single item slot, a double wide item slot where an item image is to a side of the slot, or a double high item slot with an image on the top or the bottom of the slot.

[0124] When an item to be included in an item slot is a web link, the auto-layout can give better scores to single item slots that accommodate an edge-to-edge image on a side of the slot, or an item slot that is taller than it is wide and having an image on the top or bottom.

[0125] In instances where an item image is around twice as wide as it is tall and also has sufficiently high resolution (where sufficiency of resolution can depend on a variety of factors including item slot size and resolution and size of a screen that it is to be presented on), a variety of item slots can be evaluated. For example, item slots that are configured to accommodate videos or images in an edge-to-edge manner, item slots for documents or notes that are wide with an image on a side, and item slots for web links that are wide with an edge-to-edge image can be considered baselines for scoring.

[0126] Item slots that are twice as wide as they are tall (e.g., double wide item slots) can receive better scores for images that are wider than they are tall (e.g., approximately twice as wide as tall). In instances where the image has a low resolution (e.g., a resolution where the image's low quality would be apparent when rendered on a website), then, for example, a single item slot with an image on top or bottom, a wide item slot (e.g., a double wide item slot) having an overlaid image, or a wide item slot with an image on a side can be given better scores than other item slots.

[0127] When an item image is elongated even more than a 2:1 ratio of width to height, then single item slots with the image on top can be scored better than other item slots. If an elongated image has a low resolution, then the score for an item slot that is wide with an image on a side can be reduced to make it less likely an auto-layout will select that item slot.

[0128] When an image is oriented as a portrait (e.g., taller than wide), then similar determinations are made as with elongated images, except that an auto-layout will favor single item slots with an image on a side, item slots that are taller than they are wide that accommodate an edge-to-edge image, or item slots that are wider than tall and accommodate an image on a side.

[0129] In some embodiments, in the course of selecting item slots, repetition of similar item slots can be avoided. For example, if an auto-layout evaluates an item slot for item n in a preliminary layout, the auto-layout will consider the configuration of item slots that have already been selected for items n-1 and n-2. If the same configuration of the item slot being considered for item n has already been selected for items n-1 or n-2, then an auto-layout can instead determine whether there exists an equal or comparable item slot (e.g., an item slot that scores equally or comparably to the item slot being considered for item n) that can be selected instead.

[0130] In some embodiments, auto-layout item slot selection, as mentioned above, can additionally consider image resolution of all images in a section. The auto-layout can then favor larger item slots (e.g., two by two item slots, double wide item slots, or double high item slots) for items having images with the highest resolutions (e.g., the top 5-20% of images) among the images in the section.

[0131] Once an item slot is selected, the auto-layout can set image options. For example, if an item image has a low resolution, then a stamp can be used. If an item is a document, then an image of the document (e.g., a screenshot of a page of the document) can be placed into a container to preserve aspect ratio, etc. If an item image is a screenshot, then the image can be put into a container for the same reasons a document's image would be placed into a container. In some embodiments, an image can be set as a cover image (e.g., with or without overlaid text), so that the image covers the full area allocated for the image, though the image may be cropped as a result.

[0132] As mentioned above, an auto-layout can also be responsible for filling gaps that are created when different sized item slots are placed adjacent to each other. In some embodiments, a preliminary layout of item slots is created. Adjacent combinations of item slots are evaluated to determine where gaps exist, and then the auto-layout determines how to fill those gaps by, for example, reorganizing or changing the dimensions of existing item slots. In some embodiments, item slot sizes and locations are determined before the website is generated so that by the time the website is generated, all item slots can fit together with minimal gaps (or, ideally, no gaps). In this sense, a preliminary layout can be created, and combinations of item slots are evaluated for gaps before modifying some of the item slots to eliminate those gaps. This process can be repeated until all gaps are eliminated, until any remaining gaps cannot be eliminated, or for some set maximum number of iterations (e.g., 5, 10, etc.)

[0133] In other embodiments, item slots are evaluated and modified sequentially, e.g., as each new item slot is considered and placed into an auto-layout, the auto-layout determines whether the item slot needs to be modified based on the other items slots that have already been placed. Decisions for gap elimination can thus be localized by section without necessitating a global view of an entire generated website. Thus, item slots can be evaluated either based on a preliminary arrangement of item slots, and, in some embodiments, the preliminary arrangement of item slots includes all possible item slots in preliminary positions before evaluation, while in other embodiments, a preliminary arrangement of item slots is generated one item slot at a time as each subsequent item slot is evaluated and put into position in the preliminary arrangement.

[0134] If a particular arrangement of item slots is found to result in a gap, then an auto-layout must determine how to eliminate the gap. For example, as shown in FIG. 6, a gap exists because there is a double high item slot 602 adjacent to a single item slot 604. That gap can then be eliminated by, for example, changing the double high item slot 602 to be a single item slot, or by changing the single item slot 604 to a double high item slot.

[0135] In the example shown in FIG. 5, a gap exists because a double high item slot 502 is placed above a double wide item slot 506 with a single item slot 504 adjacent to the double high item slot 502. An auto-layout could detect this gap and then eliminate it by changing the double wide item slot 506 to a double high item slot, or by changing the double high item slot 502 and the single item slot into 504 double wide item slots. In the example shown in FIG. 6, a double high item slot 602 is to the left of a single item slot 604, and a second double high item slot 606 is below that single item slot 604 resulting in a gap below the first double high item slot 602. To eliminate this gap, a variety of changes can be made to the item slots. The single item slot 604 can be made into a double high item slot and the second double high item slot 606 can be made wide, the first double high item slot 602 can be made a single item slot and the second double high item slot 606 can be made a double wide item slot, the single item slot 604 can be made a double wide item slot and moved below the two double high item slots 602, 606, etc. Changes to item slots can be made based on evaluations of different item slots as described above.

[0136] An auto-layout thus first identifies a gap and the arrangement of item slots that gave rise to the gap's existence. Next, it determines a best way to eliminate the gap. The "best way" to eliminate a gap takes several factors into consideration, including a frequency with which same-sized item slots are used in a section. For example, if too many item slots having the same size are used consecutively, then an item slot having that same size will be disfavored by the auto-layout for gap elimination. If a particular size of item slot is disfavored or otherwise cannot be used, then the remaining possible item slots are evaluated as discussed above. For example, if two possible item slot changes that can fill a gap are "make the item slot wide" or "make the item slot tall," then the double high item slot change can be selected if the item includes a lot of text because double high item slots are better suited for more text.

[0137] Similarly, if a choice exists between taking a double high item slot and making it a single or a double wide item slot, then that item's image aspect ratio can be taken into consideration. For a landscape item image, for example, it can be better to change a double high item slot to a double wide item slot. It can also be desirable for an auto-layout to avoid side-by-side double high item slots (e.g., either where both double high item slots have similar internal arrangements of item representations or where the only similarity is that both item slots are in tall configurations). For example, when two double high item slots include edge-to-edge images or both have an image on top, it can reduce visual appeal. Thus, when an auto-layout considers how to eliminate a gap, it can evaluate aspect ratios of item images that will go into both item slots and take that into consideration so as to avoid item slot arrangements that are not visually appealing.

[0138] An auto-layout can also eliminate gaps by rearranging item slots (including corresponding items). For example, if a first row of a preliminary layout includes a double row height item slot next to a single row height item slot, and a second row below includes a single row height item slot next to a double row height item slot, the auto-layout can eliminate the gaps by swapping one of the single row height item slots with one of the double row height item slots.

[0139] Gap elimination, as discussed above, can be added into any system or method of the inventive subject matter disclosed in this application, including those shown in FIGS. 7A-9B. FIGS. 10A & 10B demonstrate an example of a method that incorporates gap elimination, where FIG. 10A describes the steps, and FIG. 10B demonstrates information flow for each step. In step 1000, the server receives a website creation request from a client, and the website creation request includes a source folder identifier. The source folder identifier, as discussed above in more detail, indicates which source folder to use in the course of creating a website. The source folder identifier can be an array of identifiers indicating several source folders so that a website having different sections can be generated.

[0140] In step 1002, the server generates at least one item representative for each item in the source folder. Again, this step is described above in more detail. Any method of the inventive subject matter that includes these steps can additionally include all of the following steps that are directed to gap elimination. In step 1004, the server determines, according to an auto-layout, a preliminary arrangement of item slots for the website. A preliminary arrangement refers to an item slot arrangement before any gaps have been eliminated.

[0141] In step 1006, the server determines whether any gaps exist in the preliminary arrangement. If any gaps exist, then at least one of those gaps is eliminated according to step 1008. Gap elimination can occur in any manner described in this application. Further, gap elimination can be undertaken recursively to minimize a number of gaps, thus steps 1006 and 1008 can be repeated after each time one or more gaps is eliminated from a layout.

[0142] Finally, in step 1010 the server generates the website and a website URL, and in step 1012 the server sends a website creation response to the client where the response includes the website URL that gives a user access to the website.

[0143] In embodiments, the server can generate a static website written in a markup language like HTML. In these embodiments, markup language labels in a corresponding document directly define the presentation of the website, including the size and positioning of the items, metadata, and sections. A web browser can then render the website as specified in the markup language document. In embodiments, the server can generate a programmatic website written in a scripting language like JavaScript. In these embodiments, one or more scripts can instruct the web browser to fetch the components of the website (i.e., the items, metadata, sections, etc.) and to render them in a particular way. A programmatic website can include myriad features such as responsive design, which formats the website for particular browsers, displays, and devices. A programmatic website, for example, can also permit users to interactively edit the website, including the items, metadata, and sections, within the website. In embodiments, the server can generate a website that includes both static and programmatic components. In embodiments, the terms "generate" and "regenerate" can refer to the creation of one or more website files (e.g., HTML files) that reside on disk, in memory, or in a database, and are later rendered by a web browser. In the same or alternative embodiments, these terms can refer to the creation of one or more objects in memory, in a database, or on disk that can later be retrieved and rendered by a web browser while executing scripting instructions.

[0144] In embodiments, the server can regenerate a website based on changes to the contents of the associated source folder (and any subfolders). For example, if a user adds new items to a source folder after the server has already generated a website, the server may regenerate the website to include the new items. Similarly, the server may regenerate the website if one or more existing items within the source folder have changed. For example, if a user changes the representative image or the title for an item, or deletes the item, the server may regenerate the website to reflect the changes. In embodiments, the client notifies the server when items are added to or changed within a source folder (and any subfolders), and the server automatically regenerates the website. Alternatively, the server may not regenerate the website until receiving an explicit instruction from the user to do so.

[0145] An embodiment of the inventive subject matter that incorporates some of the concepts above are shown in FIGS. 8A and 8B. The embodiment shown in these figures incorporates many of the same steps as described above with respect to FIGS. 7A and 7B. Once a server receives the user-selected items as described in step 800, the server then adds those user-selected items to a source folder, as shown in step 802. As shown in step 804, the server receives a request from the client to create a website using the source folder and its contents. And as shown in step 806, the server generates item representatives for each of the user-selected items. An item representative includes, for example, a description of the item, a name of the item, a size of the item, an image related to the item, etc. These attributes are discussed above in more detail. It is contemplated that steps 806 and 804 can be completed in any order. Next, in response to the client's request to generate a website, the server generates a website using the item representatives it created for each item in the source folder, where the generated website can be accessed via URL, as shown in step 808. Finally, the server sends the generated website's URL to the client so the client (or any other computing device) can access the website via the URL, as shown in step 810.

[0146] In another embodiment shown in FIGS. 9A and 9B, a method of generating a website incorporates folders and subfolders to create a website having different sections (and, in some embodiments, subsections). First, a server receives a set of user-selected items from a client, as shown in step 900. The items from the set of user-selected items received from the client can then be added, by the server, to one or more subfolders within a source folder, as shown in step 902. For example, if the set of user-selected items includes two items, then a first item can be added to a first subfolder and a second item can be added to a second subfolder. As described above the first and second subfolder can exist within the source folder, or multiple source folders can exist, each source folder containing one or more items.

[0147] In another step, the server receives a request from the client to generate a website, as shown in step 904. The request, which is analogous to the request described above with respect to FIGS. 7A and 8B, can include additional information sufficient to identify what items to generate the website with, such as a source folder identifier. In another step, the server generates item representatives for each item in the set of user-selected items, as shown in step 906. This step can occur at any time after the server has been given the items by the user and before it uses the items to create a website. Item representatives are described above in more detail.

[0148] Finally, the server generates a website using the item representatives that the server generated based on the items in the source folder and its subfolders. The generated website includes up to as many sections as there are subfolders within the source folder, as shown in step 908.

[0149] Thus, specific systems and methods of generating websites have been disclosed. It should be apparent, however, to those skilled in the art that many more modifications besides those already described are possible without departing from the inventive concepts in this application. The inventive subject matter, therefore, is not to be restricted except in the spirit of the disclosure. Moreover, in interpreting the disclosure all terms should be interpreted in the broadest possible manner consistent with the context. In particular the terms "comprises" and "comprising" should be interpreted as referring to the elements, components, or steps in a non-exclusive manner, indicating that the referenced elements, components, or steps can be present, or utilized, or combined with other elements, components, or steps that are not expressly referenced.

Claims

1. A method of generating a website, the method comprising the steps of: receiving, by a server from a client, a website creation request, the website creation request comprising a source folder identifier, wherein the source folder identifier corresponds to a source folder comprising items to be included in the website; generating, by the server, an item representative for each item in the source folder; determining, by the server, a preliminary arrangement of item slots for the website, wherein each item slot is associated with one or more item representatives, and wherein each item slot is selected from a plurality of item slot types based at least in part on one or more attributes of the associated one or more item representatives; determining, by the server, whether one or more gaps exist in the preliminary arrangement of item slots, and eliminating at least one gap by altering at least one of the position or item slot type of at least one item slot; generating, by the server, the website and a website URL, wherein the website comprises each of the item representatives in a corresponding item slot, and the website is accessible by the website URL; and sending, by the server to the client, the website URL.

2. The method of claim 1, wherein each of the items to be included in the website is one of: an upload; a web link; or a note.

3. The method of claim 1, wherein each of the item representatives comprises at least one of: an image; a title; a subtitle; and a description.

4. The method of claim 1, wherein the plurality of item slot types comprises at least two of: single with text overlaid on image; single with image and text split horizontally; single with image and text split vertically; wide with text overlaid on image; wide with image and text split vertically; tall with text overlaid on image; tall with image and text split horizontally; and tall and wide with text overlaid on image.

5. The method of claim 1, wherein the one or more attributes include: item type; image resolution; image dimensions; title length; description length; and video aspect ratio.

6. The method of claim 5, wherein the server selects an item slot type for each item slot by evaluating one or more of the attributes against the plurality of item slot types and assigning a score to each item slot type, and wherein the server selects the item slot type with the highest score.

7. The method of claim 1, wherein a first item in the source folder is in a first subfolder of the source folder, and wherein a second item in the source folder is in a second subfolder of the source folder.

8. The method of claim 7, wherein the website includes a first section comprising a first item representative associated with the first item and a second section comprising a second item representative associated with the second item.

9. The method of claim 8, wherein the first section is a normal section and the second section is a gallery section.

10. The method of claim 1, wherein the server determines whether one or more gaps exist in the preliminary arrangement of item slots by evaluating adjacent combinations of item slots.

11. The method of claim 10, wherein altering the item slot type of at least one item slot comprises selecting a different item slot type that is compatible with the associated one or more item representatives but still eliminates the gap.

12. The method of claim 1, further comprising the steps of: receiving, by the server from a client, a first request to add, delete, or change an item within the source folder; and regenerating, by the server, the website based on the added, deleted, or changed item within the source folder.

13. The method of claim 12, wherein the server automatically regenerates the website in response to the first request.

14. The method of claim 12, wherein the server regenerates the website in response to a second request from the client after the first request.

15. The method of claim 1, wherein the website is a programmatic website written in a scripting language.

16. A method of generating a website, the method comprising the steps of: receiving, by a server from a client, a set of user-selected items, the set of user-selected items comprising at least a first web link and a second web link; adding, by the server, the set of user-selected items to a source folder that is associated with a source folder identifier; receiving, by a server from a client, a website creation request, the website creation request comprising the source folder identifier; generating, by the server, an item representative for each of the user-selected items in the source folder, each item representative comprising at least one of a text block and an image; determining, by the server, a preliminary arrangement of item slots for the website, wherein each item slot is associated with one or more item representatives, and wherein each item slot is selected from a plurality of item slot types based at least in part on one or more attributes of the associated one or more item representatives; determining, by the server, whether one or more gaps exist in the preliminary arrangement of item slots, and eliminating at least one gap by altering at least one of the position or item slot type of at least one item slot; generating, by the server, the website and a website URL, wherein the website comprises each of the item representatives in a corresponding item slot, and the website is accessible by the website URL; and sending, by the server to the client, the website URL.

17. The method of claim 16, wherein the plurality of item slot types comprises at least two of: single with text overlaid on image; single with image and text split horizontally; single with image and text split vertically; wide with text overlaid on image; wide with image and text split vertically; tall with text overlaid on image; tall with image and text split horizontally; and tall and wide with text overlaid on image.

18. The method of claim 16, wherein the one or more attributes include: item type; image resolution; image dimensions; title length; description length; and video aspect ratio.

19. The method of claim 16, wherein the first web link in the source folder is in a first subfolder of the source folder, and wherein the second web link in the source folder is in a second subfolder of the source folder; and wherein the website includes a first section comprising an item representative associated with the first web link and a second section comprising an item representative associated with the second web link.

20. The method of claim 16, further comprising the steps of: receiving, by the server from a client, a first request to add, delete, or change an item within the source folder; and regenerating, by the server, the website based on the added, deleted, or changed item within the source folder.