contenidos de computacion basica 2

157
Bienvenida ¡Hola! nuevamente nos encontramos juntos y eso es motivo para estar contentos por el esfuerzo y dedicación que ofreces a tus estudios. Además, creemos que lograste establecer relaciones de amistad y laborales con tus compañeros del bachillerato; y también de eso se trata. Vive, disfruta y aprende en este espacio virtual que hemos diseñado para ti. Ahora conoces como funcionan la educación a distancia: manejas la plataforma e identificas la estructura de las unidades y tu área de trabajo, sabes a quién dirigirte, cómo realizar tus actividades, reconoces los espacios para la comunicación, cuentas con tus asesores y tutores. La unidad de aprendizaje Computación básica II te proporcionará elementos sencillos para que utilices la hoja de cálculo de Excel. También aprenderás sobre la elaboración de páginas Web para que sigas conectado en este mundo de la información y la tecnología. ¡Bienvenido!

Upload: samm-rivera

Post on 26-Jul-2015

320 views

Category:

Documents


12 download

TRANSCRIPT

Page 1: Contenidos de Computacion Basica 2

Bienvenida

¡Hola! nuevamente nos encontramos juntos y eso es motivo para estar contentos por el esfuerzo y dedicación que ofreces a tus estudios. Además, creemos que lograste establecer relaciones de amistad y laborales con tus compañeros del bachillerato; y también de eso se trata. Vive, disfruta y aprende en este espacio virtual que hemos diseñado para ti.

Ahora conoces como funcionan la educación a distancia: manejas la plataforma e identificas la estructura de las unidades y tu área de trabajo, sabes a quién dirigirte, cómo realizar tus actividades, reconoces los espacios para la comunicación, cuentas con tus asesores y tutores.

La unidad de aprendizaje Computación básica II te proporcionará elementos sencillos para que utilices la hoja de cálculo de Excel. También aprenderás sobre la elaboración de páginas Web para que sigas conectado en este mundo de la información y la tecnología.

¡Bienvenido!

Competencia General

¿Qué aprenderé?

Page 2: Contenidos de Computacion Basica 2

Computación Básica II está diseñada para que desarrolles las siguientes competencias de aprendizaje

Contenido temático de la Unidad de Aprendizaje

Unidad 1 Hoja electrónica de cálculo

1.1 Diseño y formato de hoja y tabla

1.2 Uso de fórmulas, funciones y gráficas de información

Unidad 2 Creación de páginas Web

2.1 Definición y características de las páginas Web

2.2 Página Web con HTML

2.3 Páginas Web con el editor NVU

Page 3: Contenidos de Computacion Basica 2

Metodología

“Consejos para estudiar Computación Básica II”

Ahora que inicias el estudio de Computación Básica II de seguro algunas de tus dudas estarán relacionadas con: ¿cómo aprenderé a utilizar la hoja de cálculo de Excel? y ¿la creación de páginas Web? Pero eso es normal, debido a que son temas que requieren de empeño, dedicación y sobre todo práctica para lograr un mejor aprendizaje.

La Unidad de aprendizaje está desarrollada a partir de la explicación de los procedimientos, la información se apoya en imágenes, audio y animaciones que te permitan comprender y practicar lo aprendido.

A continuación desarrollamos para ti los siguientes consejos:

Consejo 1. Lee con atención y toma nota del contenido que conforma a la Unidad de Aprendizaje, en ella encontrarás una explicación de cada uno de los componentes y recursos, tanto de la Hoja de cálculo como de la Página Web.

Consejo 2. A través de una revisión detallada lograrás comprender los procedimientos para trabajar, tanto en la hoja de cálculo como para la creación de páginas Web. Esta acción la puedes realizar cada vez que tengas duda.

Consejo 3. Localiza los espacios de comunicación, ya sean los foros Académicos o el de Novedades para que expreses tu duda o, a su vez, retomes la retroalimentación proporcionada a otros compañeros.

Consejo 4. Revisa y ten a la mano tú Guía del Estudiante, ya que en ella se explica como usar el Editor para elaborar páginas Web.

Consejo 5. Ten siempre visible la Agenda de actividades para que no te atrases en la entrega de tus evidencias de aprendizaje.

Consejo 6. Avisa a tu asesor y/o tutor sobre los obstáculos que encuentres durante tu estudio, es decir, avísale si se te complica entregar una tarea, si no logras visualizar el recurso, entre otras más, para que no se afecte tu desempeño.

En la unidad I de Computación Básica II primero conocerás cómo está diseñada la hoja de cálculo, después te enseñaremos el uso de las fórmulas y funciones que puedes utilizar, así como también te mostraremos la manera en la que puedes graficar información y, finalmente, administrar datos.

Page 4: Contenidos de Computacion Basica 2

Contarás con actividades de autoevaluación y una actividad integradora para que con ellas apliques lo aprendido. A continuación, te presentamos el mapa conceptual de la unidad de aprendizaje para que conozcas de forma general los conceptos que la conforman.

Después de revisarlo, comencemos a dar lectura al tema 1 de la presente unidad.

Introducción

Comenzaremos con explicarte el tema de la hoja electrónica de cálculo. No tienes que preocuparte, si ya manejas el procesador de textos o las presentaciones electrónicas, el uso de este programa te será familiar. Lo maravilloso de este software es que facilita nuestra actividad diaria (escuela, trabajo e, incluso, asuntos del hogar), pues sólo introduciendo fórmulas podrás calcular desde sumas, restas, multiplicaciones y divisiones, hasta fórmulas complejas para llevar a cabo diversas actividades, por ejemplo: una declaración de impuestos. No importa que te equivoques, ya que esta aplicación te lleva de la mano para realizar correctamente tus cálculos. Contarás con el Foro "Mi experiencia con Excel" que estará abierto durante el estudio de la Unidad I, participa, retroalimenta a tus compañeros y deja que ellos hagan lo mismo contigo.

Para que conozcas este programa, primero te proporcionaremos una definición y después te explicaremos paso a paso algunas de las funciones y reglas para su operación.

¡Recuerda que también cuentas con el apoyo de tu asesor y tutor para el estudio de tu unidad de aprendizaje!

Page 5: Contenidos de Computacion Basica 2

Lo característico de la hoja electrónica de cálculo es que el área de trabajo es una hoja de papel cuadriculado compuesta de filas y columnas, a esta hoja la llamaremos matriz, y por lo tanto la definiremos como: "una aplicación diseñada para la gestión de datos numéricos", es decir, para la realización de operaciones matemáticas y de todo tipo.

¡Comencemos!

La forma más sencilla en la que puedes ingresar a este programa es la siguiente:

Situarse sobre el botón de Inicio de la barra de tareas, pulsar el botón izquierdo del ratón. Se despliega el menú de Todos los programas y damos clic sobre la opción Microsoft Office, localizando la aplicación de Microsoft Excel.

Si ya empleamos recientemente este software, después del botón inicio lo localizamos en el panel izquierdo.

Si en el escritorio se encuentra el icono de acceso directo del programa hacemos doble clic sobre él.

Imagen 1. Acceso a Excel

Una vez ejecutado el programa, se abre la pantalla de la hoja electrónica de cálculo, en la cual aparece un libro nuevo llamado Libro1, que contiene

Page 6: Contenidos de Computacion Basica 2

inicialmente tres hojas de cálculo (3 solapas o lengüetas en la parte inferior izquierda: Hoja1, Hoja2 y Hoja3).

NOTA. Es muy importante saber que cada libro que se utilice generará un archivo al ser guardado. Desde cada programa, los archivos generados se guardan en

disco con la extensión .xls

A partir de aquí comenzamos la descripción del área de trabajo. Cada fila se identifica mediante un número (1, 2, 3, etc.) y cada columna por una letra (a, b, c, d), por tanto, la Intersección de una fila y una columna la denominaremos Celda. Cuando queramos referirnos a una celda, tendremos que indicarla primero por la letra y después por el número, por ejemplo: si nos colocamos en la tercera columna (columna C) y cuarta fila (fila 4) es la celda C4 y se remarcará con una línea gruesa, pues es la Celda Activa (será incorrecto referirse a ella como 4C y es indistinto escribir en mayúsculas o en minúsculas dicha referencia). La siguiente sección denominada “Para saber más” contiene más

información con respecto a la Celda activa, si deseas conocerla pulsa la liga.

Page 7: Contenidos de Computacion Basica 2

Excel se caracteriza por los siguientes aspectos:

1. Las grandes dimensiones de sus hojas de cálculo. Cuenta con 65,536 filas y 256 columnas.

2. La agrupación de varias hojas de cálculo en un libro. Podríamos utilizar hasta 255 hojas por cada libro de trabajo.

3. Actualización automática de los resultados obtenidos en la hoja cuando son modificados los datos de los cuales dependen los resultados. No es preciso actualizarlos oprimiendo ninguna tecla.

Imagen 2. Celda activa

Page 8: Contenidos de Computacion Basica 2
Page 9: Contenidos de Computacion Basica 2

1.1 Diseño y formato de hoja y tabla

¿De qué elementos se compone la pantalla?

En la pantalla de la hoja electrónica de cálculo se distinguen dos ventanas, la ventana del programa (ventana principal) y la ventana del documento (dentro de la principal), que contiene el libro llamado Libro1. Ambas ventanas se podrán minimizar, maximizar, cerrar, desplazar, cambiar su tamaño, etc. de forma independiente, como cualquier otra ventana de Windows. Hay una tercera parte

Page 10: Contenidos de Computacion Basica 2

denominada Panel de tareas que puede estar visible o cerrada. Recuerda que esto lo aprendiste en Computación Básica 1.

Imagen 3. Ventanas de la hoja de cálculo

NOTA. La apariencia de la pantalla no necesariamente tiene que ser la que se observa en la primera figura mostrada, puede variar alguno de los elementos que componen su ventana principal como los botones en las barras, el panel de tareas o la sección de la hoja de trabajo, de esta forma el usuario puede personalizar el

programa a sus necesidades de trabajo.

A continuación, te presentamos los procedimientos básicos de la personalización de la pantalla.

Personalización de la pantalla

Las BarrasLas opciones que se encuentran a tu disposición se clasifican en barras:

De manera inicial siempre aparece la Barra de títulos, que identifica al programa en uso y el nombre del archivo; la Barra de menús, que agrupa las opciones que están disponibles por comandos; las Barras de herramientas, que agrupan iconos de acceso rápido estándar, y la Barra de herramientas de formato.

