João Sá Marta 227-04-23
SILVA II - Programa
Descrição do novo LayoutMetadados associadosCabeçalhos e parágrafos
NotíciasES Galeria de imagensMapas do maps.google.com
João Sá Marta 327-04-23
Layout de um site tipo – com o marcador UCPA subsite Homepage View
Cabeçalho-Apresenta a identidade da UC – Não é possível alteração via
CMS
Fim da listagem de conteúdos,copyright, links úteis
e gerais
Menu que
reflecte a estrutura do site
Barra de navegação
Área de conteúdos, editável pelos editores. (Silva Document com o identificador
“index_middle”)
Slideshow. Podem ser vídeos ou imagens que incluem texto e link para mais informação (Silva Publication com o identificador “slideshow”, cujo conteúdo são “Media content”)
Área de notícias (mostra todos os “viewers”)
João Sá Marta 427-04-23
Layout de um site tipo – sem o marcador UCPA subsite Homepage View
Banner: Banners diferentes por subsite e
por directoria
Área editável pelos editores
João Sá Marta 527-04-23
Elementos da página principal
Index: serve para definir o título do subsite
Silva publication para conter o slide show
Silva document com o conteúdo central
3 “viewers” de notícias que irão aparecer no final da
página
João Sá Marta 627-04-23
Elementos da página principal
Aparecerão, da esquerda para a direita, consoante o
nº de ordem da posição (15,16,17)
João Sá Marta 727-04-23
Elementos da página principal - Slideshow
Imagem tamanho máx:340x220
Título
TextoLink
Imagem original (600x450)
João Sá Marta 827-04-23
Elementos da página principal - Slideshow
Vídeo YouTube 420x260
Código do vídeo do YouTube
Silva Media Content, contendo um Silva Embed
João Sá Marta 927-04-23
Novo layout – tamanhos das imagens as imagens são automaticamente ajustadas consoante o tamanho da janela
do browser do visitante Banners
Tamanho dos banners no layout em 24_JAN_2014, para aparecerem sem ser cortados:
Tamanho máximo: 870x145 Tamanhos possíveis:
700x145 538x145
Miniaturas das notícias A primeira imagem de cada notícia é redimensionada para 120x80 . Assim para
as miniaturas aparecerem proporcionais à imagem original, esta última deve ter uma ter a largura igual a 1,5 vezes a altura.
Slideshow tamanho máximo 340x220, para um browser com a janela a ocupar o écran
inteiro
João Sá Marta 1027-04-23
Novo layout – metadados associados Exemplo em :
http://www.uc.pt/ciuc/formacao_silva/accoes_formacao01/ano_2011/novo_layout
Definidos em : Properties -> Settings
Definição da cor base do subsite – cabeçalhos
Link para outro idioma (i18n URL)
João Sá Marta 1127-04-23
Novo layout – cabeçalhos e parágrafos
João Sá Marta 1227-04-23
Novo layout – Banners Exemplo em :
http://www.uc.pt/ciuc/formacao_silva/accoes_formacao01/ano_2011/novo_layout
“Silva Image” com identificador começado por banner_
Podem ser utilizados banners diferentes em directorias e subsites diferentes
As dimensões são 870x145px
Podem ser usados vários banners na mesma directoria ou subsite, que irão ser apresentados de forma alternada
João Sá Marta 1327-04-23
Notícias
Criar uma “Silva News Publication” por cada grupo de notícias
Criar notícias (Silva Article) dentro das “Silva News Publication”
Definir um filtro (Silva News Filter) por cada grupo de notícias , ou agregando vários grupos de notícias
Definir um “Silva News Viewer” associado a cada filtro, ou agregando vários filtros
João Sá Marta 1427-04-23
Notícias – Silva Article
Semelhante a uma página (Silva Document), mas com mais alguns atributos
Na visualização, na página inicial, os “Silva Articles”, aparecem, da esquerda para a direita, e de cima para baixo, por ordem decrescente do parâmetro “Display Date” . O mais recente aparece à esquerda, na fila de cima.
É feita uma miniatura (120x80) da primeira imagem de cada “Silva Article”
Na visualização são mostradas as 6 notícias mais recentes (ordem da “Display Date”)
João Sá Marta 1527-04-23
Notícias – Silva Article
É possível esconder o artigo da listagem inicial a partir de uma data definida pelo editor, ficando o artigo sempre disponível no arquivo.
Possível definir um link externo para o artigo, que poderá ser aberto numa nova janela do navegador (“browser”) do cliente
Possível forçar a presença de um artigo (parâmetro “sticky”), independentemente de haverem artigos mais recentes
João Sá Marta 1627-04-23
Galeria de imagens
External Source (ES) "Image Gallery"
As imagens têm que estar todas na mesma directoria da página onde é inserida a ES
A apresentação do título das imagens é configurável
Apresentação das imagens é muito mais rápida do que a versão anterior
João Sá Marta 1727-04-23
Mapas do google External Source (ES) ”Code Source Google Maps
iframe” Para fazer um mapa personalizado é necessário possuir
uma conta em @gmail.com Os mapas podem ser públicos ou “não listados” (ver
Ajuda do maps google) Fotografias e “labels”, no mapa global, estão sujeitos a
aprovação Ícones para os mapas http://mapicons.nicolasmollet.com/ Nova versão do Google Maps sem algumas das funcionalidades da
versão anterior (info. em out/2013)
João Sá Marta 1827-04-23
20 Regras De Usabilidade
Das cerca de 200 orientações ou regras de usabilidade identificadas no documento “Usabilidade_Checklist_20070703”, destacamos um conjunto de 20:
A disposição de conteúdos começa no topo superior esquerdo do ecrã. A disposição de informação é feita de forma lógica com títulos descritivos que descrevem claramente cada grupo A navegação até aos níveis terminais do site faz-se com 3 cliques Longas cadeias de caracteres ou números devem ser quebradas em pequenos pedaços Não é necessário fazer scroll horizontal Não é necessário percorrer a pagina todas para determinar os seus conteúdos. É possível ao utilizador "varrer" o ecrã e identificar e
compreender as mensagens/temas principais Não existe uma proliferação exagerada de banners e outros elementos promocionais desajustados O conteúdo da página está dividido em blocos O nível de detalhe de conteúdos é progressivo O número de opções em listas, menus, etc. são entre 5 a 9 itens (número "mágico" de 7) O texto é conciso, simples (sem adjectivos) e legível Opções e áreas de informação não aparecem como imagens que são confundidas com publicidade Os estilos e tamanhos de letra numa página são consistentes com a importância relativa de cada elemento Os links ancorados em elementos gráficos (ícones, imagens, gráficos) tem uma componente de texto e a tag "alt" preenchida Os links Internet estão a azul Os títulos das páginas Web, conforme aparecem na barra do browser, dão indicação do conteúdo e da área onde o utilizador se
encontra Os títulos de campos de páginas e secções são breves (e descritivos do respectivo conteúdo) Os títulos dos links indicam claramente os seu propósitos ou destinos Usam-se apenas até 4 cores (exceptuando-se cores adicionais de uso esporádico) Usar apenas até 4 tamanhos de fontes/letterings