Diseño y edición de página web

Get Started. It's Free
or sign up with your email address
Rocket clouds
Diseño y edición de página web by Mind Map: Diseño y edición de página web

1. Primeros pasos

1.1. Pantalla de inicio

1.1.1. Resumen de actividad reciente

1.1.2. Estadísticas del sitio

1.1.3. Panel de control

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

1.1.3.2. Settings

1.1.3.2.1. Cambiar idioma

1.1.3.2.2. Cambiar nombre del sitio

1.1.3.2.3. Cambiar dirección

1.1.3.2.4. Cambiar descripción

1.1.3.3. Apariencia

1.1.3.3.1. Tema

2. Tipos de páginas web

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

2.1.1. Página estática

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

2.1.2. Página dinámico

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

2.2. Según la temática

2.2.1. Blog, foro o red social

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

2.2.2. Presentación o corporativo

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

2.2.3. Comercio electrónico

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

2.2.4. Aplicaciones web

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

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

3.1. Lenguajes

3.1.1. En el lado del servidor

3.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.

3.1.1.1.1. PHP

3.1.1.1.2. Java

3.1.1.1.3. .NET

3.1.1.1.4. Ruby

3.1.1.1.5. Python

3.1.2. En el lado del cliente

3.1.2.1. HTML

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

3.1.2.2. CSS

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

3.1.2.3. JavaScript

3.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

3.2. Accesibilidad

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

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

3.3. Editores

3.3.1. Editores de texto plano

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

3.3.1.1.1. Notepad+++

3.3.2. Editores de texto avanzados

3.3.2.1. Se engloban en ambientes de IDE

3.3.2.1.1. Gestión de plantillas

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

3.3.2.1.3. Autocompletar texto

3.3.2.1.4. Eclipse

3.3.3. Editores visuales

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

3.3.3.2. Se crean como si fuesen documentos de texto

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

3.3.3.4. Kompozer

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

4.1. Preparación del entorno

4.2. Instalación de XAMPP

4.2.1. En WINDOWS

4.2.2. En Linux

4.2.3. Arranque de XAMPP en Linux

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

4.2.4. Instalación de Wordpress en XAMP

4.2.4.1. Pasos

4.2.4.1.1. Se descarga el instalador de wordpress

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

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

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

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

4.2.4.1.6. Tipo de instalación

5. Gestión de contenidos

5.1. Escritorio

5.1.1. Muestra

5.1.1.1. Actividad reciente

5.1.1.2. Pblicaciones

5.1.1.3. Comentarios

5.1.1.4. Noticias

5.1.2. Ayuda

5.1.2.1. Obtener información sobre las funcionalidades

5.1.3. Actualizaciones

5.1.3.1. Actualizar pluggins y los temas

5.1.3.2. Actualizar gestor de contenidos

5.2. Herramientas

5.2.1. Publicar esto

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

5.2.2. Exportar

5.2.2.1. Descargar copias de seguridad del sitio

5.2.2.2. Descargar configuracíon del sitio

5.2.3. Importar

5.2.3.1. Importar archivos o entradas

5.2.4. Conversor de etiquetas y categorías

5.2.4.1. Transforma etiquetas en categorías y viceversa

5.3. Bibloteca multimedia

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

5.3.2. Medios

5.3.2.1. Cargar archivos adjuntables al contenido creado

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

5.3.2.3. Barra de herramientas

5.3.2.3.1. Filtros para búsqueda de contenidos

5.3.2.3.2. Selección multiple para borrar elementos

6. Creación de paginas web estáticas

6.1. Creación de página de inicio

6.1.1. Ajustes

6.1.1.1. Se modifican la pagina frontal y sus secciones

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

6.2.1. Páginas

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

6.2.1.2. Posible filtrar entradas y páginas

6.2.1.3. Acciones

6.2.1.3.1. Editar

6.2.1.3.2. Mover a la papelera

6.2.1.3.3. Ver

6.2.1.3.4. Edición

6.2.1.4. Superior

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

6.3. Creación de contenido estático

6.3.1. Blog

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

6.3.1.2. Se puede configurar desde el menú Publicar

7. Gestión de usuarios

7.1. Crear usuarios

7.1.1. Datos requeridos

7.1.1.1. Nombre de usuario

7.1.1.2. Correo electrónico

7.1.2. Roles

7.1.2.1. Subscriptores

7.1.2.1.1. Leer y añadir comentarios

7.1.2.2. Colaboradores

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

7.1.2.3. Autores

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

7.1.2.4. Editores

7.1.2.4.1. Posibilidad de gestionar y pueblo

7.1.2.5. Administradores

7.1.2.5.1. Pueden acceder a las funciones de control

7.2. Modificar perfil

7.2.1. Desactivar el editor visual

7.2.1.1. Permite editar en HTML

7.2.2. Esquema de color

7.2.2.1. Modificar la paleta de colores

7.2.3. Atajos de teclado

7.2.3.1. J+K

7.2.3.1.1. Seleccionar el comentario anterior o siguiente

7.2.3.2. A

7.2.3.2.1. Aprobar un comentario

7.2.3.3. S

7.2.3.3.1. Marcar un comentario como SPAM

7.2.3.4. D

7.2.3.4.1. Eliminación

7.2.3.5. Q

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

7.2.4. Barra de herramientas

7.2.4.1. Muestra la guerra de herramientas

7.2.5. Foto de perfil

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

8. Temas, widgets y plugins

8.1. Añadir temas

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

8.1.1.1. Añadir nuevo

8.1.1.1.1. instalar un tema entre los disponibles

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

8.1.1.2. Se puede usar vista previa o instalarlo

8.2. Gestionar widgets

8.2.1. Son secciones independientes de contenido

8.2.1.1. Se situan normalmente en barras laterales

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

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

8.3. Añadir plugins

8.3.1. Akismet

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

8.3.2. Jetpack

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

8.3.3. Google Analytics

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

8.3.4. NextGEN Gallery

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

9. Estructura de un documento HTML

9.1. Etiquetas

9.1.1. Etiquetas básicas

9.2. Atributos

9.3. Estructura básica

9.4. Tipos de elementos

9.5. Listas

9.6. Encabezados

9.7. Tablas

9.7.1. Usar el código<table>

9.7.1.1. Las filas son <tr>

9.7.1.2. El atributo de bordes es border

9.7.1.3. Las columnas son<td>

9.7.1.4. Se unen celdas con colspan, y rowspan

9.8. Imágenes

9.9. Enlaces

10. Personalización de CSS

10.1. Colocación de código

10.2. Selectores básicos

10.3. Colores

10.4. Texto

10.5. Tamaño

10.6. Bordes

10.7. Márgenes

10.8. Posicionamiento

10.9. Imagen de fondo

10.10. CSS personalizado en Wordpress

11. Publicación de páginas web

11.1. Contratación

11.2. Subir contenido a alojamiento

11.3. Instalación de contenido