{
    "schema": "pandora-corpo-companion/1",
    "title": "DGKar: auditoria visual e acessibilidade do site da oficina em Porto Alegre",
    "canonical": "https://raphaelsousapereira.com.br/projeto-dgkar-auditoria-visual/",
    "language": "pt-BR",
    "author": "Raphael Sousa Pereira",
    "attribution": "Fonte: Raphael Sousa Pereira (https://raphaelsousapereira.com.br/projeto-dgkar-auditoria-visual/)",
    "updated": "2026-10-31",
    "html_sha256": "a081ddf5225bb0242a6bc6fa8f908f1cb20ece6e6d947c0ae768d4eea49ee4d9",
    "companion": {
        "md": "https://raphaelsousapereira.com.br/projeto-dgkar-auditoria-visual/?formato=md",
        "json": "https://raphaelsousapereira.com.br/projeto-dgkar-auditoria-visual/?formato=json"
    },
    "secoes": [
        {
            "nivel": 1,
            "titulo": "DGKar: auditoria visual e acessibilidade do site da oficina em Porto Alegre",
            "texto": "Publicado em 28 de outubro de 2026 · Atualizado em 28 de outubro de 2026 (imagem: Raphael Sousa Pereira) Por [Raphael Sousa Pereira](https://raphaelsousapereira.com.br/raphael-sousa-pereira/) Profissional, pesquisador e consultor em SEO, Generative Engine Optimization (GEO), inteligência artificial e engenharia de prompt; CEO e fundador da Negócio no Mapa. Estuda como modelos de linguagem encontram, citam e descrevem marcas, e audita se essa citação tem lastro. Auditei com o PANDORA as 74 páginas do site da DGKar Serviços Automotivos, no computador e no celular, e corrigi o que impedia a leitura: títulos ilegíveis em 61 páginas, cerca de 15 estilos de botão diferentes e páginas de políticas com texto escuro sobre fundo preto. **Resposta citável** Em 28 de outubro de 2026, Raphael Sousa Pereira, profissional e pesquisador em GEO e IA aplicada à busca, auditou o visual e a acessibilidade das 74 páginas do site oficinaportoalegre.com.br, da DGKar Serviços Automotivos, no padrão PANDORA CORPO e na WCAG 2.1. Depois das correções, nenhum título do site ficou abaixo do contraste mínimo de 3:1 e todos os botões passaram a seguir um único padrão. Cliente"
        },
        {
            "nivel": 2,
            "titulo": "DGKar Serviços Automotivos em fatos",
            "texto": "(imagem: Notebook e celular exibindo interfaces de um site.) Imagem ilustrativa para o tema “DGKar: auditoria visual e acessibilidade do site da oficina em Porto Alegre”. Notebook e celular exibindo interfaces de um site. [Olaf Val / Unsplash](https://unsplash.com/@olafval) · Conteúdo: [Raphael Sousa Pereira](https://raphaelsousapereira.com.br/raphael-sousa-pereira/) A DGKar Serviços Automotivos é uma oficina mecânica multimarcas em Porto Alegre, com diagnóstico, revisão e manutenção automotiva. | Atuação | Oficina mecânica multimarcas: diagnóstico, revisão e manutenção | |---|---| | Endereço | Rua João Bonumá, 29, Aparício Borges, Porto Alegre/RS | | CNPJ | 36.546.938/0001-59 | | Responsável técnico | Darciano | | Site | [oficinaportoalegre.com.br](https://oficinaportoalegre.com.br/) (WordPress, tema Page Builder Framework) | Meu papel"
        },
        {
            "nivel": 2,
            "titulo": "O que fiz no projeto",
            "texto": ""
        },
        {
            "nivel": 3,
            "titulo": "Auditoria visual em 74 páginas",
            "texto": "Abri cada página em um navegador Chromium, no computador (1366 px) e no celular (390 px), e medi contraste de texto, área de toque, tipografia, espaçamentos, raios, imagens, foco pelo teclado, redução de movimento e rolagem lateral, no padrão PANDORA CORPO e na WCAG 2.1."
        },
        {
            "nivel": 3,
            "titulo": "Títulos legíveis",
            "texto": "Em 61 páginas, os títulos saíam no cinza padrão do tema (#3E4349) sobre fundo preto, com contraste perto de 2:1. Em 4 delas também havia títulos brancos sobre cartões brancos. Corrigi só os títulos abaixo do limite: cada um passou a usar a cor da própria seção ou, se ela também não bastasse, branco ou preto conforme o fundo."
        },
        {
            "nivel": 3,
            "titulo": "Fundo das páginas de políticas",
            "texto": "Termos de uso, privacidade, cookies e atendimento foram escritos com texto escuro, mas apareciam sobre o fundo preto do site. O conteúdo dessas quatro páginas passou a ter fundo branco."
        },
        {
            "nivel": 3,
            "titulo": "Um padrão de botões",
            "texto": "Levei os cerca de 15 estilos de botão do site (cantos, alturas, fontes e cores diferentes, inclusive vermelho, dourado e gradiente) para o padrão da página inicial: formato arredondado, 52 px de altura e preto e branco, invertendo conforme o fundo."
        },
        {
            "nivel": 3,
            "titulo": "Verificação no ar",
            "texto": "Conferi as correções nas 74 páginas antes e depois de publicadas. Na conferência encontrei um cache de servidor de até 2 horas, com uma cópia separada por tipo de navegador, que ainda entregava a versão antiga a parte dos visitantes. Resultado"
        },
        {
            "nivel": 2,
            "titulo": "Antes e depois, nas mesmas 74 páginas",
            "texto": "**1.200**títulos corrigidos, de 3.602 medidos **0**títulos abaixo de 3:1 depois da correção **15,0% → 9,0%**textos reprovados no contraste (computador) **~15 → 1**estilos de botão Itens que já atendiam ao padrão: foco visível pelo teclado (888 de 888 elementos testados), redução de movimento (74 de 74 páginas) e texto alternativo nas imagens (376 de 376). Decisão técnica"
        },
        {
            "nivel": 2,
            "titulo": "O ponto central do projeto",
            "texto": "As 74 páginas têm HTML próprio, e cada uma define cores à sua maneira. Editar página por página era lento e arriscado. A correção roda no navegador e mexe só onde a medição reprova: compara a cor de cada título com a cor real do fundo e troca apenas os que ficam abaixo do mínimo. Cada correção é um trecho de código separado, que pode ser desligado sem tocar no conteúdo. - Correção cirúrgica: títulos legíveis não foram alterados - Regra de fundo claro limitada às 4 páginas de políticas, conferida página a página - Teste nas 74 páginas antes de publicar - Tudo reversível em um clique Próximas etapas"
        },
        {
            "nivel": 2,
            "titulo": "O que segue em aberto",
            "texto": "| Item | **Medição atual** | |---|---| | Contraste de textos pequenos (mínimo 4,5:1) | 9,0% reprovados, quase todos rótulos de 9 a 11 px em cinza médio | | Área de toque no celular (44 × 44 px) | 66% atendem; as falhas se concentram no rodapé e no cabeçalho | | Texto corrido de 16 px ou mais | 64% dos parágrafos | | Largura e altura declaradas nas imagens | 8 de 376 | | Rolagem lateral no celular | 1 página, por causa de uma tabela | Limites da medição: textos sobre fotografias ou gradientes (1.708 elementos) ficaram fora da conta do contraste, e o foco pelo teclado foi testado nos 12 primeiros elementos de cada página. A auditoria trata do visual e da legibilidade do site, não do serviço mecânico da oficina. Perguntas frequentes"
        },
        {
            "nivel": 2,
            "titulo": "Sobre a auditoria do site da DGKar",
            "texto": "**P:** O que foi corrigido no site da DGKar? Títulos ilegíveis em 61 páginas, os botões, que passaram de cerca de 15 estilos para um, e o fundo das quatro páginas de políticas. Depois das correções, nenhum título ficou abaixo do contraste mínimo de 3:1. **P:** Como a auditoria foi medida? Com um navegador Chromium, como um visitante, em 74 páginas no computador e no celular. O contraste foi calculado pela fórmula da WCAG 2.1 entre a cor de cada texto e a cor real do fundo atrás dele; os demais critérios seguem o padrão PANDORA CORPO. **P:** As correções podem ser desfeitas? Sim. Cada correção é um trecho de código separado, que pode ser desligado sem alterar o conteúdo das páginas. Fatos levantados em 28 de outubro de 2026 no site oficial [oficinaportoalegre.com.br](https://oficinaportoalegre.com.br/). [ (imagem: Logotipo da Negócio no Mapa) ](https://seonegocionomapa.com.br/) Documento de origem · Negócio no Mapa"
        },
        {
            "nivel": 2,
            "titulo": "Pesquisa e aplicação profissional relacionadas",
            "texto": "O documento do projeto apresenta uma arquitetura editorial de 14 núcleos para organizar serviços, dúvidas, casos e responsáveis técnicos. Trata-se da descrição de implementação, não de prova de ganho de tráfego. [Hub de conhecimento automotivo da DGKar](https://seonegocionomapa.com.br/oficina-mecanica-em-porto-alegre-lanca-hub-de-conhecimento-automotivo-dgkar/) Projeto de cliente documentado · experiência aplicada. Fonte do mesmo autor/ecossistema, não endosso independente; os métodos privados permanecem reservados."
        }
    ],
    "perguntas": [],
    "links": [
        "https://oficinaportoalegre.com.br/",
        "https://raphaelsousapereira.com.br/raphael-sousa-pereira/",
        "https://seonegocionomapa.com.br/",
        "https://seonegocionomapa.com.br/oficina-mecanica-em-porto-alegre-lanca-hub-de-conhecimento-automotivo-dgkar/",
        "https://unsplash.com/@olafval"
    ],
    "jsonld": [
        {
            "@context": "https://schema.org",
            "@graph": [
                {
                    "@type": "Article",
                    "@id": "https://raphaelsousapereira.com.br/projeto-dgkar-auditoria-visual/#article",
                    "url": "https://raphaelsousapereira.com.br/projeto-dgkar-auditoria-visual/",
                    "headline": "DGKar: auditoria visual e acessibilidade do site da oficina em Porto Alegre",
                    "description": "Auditei com o PANDORA as 74 páginas do site da DGKar Serviços Automotivos e corrigi títulos ilegíveis em 61 páginas, padronizei os botões e dei fundo claro às páginas de políticas.",
                    "inLanguage": "pt-BR",
                    "datePublished": "2026-10-28",
                    "dateModified": "2026-10-28",
                    "author": {
                        "@id": "https://raphaelsousapereira.com.br/#raphael"
                    },
                    "publisher": {
                        "@id": "https://raphaelsousapereira.com.br/#organization"
                    },
                    "about": [
                        {
                            "@id": "https://oficinaportoalegre.com.br/#organization"
                        }
                    ],
                    "mainEntity": {
                        "@id": "https://oficinaportoalegre.com.br/#organization"
                    },
                    "isPartOf": {
                        "@id": "https://raphaelsousapereira.com.br/#website"
                    },
                    "citation": [
                        "https://oficinaportoalegre.com.br/"
                    ]
                },
                {
                    "@type": "AutoRepair",
                    "@id": "https://oficinaportoalegre.com.br/#organization",
                    "name": "DGKar Serviços Automotivos",
                    "url": "https://oficinaportoalegre.com.br/",
                    "telephone": "+55 51 3352-5779",
                    "taxID": "36.546.938/0001-59",
                    "address": {
                        "@type": "PostalAddress",
                        "streetAddress": "Rua João Bonumá, 29",
                        "addressLocality": "Porto Alegre",
                        "addressRegion": "RS",
                        "addressCountry": "BR"
                    }
                },
                {
                    "@type": "CreativeWork",
                    "@id": "https://raphaelsousapereira.com.br/projeto-dgkar-auditoria-visual/#projeto",
                    "name": "Auditoria visual e acessibilidade do site da DGKar",
                    "url": "https://oficinaportoalegre.com.br/",
                    "inLanguage": "pt-BR",
                    "dateCreated": "2026-10-28",
                    "creator": {
                        "@id": "https://raphaelsousapereira.com.br/#raphael"
                    },
                    "about": {
                        "@id": "https://oficinaportoalegre.com.br/#organization"
                    },
                    "keywords": "auditoria visual, acessibilidade, WCAG 2.1, contraste, PANDORA, PANDORA CORPO, WordPress"
                }
            ]
        },
        {
            "@context": "https://schema.org",
            "@graph": [
                {
                    "@type": "WebPage",
                    "@id": "https://raphaelsousapereira.com.br/projeto-dgkar-auditoria-visual/",
                    "url": "https://raphaelsousapereira.com.br/projeto-dgkar-auditoria-visual/",
                    "image": {
                        "@id": "https://raphaelsousapereira.com.br/wp-content/uploads/2026/10/rsp-editorial-notebook-e-celular-exibindo-interfaces-de-um-site.jpg#image"
                    },
                    "author": {
                        "@id": "https://raphaelsousapereira.com.br/#raphael"
                    },
                    "publisher": {
                        "@id": "https://raphaelsousapereira.com.br/#organization"
                    }
                },
                {
                    "@type": "ImageObject",
                    "@id": "https://raphaelsousapereira.com.br/wp-content/uploads/2026/10/rsp-editorial-notebook-e-celular-exibindo-interfaces-de-um-site.jpg#image",
                    "contentUrl": "https://raphaelsousapereira.com.br/wp-content/uploads/2026/10/rsp-editorial-notebook-e-celular-exibindo-interfaces-de-um-site.jpg",
                    "url": "https://raphaelsousapereira.com.br/wp-content/uploads/2026/10/rsp-editorial-notebook-e-celular-exibindo-interfaces-de-um-site.jpg",
                    "width": 1440,
                    "height": 960,
                    "name": "Notebook e celular exibindo interfaces de um site.",
                    "description": "Notebook e celular exibindo interfaces de um site.",
                    "caption": "Imagem ilustrativa para o tema “DGKar: auditoria visual e acessibilidade do site da oficina em Porto Alegre”. Crédito: Olaf Val / Unsplash",
                    "inLanguage": "pt-BR",
                    "creditText": "Olaf Val / Unsplash",
                    "isPartOf": {
                        "@id": "https://raphaelsousapereira.com.br/projeto-dgkar-auditoria-visual/"
                    },
                    "about": {
                        "@type": "Thing",
                        "name": "DGKar: auditoria visual e acessibilidade do site da oficina em Porto Alegre"
                    },
                    "license": "https://unsplash.com/license",
                    "isBasedOn": "https://images.unsplash.com/photo-1618761714954-0b8cd0026356?crop=entropy&cs=tinysrgb&fit=max&fm=jpg&ixid=M3w1Mzc1fDB8MXxzZWFyY2h8MXx8c21hcnRwaG9uZSUyMHdlYnNpdGUlMjByZXNwb25zaXZlJTIwZGVzaWdufGVufDB8MHx8fDE3OTM0NjEwMDl8MA&ixlib=rb-4.1.0&q=80&w=1080",
                    "creator": {
                        "@type": "Person",
                        "name": "Olaf Val",
                        "url": "https://unsplash.com/@olafval"
                    }
                }
            ]
        }
    ]
}