DISEÑO DE SITIOS WEB - PDF LOBORATORIO

UNIVLkSIDAD NACICNAL A8ILk1A A DIS1ANCIA UNAD
LSCuLLA uL ClLnClAS 8ASlCAS 1LCnCLCClA L lnCLnlL8lA

CulA CCMCnLn1L 8C1lCC uLL Cu8SC DISLC DL SI1ICS WL8

UNIVERSIDAD NACIONAL ABIERTA Y A DISTANCIA
ESCUELA DE CIENCIAS BASICAS TECNOLOGIA E INGENIERIA

GUA COMPONENTE PRCTICO

301122 - DISEO DE SITIOS WEB
ING. MAURICIO PERDOMO VARGAS
(Director Nacional)

NOMBRE DEL ACREDITADOR
Acreditador

LA PLATA - HUILA
Septiembre de 2010


2. A8PE6T08 0E PR0P|E0A0 |NTELE6TUAL Y VER8|0NAH|ENT0

Autores Gua: ORLANDO PUENTES ANDRADE JHON YERSON ROBLES
Versiones: 2005 2007
Actualizaciones: MAURCO PERDOMO VARGAS
Versiones: 2010 (1) 2010 (2)

El presente Documento se rige por la normatividad que con base a derechos de
autor de publicaciones universitarias ha expedido la Direccin Nacional de
Derechos de Autor, de all que el presente documento se reglamente bajo la
Circular No 16 del 15 de Abril de 2002 expedida por este organismo de control
pblico a las nstituciones de educacin superior, sobre "Los Derechos de Autor
en el mbito Universitario. Al igual que los reglamentos sobre derechos de Autor
consagrados en la Ley No. 23 de 1982 sobre Derechos de Autor del congreso de
la repblica de Colombia y la Ley No. 44 de 1993 que hace adiciones a la Ley 23
del 82.
Para tales efectos de establece que el presente Documento hace parte de los
repositorios documentales y digitales la Universidad Nacional Abierta y a
Distancia UNAD de Colombia.

@CopyRigth
Universidad Nacional Abierta y a Distancia
SBN
2005
Centro Nacional de Medios para el Aprendizaje


3. |N0|6E 0E 60NTEN|00

Pg.
4. L|8TA00 0E TALA8 Y CRAF|6A8 4
5. 6ARA6TER|8T|6A8 CENERALE8 0E LA PRA6T|6A 5
.1 PRA6T|6A No. 1 - |NTR00U66|0N A hTHL, |HACENE8, h|PERV|N6UL08, TALA8 8
.2 PRA6T|6A No. 2 - F0RHULAR|08 Y HAR608 EN hTHL 60N h0JA8 0E E8T|L0
688

11
.3 PRA6T|6A No. 3 - JAVA 86R|PT Y 6H8 J00HLA 13
7. FUENTE8 006UHENTALE8 17
8. RUR|6A 0E EVALUA6|0N 0E LA8 PRA6T|6A8 18


4. L|8TA00 0E TALA8
O En el presente documento no se definen tablas anexas.

4.1 L|8TA00 0E CRAF|608 Y F|CURA8

O En el presente documento no se definen grficos ni figuras anexas.


5. 6ARA6TER|8T|6A8 CENERALE8

|ntroducc|n El diseo de Sitios web , a partir de la
revolucin en las comunicaciones por
medio de la Red de redes; la nternet, ha
permitido que se presenten de forma
dinmica e interactiva los contenidos y la
informacin en forma de Pginas Web. La
estadstica muestra que en el 2008 existan
cerca de: 186.727.854 sitios Web
Publicados, convirtiendo a la nternet en la
principal vitrina publicitaria e informativa en
el Mundo y al diseo de Sitios web, en una
de las principales actividades de desarrollo
en el rea de los sistemas.
Just|f|cac|n En el campo de la Tecnologa y la
ngeniera de Sistemas, es necesario que
los estudiantes lleven a la praxis los
conocimientos que reciben a lo largo de su
proceso acadmico, esta poltica de calidad
de la UNAD, se refleja en los cursos de tipo
metodolgico y terico practico que poseen
un porcentaje de su peso evaluativo para el
desarrollo del componente practico. Con lo
cual se garantiza un enfoque acadmico
completo e integral de formacin para el
estudiante de la modalidad a distancia.
|ntenc|ona||dades format|vas Propsitos:
4ue el estudiante fundamente de forma
practica la concepcin de la Programacin
basica (Html) para nternet
4ue el estudiante diferencie y decida sobre
las tecnologas de de diseo web a aplicar
en la solucin de problemas.
4ue el estudiante aplique tecnologas


