Curso
de Programación I
Programación Basada en Objetos
Manual
del Navegación
Elaborado por:
Diseño de contenido: MSc. Edgar Casasola Murillo
Diseño curricular: MSc. Melvin Chaves Duarte
Diseño gráfico: Bach. Jorge Villalobos Sancho
Página de
contenido de un tema
El eje central del material didáctico
del Curso I de Programación es el material interactivo en formato digital que
es entregado al estudiante. Éste contiene los contenidos completos del curso,
junto con ejemplos, ejercicios, referencias e incluso lo necesario para montar
un ambiente de desarrollo adecuado.
Este manual pretende guiar al estudiante
respecto al uso de este material digital, para que éste se familiarice con su
navegabilidad y funcionalidad.
Los requerimientos técnicos para poder
utilizar este material es tener un navegador gráfico de páginas Web y un
sistema operativo que lo soporte. Se recomienda una resolución mínima de
800x600 y un CD-ROM de alta velocidad (alternativamente se podría copiar el
material completo al disco duro, el cual requeriría 60 Mb. de espacio libre).
Con el fin de garantizar portabilidad,
escalabilidad, y facilidad de uso, el material completo para este curso está
hecho en formato HTML, el lenguaje más popular y generalizado para la
construcción de sitios Web.
Este material se puede obtener en un
CD-ROM, o a través de algún sitio en Internet. En cualquiera de ambos casos, el
punto de arranque es el archivo index.html
que se encuentra en la raíz del material. La versión CD-ROM abre este archivo
con el navegador de Internet al insertar el disco en la unidad.
Uno de los esfuerzos más grandes
invertidos en este material fue el de mantener la consistencia en su apariencia
a través de sus múltiples partes. De esta manera la navegación se simplifica
considerablemente y la presentación del material no obstruye el proceso de
aprendizaje.
Todas las páginas del material tienen la
siguiente apariencia:
Se pueden distinguir fácilmente las
siguientes secciones:
·
La sección de título contiene
dos elementos: el nombre del curso en la esquina superior izquierda y el título
del documento / material presentado, que aparece centrado en letra grande.
·
La sección de menú es la
columna vertebral del material. Este menú es un índice que contiene todos los
elementos del material del curso, agrupados y ordenados de manera lógica y
fácil de encontrar. El manejo del menú se detalla en la próxima sección.
·
La sección de contenido muestra
el documento / material elegido actualmente. Esta es la sección principal de la
página.
·
La sección de pie de página
contiene información sobre los autores y un vínculo hacia la página de
créditos, que muestra una lista detalla de todos los que contribuyeron con la
elaboración del material. Esta página también se puede acceder a través del
menú, con el elemento: “Autores y agradecimientos”.
El menú se muestra en la sección
izquierda de todas las páginas del material. Este permite acceder a cualquier
página o recurso del material por medio de una estructura de árbol similar a la
que utilizan muchos manejadores de archivos y carpetas, como el Windows Explorer
o el Nautilus de KDE.
Este menú fue elegido por la facilidad
de uso que ofrece:
·
Cada línea del menú puede ser
uno de dos elementos:
o
Un
documento, el cual se muestra junto al icono: .
o
Una
carpeta, la cual se muestra con los íconos: cuando
no está desplegada y
cuando
está desplegada.
·
Al hacer clic sobre un
documento, el navegador cambia hacia la página que corresponda, el menú
mantiene su estado, y además resalta el elemento elegido. En las imágenes
mostradas anteriormente se puede apreciar que el elemento “Plan del curso” está
resaltado, dado que ese es el documento que se está mostrando.
·
Hacer clic sobre una carpeta no
produce ningún efecto. Las carpetas no están asociadas a ninguna página, sino
que agrupan documentos y otras carpetas. Para mostrar el contenido de una
carpeta se debe presionar el símbolo de que aparece a la izquierda de la misma. Para
ocultar su contenido se presiona el símbolo de
que aparece en su lugar.
·
La sección de Materiales en el
menú no contiene páginas HTML, sino que contiene archivos, pero igualmente se
muestran como documentos. Al hacer clic en estos elementos aparece la opción de
descargarlos desde su fuente, al igual que se hace en los sitios de Internet.
Con estas indicaciones se puede navegar
todo el material del curso de manera general. La estructura general de todas
las páginas es igual y se navega de la manera establecida. Nótese que la única
sección verdaderamente variable es la sección de contenido, ya que ésta es la
muestra el contenido de cada documento / material. En el siguiente apartado se
muestra la manera en que se estructura la sección de contenido para ciertos
casos particulares importantes.
Cada tema del curso tiene una página de
contenido asociada. Estas páginas de contenido muestran los aspectos teóricos
de cada tema, en formato de presentación con diapositivas. El contenido de los
temas es creado con Microsoft PowerPoint y luego es generado automáticamente a
formato Web. Una página de contenido tiene la siguiente apariencia:
Se pueden distinguir fácilmente las
siguientes secciones:
· La sección de esquema muestra 3 elementos. El elemento de mayor tamaño es el esquema mismo, que muestra cada uno de las diapositivas dentro del contenido a modo de índice. Se puede navegar a cualquier diapositiva individual haciendo clic en el título que corresponda. Este esquema se puede ocultar y volver a mostrar con el botón Esquema, que se ubica en la esquina inferior izquierda. En la esquina inferior derecha se encuentra el botón de Expandir o contraer esquema. Este solo funciona cuando el esquema está visible. Al ser presionado muestra o esconde en el esquema el contenido textual de cada uno de las diapositivas del contenido. Por defecto solo se muestra el título de cada una.
· La sección de presentación muestra la diapositiva seleccionada actualmente.
· La sección de navegación permite la navegación a través del contenido de manera secuencial. En la parte izquierda se muestra el número de diapositiva actual y dos botones para avanzar o retroceder en la presentación. A la derecha se muestra el botón Presentación, que permite ver la presentación en pantalla completa. Para avanzar en la presentación presione la barra espaciadora o haga clic con el ratón, para retroceder presione la tecla BACKSPACE (borrado) y para finalizar presione ESC (escape). Alternativamente se puede hacer clic derecho en la presentación para realizar cualquiera de las 3 acciones mencionadas.
Algunas diapositivas del material
contienen hipervínculos hacia recursos dentro o fuera del material del curso.
Todos los hipervínculos dentro de diapositivas abren ventanas nuevas del
navegador, así que no debe haber preocupación respecto a perder el hilo de la
presentación. Al terminar de ver la nueva página abierta, basta con cerrar o
minimizar la ventana para continuar con la lectura del contenido. Es importante
señalar que tener muchas ventanas abiertas puede bajar el desempeño del equipo
o causar confusión, así que se recomienda cerrar aquellas ventanas que ya no se
requieren, especialmente aquellas que están dentro del material y se pueden
hallar en el menú, como veremos en el caso siguiente.
Estas páginas muestran uno de tres elementos: un ejemplo, un ejercicio o una tarea programada.
Se puede llegar a este tipo de páginas por dos medios distintos: por medio del menú de navegación principal o por medio de un vínculo desde una diapositiva del material. El segundo es el más común, dado que los ejemplos y ejercicios van apareciendo conforme se va profundizando en el contenido, y todos los ejemplos y ejercicios tienen una referencia en el contenido del tema que le corresponde. La tarea programada es la única que solamente se puede acceder por medio del menú.
Una página de este tipo se ve de la siguiente manera:
Se pueden apreciar dos secciones
distintas en esta página: el contenido de la sub-sección y un menú de
navegación superior.
Algunos de los ejercicios / ejemplos /
tareas programadas se decomponen en 5 etapas y cada una de ellas se traduce en
una sub-sección (una sub-página) de los mismos. Estas 5 etapas corresponden al
ciclo de desarrollo de software, el cual es explicado al inicio del Tema 1.
Éstas son: Problema, Análisis, Diseño, Implementación y Prueba.
Cada una de las etapas es identificada
con un color distinto: verde para el Problema, rojo para el análisis, azul para
el diseño, naranja para la implementación y café para la prueba. Estos colores
se pueden apreciar en las flechas que indican cada etapa y en el borde que se
ve a la izquierda del contenido. Dos formas sencillas de saber qué sub-sección
se está leyendo son: ver el color del borde izquierdo o ver cuál de las flechas
es más “blanca”. Véase en la imagen que la flecha de Problema está “blanca”, mientras
que las restantes está “rellenas”. Cuál flecha está blanca depende de la etapa
actual.
Para navegar por el ciclo de desarrollo
de un ejemplo / ejercicio / tarea programada particular se tiene dos
alternativas:
1. Hacer click en la flecha de la navegación superior. De esta manera se puede mover de cualquier sub-página a cualquier otra sub-página.
2.
Hacer click en los
hipervínculos ubicados a la derecha de las flechas. El vínculo superior permite
pasar a la etapa anterior del ciclo, mientras que el vínculo inferior permite
pasar a la etapa siguiente.