Page 11: Contenidos de Computacion Basica 2

Imagen 4. Barras de la hoja de cálculo

Personalizar las Barras

Un elemento importante es la Barra de fórmulas.

Podemos personalizar esta barra colocando en ella diferentes iconos de aquellos comandos que utilicemos de una manera más habitual (por ejemplo el icono de Autosuma) para facilitar el trabajo. De esa forma, siempre podremos disponer de las opciones que utilizamos frecuentemente de una manera rápida sin necesidad de tener que buscarlas en los diferentes comandos de la barra de menús.

Page 12: Contenidos de Computacion Basica 2

Da clic en la imagen para ampliarla.

Ubica el botón( ) que aparece en el lado derecho del título de la barra para ingresar a esta opción, la barra estándar mostrará los iconos disponibles indicando aquellos que ya están activados.

Page 13: Contenidos de Computacion Basica 2

NOTA. Recuerda que en el menú Ver, en Barras de herramientas, tenemos acceso a las barras disponibles, cada una de éstas con iconos que realizan una

función específica. Las barras mínimas necesarias son la estándar y la de formato.

La Barra de fórmulas y sus vistasLa Barra de fórmulas es el espacio en el que van a aparecer las expresiones (comúnmente operaciones) que introduzcamos en cada una de las celdas de nuestras hojas de cálculo, y donde será más sencillo realizar modificaciones de las mismas en caso de que sea necesario.

Esta Barra de fórmulas tiene dos secciones:

Page 14: Contenidos de Computacion Basica 2

Lo anterior nos permite identificar nuestra área de trabajo y los elementos que la componen, por lo que el tema no se acaba aquí, sino al contrario, lo retomaremos cuando revisemos el tema de las fórmulas. Mientras tanto, veamos qué tipos de datos puedes trabajar en la hoja de cálculo.

Tipos de datos

Los datos que se pueden introducir en una celda son de tres tipos: texto, números y fórmulas. Cada uno de los cuales se caracteriza por los siguientes aspectos:

TextoUn dato de tipo texto puede contener cualquier serie de caracteres (letras, números y símbolos), es decir, es de naturaleza alfanumérica y puede tener hasta un máximo de 32,000 caracteres.

Cualquier serie de números mezclados con otros caracteres, por ejemplo 98+56, se toman como un dato de tipo texto. Los textos más usuales son las palabras, los títulos, los rótulos y los letreros

NOTA. Un texto que no ocupe el ancho total de la celda queda alineado, a la izquierda de ésta.

Si el texto fuese demasiado largo, aparecería sobre las celdas de la derecha, si bien se encuentra contenido únicamente en la celda en la cual fue introducido. Puede ocurrir que si las celdas de la derecha están ocupadas, el texto introducido

Page 15: Contenidos de Computacion Basica 2

no se verá en la pantalla completa, pero sí lo veremos entero en la Barra de fórmulas. Para verlo entero, habría que dar más anchura a su columna.

Imagen 5. Tipo de texto

Page 16: Contenidos de Computacion Basica 2

Para modificar el alto de la fila o el ancho de la columna, empleamos el menú Formato Fila y Alto o Columna y Ancho, que nos lleva a una ventana donde podemos escribir directamente la medida en píxeles. Podemos modificar únicamente las dimensiones de la celda activa o de un grupo de celdas seleccionadas previamente.

Imagen 6. Alto y ancho de fila

Page 17: Contenidos de Computacion Basica 2
Page 18: Contenidos de Computacion Basica 2

NúmerosDentro de esta categoría se incluyen los números propiamente dichos, las fechas y horas, porcentajes, etc. Tratándose todos ellos por igual y quedando alineados a la derecha de la celda donde se introducen.

Un número que no ocupe el ancho total de la celda se sitúa, por defecto, alineado a la derecha de la misma. Si el número fuese más largo que el ancho de la celda, aparecerá automáticamente en formato científico o de potencias de base 10. Por ejemplo, al introducir el número 266410566056 en una celda, éste aparecerá como 2,66410E+11, es decir, 2,66410 por 1011.

La visualización de los números en la barra de fórmulas siempre será en formato estándar, independientemente de cómo aparezcan en la celda. Más tarde estudiaremos otros formatos.

Imagen 7. Número en la celda

Page 19: Contenidos de Computacion Basica 2

NOTA. Se puede emplear el punto o la coma para el símbolo decimal o para el símbolo de separación de miles, tomando en cuenta los símbolos que estén

seleccionados en el botón Inicio, Panel de control en configuración regional y de idioma:

Page 20: Contenidos de Computacion Basica 2
Page 21: Contenidos de Computacion Basica 2

FórmulasLas fórmulas permiten realizar cálculos más o menos complejos con los datos introducidos en la hoja de cálculo.

Cuadro 1. Tipos de fórmulas

Page 22: Contenidos de Computacion Basica 2

Hasta este momento sólo has manejado fórmulas explícitas en tus cálculos aritméticos o matemáticos, en donde utilizas datos numéricos, pero también existen las fórmulas implícitas que además de datos numéricos emplean otros elementos (palabras, símbolos, rangos). Una fórmula admite un máximo de 1.024 caracteres y habitualmente está compuesta por números, operadores y direcciones (referencias) de celdas. También se podrán introducir funciones (fórmulas que ya vienen predeterminadas con Excel).

Page 23: Contenidos de Computacion Basica 2
Page 24: Contenidos de Computacion Basica 2

Los operadores utilizados en la creación de fórmulas son los siguientes:

Cuadro 2. Operadores

El orden de prioridad o preferencia de los operadores disminuye de arriba a abajo en la tabla anterior, es decir, si en una misma fórmula existe un operador de suma y otro de multiplicación, primero se efectúa la multiplicación y luego la suma. Si varios operadores en una fórmula tienen igual preferencia, éstos se evalúan en el orden en que se encuentren, de izquierda a derecha dentro de la fórmula. Para alterar el orden de evaluación de los operadores en una fórmula, se puede hacer uso de los paréntesis.

Page 25: Contenidos de Computacion Basica 2

Después de explicarte las fórmulas y los tipos de información que se pueden escribir en una hoja de cálculo, te recomendamos que revises los siguientes consejos.

Consejo: Siempre que escribamos una fórmula con más de una operación, es importante usar los paréntesis para evitar posibles errores de prioridades. Hay que tener cuidado de cerrar todos los paréntesis que abramos.

MUY IMPORTANTE: Todas las fórmulas han de comenzar con el signo igual (hay usuarios que las comienzan con el signo + del teclado numérico de la

derecha del teclado -esta forma también es válida- porque están acostumbrados a trabajar con él), de lo contrario Excel las interpretará como texto.

Por ejemplo, la fórmula B5+B8 está mal y sería considerada como una palabra que comienza por la letra B. Debería ser escrita =B5+B8. Las referencias a celdas en las fórmulas podemos escribirlas en mayúsculas o minúsculas indistintamente.

Los textos y fechas dentro de las fórmulas deben ir entre comillas.

A continuación recordaremos, mediante algunos ejemplos, las operaciones básicas que son necesarias para el trabajo en la Hoja electrónica de cálculo. En el tema 1.2 verás con mayor detenimiento el uso de fórmulas y funciones para la realización de algún trabajo.

Page 26: Contenidos de Computacion Basica 2

El ejemplo que retomaremos será el cálculo de salario de cuatro trabajadores, para ello multiplicamos el número de días trabajados y el sueldo que percibe por día cada trabajador. Veamos la siguiente imagen.

Imagen 8. Multiplicación

Si la fórmula es la correcta al dar ENTER en la celda D2 visualizaremos el resultado de la operación y en la barra de fórmulas tenemos la estructura de la fórmula empleada.

Si necesitamos saber cuántos artículos se vendieron en el primer cuatrimestre del año entonces necesitamos sumar las cantidades registradas. Necesitamos los nombres de los artículos y las cantidades vendidas en cada mes:

Page 27: Contenidos de Computacion Basica 2

Para realizar un autollenado revisa el tutorial que a continuación se te presenta. Si ya sabes realizar dicha acción, continúa leyendo el contenido.

http://148.204.103.140/moodle/file.php/311/moddata/scorm/1892/captivates/autollenado/autollenado_demo.htm

Autollenado

Page 28: Contenidos de Computacion Basica 2

Diapositiva 1

Diapositiva 2

Page 29: Contenidos de Computacion Basica 2

Diapositiva 3

Diapositiva 4

Page 30: Contenidos de Computacion Basica 2

Diapositiva 5

La fórmula inicia con el signo igual y dando clic en la primer celda que necesitamos sumar inmediatamente

después colocamos el signo de suma (+), seleccionamos la siguiente celda, colocamos el signo de suma (+)

y así sucesivamente hasta seleccionar todas las celdas que serán sumadas.

Imagen 9. Suma

Page 31: Contenidos de Computacion Basica 2

Para la división:

Pensemos que en el lugar donde están los trabajadores se requiere pintar una superficie, para ello debemos

emplear resultados de fórmulas para ser utilizados en otras.

Un bote de pintura cubre una superficie de 5 m2.

Page 32: Contenidos de Computacion Basica 2

El resultado del cálculo de la superficie ubicado en la celda C4 se emplea para obtener cuantos botes se

necesitan para pintar la superficie, iniciamos con el signo igual, seleccionamos la celda donde está el dato de

la superficie, el signo de división (/) y seleccionamos la celda donde aparece el dato numérico 5.

Imagen 10. División

Page 33: Contenidos de Computacion Basica 2

Si seleccionamos la celda donde tenemos texto, el resultado de la operación será marcado como error:

Si la fórmula es correcta en la celda aparece el resultado de la operación:

Page 34: Contenidos de Computacion Basica 2

Para utilizar una resta es importante recordar que el minuendo debe ser mayor que el sustraendo para

obtener un valor positivo, en esta operación se requieren dos valores:

En la empresa hay en bodega registrados una cantidad de productos y nos reportan las ventas del primer

trimestre, cual es la cantidad actual de productos:

Imagen 11. Resta

Page 35: Contenidos de Computacion Basica 2

Si los datos que se restan son varios hay que agruparlos para obtener un sólo resultado para ser restado al

dato mayor:

Page 36: Contenidos de Computacion Basica 2

Es necesario que tengas claro que los ejemplos que te presentamos anteriormente es