emergentes de diseo de sitios web para
admnistracion de contenidos.
2EMHtivos
Promover la apropiacion de los
conocimientos bsicos en la programacin
para nternet, de forma practica en los
estudiantes.
Permitir a los estudiantes que de forma
procatica realicen la comprensin y
aprehensin de los conceptos propios de la
Programacin basica (html) para nternet.
Fomentar en el estudiante la investigacin y
la creatividad, caractersticas que deben
identificarlo en su entorno como ngeniero
Programador.
MHtas
dentificar las tecnologas basicas (html)
propias de la Programacin en nternet.
Reconocer la fundamentacin terica y
conceptual de la Programacin en
nternet
Podr tomar decisiones sobre la solucin
de problemas las cuales sern aplicadas
en el basto campo de nternet.
CompHtHQFias
El estudiante podr desarrollar Sitios Web
(html), que satisfagan las necesidades del
usuario.
El estudiante podr administrar y dar
mantenimiento a los WebSite
(WebMaster)
El estudiante podr evaluar Sitios Web y


dar recomendaciones concretas.

0enom|nac|n de pract|cas Prctica 1: ,QtroduFFiQ a HTML,
,mgHQHs, hipHrvQFulos, taElas
Practica 2: Formularios y MarFos HQ
HTML FoQ HoMas dH Hstilo CSS
Practica 3: Java SFript y CMS Joomla
Nmero de horas 12 Horas.
Porcentaje 30% (90 Puntos sobre / 300 correspondientes
al 60% de la ponderacin del curso)
6urso Eva|uado por proyecto 8|___ N0 X
8egur|dad |ndustr|a| No Aplica No se requiere.


. 0E86R|P6|0N 0E PRA6T|6A8

.1 PRA6T|6A No. 1 - |NTR00U66|0N A hTHL, |HACENE8, h|PERV|N6UL08, TALA8

Tipo de practica

Presencial Autodirigida Remota x
Otra Cul

Porcentaje de evaluacin 107
Horas de la practica 4 horas
Temticas de la prctica Un|dad 1 - CENERAL|0A0E8 0EL H00ELAH|ENT0 Y LA8
AR0U|TE6TURA8 wE
ntencionalidades
formativas
Propsito(s)
4ue el estudiante fundamente de forma practica la
concepcin de la Programacin basica (Html) para
nternet
2EMHtivo(s)
Permitir a los estudiantes que de forma procatica
realicen la comprensin y aprehensin de los
conceptos propios de la Programacin basica (html)
para nternet.
MHta(s)
El estduante, identificar las tecnologas basicas
(html) propias de la Programacin en nternet.
CompHtHQFia(s)
El estudiante podr desarrollar Sitios Web (html),
que satisfagan las necesidades del usuario

Fundamentac|n Ter|ca
Para la practica numero 1 se tendr en cuenta la teora propia de la construccin de sitios
web, el estudiante debe tener en cuenta los modelos de sitios Web para definir la


