Taller Web Del Profesor

Taller Bsico de Creacin y Publicacin de
Pginas Web para la Web del Profesor
Web: http://webdelprofesor.ula.ve
E-mail: webdelprofesor@ula.ve
Centro de Teleinformacin de la Universidad de Los Andes (CTI-ULA)

http://cti.cptm.ula.ve
Coordinacin de Estudios Interactivos a Distancia (CEIDIS)
http://ceidis.ula.ve
Contenido del Taller

1.
2.
3.
4.
Introduccin
n Objetivos y alcances del taller.
n Servicio Web del Profesor.
n Alternativas para publicacin electrnica en la ULA.
Aspectos Bsicos
n Terminologa y conceptos.
n Cmo trabaja la Web?.
n Cmo se encuentra un documento en la Web?. URLs y buscadores.
n Qu es HTML?.
n Qu necesitamos?...
n Formas de crear sitios Web.
n Pasos previos a la creacin de un Sitio Web.
n Tipos de Documentos que puede publicar en su Web.
n Consejo para el nombramiento de carpetas y archivos para sus pginas Web.
n Direccin de la pgina principal de su sitio Web.
n Componentes de una pgina Web.
Creacin de Sitios Web usando un Editor Web (Netscape Composer)
n Planificacin del sitioWeb del profesor.
n Demostracin del Instructor. Edicin de los elementos de una pgina Web con Netscape Composer.
n Usando un Patrn de Diseo y Contenido.
n Prctica: Editando sus pginas Web.
Publicacin de Sitios Web en la Web del Profesor
n Herramientas necesarias para publicar contenidos en la Web del Profesor.
n Antes de Transferir los archivos al servidor.
n Conectndose con el servidor webdelprofesor.ula.ve.
n Transfiriendo archivos al servidor webdelprofesor.ula.ve
n Comprobando que su sitio Web se despliegue correctamente.
http://webdelprofesor.ula.ve
1. Introduccin
Objetivos y alcances del Taller.

n Servicio Web del Profesor.
n Alternativas para publicacin electrnica en
la ULA.
n
Objetivos del Taller

n
Familiarizar a los profesores de la ULA en la creacin y

edicin de sitios Web personales sencillos.
Facilitar a los profesores la publicacin en Internet de

material til para su vida acadmica y de investigacin.
Mejorar el conocimiento de los profesores en el uso de

Tecnologas de Informacin y Comunicacin (TICs)
modernas.
Incorporar el uso de TICs en el quehacer acadmico de

los profesores universitarios de la ULA.
Alcances del Taller

n
Al finalizar el taller los profesores habrn aprendido los

aspectos bsicos involucrados con la elaboracin de una
pgina Web y su publicacin en un servidor Web.
Los participantes debern, en el transcurso del taller,

elaborar una pgina sencilla que publicarn en su cuenta
personal usando el servicio Web del Profesor.
Servicio Web del Profesor

n
Es un servicio de "alojamiento" web para la comunidad acadmica

de la ULA.
El servicio "Web del Profesor" (WP) ofrece un sencillo mecanismo

de alojamiento (hosting) y publicacin de archivos y/o pginas Web
a profesores de la Universidad de Los Andes, donde puedan
compartir informacin que sea til en sus actividades acadmicas.
Esto significa que un profesor que haya elaborado su pgina Web
(en su casa u oficina) puede publicarla libre y directamente en el
servidor Web del Profesor con tan slo realizar una transferencia
de archivos.
Alternativas para publicacin electrnica en la ULA

n
Web del Profesor

n http://webdelprofesor.ula.ve
Proyecto Saber ULA, Patrimonio Intelectual de la ULA en Internet

n http://www.saber.ula.ve

n http://ceidis.ula.ve
Requerimientos especiales
n
n
n
Servicios Web para dependencias universitarias

Sitios Web de postgrados y unidades de investigacin
Sitios Web de eventos
Todas
Todas estas
estas opciones
opciones estn
estn
disponibles
disponibles para
para Uds.
Uds. Como
Como
profesores
profesores ee investigadores
investigadores de
de
la
la ULA
ULA
7
2. Aspectos Bsicos
n
n
n
n
n
n
n
n
n
n
n
Terminologa y conceptos.
Cmo trabaja la Web?.
Cmo se encuentra un documento en la Web?. URLs y buscadores.
Qu es HTML?.
Qu necesitamos?...
Formas de crear sitios Web.
Pasos previos a la creacin de un sitio Web.
Tipos de Documentos que puede publicar en su Web.
Consejo para el nombramiento de carpetas y archivos para sus
pginas Web.
Direccin de la pgina principal de su sitio Web.
Componentes de una pgina Web.
8
Terminologa y conceptos.
Discutir brevemente significado de:
n
n
n
n
n
n
n
Internet, World Wide Web, WWW, Web