SOLAMENTE para que tengas una idea de cómo se trabajan las operaciones básicas en la

Hoja electrónica de cálculo. En el tema 1.2 está centrado en la explicación sobre las fórmulas y

funciones que se pueden utilizar en el programa, te invitamos a que revises con detenimiento el

Page 37: Contenidos de Computacion Basica 2

tema, mientras vayamos cerrando nuestro tema 1.

Consejo: Cuando en una fórmula queramos operar con un valor fijo, por ejemplo calcular un

descuento del 10% sobre un precio introducido en B5, evitaremos por todos los medios

introducir el 10% en la fórmula (=B5*10%), especificando en su lugar una celda de la hoja (por

ejemplo: C20) donde introduciremos el valor del 10%. Así la fórmula debería quedar: =B5*C20.

Ésta es la técnica correcta, ya que si deseamos cambiar el descuento a aplicar, en vez de tener

que modificar la fórmula, cambiaríamos simplemente el contenido de la celda C20.

Advertencia: Cuando en una celda el resultado numérico que exista (como el resultado de una fórmula, por ejemplo) se presente en la celda de esta manera: ############, no deberemos asustarnos. Es una manera que tiene Excel de comunicar que el resultado es tan ancho que no se puede visualizar entero por el ancho actual de esa celda y que, antes de mostrarnos un resultado de forma incompleta, presenta esos símbolos de almohadilla (#) para advertir que tenemos que ampliar el ancho de la columna en la que se encuentra esa celda. El ancho de una columna se puede cambiar desde la línea separadora que existe entre todas las columnas en la línea de títulos de columna (A B C D...).

A continuación te presentamos información que te será de ayuda para trabajar en la hoja de cálculo. Revisa y toma nota.

Para aprender más sobre la Hoja de Cálculo

http://148.204.103.140/moodle/file.php/311/moddata/scorm/1892/captivates/rangos/rangos_demo.htm

Rangos de demostración

Page 38: Contenidos de Computacion Basica 2

Diapositiva 1

Diapositiva 2

Page 39: Contenidos de Computacion Basica 2

Diapositiva 3

Diapositiva 4

Page 40: Contenidos de Computacion Basica 2

Diapositiva 5

Diapositiva 6

Page 41: Contenidos de Computacion Basica 2

Diapositiva 7

Diapositiva 8

Page 42: Contenidos de Computacion Basica 2

Diapositiva 9

Diapositiva 10

Page 43: Contenidos de Computacion Basica 2

Diapositiva 11

Page 44: Contenidos de Computacion Basica 2

Diapositiva 12

Diapositiva 13

Page 45: Contenidos de Computacion Basica 2

Diapositiva 14

Diapositiva 15

Page 46: Contenidos de Computacion Basica 2

Diapositiva 16

Diapositiva 17

Page 47: Contenidos de Computacion Basica 2

Diapositiva 18

Diapositiva 19

Page 48: Contenidos de Computacion Basica 2

Diapositiva 20

Page 49: Contenidos de Computacion Basica 2

Diapositiva 21

Diapositiva 22

Page 50: Contenidos de Computacion Basica 2

Diapositiva 23

Diapositiva 24

Page 51: Contenidos de Computacion Basica 2

Cada uno de los hipervínculos anteriores fue realizado con la intención de que recuerdes o aprendas, si es el caso, algunos de los pasos básicos para trabajar en la hoja electrónica de cálculo. Como has podido ver, algunas de las funciones son parecidas a las que usaste en el procesador de palabras o en presentaciones electrónicas.

Conclusión

En la hoja electrónica de cálculo puedes realizar actividades donde introduzcas información como textos, números y/o gráficos, sin embargo, lo más importante del uso de la misma es el manejo de las fórmulas y funciones, por ello, el siguiente tema está desarrollado a partir de un ejemplo, el cual te llevará de la mano para que comprendas cómo es que se lleva a cabo este proceso.

Ahora bien, es importante que sepas que paralelamente con el siguiente tema, iniciarás tu actividad integradora, la cual tiene valor en tu calificación final, por lo que es importante que la realices, además te permitiría reforzar lo aprendido a lo largo de esta unidad de aprendizaje.

"No se equivoca el ave que ensayando el primer vuelo cae al suelo,se equivoca aquella que por temor a caerse, renuncia a volar"

Anónimo

Page 52: Contenidos de Computacion Basica 2

1.2 Uso de fórmulas, funciones y gráficas de información

Introducción

En el tema anterior definimos los elementos básicos para comprender el funcionamiento de la Hoja de Cálculo: la celda, la barra de fórmulas y los datos que se pueden introducir en la hoja (textos, números y fórmulas). También recordaste los símbolos y las operaciones básicas a utilizar durante el trabajo en la Hoja electrónica de cálculo. Ahora verás en la práctica el uso de las fórmulas y funciones para el tratamiento de la información, ya sea para tu actividad laboral, escolar o personal.

El tema está desarrollado a partir de un ejemplo: clínica La Trinidad. Te preguntarás porqué retomar un ejemplo de tal característica, pues te diremos que el manejo de la Hoja electrónica y de otros programas, como Word, apoyan nuestra actividad diaria, y para hacer más significativa la información te presentamos un ejemplo real en donde se usan fórmulas y funciones para obtener cierto tipo de información.

Caso clínica La Trinidad

Contexto Retomaremos el caso de la clínica La Trinidad, ya que tanto para el director como para el personal médico es importante conocer el número de consultas que se ofrecen, el número de médicos, tipo de casos y, sobre todo, saber cuantos pacientes atienden en un año. La información que se obtenga servirá de base para tomar decisiones con respecto al funcionamiento de la misma.

¿Te parece si comenzamos con la lectura del tema? Para el administrador de la clínica La Trinidad, el control y manejo de la información es importante, lo que da la posibilidad de tomar diversas decisiones y para ello se inician algunos procesos.

Lo primero es llevar por separado los diferentes controles, por tal razón se generarán hojas con diferente información; ahora nombrará cada hoja dependiendo de lo que contenga. Como la información que está contenida en esta primera hoja servirá para los siguientes procesos, en vez de copiar y pegar, se copiará la hoja:

Imagen 1. Copia de Hoja electrónica de cálculo A

Page 53: Contenidos de Computacion Basica 2

Se acerca el puntero a la etiqueta de la hoja, se oprime el botón derecho del mouse y aparece el menú contextual, se elige la opción Mover o copiar y se presenta el siguiente cuadro de diálogo:

Aparecerá entonces:

Imagen 2. Copia de la Hoja electrónica de cálculo B

Page 54: Contenidos de Computacion Basica 2

Podemos constatar que es una copia fiel de la hoja 1. Nombraremos las hojas para identificarlas, para hacerlo se puede posicionar el puntero sobre la etiqueta de la hoja y llamar al menú contextual y a continuación se elige la opción Cambiar nombre o se da doble clic sobre la etiqueta.

Al seleccionarse la etiqueta podemos escribir el nombre, el cual será Consultas.

Al dar un clic, en cualquier lado de la hoja, la etiqueta asumirá el nombre.

La siguiente etiqueta se llamará Cálculos Consultas, con el mismo procedimiento.

Page 55: Contenidos de Computacion Basica 2

Se iniciará el trabajo de la información, primero determinaremos el total de los pacientes que asistieron a la clínica por mes, para ello utilizaremos una fórmula, pero antes, y es algo muy importante, iniciaremos con el signo (=), para que se adicionen cada una de las celdas. Veamos la siguiente imagen.

Imagen 3. Fórmula

Como puedes ver el correcto aprovechamiento de la fórmula nos dará el resultado esperado, pero este procedimiento nos ayuda cuando es poca información, de lo contrario podemos acudir a las funciones, que son fórmulas predefinidas que contiene la Hoja electrónica de

Page 56: Contenidos de Computacion Basica 2

cálculo con la finalidad de facilitar el desarrollo de cálculos. Esta función nos ayudaría para determinar el número de pacientes.

Para poder usar las funciones haremos lo siguiente:

Nos ubicamos en la celda F15 y abrimos el cuadro de diálogo, donde se concentran las funciones, esto a través de la barra de Fórmulas o con la opción de la barra de menú Insertar.

Imagen 4. Funciones

Page 57: Contenidos de Computacion Basica 2

Imagen 5. Tipos de funciones

Las funciones utilizan ciertos valores denominados argumentos. Éstos se caracterizan por su nombre (que por acuerdo se escribe en mayúsculas) seguido de paréntesis dentro de los cuales se agregan los argumentos que son un conjunto de valores. En este caso la operación que realizaremos es una suma, por lo que elegimos la función SUMA. Veamos.

Page 58: Contenidos de Computacion Basica 2

Imagen 6. Argumentos

Al manejar la fórmula consideramos referencias de celda, no cantidades, pues de esa forma si se hubieran modificado los datos, se actualizaría el resultado.

En cada argumento para una función podríamos considerar una celda, pero resultaría lo mismo que con la fórmula simple. En este caso lo que se sumará es un grupo de celdas adyacentes es decir un rango, por (automáticamente) default al ingresar la función reconoce el rango F9:F14, facilitándonos la operación, por lo que sólo debemos revisar que sea correcto y Aceptar. Si ya conocemos la sintaxis podemos directamente ingresarla en la celda. Veamos donde se coloca la sintaxis de la función.

Imagen 7. Sintaxis

Page 59: Contenidos de Computacion Basica 2

Como el procedimiento será igual en los meses restantes utilizaremos la función de autollenado, para ello “jalamos” del cuadro de llenado hacia la derecha.

Imagen 8. Autollenado

Al copiar fórmulas contenidas en celdas hay que tener presente las direcciones o referencias de celda que tenemos en éstas. Las referencias pueden ser de tres tipos: relativas, absolutas o mixtas.

Referencias Relativas Una referencia relativa en una fórmula se basa en la posición relativa de la celda que contiene la fórmula y de la celda a la que hace referencia. Si cambia la posición de la celda que contiene la fórmula, se cambia la referencia.

Page 60: Contenidos de Computacion Basica 2

De hecho son las que establece por defecto la aplicación cuando creamos una fórmula. En este caso apreciamos que si la celda F15 contiene la fórmula =SUMA(F9:F14), la celda G15 es igual a =SUMA(G9:G14) y la celda H15 es igual a =SUMA(H9:H14), y así sucesivamente.