estructura y la navegabilidad de su sitio, adems se debe hacer una revisin de los
contenidos propios en el curso sobre el cdigo "Html para la creacin de pginas web,
ya que el Sitio Web a crear por el estudiante ser basado en este lenguaje de marcas de
hipertexto.es importante que el estudiante indague sobre la estructura bsica de una
pgina Html con su dos secciones principales Head y Body, para que desde all inicie con
la insercin de etiquetas Html segn como corresponda en cada una de estas secciones
de las pginas web que conformaran el sitio web.
0escr|pc|n de |a pract|ca
CrHar uQ Sitio WHE dH tipo HTML soErH la HoMa dH Vida dHl HstudiaQtH: este sitio se
crear con un mnimo de 5 (cinco) pginas Web, manipulando las etiquetas bsicas
como HTML, HEAD, TTLE, BODY en donde se aplican color de fondo color al texto,
imagen de fondo, las etiquetas H1 a H6, etiquetas de prrafo, etiquetas de texto, las
META. Listas ordenadas y listas desordenadas, color de texto. Adems se manipularan
imgenes, se crearan hipervnculos por medio de texto e imgenes, hacia las pginas
internas del Sitio y/o pginas de otros sitios web.
Recursos a ut|||zar en |a prct|ca (Equ|pos | |nstrumentos}
Un computador de escritorio o porttil con sistema operativo Windows o Linux con
conexin a internet.
8oftware a ut|||zar en |a prct|ca u otro t|po de requer|m|ento para e| desarro||o de |a prct|ca
Editores de texto: para Windows: Bloc de Notas y para Linux: editor Gedit, adems se
necesitara utilizar un navegador sea este Explorer, Mozilla o Crhome.
8egur|dad |ndustr|a|
No aplica para la prctica.
Hetodo|og|a
CoQoFimiHQto prHvio para Hl dHsarrollo dH la prFtiFa: El estudiante debe hacer una
revisin de la literatura referente a los modelos y tipos de sitios web, navegabilidad para
los sitios web y literatura referente al lenguaje Html.

Forma dH traEaMo: la prctica se desarrollar de forma individual por parte del
estudiante, para esto se prestar una asesora por parte del tutor en forma de tutora
Virtual por medio de la herramienta Web conferencia de la UNAD u otras herramientas de
web conferencia existentes para dar indicaciones precisas y una explicacin detallada
sobre el desarrollo de la prctica.

Dado esto, no se contempla un atuendo en especfico solo se sugiere contemplar las
normas de uso de salas de cmputo de la UNAD y protocolos de web conferencia. Ya
que la prctica se desarrollara de forma remota y los estudiantes podran hacer uso de la
sala para asistir a la web conferencia, desarrollar su prctica y subir sus productos finales


al curso para ser evaluados. Dado el nivel de apropiacin que puede tener un estudiante
sobre los temas tratado en la prctica este puede si es su deseo realizar la prctica de
forma individual desde su hogar o lugar de estudio.

ProFHdimiHQto: para el desarrollo de la presente prctica el estudiante deber participar
de la tutora virtual mediante web conferencia que se realizara por parte del tutor del
curso para orientar el laboratorio.
Adems el estudiante contar con una OVA denominada "DisHxaQdo uQ sitio wHE FoQ
Html, la cual explicara de forma clara y especfica el proceso de construccin de una
pgina web de tipo Html con el uso del programa Bloc de Notas ara Windows y Gedit
para Linux. El procedimiento de desarrollo de la prctica, consiste en crear un documento
vacio con los editores Bloc de Notas para Windows o Gedit para Linux y nombrar al
archivo como index.html, esto se har para crear la pagina principal del sitio de la hoja de
vida del estudiante, despus se proceder a hacer la insercin de etiquetas para crear el
diseo y contenidos del Sitio, como se mencionar anteriormente, el procedimiento
completo de la practica estar desarrollado por completo en la OVA, "DisHxaQdo uQ
sitio wHE FoQ Html y se desarrollar tambin en la tutora virtual del curso programada
para esta prctica de laboratorio. La cual ser grabada posteriormente y podr ser
consultada tambin por los estudiantes.
8|stema de Eva|uac|n
La prctica se define como un tem de tipo individual de los trabajos colaborativos del
Curso, por ende su calificacin se presenta como un tem de calificacin en la rbrica de
evaluacin del Trabajo Colaborativo No. 1
|nforme o productos a entregar
El producto a entregar ser un sitio web "html con la hoja de vida del estudiante, este se
entregara dentro de los aportes que cada estudiante hace para el trabajo colaborativo 1
en el foro de la actividad, segn los parmetros de la presente gua.
Rbr|ca de eva|uac|n
La rbrica de evaluacin de la practica se encontrara como un tem de valoracin de la
rbrica de evaluacin del trabajo colaborativo No. 1 y contemplara los siguientes tems
que se definirn en la parte final del presente documento.
Retroa||mentac|n
El estudiante deber ser retroalimentado en un tiempo no mayor a 8 das despus de
haber cerrado el trabajo colaborativo 1 en el aula virtual, esta retroalimentacin se
encontrara en el espacio de calificacin tipo tarea donde se asigna la calificacin del
trabajo colaborativo No. 1.


