[{"data":1,"prerenderedAt":761},["ShallowReactive",2],{"blog-posts":3,"post-\u002Fblog\u002Fvisual-feedback-faster-bug-testing":292},[4,19,39,54,69,84,95,107,122,134,144,155,168,177,192,201,213,225,236,247,258,271,280],{"path":5,"title":6,"description":7,"date":8,"modified":8,"draft":9,"locale":10,"category":11,"image":12,"translationKey":12,"tags":13,"readingTime":18},"\u002Fblog\u002Fclaude-code-fix-bugs","How to Use Claude Code to Fix the Bugs Your Clients Report","How to use Claude Code to fix bugs: what it needs from a bug report, how to connect it to client feedback over MCP, and how to review the fix before you resolve it.","2026-10-27T08:00:00+00:00",false,"en","workflow",null,[14,15,16,17],"claude code fix bugs","claude code mcp","ai bug fixing","bug report",7,{"path":20,"title":21,"description":22,"date":23,"modified":24,"draft":9,"locale":10,"category":25,"image":26,"translationKey":32,"tags":33,"readingTime":38},"\u002Fblog\u002Fbest-website-feedback-tools","How to Choose a Website Feedback Tool (2026 Checklist)","How to choose the best website feedback tool in 2026: the tool types, 12 criteria, a free scoring template (Excel) and a one-week trial plan with a real client.","2026-10-07T09:00:00+00:00","2026-10-22T10:00:00+00:00","guides",{"src":27,"card":28,"alt":29,"width":30,"height":31},"\u002Fwp-content\u002Fuploads\u002F2023\u002F09\u002Fscreencode_7_Bug_tracker_GiveFeedback.jpg","\u002Fwp-content\u002Fuploads\u002F2023\u002F09\u002Fscreencode_7_Bug_tracker_GiveFeedback-400x250.jpg","Code on a screen, illustrating how to choose a website feedback tool",1200,630,"feedback-tools",[34,35,36,37],"best website feedback tool","website feedback tool free","visual website feedback tool","client feedback",8,{"path":40,"title":41,"description":42,"date":23,"modified":24,"draft":9,"locale":10,"category":11,"image":43,"translationKey":48,"tags":49,"readingTime":38},"\u002Fblog\u002Fclient-website-approval","Client Website Approval: How to Get Sign-Off Without Delays","Client website approval made simple: the 5 approval stages, a revision-limit clause, a sign-off email, a free website sign-off form (Word) and a checklist.",{"src":44,"card":45,"alt":46,"width":47,"height":30},"\u002Fwp-content\u002Fuploads\u002F2023\u002F06\u002FAutomating-Project-Management-for-Efficiency-Sized.jpg","\u002Fwp-content\u002Fuploads\u002F2023\u002F06\u002FAutomating-Project-Management-for-Efficiency-Sized-400x250.jpg","Two people reviewing a printed document with a pen, ready for client website approval",1920,"client-approval",[50,51,52,53],"client approval process","website sign off","revision rounds","web agency",{"path":55,"title":56,"description":57,"date":23,"modified":24,"draft":9,"locale":10,"category":25,"image":58,"translationKey":62,"tags":63,"readingTime":68},"\u002Fblog\u002Fhow-to-collect-client-feedback-on-a-website","How to Collect Client Feedback on a Website (Step by Step)","How to collect client feedback on a website: 5 methods compared, a review round step by step, good vs vague feedback examples and a briefing email to send today.",{"src":59,"card":60,"alt":61,"width":30,"height":31},"\u002Fwp-content\u002Fuploads\u002F2023\u002F07\u002FFree_Bug_tracking_web_Designer_GiveFeedback.jpg","\u002Fwp-content\u002Fuploads\u002F2023\u002F07\u002FFree_Bug_tracking_web_Designer_GiveFeedback-400x250.jpg","Web designer at a desk reviewing client feedback on a website","client-feedback",[64,65,66,67],"client feedback on website","website feedback examples","client feedback examples","website review process",9,{"path":70,"title":71,"description":72,"date":23,"modified":24,"draft":9,"locale":73,"category":25,"image":74,"translationKey":78,"tags":79,"readingTime":18},"\u002Fes\u002Fblog\u002Fanotar-capturas-de-pantalla-web","Cómo anotar capturas de pantalla de una web (Mac, Windows y online)","Cómo anotar capturas de pantalla en Windows, Mac, online o en Chrome, cómo capturar una página web entera y cómo marcar los errores para que se arreglen.","es",{"src":75,"card":76,"alt":77,"width":30,"height":31},"\u002Fwp-content\u002Fuploads\u002F2023\u002F07\u002FFree_Bug_tracking_office_colours_pc_GiveFeedback.jpg","\u002Fwp-content\u002Fuploads\u002F2023\u002F07\u002FFree_Bug_tracking_office_colours_pc_GiveFeedback-400x250.jpg","Persona anotando capturas de pantalla de una web para enviarlas al equipo de desarrollo","screenshot-annotation",[80,81,82,83],"anotar capturas de pantalla","captura de pantalla","anotar captura en Mac","anotar captura en Windows",{"path":85,"title":86,"description":87,"date":23,"modified":24,"draft":9,"locale":73,"category":11,"image":88,"translationKey":48,"tags":90,"readingTime":38},"\u002Fes\u002Fblog\u002Faprobacion-cliente-proyecto-web","Aprobación del cliente en un proyecto web: cómo conseguirla","Aprobación del cliente en un proyecto web: las 5 fases, una cláusula para limitar revisiones, un email de aprobación, un formulario de aprobación gratis y una checklist.",{"src":44,"card":45,"alt":89,"width":47,"height":30},"Dos personas revisan un documento con un bolígrafo antes de la aprobación del cliente en un proyecto web",[91,92,93,94],"aprobación del cliente","rondas de revisión","presupuesto web","agencia web",{"path":96,"title":97,"description":98,"date":23,"modified":24,"draft":9,"locale":73,"category":11,"image":99,"translationKey":101,"tags":102,"readingTime":68},"\u002Fes\u002Fblog\u002Fcapturas-anotadas-en-asana","Capturas anotadas en Asana: cómo llevar el feedback web a tareas","Cómo llevar capturas anotadas y feedback web a Asana: plantilla CSV gratis, cinco métodos comparados y tareas automáticas desde el feedback del cliente.",{"src":27,"card":28,"alt":100,"width":30,"height":31},"Capturas anotadas de una web convertidas en tareas de Asana","asana",[103,104,105,106],"capturas anotadas en Asana","plantilla Asana","gestión de bugs","feedback web",{"path":108,"title":109,"description":110,"date":23,"modified":24,"draft":9,"locale":73,"category":25,"image":111,"translationKey":115,"tags":116,"readingTime":121},"\u002Fes\u002Fblog\u002Fchecklist-qa-web-antes-de-lanzar","Checklist web: más de 70 comprobaciones antes de lanzar","Checklist web con más de 70 comprobaciones por áreas: formularios, enlaces, móvil, navegadores, velocidad, SEO, accesibilidad y WordPress, con plantilla Excel gratis.",{"src":112,"card":113,"alt":114,"width":30,"height":31},"\u002Fwp-content\u002Fuploads\u002F2023\u002F08\u002FFree_Bug_tracker_people_pc_GiveFeedback.jpg","\u002Fwp-content\u002Fuploads\u002F2023\u002F08\u002FFree_Bug_tracker_people_pc_GiveFeedback-400x250.jpg","Persona revisando una web con una checklist QA antes del lanzamiento","qa-checklist",[117,118,119,120],"checklist web","checklist QA web","pruebas web","lanzamiento web",12,{"path":123,"title":124,"description":125,"date":23,"modified":24,"draft":9,"locale":73,"category":25,"image":126,"translationKey":128,"tags":129,"readingTime":68},"\u002Fes\u002Fblog\u002Fcomo-escribir-un-informe-de-bugs","Plantilla de reporte de errores (bugs): gratis, con ejemplos","Plantilla de reporte de errores gratis en Excel, Google Sheets y Word, con un ejemplo de informe de bugs bueno y uno malo y los campos que importan en una web.",{"src":27,"card":28,"alt":127,"width":30,"height":31},"Código JavaScript en una pantalla, ilustrando cómo escribir un informe de bugs de una web","bug-report",[130,131,132,133],"plantilla de reporte de errores","reporte de errores","informe de bugs","ejemplo de reporte de errores",{"path":135,"title":136,"description":137,"date":23,"modified":24,"draft":9,"locale":73,"category":25,"image":138,"translationKey":62,"tags":140,"readingTime":68},"\u002Fes\u002Fblog\u002Fcomo-recoger-feedback-de-clientes-en-una-web","Cómo pedir feedback a un cliente sobre su web (paso a paso)","Cómo pedir feedback a un cliente sobre su web: 5 métodos comparados, una ronda de revisión paso a paso, ejemplos de feedback bueno y vago y un email para enviar hoy.",{"src":59,"card":60,"alt":139,"width":30,"height":31},"Diseñador web en su mesa revisando el feedback de clientes sobre una web",[141,142,106,143],"cómo pedir feedback a un cliente","feedback de clientes","revisión de una web",{"path":145,"title":146,"description":147,"date":23,"modified":24,"draft":9,"locale":73,"category":11,"image":148,"translationKey":150,"tags":151,"readingTime":38},"\u002Fes\u002Fblog\u002Ffeedback-web-en-notion","Bugs en Notion: gestiona el feedback de tu web paso a paso","Cómo gestionar bugs en Notion en proyectos web: plantilla gratis, propiedades, vistas tablero, rutina de triaje y cómo recibir el feedback del cliente solo.",{"src":44,"card":45,"alt":149,"width":47,"height":30},"Equipo organizando bugs y feedback de clientes de una web en Notion","notion",[152,153,154,106],"bugs en Notion","plantilla Notion","seguimiento de bugs",{"path":156,"title":157,"description":158,"date":23,"modified":24,"draft":9,"locale":73,"category":159,"image":160,"translationKey":162,"tags":163,"readingTime":68},"\u002Fes\u002Fblog\u002Fherramientas-gratis-seguimiento-bugs","Herramientas gratis de seguimiento de bugs para webs (2026)","Herramientas gratis de seguimiento de bugs para equipos web: los planes gratuitos de Jira, Trello, ClickUp, Notion, Asana, monday.com y Wrike, y una hoja de cálculo gratis.","comparisons",{"src":112,"card":113,"alt":161,"width":30,"height":31},"Equipo revisando incidencias en una herramienta gratis de seguimiento de bugs","free-bug-tracking",[164,165,166,167],"herramientas gratis seguimiento de bugs","bug tracker","gestión de incidencias","hoja de seguimiento de bugs",{"path":169,"title":170,"description":171,"date":23,"modified":24,"draft":9,"locale":73,"category":25,"image":172,"translationKey":32,"tags":174,"readingTime":68},"\u002Fes\u002Fblog\u002Fmejores-herramientas-feedback-visual-web","Cómo elegir una herramienta de feedback visual para tu web","Cómo elegir entre las herramientas de feedback visual web en 2026: tipos, 12 criterios, una plantilla de evaluación gratis en Excel y una prueba de una semana.",{"src":27,"card":28,"alt":173,"width":30,"height":31},"Código en una pantalla, ilustración de cómo elegir entre herramientas de feedback visual web",[175,106,176,142],"herramientas de feedback visual","feedback visual",{"path":178,"title":179,"description":180,"date":23,"modified":24,"draft":9,"locale":73,"category":25,"image":181,"translationKey":185,"tags":186,"readingTime":191},"\u002Fes\u002Fblog\u002Fpruebas-de-aceptacion-uat-web","Pruebas de aceptación de usuario (UAT): ejemplos y plantilla","Qué son las pruebas de aceptación de usuario (UAT), diferencias con el QA, ejemplos de escenarios, checklist para webs y plantillas gratis en Excel y Word.",{"src":182,"card":183,"alt":184,"width":30,"height":31},"\u002Fwp-content\u002Fuploads\u002F2023\u002F08\u002FFree_Bug_tracking_testing-man_GiveFeedback.jpg","\u002Fwp-content\u002Fuploads\u002F2023\u002F08\u002FFree_Bug_tracking_testing-man_GiveFeedback-400x250.jpg","Cliente haciendo pruebas de aceptación UAT de su nueva web frente al ordenador","uat",[187,188,189,190],"pruebas de aceptación","pruebas de aceptación de usuario","plan de pruebas de aceptación","ejemplo pruebas de aceptación",10,{"path":193,"title":194,"description":195,"date":23,"modified":24,"draft":9,"locale":73,"category":25,"image":196,"translationKey":198,"tags":199,"readingTime":38},"\u002Fes\u002Fblog\u002Fque-es-el-feedback-visual","Qué es el feedback visual y por qué agiliza tus proyectos web","Qué es el feedback visual: comentarios sobre la propia web con capturas marcadas, vídeo o notas. Tipos, ventajas, ejemplos y qué pedirle a una herramienta.",{"src":59,"card":60,"alt":197,"width":30,"height":31},"Diseñador web revisando el feedback visual sobre una interfaz","visual-feedback",[176,106,200,142],"capturas anotadas",{"path":202,"title":203,"description":204,"date":205,"modified":24,"draft":9,"locale":10,"category":11,"image":206,"translationKey":150,"tags":208,"readingTime":38},"\u002Fblog\u002Fsupercharge-your-workflow-with-the-notion-bug-tracker-extension","Notion Bug Tracker Template (Free) for Website Projects","Free Notion bug tracker template for website projects: import the CSV, set up the properties and board views, and send client feedback into Notion.","2025-04-24T16:17:44+00:00",{"src":44,"card":45,"alt":207,"width":47,"height":30},"Team organizing website bugs and client feedback in a Notion bug tracker",[209,210,211,212],"notion bug tracker template","notion issue tracker template","bug tracking","website feedback",{"path":214,"title":215,"description":216,"date":217,"modified":24,"draft":9,"locale":10,"category":25,"image":218,"translationKey":185,"tags":220,"readingTime":68},"\u002Fblog\u002Fuser-acceptance-testing-in-software-development","User Acceptance Testing (UAT): Template, Checklist & Examples","What user acceptance testing is, UAT vs QA, test scenario examples, a UAT checklist for websites and free templates: Excel test plan and Word sign-off form.","2023-09-28T17:32:27+00:00",{"src":182,"card":183,"alt":219,"width":30,"height":31},"Client doing user acceptance testing on a new website at his desk",[221,222,223,224],"user acceptance testing","UAT testing","user acceptance testing template","user acceptance testing checklist for website",{"path":226,"title":227,"description":228,"date":229,"modified":24,"draft":9,"locale":10,"category":159,"image":230,"translationKey":162,"tags":232,"readingTime":68},"\u002Fblog\u002Fbug-tracking-tools-free","Free Bug Tracking Tools for Web Teams (2026 Comparison)","Free bug tracking tools compared for web teams: the free plans of Jira, Trello, ClickUp, Notion, Asana, monday.com and Wrike, plus a free bug tracking spreadsheet.","2023-09-21T16:56:47+00:00",{"src":112,"card":113,"alt":231,"width":30,"height":31},"Team at a computer reviewing issues in a free bug tracking tool",[233,165,234,235],"free bug tracking tools","bug tracking spreadsheet","issue tracking",{"path":237,"title":238,"description":239,"date":240,"modified":24,"draft":9,"locale":10,"category":25,"image":241,"translationKey":128,"tags":243,"readingTime":38},"\u002Fblog\u002Fwhat-to-put-in-a-bug-report","Bug Report Template (Free Excel, Word & Google Sheets) + Examples","Free bug report template for Excel, Google Sheets and Word, with a good and a bad bug report example and the fields that matter for website bugs.","2023-09-11T14:43:18+00:00",{"src":27,"card":28,"alt":242,"width":30,"height":31},"JavaScript code on a screen, illustrating how to write a bug report for a website",[244,245,246,234],"bug report template","bug report example","how to write a bug report",{"path":248,"title":249,"description":250,"date":251,"modified":24,"draft":9,"locale":10,"category":11,"image":252,"translationKey":101,"tags":254,"readingTime":38},"\u002Fblog\u002F1-way-to-get-annotated-screengrabs-into-asana","Asana Bug Tracking: Free Template and Annotated Screenshots","Asana bug tracking for website projects: a free CSV template, five ways to get annotated screenshots into tasks, and automatic tasks from client feedback.","2023-09-11T11:56:04+00:00",{"src":27,"card":28,"alt":253,"width":30,"height":31},"Annotated screenshots of a website being turned into Asana tasks",[255,256,257,212],"asana bug tracking","asana bug tracking template","annotated screenshots",{"path":259,"title":260,"description":261,"date":262,"modified":24,"draft":9,"locale":10,"category":25,"image":263,"translationKey":115,"tags":265,"readingTime":270},"\u002Fblog\u002Fspeed-up-qa-testing","Website QA Checklist: 70+ Checks Before Launch (Free Template)","A website QA checklist with 70+ checks by area (forms, links, devices, browsers, speed, SEO, accessibility, WordPress), plus a free Excel and Google Sheets template.","2023-08-19T11:32:36+00:00",{"src":112,"card":113,"alt":264,"width":30,"height":31},"Person running a website QA checklist on a laptop before launch",[266,267,268,269],"website QA checklist","website testing checklist","website qa checklist template excel","wordpress website testing checklist",11,{"path":272,"title":273,"description":274,"date":275,"modified":24,"draft":9,"locale":10,"category":25,"image":276,"translationKey":198,"tags":278,"readingTime":38},"\u002Fblog\u002Fvisual-feedback-faster-bug-testing","What Is Visual Feedback? A Guide for Web Teams","What is visual feedback? Feedback given on the website itself with marked-up screenshots, video or pinned comments. Types, examples and a tool checklist.","2023-08-09T17:41:00+00:00",{"src":59,"card":60,"alt":277,"width":30,"height":31},"Web designer reviewing visual feedback on a website interface",[279,36,257,212],"visual feedback",{"path":281,"title":282,"description":283,"date":284,"modified":24,"draft":9,"locale":10,"category":25,"image":285,"translationKey":78,"tags":287,"readingTime":18},"\u002Fblog\u002Fscreen-grab-annotation-apps","How to Annotate a Screenshot of a Website (Mac, Windows & Online)","How to annotate a screenshot on Mac, Windows, online or in Chrome, how to capture a full web page, and how to mark up website screenshots so developers fix them.","2023-08-02T23:25:13+00:00",{"src":75,"card":76,"alt":286,"width":30,"height":31},"Person at a computer annotating website screenshots for a developer",[288,289,290,291],"annotate screenshot","annotate screenshot mac","annotate screenshot windows","annotate screenshot online",{"id":293,"title":273,"body":294,"category":25,"date":275,"description":274,"draft":9,"extension":738,"faq":739,"image":752,"locale":10,"meta":753,"modified":24,"navigation":754,"path":272,"readingTime":38,"seo":755,"seoTitle":756,"stem":757,"tags":758,"tldr":759,"translationKey":198,"__hash__":760},"blog\u002Fblog\u002Fvisual-feedback-faster-bug-testing.md",{"type":295,"value":296,"toc":727},"minimark",[297,306,311,314,337,355,358,362,365,368,374,377,429,432,450,454,457,529,538,542,545,563,566,570,573,623,631,635,638,665,672,675,681,688,691,695,698,720],[298,299,300,301,305],"p",{},"Visual feedback is feedback on a website or design given by ",[302,303,304],"em",{},"showing"," the problem, with a marked-up screenshot, a short video or a comment pinned to the page, instead of describing it in words. For agencies, freelancers and project managers it's the difference between \"the button on the services page looks weird\" and an image of that exact button with a red box around it, plus the URL, browser and screen size. With the screenshot and the browser details attached, most comments can be fixed without a single follow-up question.",[307,308,310],"h2",{"id":309},"what-is-visual-feedback","What is visual feedback?",[298,312,313],{},"Visual feedback is any comment about a website, app or design that includes a visual reference to the problem: the reviewer points at it instead of explaining where it is. On web projects it takes one of three forms, and the most useful versions also carry the technical context the developer needs to reproduce what the reviewer saw.",[315,316,317,325,331],"ul",{},[318,319,320,324],"li",{},[321,322,323],"strong",{},"Annotated screenshot:"," an image of the page with arrows, boxes, highlights or text on top.",[318,326,327,330],{},[321,328,329],{},"Short video:"," a recording of the screen, often with the reviewer talking through the steps.",[318,332,333,336],{},[321,334,335],{},"Pinned comment:"," a note attached to a specific element on the live or staging page.",[298,338,339,340,343,344,343,347,350,351,354],{},"The context is what turns a picture into something a developer can act on: the ",[321,341,342],{},"page URL",", the ",[321,345,346],{},"browser and version",[321,348,349],{},"operating system"," and the ",[321,352,353],{},"screen size",". Without it, a screenshot still leaves the developer guessing how to reproduce the problem.",[298,356,357],{},"In UX design, \"visual feedback\" also means the way an interface responds to an action, such as a button changing color when it's clicked. Here it means the other kind: feedback that people give on a website project.",[307,359,361],{"id":360},"why-is-visual-feedback-better-than-text-only-feedback","Why is visual feedback better than text-only feedback?",[298,363,364],{},"The developer sees exactly what the reviewer saw, so the follow-up questions disappear. Text-only feedback forces the reviewer to describe locations and problems with words they often don't have, and each vague line costs an email to clarify. A screenshot with the problem marked and the browser details attached can be fixed the same day.",[298,366,367],{},"Here's a typical piece of text-only feedback from a client:",[369,370,371],"blockquote",{},[298,372,373],{},"\"Hi! A few things: the photo on the about page is wrong, the menu does something strange on mobile, and can we make the blue a bit darker? Also the form didn't work for my colleague.\"",[298,375,376],{},"Every line needs a follow-up question. Which photo? What does \"strange\" mean? Which blue, the buttons or the header? Which form, and what browser was the colleague using? Three emails later, you know enough to start fixing. The same feedback as visual reports:",[378,379,380,393],"table",{},[381,382,383],"thead",{},[384,385,386,390],"tr",{},[387,388,389],"th",{},"Text-only feedback",[387,391,392],{},"Visual feedback",[394,395,396,405,413,421],"tbody",{},[384,397,398,402],{},[399,400,401],"td",{},"\"The photo on the about page is wrong\"",[399,403,404],{},"Screenshot of \u002Fabout\u002F with the photo boxed: \"Replace with the team photo from the shared folder\"",[384,406,407,410],{},[399,408,409],{},"\"The menu does something strange on mobile\"",[399,411,412],{},"Screenshot at phone width with the menu overlapping the logo circled; browser, system and resolution attached",[384,414,415,418],{},[399,416,417],{},"\"Make the blue darker\"",[399,419,420],{},"Screenshot with the header button highlighted: \"This blue, closer to our logo\"",[384,422,423,426],{},[399,424,425],{},"\"The form didn't work\"",[399,427,428],{},"Screenshot of the error message on \u002Fcontact\u002F, with the browser and version attached",[298,430,431],{},"The benefits are concrete:",[433,434,435,438,441,444,447],"ol",{},[318,436,437],{},"Fewer clarification rounds: the developer sees what the reviewer saw, so the \"which page?\" emails stop.",[318,439,440],{},"Less interpretation: \"top right\" and \"the big button\" mean different things to different people; an arrow doesn't.",[318,442,443],{},"Faster bug reproduction: with the URL, browser and screen size, the developer opens the same page in the same conditions.",[318,445,446],{},"Easier for non-technical clients: pointing at something is easier than describing it with web vocabulary they don't know.",[318,448,449],{},"A clean record: each issue is one item with its image and status, not a paragraph buried in an email thread.",[307,451,453],{"id":452},"what-are-the-types-of-visual-feedback","What are the types of visual feedback?",[298,455,456],{},"There are five: annotated screenshots, screen recordings, comments pinned on the live page, session replay and comments on design mockups. For most website projects, annotated screenshots with the technical details attached automatically cover the bulk of client feedback; video earns its place for bugs that depend on a sequence of clicks.",[378,458,459,472],{},[381,460,461],{},[384,462,463,466,469],{},[387,464,465],{},"Type",[387,467,468],{},"Best for",[387,470,471],{},"Watch out for",[394,473,474,485,496,507,518],{},[384,475,476,479,482],{},[399,477,478],{},"Annotated screenshots",[399,480,481],{},"Layout bugs, copy changes, design tweaks, most client feedback",[399,483,484],{},"Shows one moment; a problem that spans the page may need more than one capture",[384,486,487,490,493],{},[399,488,489],{},"Screen recordings (video)",[399,491,492],{},"Bugs that happen in steps, animations, interactions",[399,494,495],{},"Takes longer to watch; clients often skip the narration",[384,497,498,501,504],{},[399,499,500],{},"Comments pinned on the live page",[399,502,503],{},"Design review, content approval on many elements",[399,505,506],{},"Comments can lose their position when the layout changes",[384,508,509,512,515],{},[399,510,511],{},"Session replay",[399,513,514],{},"Complex web apps where you need the exact steps",[399,516,517],{},"Usually in pricier tools; raises privacy questions",[384,519,520,523,526],{},[399,521,522],{},"Comments on design mockups",[399,524,525],{},"Feedback before anything is built",[399,527,528],{},"Doesn't catch problems that only appear in a real browser",[298,530,531,532,537],{},"If you're choosing how to capture screenshots by hand instead, our guide to ",[533,534,536],"a",{"href":535},"\u002Fblog\u002Fscreen-grab-annotation-apps\u002F","screen grab annotation apps"," covers the built-in options on Windows, Mac and the browser.",[307,539,541],{"id":540},"how-does-visual-feedback-help-project-managers","How does visual feedback help project managers?",[298,543,544],{},"Visual feedback turns the project manager's job from transcribing into triaging. Without a system, a PM collects comments from email, chat, calls and PDFs, then retypes each one into the team's task tool and attaches screenshots by hand. With a visual feedback tool, every comment arrives as a structured item with its screenshot, type, page and browser details, ready to assign.",[298,546,547,548,552,553,557,558,562],{},"The difference grows when the tool connects to the project management app the team already uses. Each report becomes a task there automatically, with the screenshot attached, and with some tools the status syncs both ways. In GiveFeedback.io that means an issue in ",[533,549,551],{"href":550},"\u002Fjira-bug-tracking-tool\u002F","Jira",", a card in ",[533,554,556],{"href":555},"\u002Ftrello-bug-tracking-tool\u002F","Trello",", a task in ",[533,559,561],{"href":560},"\u002Fasana-bug-tracking-tool\u002F","Asana",", ClickUp or Wrike, an item in monday.com, a page in Notion or a message in Slack or Discord.",[564,565],"integration-map",{},[307,567,569],{"id":568},"what-should-a-visual-feedback-tool-have","What should a visual feedback tool have?",[298,571,572],{},"It should let clients report without an account or extension, work on the live or staging site, offer basic annotation tools, attach the URL and browser data automatically, track each item's status, connect to the task tool your team already uses and price in a way that fits an agency's number of projects. Check each point against what the tool does today.",[315,574,575,581,587,593,599,605,611,617],{},[318,576,577,580],{},[321,578,579],{},"No friction for clients:"," do reviewers need an account, a browser extension or training? Every extra step sends some clients back to email.",[318,582,583,586],{},[321,584,585],{},"Works on the real site:"," feedback should happen where the problem is, not on a static image uploaded somewhere else.",[318,588,589,592],{},[321,590,591],{},"Annotation tools:"," arrows, boxes, text and a highlighter, at minimum.",[318,594,595,598],{},[321,596,597],{},"Automatic technical data:"," URL, browser and version, operating system and screen resolution.",[318,600,601,604],{},[321,602,603],{},"Status and filters:"," open, resolved and archived, so you know what's left before launch.",[318,606,607,610],{},[321,608,609],{},"Live integrations:"," with the tool your team already uses. Check which ones work today, not which are \"coming soon\".",[318,612,613,616],{},[321,614,615],{},"Developer extras:"," console logs, network logs or session replay, if you build web apps rather than websites.",[318,618,619,622],{},[321,620,621],{},"Pricing that fits your volume:"," per user, per project or per feedback report makes a big difference for an agency.",[298,624,625,626,630],{},"For a scoring template that turns this list into a side-by-side comparison, see ",[533,627,629],{"href":628},"\u002Fblog\u002Fbest-website-feedback-tools\u002F","how to choose a website feedback tool",".",[307,632,634],{"id":633},"how-does-visual-feedback-work-in-givefeedbackio","How does visual feedback work in GiveFeedback.io?",[298,636,637],{},"GiveFeedback.io adds a \"Give Feedback\" button to your site with one script. The client clicks it, the browser captures the visible part of the page, the client marks it up and adds a title, a description and a type, and the report arrives in your dashboard with the screenshot, URL, browser, operating system, screen resolution, language and time zone attached. Clients don't need an account.",[433,639,640,653,656,659,662],{},[318,641,642,643,647,648,652],{},"Install: create a project and paste one script into the site's ",[644,645,646],"code",{},"\u003Chead>","; the ",[533,649,651],{"href":650},"\u002Fdocumentation-tool\u002F","help section"," has guides for WordPress, Shopify, Wix, Squarespace and more.",[318,654,655],{},"Click: a \"Give Feedback\" button appears on the site and the client clicks it, with no account.",[318,657,658],{},"Capture: on a computer the browser asks permission to capture the tab (phones skip this step), and the visible part of the page opens in a markup editor with arrows, rectangles, ellipses, numbered markers, free drawing, text, a highlighter and blur, in five colors.",[318,660,661],{},"Describe: the client adds a title, a description and a type (Bug, Proposal, Recommendation or Feature by default) and sends it.",[318,663,664],{},"Act: the report appears in your dashboard and, if you connect one, in your task tool.",[298,666,667],{},[668,669],"img",{"alt":670,"src":671},"A client drawing on a screenshot of a web page in the GiveFeedback.io markup editor","\u002Fwp-content\u002Fuploads\u002F2024\u002F01\u002Fbrowser-1920-1080-GF-modal-6-marked-up.jpg",[298,673,674],{},"Each report keeps the marked-up screenshot next to the data the browser reported, so the developer knows the screen size, system and browser version without asking.",[298,676,677],{},[668,678],{"alt":679,"src":680},"A feedback report in GiveFeedback.io with the marked-up screenshot and the browser data captured automatically","\u002Fwp-content\u002Fuploads\u002F2024\u002F01\u002Fbrowser-1920-1080-1-task-info.jpg",[298,682,683,684,630],{},"The Free plan covers 5 projects and 50 feedback reports; Pro is €19.99 a month, or €9.99 a month billed yearly, for up to 100 projects. See ",[533,685,687],{"href":686},"\u002Fpricing\u002F","pricing",[689,690],"blog-cta",{},[307,692,694],{"id":693},"how-do-you-get-better-visual-feedback-from-clients","How do you get better visual feedback from clients?",[298,696,697],{},"Tell clients how to report before the review starts, ask for one issue per report, ask for the expected result and not only the problem, separate bugs from change requests with feedback types, and mark items resolved so the client sees progress. A tool makes pointing easy; these habits make what clients point at useful.",[315,699,700,708,711,714,717],{},[318,701,702,703,707],{},"Brief them first: one short email with the staging link, the deadline and \"click the feedback button, mark the problem, say what you expected\". Our guide on ",[533,704,706],{"href":705},"\u002Fblog\u002Fhow-to-collect-client-feedback-on-a-website\u002F","how to collect client feedback on a website"," has a briefing email to copy.",[318,709,710],{},"One issue per report: it's easier to assign, fix and close.",[318,712,713],{},"Ask for the expected result: \"the logo should link to the home page\" can be fixed; \"the logo is broken\" needs a call.",[318,715,716],{},"Separate bugs from change requests: feedback types make scope creep visible before it eats the budget.",[318,718,719],{},"Close the loop: mark items resolved so the client re-checks only what changed.",[298,721,722,723,726],{},"For the written part of each report, our ",[533,724,244],{"href":725},"\u002Fblog\u002Fwhat-to-put-in-a-bug-report\u002F"," lists the fields that make a report easy to act on. Pointing at a problem is an old idea; the gain comes from making it the default way your clients report. Put a feedback button on the staging site of your next project and count how many \"which page?\" emails you don't have to send.",{"title":728,"searchDepth":729,"depth":729,"links":730},"",2,[731,732,733,734,735,736,737],{"id":309,"depth":729,"text":310},{"id":360,"depth":729,"text":361},{"id":452,"depth":729,"text":453},{"id":540,"depth":729,"text":541},{"id":568,"depth":729,"text":569},{"id":633,"depth":729,"text":634},{"id":693,"depth":729,"text":694},"md",[740,743,746,749],{"question":741,"answer":742},"What is visual feedback on a website?","Visual feedback is a comment about a website that shows the issue instead of only describing it: a screenshot with the problem marked, a short screen recording or a comment pinned to an element on the page. The most useful kind also carries the page URL, browser, operating system and screen size, so the developer can open the page in the same conditions.",{"question":744,"answer":745},"Why is visual feedback better than feedback by email?","Because the developer sees exactly what the reviewer saw. A marked-up screenshot with the URL and browser attached answers the questions that text-only feedback always triggers: which page, which element, which device and what should happen instead. Each comment also becomes a separate item with a status, instead of a paragraph in a long email thread.",{"question":747,"answer":748},"Do clients need to install anything to give visual feedback?","It depends on the tool. Some ask reviewers to install a browser extension or create an account, and busy clients often give up and go back to email. Others, like GiveFeedback.io, add a button to the website itself: the client clicks it, allows the browser to capture the tab, marks up the screenshot and sends it, with no account.",{"question":750,"answer":751},"Is visual feedback only for bugs?","No. It works just as well for design changes, copy edits and content requests, which are most of what clients send during a website review. Labeling each report by type, such as bug, proposal or feature request, keeps them apart, so you can fix bugs straight away and quote new requests that fall outside the agreed scope.",{"src":59,"card":60,"alt":277,"width":30,"height":31},{},true,{"title":273,"description":274},"What Is Visual Feedback? Web Team Guide | GiveFeedback.io","blog\u002Fvisual-feedback-faster-bug-testing",[279,36,257,212],"Visual feedback is feedback on a website or design given by showing the problem (a marked-up screenshot, a short video or a comment pinned to the page) instead of only describing it in words. For web projects it removes the usual back-and-forth about which page, which element and which browser, because the image and the technical details travel with the comment.","h_Zhm1ef00FmWTCQ_4s_YcCrjJf0T5xL49ryFHnfU_w",1793115311473]