Reviewing Websites and HTML Content

ReviewStudio has two new methods for reviewing web page content. The first method allows you to upload and annotate directly on an HTML page or element. The second method allows you to capture live web pages and upload screen captures of their content for review. There are two methods for uploading web content to a Review as described below.

Direct upload of HTML content:

1. On the review edit page click the "Add Website" button and select the "HTML files (.zip)" option.



2. Upload a .zip file that contains all the page content. Note that a file called 'index.html' must be present in the root of the ZIP file or the page will not install. If any absolute paths are specified in the code, the remote server must allow any server to fetch the content (relative paths should work fine in all circumstances).

3. You can specify the resolution that you want the content to be displayed by including the resolution anywhere in the .zip file name. For example banner-970x250.zip will display the content in an iFrame fixed to that resolution. 

4. Note that it may take a short time for the page to be installed but once a thumbnail shows up on the edit page, the content is ready to share. 

Upload HTML of screen captures directly from web pages:

1. On the review edit page click the "Add Website" button and select the "Capture tool" option.



2. This will open a new menu that will let you navigate to a live website and the pages you would like to have reviewed. 



3. Enter the URL of the page you want to capture and click "Preview" (or press Enter/Return). You can also navigate to any link by clicking on any live links in the pages displayed or using the previous and next arrows when available. You can also change the resolution of the capture tool preview by selecting from the dropdown menu next to the "Preview" button. The viewport will adjust to show the correct aspect ratio and scale of the selected resolution.
 
4. In the bottom menu, select the resolutions of the page as you want to present it in the Review. Note that each resolution selected will be presented as a separate file for review/approval in the Review canvas. 

5. Select if you would like to Save the page as a static image or as live HTML. 

6. You can then continue to add additional pages by navigating within the preview window or close the menu by clicking on the X in the upper right.

A few notes on the capture tool:
  • For security, the capture tools uses a proxy to display live websites. Some content on some pages may not proxy and this can result in some images or content not loading (especially if the content uses JavaScript to load content). But while the preview may be missing elements, the captures displayed should be complete.

  • Screenshots may show some glitches depending upon the content that is being loaded. Pages that have a lot of animation are the most prone to problems and uploading the HTML is recommended for sites with animated content. It's always a good idea to review the screenshots for accuracy before you share them. 
Reviewing HTML Content  

Within the review canvas, the HTML content will be displayed within an iFrame. If the content exceeds the iFrame resolution, you may scroll the content using the your mouse, touchpad or scrollbar of the iFrame. Annotations may be made directly on the content as they are with any other file. Clicking the header of a comment in the comment bar will automatically scroll the iFrame if necessary so that any associated annotation will be visible.

To test controls or links within the content you can select the "Navigate" button below the iFrame. This will override the annotation tool so that you may click on any controls or links in the page (links will open in a new browser tab). To resume annotations, click on the "Annotate" button.



Feedback and Knowledge Base