De este modo hemos copiado la fórmula original, que introducimos en la celda F15, a las celdas de la derecha y apreciamos cómo las referencias que intervienen en las fórmulas se han movido, han cambiado, a la vez que se movía la fórmula.

Imagen 10. Copiar funciones

Al establecer esta fórmula y copiarla vemos como las referencias que intervienen se mueven con la fórmula, es decir, sin saberlo hemos utilizado referencias relativas de celdas. Las fórmulas se relativizan a la nueva posición que adquieren

Page 61: Contenidos de Computacion Basica 2

tras el copiado. Por ello encontramos que en cada columna, se suman los pacientes atendidos en ese período.

Consideremos entonces que las referencias relativas marcan una posición variable, en relación con su posición dentro de la hoja. Al copiar una celda que

contiene referencias relativas de celdas, las referencias de las celdas contenidas en la fórmula copiada se modifican de acuerdo a la nueva situación de la misma.

Continuaremos trabajando con la información que debemos obtener para la clínica y conseguir los totales, pero en forma anual. Veamos la siguiente imagen.

Imagen 10. Introducción de la fórmula

En este caso se ingresa en forma escrita la función en la celda. Podemos apreciar

la fórmula en la barra de fórmulas, y al dar un ENTER , o con oprimir el botón

que representa la misma acción, es decir, ACEPTAR y que aparece en la barra de fórmulas cuando se ingresa información en cualquier celda, se obtendrá el resultado.

Page 62: Contenidos de Computacion Basica 2

Para conocer el total de los pacientes atendidos por los demás doctores copiamos la fórmula hacia abajo, a través del cuadro de llenado, o se puede realizar con el

procedimiento de Edición, Copiar o la clave corta Ctrl + C y Edición, Pegar o la clave corta Ctrl +V, en cada celda.

Imagen 11. Ejemplo de copiar fórmula

Ahora conocemos el total de pacientes atendidos por cada doctor en el año, y en total por la plantilla de doctores. Sin embargo, con la tabla podemos obtener más información. Sigamos con la lectura del caso.

También es importante conocer el promedio de los pacientes atendidos durante el año, tanto por cada doctor como por mes, para lo cual se aplicará una función que nos facilitará conocer esta información.

Imagen 12. Función promedio

Page 63: Contenidos de Computacion Basica 2

En este caso al reconocer el rango, considera dentro la celda Q9 que corresponde al Total de pacientes, si aceptamos el rango la información será errónea, por lo que corregimos el rango a E9:P9 que es lo correcto.

Imagen 13. Funciones

Page 64: Contenidos de Computacion Basica 2

Obtenemos el promedio, y lo reproducimos en las celdas adyacentes. Veamos la siguiente imagen.

Pero ahora apreciamos que el promedio que se obtuvo contempla decimales, lo que en este caso es incorrecto, por lo que aplicaremos un formato para que aparezcan sólo enteros, esto es posible acudiendo a la opción Formato; Celdas…etc.; con Ctrl+1 o con el menú contextual.

Imagen 14. Formato para números enteros

Page 65: Contenidos de Computacion Basica 2

Aparecerá el siguiente cuadro de diálogo:

Se elige la categoría Número, modificamos las posiciones decimales a 0 y aceptamos. O también con el botón de la barra de herramientas de formato:

Page 66: Contenidos de Computacion Basica 2

Continuamos calculando el promedio por mes, pero ahora también identificaremos por mes cuál fue el número mínimo y máximo de pacientes atendidos. Esto lo haremos también con funciones.

Imagen 15. Número máximo de pacientes atendidos

Page 67: Contenidos de Computacion Basica 2

Da clic en la imagen para ampliarla.

Da clic en la imagen para ampliarla.

Page 68: Contenidos de Computacion Basica 2

Ahora hagamos el mismo paso para el número mínimo de pacientes.

Imagen 16. Número mínimo de pacientes atendidos

Da clic en la imagen para ampliarla.

Aplicando formato y funciones tendremos la siguiente información:

Page 69: Contenidos de Computacion Basica 2

Da clic en la imagen para ampliarla.

Ahora pasemos a revisar lo correspondiente a las referencias absolutas.

Referencias Absolutas

Una referencia de celda absoluta, en una fórmula, siempre hace referencia a una celda con ubicación específica. Si se copia la fórmula en filas o columnas, la referencia absoluta no se ajusta.

Como parte de la información que maneja Clínica La Trinidad se calculará lo que percibe cada doctor, considerando que la consulta se cobra a $250.00.

Imagen 17. Monto por consulta

Page 70: Contenidos de Computacion Basica 2

Da clic en la imagen para ampliarla.

Para determinar lo que se recibe por concepto de consultas al mes se utilizará una fórmula donde se multipliquen el número de pacientes por lo que se cobra por consulta. Ubicados en la celda D18 se ingresa la fórmula.

Imagen 18. Fórmula multiplicación

Page 71: Contenidos de Computacion Basica 2

Da clic en la imagen para ampliarla.

Al copiar la fórmula hacia las celdas adyacentes, para conocer el resultado de los demás doctores, la suma no es correcta, pues apreciamos que aparecen ceros al copiar la fórmula

¿Por qué sucede esto?

Aquí podemos advertir qué fue lo que sucedió cuando copiamos la fórmula a las otras celdas.

Imagen 19. Fórmula multiplicación B

Page 72: Contenidos de Computacion Basica 2

Da clic en la imagen para ampliarla.

Al contener las celdas referencias relativas, fueron recorriéndose en la fórmula, identificando celdas que no contenían información (B27, B28, B29, B30, B31) en lugar de reconocer la B26 que es donde se encuentra la cuota por consulta, por esta razón no obtuvimos el resultado esperado.

Para poder tener resultados correctos tendremos que “Fijar” el contenido de la celda B26, y para lograrlo le aplicaremos una referencia Absoluta.

Para hacer esto debemos escribir en la propia fórmula, a través de la barra de fórmulas previo a la letra de la columna y al número de la fila, el símbolo ($) que indica que se aplicará una referencia absoluta, por lo que se tendrá $B$26 que también se obtiene

oprimiendo la tecla de función con lo que resulta.

Imagen 20. Referencia Absoluta

Page 73: Contenidos de Computacion Basica 2

Da clic en la imagen para ampliarla.

Al copiarla a las celdas hacia abajo obtenemos:

Da clic en la imagen para ampliarla.

Page 74: Contenidos de Computacion Basica 2

Podemos cotejar lo que sucedió a través de la siguiente imagen:

Da clic en la imagen para ampliarla.

Mientras la celda D9 conservó su referencia relativa, a la celda B26 se le aplicó la referencia absoluta por lo que se mantuvo fija al momento de copiar la fórmula en otras celdas.

Ahora podemos copiar la misma fórmula a los demás meses para completar la información.

Page 75: Contenidos de Computacion Basica 2

Da clic en la imagen para ampliarla.

Asimismo, le damos formato de Moneda o de Contabilidad y obtenemos lo siguiente:

Imagen 21. Formato de moneda

Page 76: Contenidos de Computacion Basica 2

Da clic en la imagen para ampliarla.

También podemos utilizar el botón de la barra de herramientas de Formato. A continuación se encuentra una actividad de autoevaluación en donde aplicarás formato a una hoja electrónica, es importante que la realices para que practiques e identifiques errores o formas diferentes de llegar al resultado. Cuando termines la actividad continúa leyendo la información.

Después de realizar la actividad de autoevaluación puedes participan en el Foro Mi experiencia con Excel, en donde podrás comentar dudas, sugerencias y apoyo para el resto de tus compañeros.

Después de aplicar formato a la tabla, sigamos con el caso de la clínica. Así como en cualquier lugar de trabajo existen diversos perfiles que realizan actividades diferentes y la clínica no escapa a ello, veamos la siguiente imagen.

Page 77: Contenidos de Computacion Basica 2

Los dueños de la clínica deciden otorgar un bono como incentivo al personal que obtenga un buen desempeño para lo cual se solicita, tanto al personal como a pacientes, evalúen las actividades desempeñadas en la clínica. Esto determinará a cuánto ascenderá el bono, tomando como determinación que si la evaluación rebasa está entre 9 y 10, se otorgará un 8% más sobre el sueldo que perciben mensualmente. Si es inferior, será el 5% el que se otorgará.

Para poder avanzar, asigna formato a la tabla como se muestra a continuación, de acuerdo a lo visto previamente

Imagen 22 B. Personal clínica

Da clic en la imagen para ampliarla.

Para poder determinar qué bono es el que les corresponde procederemos con una función lógica:

Page 78: Contenidos de Computacion Basica 2

Ésta fórmula representa lo siguiente:

Si K11 (Evaluación) es mayor que 8, entonces a J11 (Sueldo mensual) se le aplicará el 8%, de no ser así, es decir si es menor o igual a 8, entonces a J11 se le aplicará el 5%. Aquí fue redactada la función directamente, pero también se manejará a través de Insertar Función.

Imagen 23. Función lógica A

Page 79: Contenidos de Computacion Basica 2

Da clic en la imagen para ampliarla.

La función SI consta de tres partes:

Primer paso. Se debe establecer una prueba lógica que es cualquier valor o expresión que pueda evaluarse como VERDADERO O FALSO.

Aquí vamos a emplear los signos de comparación menor qué (<), mayor que (>), igual a (=), diferente de (<>), menor o igual a (<=), mayor o igual a (>=).

Segundo paso. Para el Valor_si_verdadero es el valor que se devolverá si la prueba lógica es VERDADERO. Si se omite, devolverá VERDADERO. Puede anidar hasta siete funciones SI.

Tercer paso para el Valor_si_falso es el valor que se devolverá si la prueba lógica es FALSO. Si se omite, devolverá FALSO.

Page 80: Contenidos de Computacion Basica 2

Da clic en la imagen para ampliarla.

Si se copia la fórmula a las celdas adyacentes obtenemos el siguiente resultado:

Da clic en la imagen para ampliarla.

De igual forma para tener mejor calidad en el servicio es importante, aparte del incentivo económico, motivar al personal, por lo que aplicaremos nuevamente una función lógica para que muestre a quienes felicitar y a quienes hay que motivar.

Esto quedará de la siguiente manera:

Imagen 23. Función lógica B

Page 81: Contenidos de Computacion Basica 2

Da clic en la imagen para ampliarla.

Da clic en la imagen para ampliarla.

Esta fórmula se interpreta como: (=) Si la evaluación es mayor a 8, entonces Felicitar, si no es así, si es igual o menor a 8, entonces Motivar.

