martes, 18 de octubre de 2022

OpenOffice Writer (II): elaboración de catálogos


Utilizando el procesador de textos de OpenOffice-Writer diseña un catálogo/revista sobre nuevas tecnologías que tenga una portada y dos páginas. Crea una cuenta en Issuu.com y publícalo.









Webs Interesantes

 

 

TinyWow        Web multiherramienta

HotPoi             Efectos gráficos

Pranxs             Bromas de Hacker

Waifu              Ampliar una imagen

Compressor    Comprimir una imagen

FlightRadar    Localizador de aviones en vuelo

Gusanooo 

Estroboscopio 

Falsa Identidad              EstaCaraNoExiste        GeneradordeCaras

Papel Higiénico 

Zooooom 

Bruno-Simon 

Geo-Greeting 

Perros     Gatos  Gatos

 GeoJuego

viernes, 7 de octubre de 2022

Como subir una página web a un servidor. Hosting Gratuito

 

 

  ¿Qué es hosting? es un servicio proporcionado por un servidor web 

que consiste en un espacio limitado en el que albergar nuestra sitio web, en dicho espacio almacenaremos nuestros ficheros y serán publicado siendo accesibles a el público general.

Encontrar un servicio totalmente gratuito es complicado, la mayoría añaden publicidad en nuestra web o interrumpen el servicio de forma aleatoria.

Vamos comenzar a probar servicios gratuitos, a ver si encontramos uno fiable. 

Este curso estamos utilizando este servidor, y por ahora está funcionando bastante bien:

https://www.awardspace.com/

En este videotutorial se explica como poder subir una web a este hosting de forma gratuita:



martes, 4 de octubre de 2022

HTML Basico (VII): etiqueta MARQUEE

La etiqueta <MARQUEE> </MARQUEE> crea una marquesina cuyo contenido se desplaza. Por defecto, ocupa todo el ancho de la pantalla, tiene una línea de altura y el texto se mueve lentamente de derecha a izquierda.
Esta es una marquesina por defecto.
Los atributos WIDHT y HEIGHT permiten controlar el ancho y el alto de la marquesina y pueden expresarse en pixeles o porcentualmente. El atributo ALIGN permite alinear el texto que rodea la marquesina, y puede tener los siguientes valores: top (arriba), middle (centrado) bottom (abajo). Los atributos HSPACE y VSPACE definen la separación horizontal y vertical del texto con los bordes de la marquesina:
<marquee width="50%" height="60" align="bottom">
... texto ...
</marquee>

Esta marquesina ocupa el 50% del ancho, tiene una altura de 60 pixels y está alineada con la parte inferior.

El color de fondo puede establecerse con el atributo BGCOLOR o, utilizando el atributo STYLE, podemos establecer cualquier propiedad, de manera similar al resto de las etiquetas HTML:

Esto se ve con la fuente Impact
<marquee style="...propiedades...">
... texto ...
</marquee>
Para controlar más efectivamente las marquesinas, existen una serie de atributos especiales:

DIRECTION se utiliza para modificar la dirección hacia la que se dirige el texto. Puede ser left (el valor por defecto), right, up o down:
<marquee direction="right">
 ... texto ...
</marquee>

El texto se desplaza de izquieda a derecha.
El texto se desplaza de abajo hacia arriba.
El texto se desplaza de abajo hacia arriba.
El texto se desplaza de abajo hacia arriba.
El texto se desplaza de abajo hacia arriba.
El texto se desplaza de abajo hacia arriba.
El texto se desplaza de arriba hacia abajo.
El texto se desplaza de arriba hacia abajo.
El texto se desplaza de arriba hacia abajo.
El texto se desplaza de arriba hacia abajo.
El texto se desplaza de arriba hacia abajo.

Con el atributo SCROLLDELAY se define el tiempo entre cada movimiento expresado en milisegundos:
<marquee scrolldelay="300">
 ... texto ...
</marquee>

Velocidad = 100.
Velocidad = 150.
Velocidad = 300.
LOOP indica el número de veces que aparecerá el texto y por defecto, es infinito.

Con SCROLLAMOUNT controlamos la cantidad de desplazamiento del texto en cada movimiento de avance. Cuanto mayor es el número, más rápido avanza:

