GESTOR DE CONTINGUTS ORACLE WEBCENTER SITES PER A EXTRANET

Sessions de formació

QUÈ ÉS UNA WEB – PROPÒSIT I CREACIÓ

“Conjunt de pàgines web que una organització, una empresa o una persona pública posa a disposició dels usuaris.“

2

PROCÉS DE CREACIÓ D’UNA WEB

1. Identificació dels objectius i propòsit de la web

3

2. Definició de l’arquitectura i wireframing

PROCÉS DE CREACIÓ D’UNA WEB

3. Disseny elements visuals

4

4. Desenvolupament

5. Proves

7. Manteniment

6. Llançament

REDACCIÓ PER AL WEB

Abans de començar a redactar...

5

Què vull explicar?

A quin públic m’adreço?

Què vull aconseguir?

REDACCIÓ PER AL WEB

• Menys és MÉS

6

Textos curts

Una idea per paràgraf

Estil directe

Llenguatge senzill

Titulars

• Contingut descriptiu

Títols descriptius

Prioritzar paraules clau

El més rellevant, primer

Títol dels enllaços

Evitar elements complementaris (taules, imatges amb text)

REDACCIÓ PER AL WEB

Revisió ortogràfica

Textos en altres idiomes

Ús no sexista del llenguatge

Nomenclatures

7

• Qualitat, no quantitat

IMATGE CORPORATIVA

8

IMATGE CORPORATIVA

9

IMATGE CORPORATIVA

10

GESTOR DE CONTINGUTS

11

Elaborar, publicar i actualitzar continguts.

GESTOR DE CONTINGUTS

12

CONEIXENT L’ECOSISTEMA ORACLE

L’ecosistema Oracle WCS resideix en tres mons connectats però separats entre ells.

13

Desenvolupament Edició (webedit) Producció (www)

CONEIXENT L’ECOSISTEMA ORACLE

Asset: Contingut que es publica a una pàgina (p.e. un enllaç o una imatge)

14

Atributs(camps)

Associacions

de contingut

Plantilla *(visualització)

ID únic

ASSET

Estat

CONEIXENT L’ECOSISTEMA ORACLE

• Enllaç

• Document

• Imatge

• Notícia

• Text genèric

• Agenda

• Col·lecció

• Multillenguatge

• Pàgina

• Menú dreta

15

Assets més comuns

UAB.CAT: PÀGINES I ELS SEUS ELEMENTS

Disseny modular a partir de plantilles.

16

17

PORTADA

(HOME)

18

Notícies

Actes

d’agenda

Vídeos

PORTADA

(HOME)

19

Enllaços

Textos genèrics

PORTADA

(HOME)

20

Col·leccions

PORTADA

(HOME)

21

CAPÇALERA

PRINCIPAL

O COS

PEU

PORTADA

(HOME)

SEMIPORTADA

21

23

SEMIPORTADA

Imatges

Avisos

24

SEMIPORTADA

Enllaços

Imatges

Avisos

25

SEMIPORTADA

Textos genèrics

26

SEMIPORTADA

Col·leccions

27

SEMIPORTADACAPÇALERA

PRINCIPAL

O COS

PEU

PÀGINA

INTERIOR

27

29

PÀGINA

INTERIOR

Enllaços

Imatges

30

PÀGINA

INTERIOR

Textos genèrics

31

PÀGINA

INTERIOR

Col·leccions

32

PÀGINA

INTERIOR

Breadcrumbs

Menú esquerre

Contingut central

Menú dreta

33

PÀGINA

INTERIORCAPÇALERA

PRINCIPAL

O COS

PEU

INTERFÍCIE DE TREBALL

34

INTERFÍCIE DE TREBALL

35

Barra de menú superior

Panell lateral

Zona de continguts

INTERFÍCIE DE TREBALLBARRA DE MENÚ SUPERIOR

36

Perfil d’usuari

Menú principalOcultar barra superior

Selector de site

Desconnexió

INTERFÍCIE DE TREBALLBARRA DE MENÚ SUPERIOR

37

INTERFÍCIE DE TREBALLBARRA DE MENÚ SUPERIOR

38

INTERFÍCIE DE TREBALLBARRA DE MENÚ SUPERIOR

39

INTERFÍCIE DE TREBALLPANELL LATERAL

40

Navegació gràfica per l’estructura de pàgines del site

Pàgines que actualment no es troben col·locades a l’arbre del site

INTERFÍCIE DE TREBALLPANELL LATERAL

41

Generat a partir dels assets que consultem durant la mateixa sessió

Confeccionat a mida que anem marcant com a favorits els assets més freqüents

INTERFÍCIE DE TREBALLZONA DE CONTINGUTS

42

Pestanyes de treball Cercador d’assets

Barra d’acció

Zona principal

de treball

INTERFÍCIE DE TREBALLZONA DE CONTINGUTS

43