Para que aparezca el mensaje es importante que se escriba entre comillas, de otra manera no será reconocido como texto.

Copiamos esta fórmula y obtenemos:

Page 82: Contenidos de Computacion Basica 2

Da clic en la imagen para ampliarla.

Después de revisar el ejemplo, te solicitamos realices la segunda actividad de autoevaluación que se diseñó para ti. Posteriormente continúa leyendo la información.

Ya que tenemos la información deseada, en ocasiones deseamos darle una presentación diferente. Para ello podemos apoyarnos de las gráficas. Veamos la siguiente información.

Gráficas

Para tener una visión más completa de la información que se ha generado, y poder presentar un informe ante la Junta Directiva de la clínica, se decide presentar una gráfica referente a los pacientes atendidos durante el año. Para ello retomamos el archivo Clínica1 que se ha ido modificando, observamos la hoja Consultas que muestra la siguiente información:

Da clic en la imagen para ampliarla.

Page 83: Contenidos de Computacion Basica 2

Lo primero es seleccionar la información relevante que deba ser presentada en la gráfica:

Da clic en la imagen para ampliarla.

Después se diseña la gráfica ingresando a la opción de la barra de menú Insertar; Gráfico, etc.; o con el botón de la barra de herramientas Estándar “Asistente para gráficos”.

Imagen 24. Selección gráfica

Da clic en la imagen para ampliarla.

Al ingresar aparecerá el cuadro de diálogo “Asistente para gráficos” donde se elegirá el tipo y subtipo de gráfico:

Imagen 25. Asistente para gráficos

Page 84: Contenidos de Computacion Basica 2

En el siguiente paso encontramos varias alternativas para personalizar la gráfica:

Page 85: Contenidos de Computacion Basica 2
Page 86: Contenidos de Computacion Basica 2
Page 87: Contenidos de Computacion Basica 2

Finalmente el paso 4 da la posibilidad de elegir en dónde queremos que aparezca la gráfica; en una hoja aparte, independiente de la tabla o como parte de nuestra hoja Consultas.

En este caso elegiremos en la hoja Consultas.

Page 88: Contenidos de Computacion Basica 2

Aparece la gráfica permitiendo modificarla, por lo pronto la ensanchamos para poder apreciar todos los meses.

Da clic en la imagen para ampliarla.

Si queremos personalizarla más con el menú contextual (botón derecho del mouse sobre la gráfica), aparecerá la opción.

Imagen 26. Personalización de la gráfica

Page 89: Contenidos de Computacion Basica 2

Da clic en la imagen para ampliarla.

Da clic en la imagen para ampliarla.

Donde podremos hacer algunas modificaciones para personalizar la gráfica, como el fondo; que puede adoptar incluso una imagen al ingresar a Efectos de relleno, etc.; Cambiar el tipo de fuente, color, tamaño, etc.

Al ubicarnos en el título del eje, en la leyenda, en el título de la gráfica, en las columnas de la gráfica, etc. y acudir en cada uno al menú contextual podemos personalizar cada uno de los elementos si queremos.

Imagen 27. Formato de gráfica

Page 90: Contenidos de Computacion Basica 2

Da clic en la imagen para ampliarla.

Puede quedar así:

Da clic en la imagen para ampliarla.

Después de revisar el tema te invitamos que participes en el Foro Mi experiencia con Excel, el cual se encuentra abierto durante el estudio del tema 1 y 2 correspondientes a la Unidad I, Hoja electrónica de cálculo.

Después de que participes continúa para que aprendas a administrar datos en Excel.

Administración de Datos

Para la clínica La Trinidad el manejo de información es parte fundamental para la realización de actividades en forma rápida y eficiente. La Hoja electrónica de cálculo nos provee de opciones que facilitan el manejo y administración de la información.

Page 91: Contenidos de Computacion Basica 2

Filtros

Filtrar una lista representa que de todos los registros almacenados en ella se seleccionan aquellos que correspondan con algún criterio establecido por nosotros. Por ejemplo: género de los doctores, turno en que se encuentran, especialidad, etc.

Una lista es un conjunto de datos organizados en filas o registros, en la que la primera fila contiene los encabezados o títulos de las columnas (los nombres de los campos) y las demás filas contienen los datos almacenados. Es como una tabla de base de datos. Cada fila es un registro de entrada, por tanto podremos componer como máximo una lista con 255 campos y 65535 registros.

Las listas son muy útiles porque además de almacenar información, incluyen una serie de operaciones que permiten analizar y administrar esos datos de forma muy cómoda.

¿Qué representa esto? En la clínica La Trinidad, se realizó una evaluación al personal, en función de su desempeño en las actividades que realizan, con la intención de que el servicio que proporcionan sea cada día mejor; es importante identificar a aquellas personas que recibieron una evaluación baja (menor a 8), con la finalidad de promover en ellos una buena actitud. ¿Lo recuerdas? (imagen 22 Función lógica).

Para poder detectarlos de manera fácil y rápida utilizamos filtros, una de las opciones es el autofiltro. Para activarlo nos ubicamos en alguna celda dentro de la tabla y accedemos a las opciones Datos, Filtro, Autofiltro.

Imagen 28. Filtros y autofiltro

Da clic en la imagen para ampliarla.

Con ello se nos presenta:

Page 92: Contenidos de Computacion Basica 2

Da clic en la imagen para ampliarla.

Para utilizar el Autofiltro nos servimos de las listas desplegables asociadas a los encabezados de campos, en este caso el dato que establecemos como criterio, es la evaluación, por lo que damos un clic sobre el cuadro( ) y nos presenta un menú donde podemos escoger la opción requerida; como en este caso requerimos un rango, elegimos la opción Personalizar.

Imagen 29. Personalizar

Da clic en la imagen para ampliarla.

Donde estableceremos él o los criterios:

Imagen 30. Criterios

Page 93: Contenidos de Computacion Basica 2

Da clic en la imagen para ampliarla.

Con lo que al establecerlo, selecciona la información y presenta de la siguiente manera:

Da clic en la imagen para ampliarla.

Page 94: Contenidos de Computacion Basica 2

Para quitar el filtro volvemos a desplegar la lista y elegimos la opción (Todas) y reaparecerán todos los registros de la lista.

Y para retirar las listas desplegables nuevamente se ingresa a Datos, Filtro, Autofiltro (que

aparecerá seleccionado ) y dando un clic se desactiva.

Da clic en la imagen para ampliarla.

Tabla dinámica Una tabla dinámica consiste en el resumen de un conjunto de datos, atendiendo a varios criterios de agrupación, representado como una tabla de doble entrada que nos facilita la interpretación de dichos datos. Es dinámica porque nos permite ir obteniendo diferentes totales, filtrando datos, cambiando la presentación de los mismos, visualizando o no los datos origen, etc.

Para poder desarrollar una tabla dinámica, retomaremos el Clínica1 para seleccionar la tabla de datos.

Imagen 31. Tabla clínica 1

Page 95: Contenidos de Computacion Basica 2

Da clic en la imagen para ampliarla.

Ingresamos a las opciones Datos; Informe de tablas y gráficos dinámicos para que se visualice de la siguiente manera:

Da clic en la imagen para ampliarla.

Con la acción anterior se presentará el Asistente para talas y gráficos dinámicos, aquí elegiremos la opción Lista o base de datos, pues aquí contamos con ella, y el tipo de informe será Tabla Dinámica:

Imagen 32. Lista o base de datos

Page 96: Contenidos de Computacion Basica 2

Aparecerá reconocido el rango seleccionado:

Da clic en la imagen para ampliarla.

Al dar el siguiente paso, en esta última pantalla debemos indicar en dónde vamos a situar el resultado de la tabla dinámica. También si oprimimos el botón Diseño, accedemos a un cuadro de diálogo donde podemos personalizar la forma en que van a presentarse los datos en la tabla dinámica.

Page 97: Contenidos de Computacion Basica 2

Da clic en la imagen para ampliarla.

Da clic en la imagen para ampliarla.

En la imagen podemos apreciar que nos aparece una estructura formada por las filas, columnas, datos, además de un campo para el Nº de página. Y en el lateral derecho tenemos los campos disponibles de la tabla, los cuales podemos arrastrar a las diferentes partes del diagrama de la izquierda.

Por ejemplo, podríamos construir una tabla dinámica con la siguiente estructura. Pon atención al procedimiento.

Imagen 33. Ejemplo de Tabla dinámica

Page 98: Contenidos de Computacion Basica 2

Colocamos en el campo COLUMNA, Apellido P (para hacerlo damos clic en el botón elegido y, sin soltar el botón del mouse, arrastramos y soltamos en el campo designado).

Y en el campo DATOS ubicamos los botones de los meses, apreciamos que automáticamente le asigna el concepto de Suma a cada uno de ellos.

Al elegir la opción Aceptar nos regresa al paso 3.

Para elegir donde queremos que aparezca la tabla, pediremos una hoja nueva:

Da clic en la imagen para ampliarla.

Aparecerá entonces la tabla:

Page 99: Contenidos de Computacion Basica 2

Da clic en la imagen para ampliarla.

Apareciendo la barra de herramientas de Tabla dinámica, tendremos la posibilidad de

asignar un formato a la tabla , o incluso generar un gráfico

.

Da clic en la imagen para ampliarla.

Page 100: Contenidos de Computacion Basica 2

También se despliega una lista de campos, en donde aún podemos elegir si requerimos anexar alguno(s) y en que lugar se ubicarán.

También podemos hacer el uso de filtros; en la tabla se aprecia el cuadro que me permite desplegar la lista donde elegiría que elementos requiero visualizar. En este caso aparece en el apellido paterno, pues sólo se eligió ese campo.

Por default la tabla mostró la suma de los datos, pero no se limita sólo a presentar este tipo de cálculo, si nos ubicamos en la celda que queremos que nos muestre otro tipo de procedimiento se accede al menú contextual a través del botón derecho del mouse, y se elige Configuración de campo.

Imagen 34 Configuración de campo

Da clic en la imagen para ampliarla.

Aparecerá un cuadro de diálogo donde podemos elegir otra opción de cálculo:

Page 101: Contenidos de Computacion Basica 2

Da clic en la imagen para ampliarla.

¡Genera tus tablas dinámicas!

