Systems and methods for website optimization
View Patent ↗Webpages are optimizing through the use of experiments that compare the responses of viewers that are either presented with the original webpage or a variant thereof. One or more variants are first defined through the use of a browser-based editor application that initially examines the webpage for a snippet of code. The snippet can be added to the webpage, if missing, and the webpage returned to the editor application. Changes made to the webpage to define a variant are saved in variation code. When the webpage is later requested by multiple viewers, in each instance the viewer receives the webpage with the snippet, the snippet instructs the browser to download a file, and the instructions of the file determine whether the viewer will see the variant or the original webpage. Tracking viewer responses to the webpage and the variant allow a statistical basis for comparison to be developed.
1. A method of creating web page variations, the method comprising:
displaying, by a web browser of a client device, a first web page of a computing system, the first web page including a text field for receiving uniform resource locators (URLs) of web pages for editing;
receiving, by the web browser of the client device, a URL of a second web page for editing by a user of the client device, the URL received within the text field of the displayed first web page;
transmitting, from the web browser of the client device, the URL of the second web page that is within the text field of the first web page of the computing system to the computing system, the transmission of the URL indicative of a request by the client device to edit the second web page;
receiving, by the web browser, code for an editor application from the computing system responsive to the transmission of the URL of the second web page;
executing the received code for the editor application, the editor application displayed by the web browser on the client device responsive to the execution of the received code;
receiving, by the web browser, an editable version of the second web page from the computing system;
displaying the editable version of the second web page in the editor application;
receiving, via the editor application, a modification of an element of the editable version of the second web page to create a variant of the second web page;
generating, by the editor application, variation code describing the modification of the element of the editable version of the second web page; and
transmitting the variation code to the computing system.
2. The method of claim 1 , further comprising:
displaying a user interface of the editor application in the web browser, the user interface comprising a first frame and a second frame, the first frame including logic to create the second frame and the second frame configured to display the editable version of the second web page as instructed by the first frame.
3. The method of claim 2 , wherein receiving the editable version of the web page comprises:
receiving a modified version of the second web page in the web browser, the modified version of the second web page including code that specifies instructions for the web browser to request the editable version of the second web page; and
wherein the editable version of the second web page is displayed in the second frame of the user interface of the editor application and the editable version is based on the modified version of the second web page.
4. The method of claim 1 , wherein receiving the modification of the element of the editable version of the second web page comprises:
receiving, by the editor application, a selection of the element of the editable version of the second web page;
displaying a menu of options related to modifying the selected element in the editor application responsive to the selection;
receiving, by the editor application, a selection of an option from the menu of options; and
modifying the selected element according to the selected option.
5. The method of claim 4 , wherein the menu of options include at least one of an option to modify a position of the element in the editable version of the second web page, an option to remove the element from the editable version of the second web page, an option to edit code defining the editable version of the second web page, or an option to add an additional element to the editable version of the second web page.
6. The method of claim 4 , further comprising:
disabling logic of a second frame that allows execution of functionality of elements of the editable version of the second web page; and
using logic of a first frame to allow modification of the elements of the editable version of the second web page.
7. The method of claim 4 , wherein receiving the selection of the element comprises:
assigning, by the editor application, a unique identifier to the selected element that distinguishes the selected element from other elements of the editable version of the second web page responsive to receiving the selection.
8. The method of claim 7 , wherein assigning the unique identifier comprises:
assigning an identification attribute of the selected element as the unique identifier for the selected element responsive to determining that the identification attribute is unique with respect to identification attributes of the other elements of the editable version of the second web page;
determining whether the selected element includes a set of cascading style sheet (CSS) classes responsive to determining that the selected element is not associated with an identification attribute; and
assigning a set of CSS classes of the selected element as the unique identifier for the selected element responsive to determining that the selected element includes the set of CSS classes.
9. The method of claim 1 , wherein the web browser lacks the code for the editor application prior to receiving the code from the computing system.
10. A non-transitory computer readable storage medium storing executable code to create a variant of a web page, the code when executed by at least one processor causes the at least one processor to perform operations comprising:
displaying, by a web browser of a client device, a first web page of a computing system, the web page including a text field for receiving uniform resource locators (URLs) of web pages for editing;
receiving, by the web browser of the client device, a URL of a second web page for editing by a user of the client device, the URL received within the text field of the displayed first web page;
transmitting, from the web browser of the client device, the URL of the second web page that is in the text field of the second web page of the computing system to the computing system, the transmission of the URL indicative of a request by the client device to edit the second web page;
receiving, by the web browser, code for an editor application from the computing system responsive to the transmission of the URL of the second web page;
executing the received code for the editor application, the editor application displayed by the web browser on the client device responsive to the execution of the received code;
receiving, by the web browser, an editable version of the second web page from the computing system;
displaying the editable version of the second web page in the editor application;
receiving, via the editor application, a modification of an element of the editable version of the second web page to create a variant of the second web page;
generating, by the editor application, variation code describing the modification of the element of the editable version of the second web page; and
transmitting the variation code to the computing system.
11. The non-transitory computer readable storage medium of claim 10 , wherein the code when executed by the at least one processor causes the at least one processor to perform further operations comprising:
displaying a user interface of the editor application in the web browser, the user interface comprising a first frame and a second frame, the first frame including logic to create the second frame and the second frame configured to display the editable version of the second web page as instructed by the first frame.
12. The non-transitory computer readable storage medium of claim 11 , wherein receiving the editable version of the web page comprises:
receiving a modified version of the second web page in the web browser, the modified version of the second web page including code that specifies instructions for the web browser to request the editable version of the second web page; and
wherein the editable version of the second web page is displayed in the second frame of the user interface of the editor application.
13. The non-transitory computer readable storage medium of claim 10 , wherein receiving the modification of the element of the editable version of the second web page comprises:
receiving, by the editor application, a selection of the element of the editable version of the second web page;
displaying a menu of options related to modifying the selected element in the editor application responsive to the selection;
receiving, by the editor application, a selection of an option from the menu of options; and
modifying the selected element according to the selected option.
14. The non-transitory computer readable storage medium of claim 13 , wherein the menu of options include at least one of an option to modify a position of the element in the editable version of the second web page, an option to remove the element from the editable version of the second web page, an option to edit code defining the editable version of the second web page, or an option to add an additional element to the editable version of the second web page.
15. The non-transitory computer readable storage medium of claim 13 , wherein the code when executed by the at least one processor causes the at least one processor to perform further operations comprising:
disabling logic of a second frame that allows execution of functionality of elements of the editable version of the second web page; and
using logic of a first frame to allow modification of the elements of the editable version of the second web page.