Pgina Web, sitio Web, portal Web
Navegador Web, browser, editor Web, editor HTML, servidor Web
Alojamiento, hosting, publicacin Web
HTTP, FTP, SFTP, SSH
URL, HTML, HTM
Java, JavaScript, PHP, etc.
Cmo trabaja la Web?

Su computador
...solicita
...solicita documento
documento a...
a...
Su
Su computador
computador
despliega
despliegael
el
documento
documento enviado
enviado
1.
2.
3.
Servidor Web
Servidor
Servidor enva
enva documento
documento
aa su
su computador
computador
Su computador solicita a un servidor Web que le enve un documento

almacenado en l.
El documento viaja a travs de Internet hasta su computador
Su computador despliega el documento que solicit.
10
Cmo se encuentra un documento en la Web?

Las direcciones Web (URLs)
n
Los documentos en Internet (y el Web) se pueden ubicar gracias a que cada

uno posee una direccin web (llamadas URLs)
Direcciones web tpicas serian las siguientes:

n
http://www.saber.ula.ve/unidades/planilla.html
|-servicio-|---- servidor ------|-- detalles del camino y el archivo ---|

n
http://webdelprofesor.ula.ve/ingenieria/fpalm
Si Ud. conoce la direccin de la pgina

que quiere visitar, la coloca en la barra
de direcciones de su navegador
Mencionen
Mencionen otras
otras direcciones
direcciones Web
Web que
que hayan
hayan visto
visto yy les
les llamen
llamen la
la atencin.
atencin.
11
...Cmo se encuentra un documento en la Web?

Los buscadores
Buscadores globales
n
n
n
n
http://www.google.com
http://www.altavista.com
http://www.auyantepui.com
Etc...
Buscadores locales
n
n
Buscan dentro de un determinado sitio Web

Ejemplos: http://www.saber.ula.ve, http://webdelprofesor.ula.ve
-- Mencionen
Mencionen cual
cual buscador
buscador global
global les
les da
da mejores
mejores resultados.
resultados.
-- Mencionen
Mencionen un
un problema
problema que
que ocurre
ocurre con
con los
los buscadores
buscadores globales.
globales.
12
Qu es HTML?
HTML es el lenguaje con el que se estructuran

internamente las pginas web. Bsicamente se trata
de un conjunto de instrucciones (etiquetas) que sirven
para dar formato al texto y definir donde y como se van
a presentar los elementos de pgina (texto, imgenes,
etc.).
No es necesario saber HTML para elaborar y publicar

pginas Web sencillas (hay programas que nos
ayudan en esa tarea).
13
Qu necesitamos?...
n
Para Navegar por el Web:

n
n
Para elaborar pginas Web:

n
n
n
Conexin de algn tipo a la red Internet.

Navegador Web (Netscape Navigator MS Internet Explorer por ejemplo).
Navegador Web.
Editor de texto o editor HTML o conversores de formato.
Programas para procesar o elaborar grficos (opcional).
Para publicar informacin en el Web:

n
n
Haber elaborado previamente pginas Web y grficos relacionados.

Tener a nuestra disposicin una institucin o compaa que aloje nuestras
pginas (tener una cuenta de usuario en una universidad, compaa o
proveedor de acceso a Internet, con derecho a publicar nuestros propios
archivos en sus servidores) o tener servidores propios conectados a Internet.
Uds.
Uds. tienen
tienen un
un lugar
lugar donde
donde publicar
publicar sus
sus pginas
pginas Web?
Web?
14
Formas de crear sitios Web

Utilizando
Herramientas de
Conversin de
Formato
Utilizando
Editores HTML
Escribiendo el
cdigo HTML
15
Pasos previos a la creacin de un Sitio Web
1.
2.
Definir contenidos a publicar.

Estructurar informacin para el sitio Web.
Secciones del sitio,
navegacin
rbol del sitio
Boceto o esquema de una pgina

Logo de la ULA
Datos de Contacto
Material y Notas
Intereses personales, links...
Nombre
e-mail
Resumen Curricular
Participacin en Proyectos de Inv.
Publicaciones recientes
Se
Se puede
puede usar
usar un
un patron
patron de
de diseo
diseo prepredefinido
definido para
para facilitar
facilitar esta
esta tarea
tarea (diseo,
(diseo,
boceto,
boceto, diagramacin)
diagramacin)
16
Tipos de Documentos que puede publicar en su Web