ConclusionesCon lo que revisamos, la clínica La Trinidad podrá obtener la información que requiere para satisfacer sus necesidades. De la misma manera en que realizamos este pequeño ejercicio podrás aplicarlo para tu trabajo cotidiano, ya que siempre es bueno contar con herramientas que nos faciliten nuestras labores y Excel (o la Hoja Electrónica de Cálculo) nos las ofrece.

Cuando hayas llegado hasta este momento es porque terminaste de leer el contenido de la Unidad I. Asimismo, realizaste las dos actividades de autoevaluación que se plantearon durante el tema 1.2 y participaste en el Foro Mi experiencia con Excel. De lo contrario, te solicitamos que las realices y hagas tus aportaciones al Foro con el fin de fortalecer tu comunidad virtual.

En la Unidad II trabajaremos lo relacionado con la elaboración de páginas Web a través del código HTML y un editor. Para el trabajo propiamente del Editor realizamos una Guía sobre el uso del Editor; es importante que la revises y la tengas siempre a la mano.

"El éxito no se logra sólo con cualidades especiales. Es sobre todo un trabajo de constancia, de método y de organización." J.P. Sergent

UNIDAD 2

¿Te imaginas que puedas estar comunicado a cualquier hora del día y desde cualquier lugar del mundo, y que la gente obtenga información sobre ti, sobre algún producto que promuevas o de tu empresa, sin necesidad de que estés presente para proporcionarla? Es genial ¿no crees? Lo anterior lo podemos lograr por diversos medios, por ejemplo: una página Web.

En la actualidad es importante estar comunicados e informados y las páginas Web propician un espacio donde convergen imagen, texto y audio para ser un medio versátil y completo que nos informe sobre cualquier tema de índole académica, personal, social, privada, gubernamental, política, etc.

Lee con atención, toma nota de lo revisado y realiza las actividades para elaborar una página Web con el tema de tu elección. ¡Iniciamos viendo el mapa conceptual!

Page 102: Contenidos de Computacion Basica 2

2.1 Definición y características de las páginas Web

Introducción

Vamos a iniciar este proyecto en el que aprenderemos a diseñar y generar una página Web, que puede ser como las que hemos visto o conocemos bien, pero antes será interesante saber ¿qué es?

Una página Web es un documento de la World Wide Web que, normalmente, incluye texto e imágenes; también puede contener animaciones, sonidos, enlaces hacia otros documentos de la red, programas especiales y cualquier otro tipo de documento por medio de diversas tecnologías.

Una página Web es un documento creado con lenguaje HTML (Lenguaje de Marcado de Hipertexto).

Y ahora surgiría la pregunta ¿Qué es un lenguaje HTML?

Page 103: Contenidos de Computacion Basica 2

Antes de abordar el tema, identificaremos qué tipos de páginas Web son reconocidas y algunas recomendaciones para su diseño y elaboración.

También es importante reconocer que no es lo mismo "páginas Web" que "sitios Web". Un sitio Web es un conjunto de páginas Web, vinculadas entre sí, que funcionan en un mismo dominio.

Imagen 1 Páginas Web

Estándares de diseño

Son pautas o reglas normalizadas que se establecen para conseguir uniformidad en el desarrollo de páginas Web, tratando de obtener que la mayoría de usuarios vean lo que se publica.

Con el uso de estos estándares se pretende que las páginas se desplieguen de manera rápida, además que puedan ser visualizadas como fueron construidas.

El World Wide Web Consortium (W3C), organización independiente y neutral, desarrolla estándares relacionados con la Web, también conocidos como recomendaciones, que sirven como referencia para construir una Web accesible,

Page 104: Contenidos de Computacion Basica 2

interoperable y eficiente, en la que se puedan desarrollar aplicaciones cada vez más robustas.

Las tecnologías creadas por el (W3C) permiten que se puedan diseñar y crear sitios con un funcionamiento duradero, aunque cambien los estándares y navegadores.

Los estándares permiten:

Page 105: Contenidos de Computacion Basica 2

Un sitio basado en estándares web mostrará una mayor consistencia visual, gracias al uso del Lenguaje de Marcado de Hipertexto Extensible (XHTML); para el contenido y las hojas de Estilo en Cascada (Cascading Style Sheets; CSS); para la apariencia se puede transformar rápidamente un sitio, sin importar que se trate de una página web o miles, realizando cambios en un sólo lugar.

Page 106: Contenidos de Computacion Basica 2

Para poder trabajar sobre lo que es una página Web es básico tener en cuenta dos conceptos: Usabilidad y Accesibilidad. El primero de ellos se refiere a la facilidad con la cual las personas pueden utilizar una herramienta. El segundo es el acceso que puede tener el usuario a la información y contenido que conforma a la página Web.

Es importante tomar en cuenta que la creación de páginas Web requiere de una estructura y planeación para obtener un producto que cumpla con los objetivos. El resultado dependerá de la organización, la originalidad y los elementos utilizados en las páginas que se creen. Para ello hay que tener en cuenta a quién va dirigida, lo que permitirá que podamos adecuar los contenidos y el estilo, sin perder de vista también que la estructura sea clara en cuanto a la relación de unas páginas con otras.

Por lo que consideraremos las siguientes recomendaciones:

1. Definir el mensaje que se desea transmitir, lo que permitirá elegir los recursos que se incluirán.

2. Crear un mapa de navegación, para visualizar cómo se desplazarán los usuarios por ellas. Identificar índice principal, páginas secundarias y las ramificaciones de todos los documentos, para que se establezcan los enlaces que se requerirán, aun cuando se trate de una sola página. Por ejemplo:

Imagen 2 Tipos de navegación

Page 107: Contenidos de Computacion Basica 2

3. Detallar un estilo que sea aplicado a todas las páginas que vayamos generando, incluyendo en su caso los logotipos, encabezados y pies, etc. Por ejemplo: los iconos que identifican a la unidad de aprendizaje que actualmente estudias.

4. Definir el contenido de las páginas:

o Reducir el texto al mínimo, pues de otra manera no serán leídos. Es importante informar lo necesario, relevante y actualizado.

o Reduce al mínimo los estilos de encabezamientos y subtítulos cuando organices el contenido y utilices los estilos en forma coherente.

o Puedes insertar líneas horizontales para separar visualmente las secciones del documento.

5. Combinación de fondos con el texto: El fondo puede hacer que la lectura de los documentos en pantalla sea más atractiva, pero es conveniente aplicar al texto un color de contraste, por ejemplo: un color claro para texto sobre fondo oscuro y viceversa. Pero trate de evitar la utilización de textos de color blanco, pues algunas impresoras no escriben en dicho color.

6. Establecer la longitud de la página: Una gran parte de los monitores de los equipos personales actuales presentan la información en una resolución de 640 x 480 pixeles en pantallas de 13 a 15 pulgadas (también en 800 x 600). Diseña las

Page 108: Contenidos de Computacion Basica 2

páginas en forma que la información se presente en partes cortas y claramente segmentadas, a fin de mantener las páginas concisas.

Una buena regla general, para escribir una página que se leerá en la pantalla, es que su longitud no sea mayor que dos o tres pantallas de información de 640 x 480, incluidos los enlaces de navegación locales, al principio y final de la página.

Si la información es muy extensa divídela en páginas separadas o proporciona un enlace con un archivo diferente que contenga el texto en una sola página. Esto permitirá que la descarga de la información y la navegación, a lo largo de los diferentes temas, se haga más rápida para los visitantes de la Web.

7. Reducir el tamaño de los archivos de imágenes y vídeos en las páginas Web : Las imágenes son un elemento importante en un sitio Web. Éstas vienen en dos formatos básicos: GIF y JPEG. Cada formato tiene sus ventajas e inconvenientes.

Las imágenes GIF son preferibles cuando la imagen va a contener menos de 256 colores. Los GIF son también apropiados para animaciones sencillas. Las de tipo JPEG se utilizan en imágenes con más de 256 colores, como son las fotografías escaneadas.

Las imágenes gráficas y los videos pueden dar un aspecto más atractivo a las páginas Web. Sin embargo, los archivos de dichos elementos pueden llegar a ser de gran tamaño e incrementar el tiempo necesario para descargar las páginas, sobre todo para los lectores que tienen acceso vía MODEM. El tiempo de descarga es muy importante en el World Wide Web, ya que algunos usuarios abonan la cuota en función de las horas de conexión; otros simplemente no son tan pacientes como para esperar mucho tiempo por la carga de la página. Si planificas la cantidad de imágenes que utilizará tu página Web y su tamaño, por consiguiente, puedes reducir el tamaño de los archivos y el tiempo de descarga de los gráficos y videos.

Para reducir el tamaño de un archivo gráfico, utilice menos colores, reduzca el alto y el ancho del gráfico o recórtelo.

8. Uso de tablas como herramientas de diseño: Puedes utilizar las tablas como una herramienta de diseño, pero también para organizar la información. Las columnas, los gráficos y el texto pueden organizarse de forma que aparezcan alineados en los navegadores Web. Si no se utilizan tablas, es complicado mantener los gráficos y el texto alineados en HTML (formato de las páginas Web).

9. Uso de distintos navegadores: Se recomienda utilizar un diseño que sea legible para cualquier navegador, pues, aunque todos los navegadores admiten un único lenguaje HTML, existen algunas diferencias entre ellos.

Page 109: Contenidos de Computacion Basica 2

ConclusionesLo anterior ha sido algo básico para entender qué es una página Web, si deseas conocer más información puedes buscarla y hacer una selección crítica de la misma (recuerda que esto lo viste en Computación Básica) para complementar lo revisado aquí. En el siguiente tema revisaremos cuál es el lenguaje básico para la elaboración de una página Web, no olvides realizar tu actividad de autoevaluación.

“Largo es el camino de la enseñanza por medio de teorías; breve y eficaz por medio de ejemplos”

Séneca

2.2 Páginas Web con HTML

Introducción

En el tema anterior vimos las características y los tipos de página Web, ahora trabajaremos sobre las páginas, pero con HTML. Antes de iniciar con las instrucciones para generar una página Web, primero debemos definir su propósito, su contenido y los elementos de apoyo que vamos a utilizar como imágenes, música, video y todos aquellos multimedios que nos permiten enriquecer su diseño.

La función principal es dar a conocer información de algún tema, producto o servicio que sea del interés público.