Desplazamiento = 5.
Desplazamiento = 10.
Desplazamiento = 50.
Por último, el atributo BEHAVIOR (comportamiento) sirve para definir de que manera se va a efectuar el desplazamiento y puede tener los siguientes valores:
  • scroll (valor por defecto), aparece por un lado, se desplaza hasta el otro, desaparece y vuelve a empezar
  • slide aparece por un lado, se desplaza y se detiene (sólo funciona en Internet Explorer).
  • alternate se desplaza alternativamente hacia un lado y el otro.

Behavior = scroll.
Behavior = slide.
Behavior = alternate.
Las marquesinas no sólo pueden contener textos, también pueden contener otros elementos, por ejemplo, imágenes, vínculos o tablas:


Una tabla
Celda ACelda B
Celda CCelda C

¿Podemos controlar una marquesina mientras se ejecuta? Aquí hay un ejemplo simple, mediante dos pseudo-botones, logramos cambiarle la dirección:

<marquee id="ejemplo" direction="up">
  ... contenido ...
</marquee>

<a href="javascript:void(0);" onclick="getElementById('ejemplo').direction='down';">
  Hacia abajo
</a>
<a href="javascript:void(0);" onclick="getElementById('ejemplo').direction='up';">
  Hacia arriba
</a>

HTML Básico (VI): mapa de imágenes

          HTML nos permite la opción de crear diferentes enlaces url dentro de una misma imagen. Es decir, podemos hacer que diferentes partes de una imagen tengan enlaces que nos permitan ir a diferentes destinos.
         Las fotos en las que queramos introducir un mapa de imágenes deberán ser de uno de estos tres formatos: .jpg, .gif o .png, que son los tres formatos recomendables para todos los navegadores.

         A continuación vamos a explicarte como podemos crear esta etiqueta html y los diferentes atributos que posee este tag. Como veremos a lo largo del artículo, lo difícil de crear un mapa de imágenes no es el mapa en sí, sino encontrar las coordenadas en la imagen. Aunque existen programas de edición de imágenes que nos ayudarían en esa tarea.



HTML Básico (VIII): Celdas

Imaginad que tenéis que diseñar la siguiente tabla para la página principal de un sitio web

Con los atributos de la etiqueta <TABLE> que conocemos no podemos hacerla. Utilizaremos dos atributos nuevos. Para las etiquetas <td> y <th> existen los atributos colspan y rowspan, que se utilizan para combinar celdas.

 A través del atributo colspan se especifica el número de columnas por las que se extenderá la celda, y a través del atributo rowspan se especifica el número de filas por las que se extenderá la celda.

Ejemplo de ROWSPAN:

  <table width="80%" border="1" cellspacing="0" cellpadding="0">
<tr>
<td rowspan="3"><p>Países Europeos</p></td>
<td><p>España</p></td>
<td><p>Madrid</p></td>
</tr>
<tr>
<td><p>Francia</p></td>
<td><p>Paris</p></td>
</tr>
<tr>
<td><p>Reino Unido</p></td>
<td><p>Londres</p></td>
</tr>
<tr>
<td rowspan="3"><p>Países Americanos</p></td>
<td><p>EEUU</p></td>
<td><p>Washington</p></td>
</tr>
<tr>
<td><p>Canada</p></td>
<td><p>Toronto</p></td>
</tr>
<tr>
<td><p>Mexico</p></td>
<td><p>Mexico</p></td>
</tr>
</table>


Países Europeos España Madrid
Francia Paris
Reino Unido Londres
Países Americanos EEUU Washington
Canada Toronto
Mexico Mexico

HTML Básico (V) : Tablas

Las tablas se usan con profusión en las páginas Web, muchas veces debido a que son el único instrumento con el que se cuenta, para asegurarse que las cosas estarán en su sitio. Para definir una tabla se usan las etiquetas:
<TABLE> y </TABLE> son las etiquetas donde está contenida la tabla
<TR> y </TR> son las etiquetas que indican el comienzo y fin de una fila (<th> y </th> si es una fila de cabecera)
<TD> y </TD> señalan una celda.
La tabla se va definiendo declarando una fila y a continuación las celdas que contiene esa fila, luego otra fila y sus celadas, etc. No es necesario que todas las filas contengan el mismo número de celdas.
La tabla (2x2) más sencilla que podemos hacer es la siguiente
Escribimos: Visualizamos
<TABLE >
     <TR>
          <TD>1 </TD> <TD> 2 </TD>         
     </TR> <TR>
          <TD>3 </TD> <TD> 4</TD>
</TR>
</TABLE>