INTERFÍCIE DE TREBALL

• Cada lloc web al sistema correspon a un site a Oracle.

• L’accés és individual per usuariamb uns determinants permisos.

• Un usuari només té accés alssites als quals ha estat donatd’alta.

• Cal previsualitzar tots els canvis a l’entorn d’edició WEBEDIT abans de publicar contingut.

• Normalment es fa als assets pàgina.

Obrir vista prèvia

Menú Ver > Vista prèvia a nova finestra

44

FLUXE DE TREBALL D’EDICIÓ

Accés a

Oracle

Creació

asset

Edició

asset

Formulari

asset

Previsualització

a webedit

Visualització

correcta?

NOSIPublicar

asset?

Aprovar per

a publicació

SI

Visualització

www

Visualització

correcta?

NO

45

PRÀCTICA DE CREACIÓ D’ASSETS

ASSET ENLLAÇ

• Tres tipus d’asset enllaç: document, intern i extern.

• Prefixe recomanat: EN_

46

PRÀCTICA DE CREACIÓ D’ASSETS

ASSET DOCUMENT

• Permet publicar documents per a consulta i/o descàrrega.

• Prioritzar sempre informació textual al web.

• Si s’ha de publicar com a document, fer-ho en format PDF.

• Prefixe recomanat: DOC_

47

PRÀCTICA DE CREACIÓ D’ASSETS

ASSET ENLLAÇ

• Tres tipus d’asset enllaç: document, intern i extern.

• Prefixe recomanat: EN_DOC_

48

PRÀCTICA DE CREACIÓ D’ASSETS

ASSET IMATGE

• Crear l’asset sempre a partir d’imatges amb les dimensions amb què volem que es visualitzin al web.

• Evitar imatges més grans, ja que penalitzen temps de càrrega i rendiment del sistema.

• Algunes eines d’ajut:

• Prefixe recomanat: IMG_

49

PRÀCTICA DE CREACIÓ D’ASSETS

NOTES SOBRE DRETS D’AUTOR

• No tot el que trobem publicat a Internet el podem fer servir a plaer.

• Buscarem contingut lliure de drets o amb llicències d’ús lliure (com per exemple Creative Commons).

• Propietat intel·lectual i accés obert.

50

Dipòsit Digital de Documents (UAB)

Bancs d’imatges gratuïts (p.e. pexels.com)

Google imatges (opcions de cerca relatives a llicència)

PRÀCTICA DE CREACIÓ D’ASSETS

ASSET NOTÍCIA

• Un dels assets més complexos que tractarem.

• Dos tipus: notícia i notícia importada.

• Cal tenir en compte les nostres recomanacions per redactar textos pel web.

• Possibilitat d’incorporar vídeo del repositori institucional (PUMUKIT).

• Prefixe recomanat: AAMMDD_ (data notícia)

51

PRÀCTICA DE CREACIÓ D’ASSETS

EDITOR DE TEXT

• Editor de text HTML WYSIWYG: CKEditor.

• Permet afegir format (HTML, CSS).

• Quan enganxem contingut d’una font externa (web, editor de textos) cal netejar el text de codi HTML.

• Copiar/enganxar previ a un editor de text pla (Bloc de notes).

52

PRÀCTICA DE CREACIÓ D’ASSETS

EDITOR DE TEXT

53

Eines de format

PRÀCTICA DE CREACIÓ D’ASSETS

EDITOR DE TEXT

54

Eines de contingut addicional

PRÀCTICA DE CREACIÓ D’ASSETS

EDITOR DE TEXT

55

Neteja de codi font importat per error

PRÀCTICA DE CREACIÓ D’ASSETS

EDITOR DE TEXT

56

Marcar text en un segon idioma (p.e. anglicismes)

PRÀCTICA DE CREACIÓ D’ASSETS

EDITOR DE TEXT

57

Altres eines

PRÀCTICA DE CREACIÓ D’ASSETS

ASSET COL·LECCIÓ

• Conjunt d’assets del mateix tipus agrupats i ordenats per l’usuari.

• Es poden fer de diversos tipus d’assets.

• L’acció per editar els elements d’una col·lecció és Crear col·lecció.

• Per afegir nous assets a la col·lecció una query ens retornarà un llistat.

• La query més habitual retornarà assets modificats la darrera setmana.

• Prefixe recomanat: COL_

58

PRÀCTICA DE CREACIÓ D’ASSETS

ASSET MULTILLENGUATGE

• Cadena de text en tres idiomes.

• Ens permet gestionar títols i textos en les seves versions.

• Prefixe recomanat: ML_

59

PRÀCTICA DE CREACIÓ D’ASSETS

ASSET AGENDA (ACTIVITAT)

• Similar a l’asset notícia però amb menys atributs.

• Prefixe recomanat: AAMMDD_ (data esdeveniment)

60

PRÀCTICA DE CREACIÓ D’ASSETS