El contenido debe ser inédito, y que cumpla con el objetivo planeado inicialmente, sobre todo en el uso de imágenes, video y sonido, ya que todo lo que puedes localizar a través de un buscador de Internet tiene dueño y no debemos incluirlo de manera arbitraria a nuestra página, porque generaría un conflicto legal con los Derechos de Autor.

El diseño debe ser funcional, proporcionando al usuario la ubicación rápida de la información, que debe estar redactada de una manera concisa y fácil de leer.

Es importante que todos los contenidos empleados en nuestra página estén organizados en carpetas para facilitar su ubicación y vínculo.

Elementos que la integran

Page 110: Contenidos de Computacion Basica 2
Page 111: Contenidos de Computacion Basica 2

La cantidad de información que podemos almacenar en una página afecta, de manera directa, el tiempo de descarga para visualizar a través del Servidor; si abusamos de los multimedios y la descarga se vuelve lenta, lo más seguro es que el usuario abandone nuestra página y busque otra más veloz.

Otro aspecto importante es vincular las páginas entre sí, relacionándolas en forma hipertextual, esto quiere decir que vamos a emplear enlaces, ligas o links para navegar (movernos) por nuestro Sitio.

Las siglas HTML vienen de las palabras en inglés Hypertext markup language, que se puede traducir como lenguaje de marcación de hipertexto, y está basado en órdenes llamadas etiquetas o tags, que es el texto que define el contenido de la página Web.

Si tenemos varias páginas Web que forman un Sitio, la primera página debe llevar el nombre de index.Html, para que sea reconocida como página principal por el navegador.

Lenguaje Html

Page 112: Contenidos de Computacion Basica 2

Las etiquetas están formadas por palabras cortas en inglés y acompañadas de los símbolos:

Imagen 1 Símbolos

Las letras de la etiqueta pueden estar en mayúsculas o minúsculas, indistintamente. La mayoría de las instrucciones cuentan con una etiqueta de apertura, y una etiqueta de cierre, que afectan el contenido entre éstas, aunque también hay etiquetas únicas. Ejemplo:

Page 113: Contenidos de Computacion Basica 2

Para escribir el código Html emplearemos el bloc de notas, este programa se ubica en el grupo Accesorios, ya que sólo requerimos un procesador de textos sencillo, no tenemos que aplicar ningún formato al texto, puesto que no se verá reflejado en el resultado de la Página Web; todo el formato, distribución y multimedios se deben aplicar a través de las etiquetas. (También se puede emplear WordPad).

El documento elaborado en bloc de notas debe guardarse, asignarle un nombre y la extensión .HTML , para que sea reconocido como tal:

Page 114: Contenidos de Computacion Basica 2

El archivo guardado con la extensión .HTML lo podemos ubicar en Mi PC o en el Explorador de Windows; de manera interna este archivo muestra el resultado utilizando el programa de Internet Explorer, aun sin estar conectado a Internet. Si deseamos regresar al código fuente este mismo archivo lo podemos abrir con el Bloc de Notas. En ambos casos estas dos opciones aparecen en el Menú Contextual (Botón derecho del mouse) previa selección del archivo.

Imagen 2 Archivo .HTML

Page 115: Contenidos de Computacion Basica 2

Da clic en la imagen para ampliarla.

Manejo de texto

La lectura de las instrucciones se realiza de izquierda a derecha; sin considerar la distribución que se muestra en el bloc de notas, “las instrucciones se leen de corrido”, para establecer un formato se requiere de etiquetas con instrucciones precisas. Podemos emplear el tabulador para diferenciar las etiquetas de apertura y de cierre de cada instrucción y facilitar la detección de errores.

Imagen 3 Manejo de texto

Da clic en la imagen para ampliarla.

De forma general una Página Web cuenta con los siguientes elementos básicos:

Imagen 4 Elementos de la página Web

Page 116: Contenidos de Computacion Basica 2

Da clic en la imagen para ampliarla.

Estructura Básica

El código para generar una estructura básica es el siguiente:

Imagen 5 Estructura básica

Page 117: Contenidos de Computacion Basica 2

Cada archivo que guardemos lo podemos visualizar de dos formas: a través del Explorador de Windows o con el Bloc de notas. De hecho vamos a trabajar conjuntamente con estas dos aplicaciones que nos permiten ver el avance de nuestra Página.

Si realizas una modificación en el código, primero debes guardar estos cambios (Archivo, Guardar), para ver el resultado; si ya está abierto el mismo archivo, en

Internet Explorer, puedes emplear la tecla F5 o el icono actualizar

Page 118: Contenidos de Computacion Basica 2

Nota: Si está instalado un antivirus en tu equipo, se mostrará una advertencia para que permitas el acceso a esta página, utilizando el menú contextual sobre el aviso.

Da clic en la imagen para agrandar

Otra opción para visualizar el archivo a través de Internet Explorer es localizar el icono de esta aplicación en el panel del botón inicio.

Etiquetas

A continuación te presentamos un listado con las etiquetas más comunes que se emplean en la creación de Páginas Web, cada etiqueta te mostrará sus características y cómo se utilizará en un ejemplo práctico.

Page 119: Contenidos de Computacion Basica 2

Además de conocer las etiquetas es importante que practiques la escritura y realices un código para verificar la aplicación de las instrucciones y cómo obtener tus propias Páginas.

Utiliza las etiquetas para crear una Página Web que muestre el código de la estructura base (Etiquetas 1, 2, 3 y 4). En el título coloca el texto EJERCICIO 1, en el cuerpo de la página coloca el texto ESTRUCTURA BÁSICA DE UNA PÁGINA WEB.

Imagen 6 Estructura

Da clic en la imagen para agrandar

Puedes emplear esta práctica para tus futuras Páginas, modificando los textos del título y, lógicamente, el contenido, ahorrarías tiempo para escribir estas etiquetas que se repiten en todas las páginas. Recuerda que cuando asignes nombre al archivo para guardarlo, omite espacios en blanco y escribe la extensión .HTML en mayúsculas o minúsculas, normalmente se recomienda que se escriba todo en minúsculas.

Para el siguiente ejercicio utiliza esta imagen, para que analicemos las etiquetas requeridas. El resultado puede variar, ya que el contenido de una Página Web modifica su acomodo en función del tamaño de la ventana; si está maximizada o restaurada, el contenido se ajusta automáticamente, esta es una ventaja de los textos trabajados con este lenguaje.

Page 120: Contenidos de Computacion Basica 2

Debemos empezar por la estructura base, el título de la página es: EJERCICIO 2, el cuerpo de la página está formado por las siguientes etiquetas:

Después del primer renglón, y de los dos textos, hay un salto de línea. Cada uno de los cuatro ejemplos de alineación de texto está trabajado como párrafo, el atributo para alinear texto no tiene una etiqueta de cierre, sólo se ubica en la etiqueta de párrafo de inicio. Hay un texto que sólo está centrado.

Imagen 7 Ejemplo de página Web

Da clic en la imagen para agrandar

Intenta realizar el código y visualiza tu resultado, ¿tienes dudas?, verifica los siguientes puntos:

La escritura de las etiquetas es correcta:

o Si la palabra en inglés es HEAD y por error escribes HED, no se ejecuta la etiqueta.

o Si la palabra en inglés es ALIGN y por error escribes ALING, no se ejecuta el atributo.

Page 121: Contenidos de Computacion Basica 2

No omitir los símbolos que acompañan a las etiquetas y evitar invertirlos o <Body> CONTENIDO >/Body>

Revisar las etiquetas que se escriben para apertura y para cierre, ya que ésta última se diferencia por la diagonal normal.

o <Body> CONTENIDO </Body>

Cuando utilizamos un procesador de textos limitado, éste no cuenta con la opción para resaltar nuestros errores ortográficos o de gramática, así que hay que revisar nuestra escritura para corregirlos.

Si realizaste exitosamente el código, ¡Felicidades! , ahora realiza la actividad de autoevaluación en donde podrás practicar un poco más sobre el lenguaje HTML.

Si te quedaron dudas con respecto al uso del código te presentamos cómo se realizó el ejercicio, observa detenidamente la siguiente imagen:

Ahora analicemos el código:

Imagen 8 Análisis de código

Page 122: Contenidos de Computacion Basica 2

Da clic en la imagen para agrandar

Si ya tienes una idea más precisa de la escritura del código, regresa a tu actividad de autoevaluación para que la enriquezcas y envíala a tu asesor para que la revise y haga las acotaciones necesarias

Conclusiones El diseño de página Web puede parecer complicado por el tipo de código que maneja, pero si realizas las actividades y te comunicas mediante el foro podrás reducir las dudas con respecto al tema.

Recuerda la Unidad de Aprendizaje la diseñamos paso a paso para que logres tus objetivos de aprendizaje.

Aprendí que no se puede dar marcha atrás, que la esencia de la vida es ir hacia adelante. La vida, en realidad, es una calle de sentido único.

Agatha Christie

Tema 2.3 Páginas Web con editor NVU

Introducción

Este tema es un primer acercamiento para el diseño de páginas Web y está dirigido a aquellas personas que no están familiarizadas con la programación, pero

Page 123: Contenidos de Computacion Basica 2

que tienen la necesidad y quieren publicar información en Internet. Esta herramienta es de diseño práctico, y paso a paso te llevaremos a la elaboración de una página Web.

¿Qué es NVU?

NVU es un editor de páginas Web WYSIWYG, acrónimo de What You See Is What You Get (en inglés, "lo que ves es lo que obtienes"), es multiplataforma y permite editar la página Web tal y como si estuviera en el navegador.

Dentro de sus funciones encontramos:

El código HTML, creado en este editor, funciona en la mayoría de los navegadores actuales. Se puede alternar rápidamente entre modo visual y modo texto. Es posible trabajar en varias páginas de forma simultánea. Posee herramientas de ayuda para formularios, tablas y plantillas.

En la ventana de trabajo de NVU encontramos los siguientes elementos:

Elementos del editor

Da clic en la imagen para

interactuar con la

animación.

Después de conocer un poco sobre los componentes del editor NVU, ayudaremos a la administración de la clínica médica La Trinidad a promover sus servicios a través de Internet, para lo cual se generará una página Web que dé a conocer lo

Page 124: Contenidos de Computacion Basica 2

que ofrece, por ejemplo, promociones, personal que la integra, así como su ubicación.

Sigue atentamente el procedimiento para elaborar la página Web de la clínica; primero haremos uso del editor de páginas Web NVU, en donde escribiremos el título “Nuestros servicios” en el área de edición.