.2 PRA6T|6A No. 2 - Formu|ar|os y Harcos en hTHL con hojas de est||o 688

Tipo de practica


Temticas de la prctica Un|dad 2: V|N6UL08, U80UE0A8 T|P0CRAF|A PARA EL
0|8EN0 wE
ntencionalidades
formativas
Propsitos
4ue el estuduante conozca e interiorise de forma
practica, sobre la estructura de las hojas de estilo
CSS y su aplicacin en las paginas y sitios web.
2EMHtivos
Permitir que el estudiuante del curso diseo de sitios
web, manipule y utilice hojas de estilo CSS para
administrar los aspectos de diseo y presentacion de
un sitio o pagina web.
MHtas
El estudiante identificara y manipualara con exito los
principales componentes de las hojas de estilo CSS
para ser aplicados en paginas web.
CompHtHQFias
El estudiante creara hojas de estilo CSS y las
vinculara a pginas web para configurar de forma
general aspectos de diseo y presentacin de la
pgina.

En el desarrollo de esta prctica, el estudiante debe interiorizar en el manejo de las hojas
de estilo CSS, deber consultar la estructura de una hoja de estilo para cnfigurar ttulos,
prrafos, fuentes, colores y fondos entre otras caractersticas del componente de diseo
y presentacin de una pgina Web, a su vez deber indagar sobre las formas de vincular


estas hojas de estilo a una pgina web de tipo html.
El estudiante Creara un sitio web HTML de 4 pginas sobre una "Tienda Deportiva en
este se deben aplicar Marcos o Frames para dividir las pginas del Sitio. Debe existir
una pgina con un formulario de solicitud de cotizaciones en lnea el cual use la funcin
Mailto (para crear el formulario se deben usar los objetos relacionados en la descripcin
de la practica), adems se deben crear dos hojas de estilo, una para el home o pgina
principal del sitio y otra para las dems paginas del sitio de la Tienda Deportiva.
El estudiante debe tener en cuenta que las paginas a crear para el sitio de la tienda
deportiva deben contemplar la utilizacin de formularios adems de crear encuestas que
manipulen TEXT, RADO, CHECKED, LSTAS, BOTONES, SUBMT, RESET, creando
para estas tambin hojas de estilo para la manipulacin de ttulos principales, subttulos,
texto, tablas, formularios.
Un computador de escritorio o porttil con sistema operativo Windows o Linux
8oftware a ut|||zar en |a pract|ca
necesitara utilizar un navegador sea este Explorer, Mozilla o Crhome.
Hetodo|og|a
CoQoFimiHQto prHvio para Hl dHsarrollo dH la prFtiFa: El estudiante debe realizar una
revisin bibliogrfica previa sobre el manejo y utilizacin de las hojas de estilo CSS.

Forma dH traEaMo: la prctica se desarrollar de forma individual por parte del
estudiante, para esto se prestar una asesora por parte del tutor en forma de tutora
Virtual por medio de la herramienta Web conferencia de la UNAD u otras herramientas de
web conferencia existentes para dar indicaciones precisas y una explicacin detallada
sobre el desarrollo de la prctica.


curso para orientar la prctica de laboratorio No. 2.


