Kategóriák: Minden - etiquetas - blogs - cms - html

a Albert Trepat Pérez 12 éve

287

Tema 2: Gestors de continguts -CMS-

La documentación y comunicación audiovisual abordan distintos temas esenciales para la creación y gestión de contenido web. Uno de los aspectos más destacados es la edición web mediante herramientas WYSIWYG, como DreamWeaver de Adobe, que permite a los usuarios diseñar páginas web visualizando el código HTML y el aspecto final simultáneamente.

Tema 2: Gestors de continguts -CMS-

Tema 4: Edición web WYSIWYG

DreamWeaver

Para ello utilizamos un programa WYSIWYG, como por ejemplo DreamWeaver de Adobe. Es un programa para crear páginas web dividiendo la pantalla en dos y ver el código HTML mientras ves como va quedando la página Web. Así que lo que tu haces es lo que tu ves.

Puedes crear la página...
Como si fuese un documento de Word, vas editando sin tener que utilizar el código.
Con el código HTML
DreamWeaver Screenshot

WYSIWYG: What You See Is What You Get. Permite escribir un documento viendo directamente el resultado final.

Tema 3: Edición de código fuente

CSS

Selector, propiedad y valor
Ejemplo

p { font-color:red; }

Valor

Contenido

Propiedad

Elemento que va a modificarse

Selector

Etiqueta que quedará afectada por el estilo

Formas de aplicarlo
Estilo externo

en un documento a parte

Estilo interno

en el head del documento

Estilo en línea

en cada etiqueta XHTML

Ventajas
Permiten hacer cambios globales en todo el documento o en todo el sitio web
Evitan tener que indicar el estilo en cada etiqueta
Mayor control sobre el aspecto del documento

HTML

Etiquetas en HTML
Formularios

reset

submit

radio

text

Tablas

Columna normal

Columna tipo encabezado

Fila

Listas

No numeradas

Numeradas

  1. Uno
  2. Dos
  3. Tres

Metaelementos

Datos legibles por los robots de los buscadores

Enlace

Enlace a un punto concreto de una página

.......

Enlace a otro sitio web

Enlace a un archivo en otra carpeta que está dentro de la carpeta que alberga el archivo html

Enlace a un archivo en otra carpeta del mismo nivel

Enlace dentro del mismo directorio

Inclusión de objetos

Sonidos, vídeos...

Imágenes

De internet

Guardada en otra carpeta

Guardada en la misma carpeta

Formato de texto

Texto en calibri

Texto azul

Tamaño del texto

Letra cursiva

Letra negrita

Formato de documento

Tamaño de la letra

...


Línea horizontal

Salto de párrafo


Salto de línea

Estructura de las etiquetas

.......

Body
Es la parte que se visualiza
Head
Es la parte que no se visualiza
Empezar y terminar por...
Qué utilizar?
Text Edit
Bloc de notas

Tema 2: Gestors de continguts (CMS: Content Management Systems)

Para qué se usa?

Comercio electrónico, catálogo, revistas online...
Foros
Wikis
Webs
Weebly
Webnode

Módulo para blogs

Para sitios web

Blogs
Wordpress

Posibilidad de conversión en sitio web

Para blogs

Blogger

Sólo para blogs

Como crear un sitio web

Ver
Sitio web, blog... en un navegador web

Ejemplo: Google Chrome

Subir
Cliente FTP

Ejemplo: Filezilla

Crear
CMS

Ejemplo: Weebly

Editor de código (WYSIWYG)

Ejemplo: Adobe Dreamweaver

Código Fuente (HTML)

Documentación y comunicación audiovisual: Temas 2, 3 y 4