viernes, 16 de octubre de 2015

CLASE 2 - FORMATO DE DOCUMENTOS

FORMATO DE DOCUMENTOS
Cuando hablamos del formato de un documento nos estamos refiriendo a las cuestiones que tienen que ver con su aspecto, con la forma de presentarlo. El contenido en sí seguirá siendo el mismo.
La presentación del documento es importante. No sólo por elegancia, sino también para facilitar y motivar su lectura. Afortunadamente, Word facilita mucho esta tarea y con poco trabajo se consiguen resultados espectaculares.
En esta unidad veremos las herramientas que nos ayudarán a dar cierto diseño, de las más generales a las más específicas:
  • Aprenderemos a aplicar un tema.
  • Luego a incluir una portada y cambiar el color de página.
  • A modificar el formato del texto.
  • Y el de los párrafos.
Además, también veremos cómo utilizar las tabulaciones para mejorar la maquetación del documento y cómo copiar el formato de un texto a otro.
----------
BORDE DE PAGINA
Al pulsar esta opción se abre un cuadro de diálogo como el siguiente:
Ventana Borde de página
La forma de aplicar el borde es ir escogiendo las opciones de izquierda a derecha.
  1. Primero selecciona el valor para el borde: NingunoCuadroSombra3D o Personalizado. El cuadro seleccionado es el que está enmarcado en azul.
  2. Luego, selecciona el estilo de línea que quieres aplicar.
    Si eliges un Estilo de línea, podrás especificar su color y ancho.
    En cambio, si escoges un Arte, el borde será un motivo realizado por una consecuencia de dibujos. Por lo tanto sólo podrás establecer un ancho, y en algunos casos el color (cuando el programa lo permita) porque el color y forma son características propias del dibujo.
    Arte
  3. Por último, elige en la vista previa qué bordes quieres aplicar. De forma predeterminada se muestran bordes en los cuatro lados, pero activando y desactivando los botones que hay a su lado podrás decidir cuáles mostrar. También podrás decidir qué ámbito de aplicación tendrán: todo el documento, sólo la primera página, todas excepto la primera...
    Borde - Aplicar a

Estas tres opciones: marga de agua, color de fondo y bordes, son compatibles. Podrás utilizar las tres a la vez en un mismo documento, pero ten en cuenta que la marca de agua suele tener un color muy claro y es posible que no se aprecie con según qué colores de fondo.

MARCA DE AGUA
Normalmente es un texto que se ve al fondo de la página, por ejemplo ConfidencialNo copiarBorradorEjemplo y Urgente. Al hacer clic se desplegará el menú siguiente que te permitirá elegir el que quieras del listado:
Botón Marca de agua

LA PORTADA
En ocasiones el tipo de documentos que realizamos necesitan de una portada: proyectos, memorándums, informes... Word 2013 facilita mucho esta tarea, ya que pone a nuestra disposición una serie de portadas predefinidas.
Para incluir una portada debemos ir a la pestaña Insertar > grupo Páginas > opción Portadabotón portada
Se desplegará un menú con varios diseños. Haciendo clic en uno de ellos se insertará una nueva página al principio del documento con el aspecto elegido.
Portadas integradas
La portada suele incluir cuadros que deben rellenarse con los datos adecuados, como el título, el subtítulo, la fecha o el nombre del autor. De entrada, estos campos se muestran con texto entre corchetes: [Escribir el título ...]. Al hacer clic sobre él se muestra un cuadro de edición, donde hay que indicar el nuevo texto.
Portada - editar título
Ten presente que las portadas, al igual que el resto del documento, se ven influenciadas por el tema aplicado al documento. Es decir, que el aspecto variará ligeramente para adaptarse a los colores y fuentes del tema en cuestión y así dar un aspecto al conjunto más homogéneo.

COLOR DE PAGINA
. Al hacer clic, un menú te permite elegir el color en una paleta de colores.
Menú Color de páginaColor de fondo de página
Para recuperar el color blanco, elige la opción Sin color. Y si no encuentras el que quieres en la paleta, pulsa Más colores.... También puedes crear fondos más complejos, que no sean simplemente de un color sino que utilicen degradados, texturas y tramas

viernes, 2 de octubre de 2015

CLASAE 01 - WORD: CONFIGURACION DE PAGINA

Configuración de Página