ASSET TEXT GENÈRIC

• La majoria d’informació al web es publica en format text genèric.

• Prefixe recomanat: TG_

61

CERCADOR D’ASSETS

62

• Cerca per coincidència exacta insensible a majúscules

• Cerca per un sol tipus d’asset o per qualsevol (defecte)

• Existeixen caràcters comodí per a refinar les cerques (? * ~)

• La cerca avançada permet trobar assets pel seu ID o per altres propietats

• Guardar cerques.

Per exemple: qualsevol asset modificat per mi la darrera setmana

ASSET PÀGINA

63

Descripció de

la pàgina

ASSET PÀGINA

64

Categories de pàgina

Títol menú esquerre

Section

front

ASSET PÀGINA

65

Associacions de contingut

Text genèric

Menú de la

dreta

ASSET PÀGINA

66

Arbre de pàgines

VARIANTS DE CONTINGUT CENTRAL

Pàgina interior estàndard

67

VARIANTS DE CONTINGUT CENTRAL

Pàgina interior amb text genèric + textos genèrics desplegables

68

VARIANTS DE CONTINGUT CENTRAL

Pàgina textos genèrics en capsetes

69

VARIANTS DE CONTINGUT CENTRAL

Pàgina de galeria d’imatges

70

PRÀCTICA DE CREACIÓ D’ASSETS

ASSET PÀGINA

• És un asset base en la navegació pel nostre lloc web.

• Alguns dels seus atributs (p.e. categoria), en modifiquen la visualització final.

• Per previsualitzar una pàgina cal que aquesta estigui col·locada a l’arbre de pàgines del site.

• Sufixe recomanat: _<idioma> (p.e. Historia_de_la_UAB_WEB_ca)

71

PRÀCTICA DE CREACIÓ D’ASSETS

ASSET ENLLAÇ

• Tres tipus d’asset enllaç: document, intern i extern.

• Prefixe recomanat: EN_

72

PRÀCTICA DE CREACIÓ D’ASSETS

ASSET MENÚ DRETA

• Encarregat de mostrar el menú lateral dret a les pàgines interiors.

• S’hi poden afegir assets de molts tipus.

• Herència del menú dreta a les pàgines filles.

• Prefixe recomanat: MD_

73

PUBLICACIÓ D’ASSETS

74

• Comprovar visualització del resultat final a webedit.

Aquesta acció pot fer retirar de manera involuntària

un asset enviat a publicació

• Si tot és correcte, aprovarem per a publicar l’asset o assets editats.

• Es pot desfer l’enviament a la cua d’un asset editant el mateixsempre i quan no hagi iniciat la publicació.

• Els assets aprovats van a la cua de publicació.

• La cua de publicació s’executa periòdicament en base a un horariprogramat.

• En el moment en què es llença una cua de publicació, els assetspresents són publicats a l’entorn de producció i visibles per tothom(cercadors inclosos).

Elaborar contingut accessible per a tots els usuaris independentment de les seves capacitats.

ACCESSIBILITAT WEB

75

• Visuals (ceguesa, visibilitat reduïda, daltonisme)

6,8%5,73%

Idescat 2019 INE 2018

• Cognitives, d’aprenentatge i neurològiques (salut mental, autisme, dislèxia, epilèpsia)

• Auditives (sordesa, dificultats auditives)

• Físiques i motores (paràlisi, amputació)

• Parla (mudesa, tartamudesa)

• Text alternatiu de les imatges.

ACCESSIBILITAT WEB

76

• Màxim contrast color de lletra – color de fons (també aplica a imatges).

• Enllaços descriptius

• Codi HTML o XML amagat al contingut que importem.

Directiva europea accessibilitat de llocs

web i aplicacions mòbils

Setembre

2020

• Taules amb encapçalament

• Semàntica de la pàgina.

CONSELLS PER L’EDICIÓ DE CONTINGUTS WEB

Recursos en el cas que necessitem ajuda

77

Consultar el manual del gestor de continguts

(disponible al blog dels editors)

Consultar la documentació

del blog dels editors

CONSELLS PER L’EDICIÓ DE CONTINGUTS WEB

Recursos en el cas que necessitem ajuda

78

Consultar a altres companyes

Contactar amb el CAS

935812100 | cas@uab.cat

Contactar amb l’equip web: web@uab.cat

CONSELLS PER L’EDICIÓ DE CONTINGUTS WEB

• No fer servir caràcters especials a determinats camps:

79

Al nom dels fitxers

Al camp part final de la URL del document

• Tot asset al sistema té un identificador numèric únic (ID) que ens pot ajudar a localitzar contingut.

• Servei de formularis institucional: e-Formularis.

ACLARIMENT DE DUBTES

80

CONCLUSIONS

81

GESTOR DE CONTINGUTS ORACLE WEBCENTER SITES PER A EXTRANET

Sessions de formació

MOLTES GRÀCIES!