n
A continuacin una lista algunos tipos de documentos que Ud. Puede

publicar en su Web:
Tipo de Documento
Pgina WEB-HTML
Archivo texto ASCII
Portable Document Format
Grficos
Archivos de audio digital
Extensin
.html, .htm
.txt
.pdf
.gif, .jpg, png, etc.
.mp3, .wav
Cualquier otro archivo digital: p.ej. documentos Word, Power Point, Excel, etc.
No todos estos tipos de documentos pueden ser mostrados por el

Navegador directamente; algunos necesitan aplicaciones de apoyo o
plugins (es el caso de Word, Flash, MP3, etc.)
17
Consejos para el nombramiento de carpetas y archivos para sus

pginas Web
Cuando se trabaja con archivos para un servidor
Web, es conveniente seguir algunos consejos:
n
NO usar !!! espacios en blanco en un nombre

de archivo o carpeta aunque su sistema
operativo lo permita.
Usar una convencin para maysculas y

minsculas. Para un servidor Web el archivo
mipagina.html es diferente al archivo
MIPAGINA.Html (para MS Windows no!!).
Consejo: usar minsculas
NO usar !!! Letras acentuadas dentro de los

nombres de archivos.
NO usar !!! caracteres especiales en el

nombre de los archivos:
No
h04.htm
N Clases C.Htm
Artculo.pdf
C V.doc
img
S
horario_2004.html
notas_clase_calculo.html
articulo.pdf
curriculum.doc
imagenes
! @ # $ % ^ & * ( ) / \ | : ; , ? + , etc...
n
Usar nombres descriptivos para los archivos,

sin importar su longitud.
18
Direccin de la pgina principal de su sitio Web

n
El servidor Web reconoce como documento por defecto los nombres de

archivo:
index.html index.htm
...y los despliega automticamente si necesidad de escribir su nombre.
Consejo: use uno de esos nombres para la pgina principal de su sitio.
n
Ejemplos de posibles direcciones de pginas Web de profesores

n
http://webdelprofesor.ula.ve/ciencias/josepena/clases.html
http://webdelprofesor.ula.ve/ciencias/josepena/
Mencione
Mencione cual
cual es
es la
la desventaja
desventaja de
de NO
NO usar
usar estos
estos nombres
nombres sugeridos
sugeridos de
de
archivo
archivo para
para la
la pgina
pgina principal
principal de
de su
su sitio
sitio Web.
Web.
19
Componentes de una pgina Web
Las pginas Web se componen de varios elementos:

n Texto.
n Grficos.
n Enlaces (hipervnculos).
n Elementos de diagramacin y formato.
Se
Se podrn
podrn crear
crear grficos
grficos en
en un
un editor
editor Web?
Web?
20
3. Creacin de Sitios Web usando un Editor Web (Netscape

Composer)
n
n
n
n
Planificacin del sitioWeb del profesor.

Demostracin del Instructor. Edicin de los elementos
de una pgina Web con Netscape Composer.
Usando un Patrn de Diseo y Contenido.
Prctica: Editando sus pginas Web.
21
Planificacin del sitio Web del profesor

n
Tema: Sitio Web del Profesor Jos Pea
Este sitio incluir informacin sobre las materias que

dicta el profesor, guas de estudio, ejercicios,
actividades, reas de investigacin.
El prof. Pea tambin quiere que la pgina sea un medio

de comunicacin entre l y sus alumnos, donde colocar
las notas de las evaluaciones, anuncios y eventos de
inters para sus estudiantes.
22
... Planificacin del sitio Web del profesor

n
Es buena prctica revisar otras pginas Web de

Profesores.
n
Navegar por:
n
n
n
n
Ingenieria/ Richar Mquez

Ciencias / Wilians Barreto
Arquitectura / Nelson Gmez
Ciencias Jurdicas / Daniela Bettiol
23

n
Secciones del Sitio / Navegacin

Una posible divisin de la informacin sera:
n
n
n
n
n
n
n
Informacin sobre el profesor

Materias
Guas y Ejercicios
reas de Investigacin
Publicaciones
Enlaces de Inters
Mi familia
24

n
Estructura del Sitio:

n
Se podran crear diferentes carpetas para almacenar

