DISEÑO Y EDICIÓN DE PÁGINAS WEB

Comienza Ya. Es Gratis
ó regístrate con tu dirección de correo electrónico
Rocket clouds
DISEÑO Y EDICIÓN DE PÁGINAS WEB por Mind Map: DISEÑO Y EDICIÓN DE PÁGINAS WEB

1. 1.Tipos de páginas web

1.1. Según el nivel de interacción con el usuario

1.1.1. Página estática

1.1.1.1. El contenido solo puede ser modificada por el administrador  de la misma

1.1.2. Página dinámico

1.1.2.1. Permite al usuario interactuar con el sito web, ya sea para crear contenidos o para realizar otras acciones.

1.2. Según la temática

1.2.1. Blog, foro o red social

1.2.1.1. Paginas destinadas a que los usuarios interaccionen entre sí

1.2.2. Presentación o corporativo

1.2.2.1. Sitio web destinado a publicitar un producto, una empresa, etc

1.2.3. Comercio electrónico

1.2.3.1. Página destinada a la realización de transacciones.

1.2.4. Aplicaciones web

1.2.4.1. Destinados a ofrecer una funcionalidad tradicionalmente propia de aplicaciones de escritorio

2. 2.Estándares de publicación y editores web

2.1. Lenguajes

2.1.1. En el lado del servidor

2.1.1.1. Permiten programar el comportamiento del servidor web en el momento de atender las peticiones de los usuarios y de generar contenidos HTML correspondiente.

2.1.1.1.1. PHP

2.1.1.1.2. Java

2.1.1.1.3. .NET

2.1.1.1.4. Ruby

2.1.1.1.5. Python

2.1.2. En el lado del cliente

2.1.2.1. HTML

2.1.2.1.1. Lenguaje de marcado compuesto por etiquetas que describen y estructuran el contenido de una página web

2.1.2.2. CSS

2.1.2.2.1. Utilizado para definir el estilo con el que se presenta la estructura HTML

2.1.2.3. JavaScript

2.1.2.3.1. Lenguaje de programación interpretado por el navegador  o  cliente web y que añade dinamismo a las páginas ya que permite modificar su estructura y estilo

2.2. Accesibilidad

2.2.1. Existen una variedad de limitaciones visuales, motrices, motrices, auditivas y cognitivas que requieren la utilización de herramientas y programas especiales

2.2.2. Se crearon, impulsados por W3C, los estándares de accesibilidad

2.3. Editores

2.3.1. Editores de texto plano

2.3.1.1. Normalmente, hay que empezar a crear el documento desde cero

2.3.1.1.1. Notepad+++

2.3.2. Editores de texto avanzados

2.3.2.1. Se engloban en ambientes de IDE

2.3.2.1.1. Gestión de plantillas

2.3.2.1.2. Generación de código automática

2.3.2.1.3. Autocompletar texto

2.3.2.1.4. Eclipse

2.3.3. Editores visuales

2.3.3.1. Se caracterizan por ofrecer creación de contenido web de forma gráfica y visual, sin necesdad de escribir código.

2.3.3.2. Se crean como si fuesen documentos de texto

2.3.3.3. Permiten observar el diseño de la página a medida que es creada

2.3.3.4. Kompozer

3. 3. Instalación de un sistema de gestión de contenidos

3.1. Preparación del entorno

3.2. Instalación de XAMPP

3.2.1. En WINDOWS

3.2.2. En Linux

3.2.3. Arranque de XAMPP en Linux

3.2.3.1. Después e la instalación se puede arrancar y detener el programa facilmente con los servicios Apache y MySQL

3.2.4. Instalación de Wordpress en XAMP

3.2.4.1. Pasos

3.2.4.1.1. Se descarga el instalador de wordpress

3.2.4.1.2. Se especifica el directorio en el que estará el archivo

3.2.4.1.3. Se especifica el administrador y contraseña para regular el programa

3.2.4.1.4. Se añade el nombre del blog. sabiendo que también se puede editar el estilo, diseño... del blog.

3.2.4.1.5. Se pide una cuenta existente de correo para poder enviar notificaciones y una cuenta de wordpress si la hubiese.

3.2.4.1.6. Tipo de instalación

4. 4. Gestión de contenidos

4.1. Primeros pasos

4.1.1. Pantalla de inicio

4.1.1.1. Resumen de actividad reciente

4.1.1.2. Estadísticas del sitio

4.1.1.3. Panel de control

4.1.1.3.1. Similar aunque más compleja a la versión web

4.1.1.3.2. Settings

4.1.1.3.3. Apariencia

4.2. Escritorio

4.2.1. Muestra

4.2.1.1. Actividad reciente

4.2.1.2. Publicaciones

4.2.1.3. Comentarios

4.2.1.4. Noticias

4.2.2. Ayuda

4.2.2.1. Obtener información sobre las funcionalidades

4.2.3. Actualizaciones

4.2.3.1. Actualizar pluggins y los temas

4.2.3.2. Actualizar gestor de contenidos

4.3. Herramientas

4.3.1. Publicar esto

4.3.1.1. Publicar de manera instantánea una publicación de página externa

4.3.2. Exportar

4.3.2.1. Descargar copias de seguridad del sitio

4.3.2.2. Descargar configuracíon del sitio

4.3.3. Importar

4.3.3.1. Importar archivos o entradas

4.3.4. Conversor de etiquetas y categorías

4.3.4.1. Transforma etiquetas en categorías y viceversa

4.4. Bibloteca multimedia