Adems el estudiante contar con una OVA denominada "HoMas dH Hstilo CSS, la cual
explicara de forma clara y especfica el proceso de construccin de Hoja de estilos CSS
con el uso del programa Bloc de Notas para Windows, Gedit para Linux y Dreamweaver
para Windows y Linux.
El procedimiento completo de la prctica estar desarrollado por completo en la OVA,
"HoMas dH Hstilo CSS y se desarrollar tambin en la tutora virtual del curso
programada para esta prctica de laboratorio. La cual ser grabada posteriormente y
podr ser consultada tambin por los estudiantes.
El producto a entregar ser un sitio web "html sobre una tienda deportiva, donde se
apliquen hojas de estilo CSS y Marcos, este sitio se debe crear con base a las
caractersticas resaltadas en la caracterizacin de la prctica No. 2 del presente
documento.
Rbr|ca de eva|uac|n
Retroa||mentac|n


.3 PRA6T|6A No. 3 - Java 8cr|pt y 6H8 Joom|a

Tipo de practica


Temticas de la prctica Un|dad 3 - TE6N0L0C|A8 wE
ntencionalidades
formativas
Propsitos
Objetivos
Metas
Competencias

Para esta prctica el estudiante debe documentarse sobre las tecnologas emergentes de
gestin de contenidos Web CMS en especial la plataforma Joomla, adems deber
revisar informacin y contenidos sobre la creacin de scripts de Java, para programar
objetos y acciones en porciones de cdigo que se pueden incluir en pginas web Html.
El estudiante creara un Sitio Web de noticias en Joomla el cual debe contener:

O Tres secciones (Noticias Clasificados Videos)

O Seis categoras ( 4 para noticias, 1 para clasificados y 1 para videos)