la informacin del sitio del prof. Pea:
/josepena
n
n
n
/imgenes
/investigacion
/materias
n
n
n
/personal
n
/Materia1
/Materia2
...
/fotos
/publicaciones
Discutir
Discutir esta
esta estructura
estructura yy agregar
agregar
lo
lo que
que falte.
falte.
25

n
Ejemplo de esquema de una pgina (boceto):

Logo de la ULA
Datos de Contacto
Nombre
e-mail
Resumen Curricular
Material y Notas
Participacin en Proyectos de Inv.
Intereses personales, links...
Publicaciones recientes
26

n
Boceto que se deber convertir en algo como esto:
27
Demostracin del Instructor. Edicin de los elementos de una

pgina Web con Netscape Composer
n
Elementos bsicos del Editor Web

Barra de men y de herramientas
Zona de edicin de la pgina Web
Vistas de edicin de la pgina Web

28
Usando un Patrn de Diseo y Contenido
Patrn para pginas Web
Patrn previamente
creado para dar
mayor facilidad a los
profesores
29
Prctica: Editando sus pginas Web

1. Escoja en que lugar de su computador creara el sitio Web (para el taller en:
C:\taller_web_del_profesor\mi_sitio_web\).
2. Genere las carpetas necesarias en el lugar escojido (para el taller ya
estarn creadas algunas).

3. Coloque los archivos necesarios en las carpetas correspondientes (para el
taller ya existirn algunas carpetas y archivos).

4. Abra el archivo patrn proporcionado (patron1.html), con Netscape
Composer y guardelo con el nombre index.html

5. Comience a editar la pgina principal de su sitio. Incorpore o edite
elementos en la pgina Web (texto, enlaces, imgenes, tablas, etc.).

6. Guarde el archivo a menudo.
7. Pruebe la pgina en el navegador Web (Explorer o Netscape).
8. Repita pasos del 4 al 7 para crear cualquier otra pgina de su sitio.
30
...Prctica: Editando sus pginas Web

n Edite todos los elementos que desee de su pgina.
n Aada enlaces a:
n una pgina externa.
n otra pgina de su sitio Web.
n una direccin de correo electrnico.
n un documento PDF, Word, Excel y Power Point (proporcionados por el
instructor).
n Inserte una imagen (encontrara una en la carpeta imgenes)
n Intente colocar datos verdaderos en su pgina para que luego sirva como
su primera pgina publicada en el Web del Profesor.

n El instructor lo ayudar cuando Ud. lo solicite.
31
...Prctica: Editando sus pginas Web

n Modelo posible:
32
4. Publicacin de Sitios Web en la Web del Profesor
n
n
n
n
Herramientas necesarias para publicar contenidos en la

Web del Profesor.
Antes de Transferir los archivos al servidor.
Conectndose con el servidor webdelprofesor.ula.ve.
Transfiriendo archivos al servidor webdelprofesor.ula.ve
Comprobando que su sitio Web se despliegue
correctamente.
33
Herramientas necesarias para publicar contenidos en

la Web del Profesor
n
Para publicar contenidos en la Web del Profesor es necesario utilizar un

programa llamado cliente FTP seguro, que permite transferir los archivos y
pginas Web creadas en su computador, a su cuenta en el servidor Web
del Profesor.
SFTP son las siglas que corresponden a Secure File Transfer Protocol
(Protocolo Seguro de Transferencia de Archivos); y es un sistema seguro
de envo de archivos a travs de Internet que se usa en el servicio Web del
Profesor de la ULA.
Se pueden descargar e instalar clientes FTP seguros de forma gratuita

(desde las paginas del Web del Profesor)
Ser
Ser que
que existen
existen clientes
clientes yy servidores
servidores FTP
FTP inseguros?
inseguros? R:
R: SI
SI
34
Antes de Transferir los archivos al servidor
1.
Identificar dnde estn los archivos del Sitio Web en

su computadora.
2.
Comprobar que el sitio Web y documentos a enviar se

desplieguen correctamente en su computadora.
35
Conectndose con el servidor webdelprofesor.ula.ve
n
n
Seguiremos las indicaciones del instructor.

Para esta actividad utilizaremos el cliente SFTP recomendado en la
Web del Profesor (Secure Shell SSH y Secure FTP SFTP).
Para instrucciones detalladas de instalacin y conexin puede

consultar el manual de Secure Shell (SSH) y Secure FTP (SFTP)
para Windows, que encontrar en la seccin Documentacin y
Manuales en la Web del Profesor:
n
36
Transfiriendo archivos al servidor webdelprofesor.ula.ve

