páginas web para proyectos wordpress: desarrollo de ...cea.uprrp.edu › wp-content › uploads ›...

Introducción a la plataforma WordPress: Desarrollo de páginas web para proyectos académicos en el Recinto de Río Piedras

José V. CamachoFredy Castillo Prado

María Gil Barvo

6 de mayo de 2016

Objetivos

• Dar a conocer a los participantes la normativa relacionada con la administración de páginas web en la Universidad de Puerto Rico, Recinto de Río Piedras.

• Presentar un ejemplo que ilustre los pasos básicos para la administración de una página web utilizando la plataforma WordPress ofrecida por el Recinto

Objetivos

• Realizar un ejercicio con los pasos básicos para crear y administrar un sitio web de WordPress con fines personales o profesionales.

• Conocer algunos principios básicos de diseño gráfico para aplicarlos al diseño de websites

Plataforma para el Diseño de Páginas Web

• La plataforma sugerida por la Oficina de Sistemas de Información de Administración Central, para la construcción y el mantenimiento de las páginas web de los Recintos es WordPress.

Ventajas de WordPress

• Es un “open source”, por lo que es gratuito.• Es fácil de usar y existe mucho contenido en la web

sobre cómo utilizarlo.• Se le pueden añadir funcionalidades a través de los

“plugins”.• Compatible con la Web Móvil.• Multi-Usuarios.

Plataforma para el Diseño de Páginas Web

Alojamiento (Hosting)

• Todas las páginas web institucionales deberán estar alojadas en los servidores de la División de Tecnologías Académicas y Administrativas del Recinto de Río Piedras (DTTA).

– Se le asignará un dominio y espacio de prueba a cada página mientras está en construcción (dominio dv.rrp.campus).

– Los dominios y espacios de prueba se asignarán en la Oficina de Comunicaciones, Desarrollo y Exalumnos.

– Una vez completada la página web, se pasan todos los datos al servidor de producción (dominio uprrp.edu).

Estándares para la utilización aceptable de recursos de tecnología informática

• La Universidad y/o sus Recintos podrán definir y publicar el diseño de un marco general para alinear tales páginas y aplicaciones a la imagen institucional deseada.

• Los investigadores y personal docente quedan eximidos de cumplir con este requisito, por la naturaleza del trabajo que rinden a la Universidad.

http://www.uprrp.edu/dtaa/files/estandaresparaelusodetecnologiaespanol.pdf

Imagen

• Todas las páginas web deberán tener el sello oficial del Recinto con el banner establecido para la Oficina de Comunicaciones del Recinto.

• El pie de página/footer deberá ser de color gris con la firma uprrp en el lado derecho.

Mayor información

Contacto:

José Víctor Camacho LópezEspecialista en Diseño Gráfico

Oficina de Mercadeo, Desarrollo y Comunicaciones

Ext. 83120

E-mail: [email protected]

Páginas del Recinto: CEA

Administración de la página

Elementos de

Diseño Gráfico

¿Qué es WordPress?

• Gestor de Contenido CMS (content manager system)

• Editor de texto WYSIWYG (what you see is what you get)

Consideraciones en el diseño

• Realzar la imagen de la organización o unidad

• Despertar confianza e interés

• Permitir al usuario encontrar fácilmente la información

¿Cómo empezar?

• Inspiración o idea inicial• Organización de la página– Bocetos– Plantillas

• Posicionamiento de la información– Dirección de la lectura

Elementos Gráficos

• Tipografía– Serif o Sans Serif

• Colores

• Imágenes

• Logotipos

• Background

1. Crear una cuenta en WordPress

Ejercicio PrácticoCreación de website


a. Seleccione una categoría para su sitio


b. Seleccione un tema (escoja cualquiera para los efectos de diseño, se puede cambiar más adelante)

c. Escriba un dominio


d. Seleccione un plan


e. Escriba su correo electrónico y un password para crear su cuenta.


Estos únicamente los realizará la primera vez para la creación de la cuenta.

La próxima vez que desee trabajar su website solamente deberá presionar en acceder y escribir sus credenciales.



Cuando ingrese a su cuenta, presione el botón “Mi Sitio” para comenzar a construir o editar su sitio web

2. Seleccione un tema para configurar su sitio

1

2


Esta pantalla muestra el editor del tema


3. Comience la construcción del website, creando las páginas que lo conformarán


a. Escriba el contenido de la página utilizando las propiedades CMS (Gestor de Contenido)de WordPress


b. Construya una página de contacto

Seleccione los campos del formulario de contacto


Configure los ajustes de contacto


c. Cree una página de galería

Añada las imágenes


Configure las opciones y presentación de su galería


d. Cree un menú acomodando el orden en que desea se presenten sus páginas



Finalmente presione este botón para ver el resultado final de su website

Recursos útiles• Imágenes gratuitas (Creative Commons CC0)

https://pixabay.com/

Recursos útiles

• Imágenes gratuitashttp://www.freedigitalphotos.net

https://www.textures.com/

• Imágenes pagadashttp://www.shutterstock.com/

Enlaces a tutoriales

• Crear un sitio gratis con WordPress

https://www.youtube.com/watch?v=tcynS7PbA7Q

• Cómo Crear Blog en Wordpress Gratis 2016 | Editar

Plantilla Foto Perfil, Insertar Imagen Videos

https://www.youtube.com/watch?v=HbmHIbsaWMs





páginas web para proyectos wordpress: desarrollo de ...cea.uprrp.edu › wp-content › uploads ›...

Documents