O Seis artculos (uno por cada categora, en la seccin de clasificados se sebe
enlazar una pgina externa de clasificados de su ciudad de origen. La seccin de
videos debe tener 4 videos relacionados con cada artculo de noticias publicado.

O Se debe crear una pgina embebida con un formulario de compra en lnea de
pauta de clasificados en Java Script para que valide la insercin de datos de tipo
numrico y carcter segn corresponda.
O Se debe crear un artculo adicional donde se consignar el informe de la prctica

de cada estudiante, este debe tener una descripcin de la actividad que realizo,
conclusiones y una reflexin final sobre el uso de Joomla y Java Script.


Un computador de escritorio o porttil con sistema operativo Windows o Linux
8oftware a ut|||zar en |a pract|ca
necesitara utilizar un navegador sea este Explorer, Mozilla o Crhome. Servidor web
Apache o Xammp y Plataforma Java 6.0 o superior
Hetodo|og|a
CoQoFimiHQto prHvio para Hl dHsarrollo dH la prFtiFa: el estudiante debe indagar
previamente sobre la instalacin y configuracin de sitios web con el CMS Joomla,
adems de conocer la estructura bsica de un script de Java para pginas web.

Forma dH traEaMo: la prctica se desarrollar de forma Grupal por parte de cada
pequeo grupo colaborativo, para esto se prestar una asesora por parte del tutor en
forma de tutora Virtual por medio de la herramienta Web conferencia de la UNAD u otras
herramientas de web conferencia existentes para dar indicaciones precisas y una
explicacin detallada sobre el desarrollo de la prctica No. 3.


curso para orientar la prctica de laboratorio No. 3.
Adems el estudiante contar con una OVA denominada "2VA Cms Joomla 2010, la
cual explicara de forma clara y especfica el proceso de instalacin del CMS Joomla en
un servidor web local y remoto, adems de mostrar la forma de configurar y publicar
contenidos en el sitio.
El procedimiento completo de la prctica estar desarrollado por completo en la OVA,
"2VA Cms Joomla 2010 y se desarrollar tambin en la tutora virtual del curso
programada para esta prctica de laboratorio. La cual ser grabada posteriormente y
podr ser consultada tambin por los estudiantes.


El producto a entregar ser un sitio web de noticias creado con el CMS de Joomla, el
cual debe estar alojado en un hosting gratuito en la nternet el cual se definir por el tutor
del curso.
Rbr|ca de eva|uac|n
Retroa||mentac|n


7. FUENTE8 006UHENTALE8
DSEO DE STOS WEB. Manual de referencia. Thomas a. Powell. McGraw Hill
EL PROCESO UNFCADO DE DESARROLLO DE SOFTWARE. Jacobson,
Booch and Rumbaugh. Editorial Addison Wesley.
Diseo de sitios Web. Manual de referencia. Thomas A. Powell, Editorial McGraw
Hill.
XML, Elizabeth Castro. Editorial Prentice Hall.
Active Server Pages 3.0. Serie Prctica. Nicholas Chase.
Programacin de Active Server Pages. Scott Hillier and Daniel Mezick. Editorial
McGraw Hill Microsoft Press.
Administracin de S 5. Gerry O'Brien. Editorial Prentice Hall.
Artculos sobre diseo Web. http://www.Webdesignref.com/
www.desarrolloWeb.com
Sitio de consulta: www.laWebdelprogramador.com
http://es.wikipedia.org/wiki/Cms
http://www.cmsenespanol.com/
http://www.difundefirefox.com/que-es-un-feed-rss-y-como-usarlo
http://www.mambohispano.org/
http://www.mambohispano.org/Especiales/Newbie/%BF4u%E9_es_Mambo?/
http://es.wikipedia.org/wiki/Joomla!#Historia_del_proyecto
http://www.nosolocodigo.com/tutorial-crear-plugins-joomla-15
http://www.solojoomla.com/
http://www.aulablog.com/planeta/node/26636


8. RUR|6A 0E EVALUA6|0N 0E LA8 PRA6T|6A8
Rubr|ca de eva|uac|n Prct|cas de Laborator|o

|tem Eva|uado Va|orac|n Va|orac|n Hed|a Va|orac|n A|ta Hx|mo
aja Puntaje
Redaccin y
ortografa
El documento
Presenta
deficiencias en
redaccin y
errores
Ortogrficos.
(Puntos = 0}
El documento final
no pose errores de
Ortografa, pero el
documento si
presenta una
mediana articulacin
de las ideas y la
estructura de los
Prrafos.

(Puntos = 3}
En el documento
posee la redaccin
es excelente, las
ideas estn
correlacionadas, y
el cuerpo del texto
es coherente en su
Totalidad.
(Puntos =5}
Entrega de la
practica por
parte del
estudiante
El estudiante no
presenta la prctica
de laboratorio

(Puntos = 0}

No ap||ca
El estudiante
presenta la prctica
de laboratorio de
acuerdo a la agenda
del curso

(Puntos =5}

5
Calidad de la
prctica de
laboratorio
La prctica que
presenta el
estudiante no
cumple con
ninguno de los
requerimientos ni
parmetros de la
Gua de la
actividad.

(Puntos = 0}
La prctica que
presenta el
estudiante tan solo
cumple con la mitad
de los
requerimientos y
parmetros de la
Gua de la
actividad.

(Puntos = 10}

La prctica del
estudiante cumple
con todos los
requerimientos y
parmetros de la
gua de la actividad.

(Puntos = 20}

20
T0TAL 0E PUNT08 P08|LE8 30

DISEÑO DE SITIOS WEB - PDF LOBORATORIO

Încărcat de

Informații document

Titlu original

Drepturi de autor

Formate disponibile

Partajați acest document

Partajați sau inserați document

Opțiuni de partajare

Vi se pare util acest document?

Este necorespunzător acest conținut?

Drepturi de autor:

Formate disponibile

DISEÑO DE SITIOS WEB - PDF LOBORATORIO

Încărcat de

Drepturi de autor:

Formate disponibile

UNIVLkSIDAD NACICNAL A8ILk1A A DIS1ANCIA UNAD

LSCuLLA uL ClLnClAS 8ASlCAS 1LCnCLCClA L lnCLnlL8lA

O Se debe crear un artculo adicional donde se consignar el informe de la prctica

T0TAL 0E PUNT08 P08|LE8 30

S-ar putea să vă placă și