Development of a Web Inspection Widget for Bookmarklet
Budget: $15 – $25 USD
I'm seeking a developer with expertise in JavaScript, especially in creating bookmarklets and web inspection tools, to develop a custom widget.
Project Requirements:
Bookmarklet: The widget should be executable from a bookmarklet, enabling users to launch it on any web page they are browsing.
Element Inspection:
The widget should offer functionality akin to Chrome's 'Inspect' tool, allowing users to navigate and visualize the page's DOM tree.
Users should be able to hover over or click on each element on the page, with a particular focus on content like advertisements.
Page Metrics:
Upon selecting an element (e.g., an ad), the widget should display relevant metrics such as:
Element's position on the page (X, Y axis).
Element dimensions (width, height).
Resource URL (for images, videos, etc.).
Any other associated metadata.
User Metrics:
The widget should be capable of tracking and displaying real-time user interaction metrics such as:
Current cursor position.
Scrolling speed on the page.
Duration of interaction with a particular element (e.g., how long the cursor hovers over an ad).
Design:
While functionality is the priority, the widget should possess an intuitive and user-friendly design.
It should be compatible and look consistent across most browsers and devices.
Deliverables:
Complete and commented source code for the widget.
Bookmarklet to execute the widget.
Detailed documentation on how to use the widget and interpret the metrics provided.
Testing across various browsers and devices to ensure compatibility.
Timeline:
Initial proposal and design: one week
First review and feedback: two weeks
Final delivery and testing: two weeks
Project Requirements:
Bookmarklet: The widget should be executable from a bookmarklet, enabling users to launch it on any web page they are browsing.
Element Inspection:
The widget should offer functionality akin to Chrome's 'Inspect' tool, allowing users to navigate and visualize the page's DOM tree.
Users should be able to hover over or click on each element on the page, with a particular focus on content like advertisements.
Page Metrics:
Upon selecting an element (e.g., an ad), the widget should display relevant metrics such as:
Element's position on the page (X, Y axis).
Element dimensions (width, height).
Resource URL (for images, videos, etc.).
Any other associated metadata.
User Metrics:
The widget should be capable of tracking and displaying real-time user interaction metrics such as:
Current cursor position.
Scrolling speed on the page.
Duration of interaction with a particular element (e.g., how long the cursor hovers over an ad).
Design:
While functionality is the priority, the widget should possess an intuitive and user-friendly design.
It should be compatible and look consistent across most browsers and devices.
Deliverables:
Complete and commented source code for the widget.
Bookmarklet to execute the widget.
Detailed documentation on how to use the widget and interpret the metrics provided.
Testing across various browsers and devices to ensure compatibility.
Timeline:
Initial proposal and design: one week
First review and feedback: two weeks
Final delivery and testing: two weeks