Imagen 1. Título de la página

Da clic en la imagen para

ampliarla.

Enseguida lo seleccionamos y le daremos el formato de Título 1, alineación centrada, estilo negrita, cursiva y tipo de fuente Arial.

Imagen 2. Formato para el título

Page 125: Contenidos de Computacion Basica 2

Da clic en la imagen para

ampliarla.

Da clic en la imagen para

ampliarla.

Para estructurar mejor la información que vamos a presentar, agregaremos una tabla:

Da clic en la imagen para

ampliarla

Page 126: Contenidos de Computacion Basica 2

Da clic en la imagen para

ampliarla

En donde podemos elegir cuántas columnas y filas necesitamos, en este caso insertaremos 2 columnas por dos filas. A través de sus pestañas Preciso y Celda podremos definir de una manera más efectiva lo que requerimos.

Preciso: Se puede indicar, en los campos adecuados, el número de filas y de columnas, así como establecer el ancho total de la tabla en tantos por cien o en pixeles. También se puede indicar el grosor del borde.

Celda: se establecen las características de la celda, como la alineación vertical y horizontal, el espaciado entre celdas.

Botón Edición avanzada: para establecer opciones avanzadas como atributos HTML, eventos de Javascript, estilos, etc.

Agregaremos la siguiente información:

Imagen 3. Formato para la página Web

Page 127: Contenidos de Computacion Basica 2

Da clic en la imagen para

ampliarla.

Para poder visualizar cómo se verá al publicar, guardamos la página con el nombre de Servicios, en Archivo; Guardar como…Al hacer esto aparecerá el nombre en la pestaña.

En la barra de redacción ubicamos el botón de Navegar:

Da clic en la imagen para

ampliarla.

Al oprimirlo podemos llevar el seguimiento de nuestra página, en el navegador visualizamos:

Page 128: Contenidos de Computacion Basica 2

Da clic en la imagen para

ampliarla.

Si no queremos que aparezcan los bordes, en el menú tabla elegimos Seleccionar; Tabla, con lo que cualquier modificación que se haga afectará toda la tabla, seleccionamos entonces en el mismo menú: Propiedades de la tabla…, presentará un cuadro de diálogo en donde podemos apreciar diversas opciones:

Da clic en la imagen para

ampliarla.

Page 129: Contenidos de Computacion Basica 2

Da clic en la imagen para

ampliarla.

En Bordes y espaciado asignamos en el Borde 0, en Relleno asignamos 6 pixeles, entre el borde de la celda y su contenido; la alineación de la tabla la ubicamos centrada, En Anchura asentamos 600 para ajustar un poco la tabla:

NOTA: Es necesario ir guardando los cambios para poder visualizarlos en el navegador.

Sin embargo, al visualizar la página en el navegador, apreciamos que la tabla aparece a la izquierda.

Para ubicarla al centro, podemos hacerlo directamente en nuestro Código fuente, a través de la pestaña en la Barra de modo de edición.

Nos presentará todo el código que se ha ido generando, por lo que en <Body> asentamos align=”center” (¿recuerdas las etiquetas de HTML?)

Page 130: Contenidos de Computacion Basica 2

Y entonces tendremos:

Para poder ubicar en forma de lista las opciones de servicios que ofrece, regresamos al modo de edición Normal, seleccionamos las opciones y oprimimos el botón de Lista de viñetas, y le damos alineación a la izquierda.

Page 131: Contenidos de Computacion Basica 2

Guardamos los cambios y visualizamos en el navegador:

Para seguir visualizamos en el navegador vamos a agregar un color en el fondo, por lo que elegimos:

Page 132: Contenidos de Computacion Basica 2

Da clic en la imagen para

ampliarla.

Formato; Colores y fondo de la página…

Aparece un cuadro de diálogo en donde tendremos posibilidad de hacer varias modificaciones a la página, si es lo que queremos, desde los colores del texto en las diversas partes en donde lo asentemos, color al fondo, o incluso insertar una imagen como fondo:

Da clic en la imagen para

ampliarla.

Elegimos modificar el fondo, y aparece el siguiente cuadro de diálogo:

Page 133: Contenidos de Computacion Basica 2

Da clic en la imagen para

ampliarla.

Seleccionamos el color que queremos, considerando las recomendaciones que revisamos al inicio de la Unidad, en cuanto a colores de fuente y fondos.

Un elemento que puede dar otra vista a la página es el logotipo de la clínica, y que debemos tener en la carpeta de imágenes (es importante recordar que debemos administrar nuestros archivos en carpetas para que al momento de subir la página, se encuentre la imagen).

Para poder agregar esa imagen nos ubicamos al inicio del área de edición, acudimos a la opción de imagen en la barra de redacción:

Da clic en la imagen para

ampliarla.

Page 134: Contenidos de Computacion Basica 2

En este cuadro de diálogo podemos modificar las dimensiones de la imagen seleccionada, la apariencia e incluso agregar un enlace a una página Web, un correo electrónico o un archivo local.

Una vez insertada la imagen se pueden establecer sus propiedades haciendo doble clic sobre ella, seleccionando la opción de menú Formato >> Propiedades de la imagen o a través del menú contextual.

En este caso, como es el logotipo, elegiremos no usar el texto alternativo. El resultado será:

Da clic en la imagen para

ampliarla.

No olvides guardar todos los cambios que se realicen para no perder la información.

Vamos creando una página nueva que trate sobre alguna de las opciones que se presentan como servicios. Para ello elegimos la opción Nuevo de la barra de redacción, y aparece:

Imagen 4. Formato para la página Web

Page 135: Contenidos de Computacion Basica 2

Da clic en la imagen para

ampliarla.

Elegimos Página en nueva pestaña, pues formará parte de este archivo. También puedo acceder a ello a través de Archivo; Nuevo o con la clave corta Ctrl + N.

La página se llamará cuneros.

Asignamos un nuevo título que será Cuneros, agregamos una imagen (debe estar en la carpeta de imágenes), al elegir la imagen (Enfermeras.jpg) se anexará como texto alternativo Atención constante, luego anexaremos el texto Contamos con el personal especializado que atenderá con esmero a los bebés mientras permanecen en la clínica"

Para que la imagen aparezca en el centro de la página, podemos modificar nuevamente el código fuente con la siguiente etiqueta align="middle" correspondiente precisamente a la imagen. Para el texto utilizamos el botón de centrar de la barra de formato.

Page 136: Contenidos de Computacion Basica 2

Da clic en la imagen para

ampliarla.

Con esto el resultado se verá en el navegador de la siguiente manera:

Da clic en la imagen para

ampliarla.

Page 137: Contenidos de Computacion Basica 2

Para poder enlazar las páginas, regreso a la página Servicios, dando solamente un clic a la pestaña, seleccionamos la opción Cuneros de la lista de Hospitalización, ingresamos al botón Enlace, y se elige la página cuneros en el cuadro de diálogo Propiedades del enlace:

Da clic en la imagen para

ampliarla.

Guardamos, y actualizamos la página Servicios, probamos el vínculo. Podemos apreciar que nos refiere a la página Cuneros, ahora hay que establecer la forma en que podamos regresar a Servicios.

Imagen 5. Hipervínculos

Da clic en la imagen para

Page 138: Contenidos de Computacion Basica 2

ampliarla.

En el editor en la página Cuneros, al final de la página, escribimos el texto Regresar, agregamos un nuevo enlace, ahora a la página Servicios.

Da clic en la imagen para

ampliarla.

Guardamos la información y probamos en el navegador.

Creamos también la página index.html que será la que contenga el Índice, a través del cual podemos desplazarnos entre las páginas creadas.

Esta quedará de la siguiente manera, podrás apreciar que se incluyó una tabla, la Bienvenida y los enlaces a las páginas:

Imagen 6. Index

Da clic en la imagen para

Page 139: Contenidos de Computacion Basica 2

ampliarla.

Trata de generarla como aparece. También se contemplan dos páginas más, Ubicación y Personal, las cuales las llevarás a cabo en la siguiente actividad de autoevaluación.

Publicar

Para poder publicar en la Web encontramos varios sitios que ofrecen el servicio gratis. Uno de ellos es en yahoo.com.mx; en el espacio de Geocities:

Imagen 7 Publicar

Da clic en la imagen para

ampliarla.

Es importante contar con una cuenta de este sitio, si no tienes una puedes generarla.

Al entrar te da la Bienvenida y te invita a empezar la construcción de tu sitio:

Page 140: Contenidos de Computacion Basica 2

Da clic en la imagen para

ampliarla.

Al pasar a la siguiente página:

Da clic en la imagen para

ampliarla.

Elegiremos Educación, y continuamos con el siguiente paso:

Page 141: Contenidos de Computacion Basica 2

Da clic en la imagen para

ampliarla.

En seguida pasamos a la siguiente ventana, eligiendo la opción de Administración de archivos:

Da clic en la imagen para

ampliarla.

De ahí se nos presenta:

Page 142: Contenidos de Computacion Basica 2

Da clic en la imagen para

ampliarla.

Finalmente, al abrir el administrador de archivos se presenta la ventana en donde iremos cargando todos los archivos que estén involucrados, recuerda que debes insertar también las imágenes.

Da clic en la imagen para

ampliarla.

En esta ventana oprimimos el botón Cargar a,

Page 143: Contenidos de Computacion Basica 2

Da clic en la imagen para

ampliarla.

Esta ventana nos permite ingresar todos los archivos, no hay limitación en cuanto al número de ellos.

Da clic en la imagen para

ampliarla.

Al examinar los primeros 5 archivos oprimimos Cargar archivos, y continuamos cargando los demás:

Page 144: Contenidos de Computacion Basica 2

Da clic en la imagen para

ampliarla.

Regresamos al Administrador de Archivos, en donde todavía se pueden hacer modificaciones, en caso necesario, agregando archivos, eliminándolos o modificándolos.

Da clic en la imagen para

ampliarla.

Oprimimos el archivo index.html en la liga Ver y podemos visualizar nuestra página.

ConclusionesEsperamos que esta probadita sobre lo que es una página Web haya sido de gran ayuda para ti, te recordamos que si deseas saber más puedes apoyarte en lo que ya revisaste, e incluso, investigar si existen otros programas en donde puedas practicar la elaboración de páginas Web.

Page 145: Contenidos de Computacion Basica 2

Lo que sabemos es una gota de agua; lo que ignoramos es el océano." Isaac Newton