Atividade 9

Sumário

Árvore Árvore Organizacio Organizacional nal do Site .......................................... ................................................................ ............................................ .............................. ........ 2

Árvore Organizacional Completa .............................................................................................. ............................................................................................. 3 Guidelines Identificadas no Site da FATEC-SO ....................................................................... 4 Guidelines Sugeridas para o Site da FATEC-SO ...................................................................... 7

Árvoree Organizacional do Site Árvor A seguir, apresentaremos a árvore organizacional do site da FATEC-SO (http:// http://www.fatecsorocaba.edu.br/), obtida por meio da ferramenta gratuita Website  Extractor . A árvore apresenta os skins, scripts, imagens e tantos outros arquivos que formam o site.

Figura 1: Site da FATEC-SO desmembrado em árvore organizacional.

Eis a árvore completa que, pôde ser montada a partir dos downloads de arquivos realizados pelo programa, obtendo inclusive informações detalhadas dos recursos do site:

2

Árvore Organizacional Organizacional Completa do Site Si te da Fatec-SO:

Figura 2: Árvore Organizacional do site FATEC-SO completa.

3

Guidelines Identificadas no Site da FATEC-SO

Guideline 1 Exemplo Guideline 2

Exemplo

Guideline 3 Exemplo Guideline 4

Utilizar cores de acordo com o logo  principal FATEC / ETEC, no caso, o vermelho, o preto, o branco e cinza. A aba principal de botões possui fonte  branca e fundo fundo vermelho. Exibir notícias de destaques em uma exibição de loop, seguindo a formatação  padrão de textos no decorrer decorrer do resto do site  Na aba “Notícias”, há notícias de coisas

novas na faculdade com fonte vermelha e fundo branco. Essas notícias ficam subindo e voltando embaixo, rodando constantemente constantemente em flash. Exibir as atualizações no centro com título em destaque vermelho e uma breve descrição embaixo do mesmo. No centro, há as informações principais, como vestibular, intercâmbio cultural, etc. Utilizar links externos, ou pop-ups, para a maioria das informações/notícias i nformações/notícias

Exemplo

Ao clicarmos no botão “Vestibular”, é

Guideline 5

aberto uma nova aba/janela do navegador com o site www.vestibularfatec.com.br www.vestibularfatec.com.br Exibir o calendário do mês atual com a data do dia atual em destaque, utilizando fonte vermelha.

Exemplo

Embaixo da aba “Notícias” há o

Guideline 6

Exemplo

Guideline 7 Exemplo

calendário em destaque, com uma aba exclusiva só para o mesmo. Destacar uma aba de botões contendo links que o levam ao site do Centro Paula Souza e à outros (a minoria) lugares do mesmo site. Os botões/links Clipping, Vestibular, a  pesquisa, o clima, etc, abrem sites sites específicos para eles (tempoagora.com.br, (tempoagora.com.br, vestibularfatec.com.br, centropaulasouza.sp.gov.br) Exibir, no canto direito superior, abaixo dos botões, uma caixa para digitar uma  pesquisa qualquer qualquer no Google. Google. Na aba Pesquisar, qualquer coisa que digitemos é exibido resultado do Google.

4

Guideline 8 Exemplo

Guideline 9

Exemplo Guideline 10 Exemplo Guideline 11 Exemplo

Guideline 12 Exemplo Guideline 13 Exemplo Guideline 14 Exemplo

Guideline 15

Exibir botões ilustrativos, abaixo do calendário, que levam à sites externos de comunidades da FATEC-SO Embaixo do calendário, há links para o  blog da FATEC, FATEC, facebook da FATEC, vestibular, site da VIARAPIDA, twitter da FATEC e o Google Maps da FATEC-SO. Exibir no canto esquerdo, um conjunto de  botões, separados separados por assunto, assunto, contendo os principais assuntos de diretoria e alunos. No canto esquerdo, temos as sessões de Menu Principal, Diretoria Acadêmica e Diretoria Administrativa. Utilizar linguagem voltada à usuários mais avançados/intermediários. avançados/intermediários. Há links com nomes de Clipping, MSDNAA e Softwares Educacionais. Exibir, em constante movimento horizontal, links para todos os cursos que a faculdade oferece. Bem abaixo no final do site, há, em flash, todos os cursos da FATEC-SO, que são exibidos da direita para a esquerda em velocidade média. Exibir, abaixo do grupo de botões esquerdo, o clima do dia atual, contendo informações de temperatura. Abaixo da aba Diretoria Administrativa, há informações do tempo, de acordo com o site TEMPOAGORA. Organizar o Corpo Docente em ordem alfabética, independente da área de atuação ou curso que mestra. O Corpo Docente é exibido dentro do link Corpo Docente em ordem alfabética, independente independente do curso ou grade. Exibir apenas a carga horária e breve descrição dos cursos que são exibidos para clicar na home Page. A informação de Análise e Desenvolvimento Desenvolvimento de Sistemas específica o curso e detalha a carga horária (2880 horas), mas não exibe as matérias. Utilizar uma simples interface para enviar e-mails à faculdade.

5

Exemplo

Guideline 16 Exemplo

Guideline 17 Exemplo

O envio de e-mail para contato é simples e de fácil utilização. É apresentado os campos para inserir o Nome, o E-mail, o Assunto e a Mensagem. Evitar ao máximo o uso de fotos para destacar notícias, quadros e afins. Em lugar algum é utilizado fotos para exibir as mensagens. Há apenas fotos na sessão de fotos do prédio (algumas, apenas). Separar o conteúdo dos títulos em subtítulos que abrem, quando há, mais informações específicas. Na aba Menu Principal, temos o subtítulo “Institucional” que não abre mais

informações ao lado específicas. Já o subtítulo “Coordenadorias” exibe, ao

Guideline 18 Exemplo

ficarmos com o ponteiro do mouse em cima, outros subtítulos ao lado direito com os cursos levando, então, a cada coordenadoria coordenadoria específica. Utilizar imagens em formato .png e .pdf  para informar sobre sobre matrículas, notas de alunos, estágios, e afins. Ao clicarmos na sess ão “Calendário Escolar” é aberto um .pdf para download,

Guideline 19 Exemplo

onde o mesmo contém as informações específicas. Tratar os erros de manutenção de site e erros de login na mesma página, no centro, sem detalhes e/ou sons de alerta. Ao clicarmos no link “Informações” da sessão “Programa de Formação Pedagógica”, somos levados à uma

mensagem de manutenção no mesmo site, no centro, com a mesma formatação do restante do site.

6

Guidelines Sugeridas para o Site da FATEC-SO Guideline 1 Exemplo Justificativa

Manter o site atualizado constantemente constantemente Sempre exibir notícias e demais informações atuais. Muitas das informações disponíveis são antigas a ponto de não serem mais de interesse. Além do fato de a parte inferior do site exibir: “2011” em pleno Dez/2012

Guideline 2 Exemplo Justificativa Guideline 3 Exemplo Justificativa Guideline 4 Exemplo Justificativa Guideline 5 Exemplo Justificativa Guideline 6 Exemplo Justificativa

Exibir som de alerta de erro e fontes alternativas em tratamento de erros de logins e afins. Quando ocorrer alguma informação inválida em login ou em lugar de acesso, emitir um som suave de erro p/ alertá-lo. Não há sons ou detalhes especiais para o tratamento de erros. Alinhar-se à uma linguagem de  programação Seguir um padrão de linguagem de  programação de acordo com a especialização especialização dos que o mantém. De acordo com a árvore organizacional, organizacional, há várias linguagens sendo utilizadas, util izadas, como flash, css, html, clipping, asp, etc. Não utilizar recursos que não são de interesse do público alvo do site. Informações de clima e esportes em um site acadêmico Há informações de clima, esportes e calendário, irrelevantes e poluindo a tela. Utilizar/manter as ferramentas que gerenciam o site atualizadas. Qualquer clique de link/botão deve levar à algum lugar de acordo com o esperado. Há programação antiga sem atualização e muitos dos links não levam a lugar algum. Manter o visual limpo e de fácil entendimento. Não deixar uma massa de textos e informações em conjunto. Há muita informação com prioridade igual às demais, ou seja, tudo está no mesmo tamanho de fonte e formatação.

7

Guideline 7 Exemplo Justificativa Guideline 8 Exemplo Justificativa Guideline 9 Exemplo Justificativa Guideline 10 Exemplo Justificativa Guideline 11 Exemplo

Justificativa Guideline 12 Exemplo

Utilizar imagens para destacar notícias e assuntos relacionados. Utilizar uma imagem nas notícias de  programação,  programação, dos prédios, vestibulares, vestibulares, etc. Não há imagens/fotos para destacar os assuntos do site. Organizar o Corpo Docente tanto por ordem alfabética quanto por curso ou área de atuação. Deixar o Corpo Docente mais fácil e com maior comodidade à partir da organização  por área de atuação atuação e/ou curso. curso. O Corpo Docente está organizado apenas  por ordem alfabética. alfabética. Organizar os e-mails que são enviados, repassá-los e garantir atendimento à todos. Ao enviar um e-mail, o mesmo deve ser recebido numa caixa de e-mail específica  para o site. Muitos, quase todos, os e-mail enviados não são respondidos ou justificados. j ustificados. Organizar por sessões e, assim, exibir novas telas do site para informações específicas. Ao clicar em algum link, deve-se abrir uma tela com o assunto específico com uma formatação aceitável e não fechada. Há várias informações jogadas numa mesma tela, dificultando o entendimento e, portanto, compreensão do que gostaria. Links alternativos devem aparecer no canto inferior direito, a fim de manter a organização. Os links do facebook, blog e twitter devem ser colocados no canto inferior direito com tamanho pequeno/médio para não ocupar as outras funções importantes do site. O blog, facebook, twitter da FATEC-SO não são de extremo interesse para terem o destaque que possuem no site. Organizar os textos e descrições dos temas com formatações e fontes mais expressivas. Definir uma fonte para textos, outra para notícias, botões, links e afins e, além das formatações, claro.

8

Justificativa Guideline 13 Exemplo

Justificativa Guideline 14 Exemplo

Todos os textos e descrições estão no mesmo padrão e sempre em massa. Dificulta a leitura e acarreta desinteresse. Manter atualizado e disponível os direitos do site na informação inferior do site. Os direitos do site devem estar disponíveis na informação inferior do site, a fim de manter a organização e padrão de Direitos do Site com os demais sites. Há o link “Legislação”, porém de difícil

entendimento. Manter uma linguagem de escrita de fácil entendimento e acesso. Evitar linguagens de informática e/ou assuntou específicos, como “Clipping”, “Softwares”, “MSDNAA”.

Justificativa

Guideline 15 Exemplo

Justificativa

Muitas das informações disponíveis são voltadas à usuários, no mínimo, intermediários em informática e/ou outros assuntos mais específicos. Manter diferencial de cores de acordo com as abas, botões e afins. As abas de botões devem ter cores de tons leves, destacando a fonte. As abas devem conter uma fonte diferente, a fim de diferenciar os conteúdos. Tudo no site está em vermelho e branco.  Não há diferenças diferenças entre recursos. recursos.

9