n
Para publicar su sitio Web seguiremos los pasos

indicados por el instructor.
37
Comprobando que su sitio Web se despliegue correctamente

n
Usando su navegador, intente acceder a su pgina Web

recien transferida.
Recuerde la direccin de su pgina Web:
http://webdelprofesor.ula.ve/SU_FACULTAD/SU_LOGIN
38
Felicitaciones !!
Ya Ud. Tiene publicada en Internet su pgina Web!!

Informele a sus colegas, estudiantes y amigos la direccin
de su pgina Web.
Publique informacin valiosa y actualice sus contenidos
constantemente.
39
Preguntas, dudas, comentarios finales?
Puede preguntar cualquier duda a los administradores

del sistema Web del Profesor
Puede volver a asistir a este taller cuando quiera
40
Gracias por su atencin
Comunicar cualquier duda, pregunta o

sugerencia al siguiente correo electrnico:
webdelprofesor@ula.ve
Centro de Teleinformacin de la Universidad de Los Andes (CTI-ULA)
http://cti.cptm.ula.ve
http://ceidis.ula.ve
41

Taller Web Del Profesor

Uploaded by

Document Information

Copyright

Available Formats

Share this document

Share or Embed Document

Sharing Options

Did you find this document useful?

Is this content inappropriate?

Copyright:

Available Formats

Taller Web Del Profesor

Uploaded by

Copyright:

Available Formats

Taller Bsico de Creacin y Publicacin de

Pginas Web para la Web del Profesor

Centro de Teleinformacin de la Universidad de Los Andes (CTI-ULA)

Contenido del Taller

Objetivos y alcances del Taller.

Objetivos del Taller

Familiarizar a los profesores de la ULA en la creacin y

Facilitar a los profesores la publicacin en Internet de

Mejorar el conocimiento de los profesores en el uso de

Incorporar el uso de TICs en el quehacer acadmico de

Alcances del Taller

Al finalizar el taller los profesores habrn aprendido los

Los participantes debern, en el transcurso del taller,

Servicio Web del Profesor

Es un servicio de "alojamiento" web para la comunidad acadmica

El servicio "Web del Profesor" (WP) ofrece un sencillo mecanismo

Alternativas para publicacin electrnica en la ULA

Web del Profesor

Proyecto Saber ULA, Patrimonio Intelectual de la ULA en Internet

Coordinacin de Estudios Interactivos a Distancia (CEIDIS)

Servicios Web para dependencias universitarias

Internet, World Wide Web, WWW, Web

Cmo trabaja la Web?

Su computador solicita a un servidor Web que le enve un documento

Cmo se encuentra un documento en la Web?

Los documentos en Internet (y el Web) se pueden ubicar gracias a que cada

Direcciones web tpicas serian las siguientes:

|-servicio-|---- servidor ------|-- detalles del camino y el archivo ---|

Si Ud. conoce la direccin de la pgina

...Cmo se encuentra un documento en la Web?

Buscan dentro de un determinado sitio Web

HTML es el lenguaje con el que se estructuran

No es necesario saber HTML para elaborar y publicar

Para Navegar por el Web:

Para elaborar pginas Web:

Conexin de algn tipo a la red Internet.

Para publicar informacin en el Web:

Haber elaborado previamente pginas Web y grficos relacionados.

Formas de crear sitios Web

Pasos previos a la creacin de un Sitio Web

Definir contenidos a publicar.

rbol del sitio

Boceto o esquema de una pgina

Intereses personales, links...

Participacin en Proyectos de Inv.

Tipos de Documentos que puede publicar en su Web

A continuacin una lista algunos tipos de documentos que Ud. Puede

No todos estos tipos de documentos pueden ser mostrados por el

Consejos para el nombramiento de carpetas y archivos para sus

NO usar !!! espacios en blanco en un nombre

Usar una convencin para maysculas y

NO usar !!! Letras acentuadas dentro de los

NO usar !!! caracteres especiales en el

Usar nombres descriptivos para los archivos,

Direccin de la pgina principal de su sitio Web

El servidor Web reconoce como documento por defecto los nombres de

Ejemplos de posibles direcciones de pginas Web de profesores

Componentes de una pgina Web

Las pginas Web se componen de varios elementos:

3. Creacin de Sitios Web usando un Editor Web (Netscape

Planificacin del sitioWeb del profesor.

Planificacin del sitio Web del profesor

Tema: Sitio Web del Profesor Jos Pea

Este sitio incluir informacin sobre las materias que