Cuando estamos escribiendo en un documento Word es como si lo hiciéramos en una hoja de papel que luego puede ser impresa. Por lo tanto, existe un área en la cual podemos escribir y unos márgenes los cuales no podemos sobrepasar.
Estos márgenes se definen en la pestaña Diseño de página, en el grupo de herramientas Configurar página, donde también podremos encontrar herramientas para seleccionar la OrientaciónSaltos de páginaTamañoNúmeros de líneaColumnas y Guiones.
Al hacer clic sobre el botón Márgenes, aparecen unos márgenes predeterminados. Si ninguno nos sirve, podremos definir unos desde la opción Márgenes Personalizados.
Márgenes
También es conveniente especificar el tamaño del papel que vamos a utilizar en la impresión. Al hacer clic en el botón Tamaño, se abre una lista de Tamaños predeterminados. Pero, al igual que en los márgenes, aquí también se puede personalizar el tamaño de la hoja, haciendo clic en la opción Más tamaños de papel.

viernes, 11 de septiembre de 2015

Clase 03 - Hiperenlaces

Hiperenlaces <a>
Un hiperenlace, hipervínculo, o vínculo, no es más que un enlace, que al ser pulsado lleva de una página o archivo.
Aquellos elementos (texto, imágenes, etc.) sobre los que se desee insertar un enlace han de encontrarse entre las etiquetas <a> y </a>.
A través del atributo href se especifica la página a la que está asociado el enlace, la página que se visualizará cuando el usuario haga clic en el enlace.
Por ejemplo, para insertar el enlace:
Habría que escribir:
<a href="http://www.google.com.pe">Visita Google</a>

Destino de Enlace
El destino del enlace determina en qué ventana va a ser abierta la página vinculada, se especifica a través del atributo target al que se le puede asignar los siguientes valores:
 _blank:
Abre el documento vinculado en una ventana nueva del navegador.
 _parent:
Abre el documento vinculado en la ventana del marco que contiene el vínculo o en el conjunto de marcos padre.
 _self:
Es la opción predeterminada. Abre el documento vinculado en el mismo marco o ventana que el vínculo.
 _top:
Abre el documento vinculado en la ventana completa del navegador.
No te preocupes si no te queda del todo claro para qué sirve cada una de estas opciones de destino, ya que se volverán a ver en el tema de Marcos. De momento sólo te interesa retener la opción _blank y _self.
Para insertar el enlace:
Habría que escribir:
<a href="http://www.google.com.pe" target ="_blank">Visita www.google.com en una ventana nueva</a>
Es interesante utilizar esta opción cuando la página de destino está fuera de nuestro sitio para que cuando el usuario cierre la ventana del explorador, se encuentre automáticamente en la página desde la que había salido (que vuelva a nuestro sitio).

 Vínculo a ficheros para descarga:
El valor del atributo href normalmente será una página web (con extensión htm, html, asp, php...) pero también puede ser un fichero comprimido, una hoja de Excel, un documento Word, un documento con extensión pdf. Cuando el enlace no es a una página Web nos aparecerá el cuadro de diálogo que seguro habrás visto alguna vez en el que el navegador le pide al usuario permiso para descargar el fichero en su ordenador.
El navegador reconoce algunas extensiones como asociadas a un determinado programa (por ejemplo la extensión .doc está asociada al programa Word, .pdf al programa Acrobar Reader, .xls al programa Excel...) en este caso en el cuadro de diálogo aparece una nueva opción, la de abrir el fichero sin descargarlo en el disco duro del usuario.
Para nombrar el fichero podemos utilizar según el caso, una referencia externa, una referencia relativa al sitio o una referencia relativa al documento.
Por ejemplo, en la carpeta donde se encuentra esta página tenemos el fichero Word carta.doc y queremos que nuestros visitantes puedan visualizar e incluso descargar el fichero en su disco duro, en este caso definiremos el enlace:
De la siguiente forma:
<a href="carta.doc" tarjet=_blank >haz clic aqu&iacute; para descargarte el fichero</a>
En este caso hemos utilizado una referencia relativa al documento ya que la carta se encuentra en la misma carpeta que nuestra página.


viernes, 4 de septiembre de 2015

Clase 02 - Imágenes en HTML

<IMG> inserta imágenes

Para insertar imágenes en un sitio usaremos la etiqueta <img>.

Esta etiqueta debe ir acompañada del atributosrc que es el que contiene el URL de la ubicación del archivo de la imagen.

El atributo alt se utiliza para dar una breve descripción de la imagen, la cual podremos observar en caso que el navegador del usuario, por alguna razón, no muestre la misma.

La etiqueta <img> no tiene cierre.


Sintaxis

<img src="/URL" >

Ejemplo:

<IMG SRC="immagine.gif">

donce SRC corresponde al inglés Search y es el recorrido del que el navegador saca la imagen (en este caso "immagine.gif"). Como hemos señalado, esta marca es única en el sentido de que NO lleva como cierre el correspondiente </IMG>.



WIDTH y HEIGHT

En los ejemplos vistos hasta ahora, no hemos especificado las medidas de la imagen que el navegador se ha encargado de buscar automáticamente. Es posible definir la anchura y la altura de la imagen gracias a los atributos width y height, respectivamente:

<IMG SRC="immagine.gif" WIDTH="178" HEIGHT="180">

donde WIDTH="178" es la dimensión horizontal (ancho) de la imagen expresada en píxel, y HEIGHT="180" la dimensión vertical (alto).

Mediante estos atributos podemos definir dimensiones diferentes de las que realmente tiene la imagen. En cualquier caso, es aconsejable insertar imágenes con su tamaño efectivo sobre todo si están en formato GIF, dado que, cuando se cambian las medidas, este formato pierde mucha calidad.

BORDER
Con el atributo BORDER podemos aplicar un borde a la imagen. Los valores son numéricos y van expresados en píxel. Si impostamos el valor BORDER en 0, la imagen no va recuadrada. Cuando omitimos este atributo, el navegador no aplica ningún borde, pero si la imagen es también un enlace automáticamente se le asignará un BORDER=1. La sintaxis correcta es:

<IMG SRC="immagine.gif" WIDTH="178" HEIGHT="180" BORDER="2" >


HSPACE y VSPACE

Con estos dos atributos podemos establecer la distancia en píxel de la imagen a los objetos que se encuentran a los cuatro lados de la misma.




  • HSPACE define la distancia de los lados derecho e izquierdo de la imagen a los objetos más cercanos (texto, imágenes, apliques, etc.).
  • VSPACE define la distancia de los lados superior e inferior de la imagen a los objetos más cercanos (texto, imágenes, apliques, etc.). La sintaxis correcta es

    <IMG SRC="immagine.gif" WIDTH="178" HEIGHT="180" BORDER="2" VSPACE="3" HSPACE="3">

    Estos atributos resultan útiles cuando queremos distanciar la imagen de los objetos más cercanos.

    ALIGN

    El atributo ALIGN define la posición de la imagen respecto al texto colocado inmediatamente antes o después de la misma. Existen varias opciones para el atributo ALIGN:
  • ALIGN=top: alinea la primera línea de texto con la parte superior de la imagen.
    Para un ejemplo práctico, haz clic aquí.
  • ALIGN=middle: alinea la primera línea del texto con el centro de la imagen.
    Para un ejemplo práctico, haz clic aquí.
  • ALIGN=bottom: alinea la primera línea de texto con la parte inferior de la imagen.
    Para un ejemplo práctico, haz clic aquí.
  • ALIGN=left: el texto se coloca a la derecha de la imagen empezando desde la parte superior de la misma.
    Para un ejemplo práctico, haz clic aquí.
  • ALIGN=right: el texto se coloca a la izquierda de la imagen empezando desde la parte superior de la misma.
    Para un ejemplo práctico, haz clic aquí
  • viernes, 28 de agosto de 2015

    Clase 01 - Caracteres especiales

    Caracteres especiales

    Muchas veces necesitamos incluir en nuestros textos, signos que tienen un significado especial en HTML (por ej. "<" - menor que).

    Para poder mostrarlos, debemos usar su nombre en código.

    Los nombres de las entidades están compuestos por el signo(&), luego el nombre de la entidad y al final (";" - punto y coma).

    Los números de estos caracteres están compuestos por (&), luego (# - numeral), el número de la entidad y al final (";" - punto y coma).

    Por ejemplo para mostrar el signo "<" debemos escribir &lt; o &#60;.

    Caracteres especiales de uso frecuente

    ResultadoDescripciónNombreNúmero
    Espacio en blanco&nbsp;&#160;
    <Menor que&lt;&#60;
    >Mayor que&gt;&#62;
    &&amp;&#38;
    "Comillas&quot;&#34;
    ¡Apertura signo de exclamación&iexcl;&#161;
    ¿Apertura signo de interrogación&iquest;&#191;
    ®Marca registrada&reg;&#174;
    ©Derecho de autor&copy;&#169;
    Euro&euro;&#8364;
    áa minúscula con acento&aacute;&#225;
    ée minúscula con acento&eacute;&#233;
    íi minúscula con acento&iacute;&#237;
    óo minúscula con acento&oacute;&#243;
    úu minúscula con acento&uacute;&#250;
    ññ minúscula&ntilde;&#241;
    üu minúscula con diéresis&uuml;&#252;
    ÁA mayúscula con acento&Aacute;&#193;
    ÉE mayúscula con acento&Eacute;&#201;
    ÍI mayúscula con acento&Iacute;&#205;
    ÓO mayúscula con acento&Oacute;&#211;
    ÚU mayúscula con acento&Uacute;&#218;
    ÑÑ mayúscula&Ntilde;&#209;
    ÜU mayúscula con diéresis&Uuml;&#220;