Assessoria de Planejamento Estratégico de Comunicação
3. Estrutura de serviços
3.1 - Corpo de página
O corpo (body) deverá ter fundo branco e não deverá possuir margem ou espaçamento interno (padding), conforme o exemplo de CSS abaixo:
background-color: white;
margin: 0;
padding: 0;
}
3.2 - Cabeçalho
Após a abertura da tag do corpo (body), e antes de qualquer conteúdo visível, deverá ser inserido o código HTML abaixo para exibir o cabeçalho do site da Prefeitura em iframe.
<iframe width="100%" height="190" scrolling="no" frameborder="0"
src="http://www.sjc.sp.gov.br/pagina_servico_frame_cabecalho.aspx"></iframe>
</div>
3.3 - Rodapé
Antes do fechamento da tag do corpo (body), e após qualquer conteúdo visível, deverá ser inserido o código HTML abaixo para exibir o rodapé do site da Prefeitura em iframe.
<iframe width="100%" height="305" scrolling="no" frameborder="0"
src="http://www.sjc.sp.gov.br/pagina_servico_frame_rodape.aspx" class="exemplo_pmsjc_iframe_rodape"></iframe>
</div>
3.4 - Conteúdo
Todo o conteúdo visível das páginas deverá ficar entre o cabeçalho e o rodapé definidos nos itens 3.2 e 3.3. A largura do conteúdo deve ser exatamente 1000 pixels, e o conteúdo deverá ficar centralizado horizontalmente na janela do navegador, conforme a imagem a seguir. A altura é livre.
3.5 - Fonte
Os textos devem ter fonte Arial com o tamanho mínimo de 12 pixels. Os links (com exceção do menu) devem possuir o estilo itálico com cor #006. Os textos corridos devem estar na cor preta e com alinhamento justificado.
3.6 - Menu
Deve ocupar o lado esquerdo do conteúdo, possuindo 206 pixels de largura, e com margem de 12 pixels à direita para separar o menu do restante do conteúdo.
Como primeiro item o menu deve conter o texto "Serviços" (sem as aspas) na fonte Arial de cor branca com 12 pixels de tamanho, com a imagem "barra_azul_1.jpg" de fundo (incluída no arquivo de exemplo), 10 pixels de espaçamento interno à esquerda, e 23 pixels de altura.
Os itens do menu são divididos em dois tipos:
a) Título de grupo: Não possuem link, servem apenas para dividir os links do menu em grupos. Possuem a fonte Arial em negrito de cor #000066 com 13 pixels de tamanho, e 10 pixels de espaçamento interno à esquerda. Devem estar contidos em um espaço de 20 pixels de altura. Sempre com todas as letras em maiúsculas.
b) Link de menu: São os links, possuem a fonte Arial na cor preta com 12 pixels de tamanho. Quando passar o mouse sobre os links (a:hover) eles devem ser sublinhados. São precedidos pela imagem "seta.jpg" (incluída no arquivo de exemplo) com 10 pixels de distância entre o fim da imagem e o início do texto do link. Devem estar contidos em um espaço de 20 pixels de altura se ocuparem apenas uma linha.
Manter um espaço de 20 pixels de altura entre um título de grupo e os seus links. Manter um espaço de 20 pixels de altura entre o último link de um grupo e o próximo título de grupo. Em todas as páginas que possuem menu, os primeiros itens do mesmo devem ser obtidos em tempo real no arquivo XML disponibilizado pela Prefeitura no endereço: http://www.sjc.sp.gov.br/menusjc/XML_MenuFixoSJC.aspx
Os campos do XML são:
• Descrição: texto do item
• Tipo: "T" para título de grupo, "L" para link
• Link: link do item (apenas para o tipo L)
• Abre: "M" para abrir na mesma janela, "N" para abrir em nova janela (_blank)
A parte do menu obtida no XML da Prefeitura deverá ter cor de fundo "#DDDDDD" (RGB), conforme o arquivo de exemplo ("exemplo.zip" ou "exemplo.rar").