4.4.1. Almacenar archivos de de forma local para evitar pérdida

4.4.2. Medios

4.4.2.1. Cargar archivos adjuntables al contenido creado

4.4.2.2. Enlazar el contenido almacenado a la página para su descarga

4.4.2.3. Barra de herramientas

4.4.2.3.1. Filtros para búsqueda de contenidos

4.4.2.3.2. Selección multiple para borrar elementos

5. 5.Creación de paginas web estáticas

5.1. Creación de página de inicio

5.1.1. Ajustes

5.1.1.1. Se modifican la pagina frontal y sus secciones

5.2. Gestión de páginas estáticas

5.2.1. Páginas

5.2.1.1. Gestionar las distintas páginas de contenido estático

5.2.1.2. Posible filtrar entradas y páginas

5.2.1.3. Acciones

5.2.1.3.1. Editar

5.2.1.3.2. Mover a la papelera

5.2.1.3.3. Ver

5.2.1.3.4. Edición

5.2.1.4. Superior

5.2.1.4.1. Estable la relación entre páginas, es decir, si una es o no subsección de otras

5.3. Creación de contenido estático

5.3.1. Blog

5.3.1.1. En la sección Páginas, mediante la opción Añadir nueva.

5.3.1.2. Se puede configurar desde el menú Publicar

6. 6.Gestión de usuarios

6.1. Crear usuarios

6.1.1. Datos requeridos

6.1.1.1. Nombre de usuario

6.1.1.2. Correo electrónico

6.1.2. Roles

6.1.2.1. Subscriptores

6.1.2.1.1. Leer y añadir comentarios

6.1.2.2. Colaboradores

6.1.2.2.1. Crear y gestionar sus propias entredas pero no pueden publicarlas directamente

6.1.2.3. Autores

6.1.2.3.1. A diferencia del colaborador , este rol permite publicar entradas en el blog

6.1.2.4. Editores

6.1.2.4.1. Posibilidad de gestionar y pueblo

6.1.2.5. Administradores

6.1.2.5.1. Pueden acceder a las funciones de control

6.2. Modificar perfil

6.2.1. Desactivar el editor visual

6.2.1.1. Permite editar en HTML

6.2.2. Esquema de color

6.2.2.1. Modificar la paleta de colores

6.2.3. Atajos de teclado

6.2.3.1. J+K

6.2.3.1.1. Seleccionar el comentario anterior o siguiente

6.2.3.2. A

6.2.3.2.1. Aprobar un comentario

6.2.3.3. S

6.2.3.3.1. Marcar un comentario como SPAM

6.2.3.4. D

6.2.3.4.1. Eliminación

6.2.3.5. Q

6.2.3.5.1. Activar la edición rápida de un comentario

6.2.4. Barra de herramientas

6.2.4.1. Muestra la guerra de herramientas

6.2.5. Foto de perfil

6.2.5.1. Muestra la fotografía de perfil en los comentarios realizados por el usuario.

7. 7.Temas, widgets y plugins

7.1. Añadir temas

7.1.1. Desde la sección apariencia se puede cambiar, o personalzar añadiendo temas o instalando otros.

7.1.1.1. Añadir nuevo

7.1.1.1.1. Instalar un tema entre los disponibles

7.1.1.1.2. Buscar temas por sus nombres en un buscador, o mediante filtros

7.1.1.2. Se puede usar vista previa o instalarlo

7.2. Gestionar widgets

7.2.1. Son secciones independientes de contenido

7.2.1.1. Se situan normalmente en barras laterales

7.2.1.2. Desde apariencia se pueden gestionar cuales serán visibles.

7.2.1.3. Se pueden reorganizarse y personalizarse, cada uno de un modo distinto según su función

7.3. Añadir plugins

7.3.1. Akismet

7.3.1.1. Detecta spam filtrando listas de comentarios para sugerir cuales tienen o podrían tenerlo

7.3.2. Jetpack

7.3.2.1. Añade las características de la página web a la versión de escritorio

7.3.3. Google Analytics

7.3.3.1. Agrega el seguimiento de Analytics a las visitas que recibe el sitio web

7.3.4. NextGEN Gallery

7.3.4.1. Incluye más opciones de personalización de imágenes

8. 8.Estructura de un documento HTML

8.1. Etiquetas

8.1.1. Etiquetas básicas

8.2. Atributos

8.3. Estructura básica

8.4. Tipos de elementos

8.5. Listas

8.6. Encabezados

8.7. Tablas

8.7.1. Usar el código<table>

8.7.1.1. Las filas son <tr>

8.7.1.2. El atributo de bordes es border

8.7.1.3. Las columnas son<td>

8.7.1.4. Se unen celdas con colspan, y rowspan

8.8. Imágenes

8.9. Enlaces

9. 9.Personalización de CSS

9.1. Colocación de código

9.1.1. Se puede vincular a una estructura HTML

9.2. Selectores básicos

9.2.1. Determinan qué elementos HTML se verán afectados por el código CSS

9.3. Colores

9.4. Texto

9.5. Tamaño

9.5.1. Podemos modificar el tamaño de la mayoría de elementos

9.6. Bordes

9.7. Márgenes

9.7.1. Modificar márgenes externos

9.8. Posicionamiento

10. 10. Publicación de páginas web

10.1. Hostinger.es

10.1.1. Permite crear sitios web con nuestras páginas

10.1.2. Permite crear un blog con Wordpress

10.1.3. Permite crear un sitio web desde la propia página de Hostinger.es