08 mayo 2011

Detectar el navegador

Esto sirve para comprobar el navegador que se está usando, por si queremos crear una página para Netscape y otra para Internet Explorer:

Tu icono en la lista de los favoritos

Este recurso es muy bueno funciona en IE y Mozilla. Cuando alguien agrega tu página a la lista de favoritos, aparece al lado del título un pequeño icono de Internet Explorer o Mozilla. ¿Qué tal si colocas tu propio icono allí? Sí: más personalización para tu sitio. 
Para que el icono aparezca en la lista de favoritos del usuario, tenés que colocarlo, primero, dentro de tu espacio y después, incluir dentro de tus páginas una pequeña y simple línea de código que hará que el mismo aparezca en la lista. Podés usar cualquier icono que desees (no olvides que los archivos de icono tienen la extensión .ICO, imágenes gif o jpg no pueden ser usadas).
Incluye el siguiente código entre las etiquetas "<head>" y "</head>" de tu página:

Menú desplegable

El menú desplegable permite que coloques varios enlaces en un solo lugar. Con esto, ganás espacio y facilidad de navegación. Este menú no necesita un botón para activarse. Basta con seleccionar el enlace y automáticamente el navegador se dirigirá a la página. Este menú funciona en páginas sin marcos. 
Para crear tu menú y personalizarlo, pegá el siguiente código en tu página HTML:

Efectos de transición especiales

Estos efectos de transición son especiales porque con ellos tu página tendrá una apertura muy original, pero sólo funcionarán con Internet Explorer. No tendrás problemas para utilizar este recurso, ya que los usuarios de otros navegadores no verán errores y la página se cargará normalmente.
Ingresá el código debajo de la etiqueta <body> de tu página. 

Texto en la barra de estado

Con este recurso puedes incluir varios mensajes, novedades y noticias sobre tu sitio. Es una forma de destacar lo que quieras y también de agregar un efecto diferente a tu sitio.

Texto de apertura

Este es un recurso muy interesante. Podés lograr que, al entrar a tu página, el usuario vea un mensaje de bienvenida o cualquier otro que configures. Luego, el usuario es llevado automáticamente a la página que tú definas. 
Para tener este recurso en tu página, sólo debes copiar el siguiente código, pegarlo en tu editor y guardar la página como principal. De esta forma, al entrar a tu página, los visitantes verán los mensajes y luego serán llevados a la página que tú definas. Es muy fácil configurar este recurso. Basta con alterar las áreas destacadas en negrito en el código. Si tienes problemas con algún editor HTML que no reconozca el código, copia y pega este código en el bloc de notas del Windows u otro editor de texto y no olvides guardarlo con extensión html.

Texto animado

Con este recurso puedes hacer que cualquier texto tenga movimiento en tu página. Es ideal para destacar tu logo o lo que vos prefieras.

Saludo al visitante

Puedes poner en tu sitio un mensaje personalizado según la hora en que el visitante entre. Este puede recibir el saludo "Buen día", "Buenas tardes", "Buenas noches", o puedes sustituirlos por otros mensajes de tu preferencia. De esta forma el visitante verá el mensaje de acuerdo con el horario que entre a tu página. 

Barra de estado fija

Puedes colocar la palabra o el mensaje que quieras en la barra de estado de tu sitio y mantenerlo fijo. De esta forma tu sitio quedará mucho más personalizado, además de contar con otras ventajas. Por ejemplo: el visitante no verá la dirección del enlace al que está apuntando, sólo el mensaje definido por vos. 

Imprimir pagina actual

Este tipo de codigos se utiliza para poder hacer que el usuario pueda tener una copia de algun contrato importante o alguna lectura que le paresca muy interezante y poderla imprimir, para poder seguir leyendo sin necesidad de estar en la pc.

Atrás y Adelante

Esta es la forma de hacer que una web con una paginacion muy simple, ya que hay otros procesos mas grandes y mucho mejores, pero para comenzar podemos ir utilizando esto dependiendo a nuestros conociemientos.

Mensaje de bienvenida

Con este recurso personalizás tu sitio para el visitante. Al entrar, el visitante verá un espacio para ingresar su nombre y un mensaje que dice "Hola, Fulano".
Copiá el siguiente código y pegalo donde quieras que aparezca el mensaje:

Poniendo fecha en tu sitio

Aprende a incluir la fecha en tu sitio sin necesidad de actualizarla cada día. Sólo tienes que usar un JavaScript que automáticamente exhibirá la fecha del día en tu página cada vez que ésta se abra. 
No tienes que preocuparte con ninguna configuración. Sólo tenés que copiar y pegar el código en tu página.

Cambiar el color de la barra de desplazamiento

Con éste código van a conseguir cambiar el clásico color gris de la barra de desplazamiento de la derecha y abajo por el color que quieran. Para cambiar de colores, cambien el número 000000 por otros, cada color tiene su número, pero la lista es muy larga, así que prueben con los número que ya van a encontrar el deseado.

Cambiar el color de la barra de desplazamiento al pasar el mouse

Con este truco puedes hacer que además de cambiar el color clásico gris de la barra de desplazamiento por otro, hacer que cuando el mouse se pose sobre ella cambie a otro color. Cambiando los números y letras en verde variaran los colores. Pruebalo pasando por la barra de la derecha!.

Página protegida por clave

Este es un excelente recurso. Pudes proteger tus páginas con una clave. Así pudes definir exactamente quienes entrarán a tu página. No tienes que preocuparte por configuraciones. Es muy sencillo: la clave siempre será el nombre de tu página sin la extensión .htm, es decir, si la página tiene el nombre de "ejemplo.htm", la clave será "ejemplo". ¿Ves que fácil?.
Para tener este recurso en tu sitio debes incluir un código en la página de "entrada" en donde el visitante ingresará la clave, y enviar a tu sitio el archivo de la página que será cargada.

Texto en expansión

Colocá en tu página mensajes animados que se agrandan y llaman la atención de los visitantes. Además, incluyen enlaces hacia donde vos quieras.
Copiá el siguiente código y pegalo en tus páginas debajo de la etiqueta <Body>. 

Imagen volando por la pantalla

Este efecto hace que cualquier imagen que elijas quede "paseando" por la pantalla, siendo un recurso excelente tanto para llamar la atención por alguna novedad en tu sitio como para darle más movimiento a la página.
Copiá y pegá el siguiente código en tu página HTML.
Recordá que la imagen debe estar en el mismo directorio de tu página html.


Texto que sigue al mouse

Has que un texto cualquiera siga al mouse del visitante en tu página. Es un efecto fabuloso y fácil de incluir en las páginas
Incluye el siguiente código en tu página HTML:

Botón Colorido

¿Cansado del botón siempre gris?
Ahora con CSS pudes definir cualquier color para tus botones. Ellos combinarán más con tu página y son muy fáciles de crear.
Copia el código que sigue y pegalo dentro de la etiqueta de formulario de tu página:


Pantalla que tiembla

Al insertar este código, cada vez que entremos en la Web se producirá una especie de terremoto en el explorador. Un efecto interesante para atraer la atención de nuestros visitantes.

Letrero de mensajes

Este es un efecto muy fácil de lograr y muy funcional para tu página. Puedes definir cuántos textos y enlaces quieras. Ellos se destacarán y tu página quedará mucho más dinámica. Podés ver cómo personalizar este recurso al final de esta página. Es mejor que Java ya que es mucho más liviano y rápido de cargarse, y no necesita archivos adicionales.
Para incluir este recurso en tu página debes seguir dos pasos: 

Botón animado

Aprendé a dar movimiento a tu página con botones animados por Java Script. Cada botón puede llevar a un enlace distinto. Sólo tienes que configurar los parámetros "lineArr" y "urlArr" del script, que permiten destacar cosas en tu página.

Hora y texto en la barra de estado

Con este truco, podemos hacer que aparezca en la barra de estado la hora de la PC que entra a nuestra Web y poner el texto que queramos.

Abrir un link de una imagen en una ventana nueva

Con este código podemos insertar una imagen (ej. banner) y que al hacer click sobre ella se abra el link de destino en una ventana nueva. Primero ponemos la ruta del link de destino, y luego la ruta donde está alojada la imagen. Si está alojada en la raíz de nuestro servidor solo ponemos el nombre y listo.

Barra de desplazamiento de colores

A continuación veremos otro código para ponerle color a la barra de desplazamiento, en este caso vamos a poder personalizar los colores de la barra, del fondo y los bordes. Reemplazar los nombres de los colores por otros o por los código de letras y números. Mas abajo está la tabla de colores.

Crear un PopUp

Abrir una pequeña ventana con una imagen. Podemos darle las medidas que queramos cambiando "Width" y "Height".

Abrir un Link en una Ventana Nueva

Cuando tenemos Links en nuestras páginas y alguien hace clic sobre ellos, automáticamente se abre esa dirección en nuestra ventana. Con este truco podemos hacer que al hacer clic sobre un determinado Link, esta dirección se abra en una ventana nueva, quedando la nuestra también abierta:

Enviar un e-mail con Asunto y Mensaje

Con este truco pudes hacer que al hacer clic sobre una palabra, se abra el Outlook para enviar un mensaje con tu dirección, el asunto que quieras y el texto que quieras.

Establecer una página como inicio

Este código html te sirve para crear un link para que el visitante pueda hacer que tu página sea la de inicio de su computadora. Con solo hacer clic sobre el link creado, tu página se iniciará automáticamente cada vez que esa persona se conecte a Internet.

Dificultar copia de página

Con este recurso sencillo podemos hacer más difícil el acceso al código-fuente o la copia de imágenes de nuestro sitio.
Cuando el visitante haga click con el botón derecho del mouse, surgirá un mensaje creado previamente por nosotros.
Recordemos que a algunas personas no les gusta este tipo de bloqueo.
Nosotros tenemos que decidir si queremos incluirlo o no en nuestras páginas.
Podemos colocarlo antes de la etiqueta <html> o después de la etiqueta <body>.

Comentario sobre un link en la barra de estado

Al pasar el mouse sobre el link deseado, veremos en la barra de estado un comentario sobre éste.
Esto se usa mayormente para poder dar una pequeña informacion al usuario para que se de cuenta si le intereza o no. 

Transformar el cursor en una mira

Esta herramienta de las flechitas es una de las mas usadas en las webs ya que permite dar un toque atractivo.
Transformá la clásica flechita de Windows en una mira de disparo.

Subrayar un Link al pasar el mouse

Con este código podemos lograr ese tan conocido efecto que al pasar el mouse sobre un link, este se subraye. Podemos hacer que tenga un color antes de visitar el link, y que tenga otro una vez visitado.

Efecto nieve con cualquier imagen

Con este truco podés hacer que caigan por la pantalla varias veces la misma imagen con un efecto estilo nieve.
Puedes cambiar la imagen reemplazando por una tuya alojada en el servidor poniendo su nombre donde está en rojo.

Crear un link para download

Si queremos poner archivos para que los visitantes los puedan descargar a sus computadoras, solo debemos subir ese archivo a nuestro servidor e insertar en nuestra Web el siguiente código HTML:
y como se logra eso ps se logra mediante un autoejecutable .exe 

Insertar un sonido o música de fondo

Si quieren que los visitantes escuchen una canción mientras visitan la Web, o simplemente recibirlos con una melodía estilo presentación, este es el código que estabas buscando. Solo tenies que guardar el sonido en el directorio raíz de tu servidor e insertar el siguiente código html:

Cuadro explicativo de los enlaces

Sorprendé a tus visitantes con este asombroso truco. Al pasar el mouse sobre el link, aparece la explicación de ese link en un cuadro con la cantidad de palabras que queramos poner. Solo tenés que reemplazar mis direcciones por las tuyas, y el texto deseado por el tuyo.

Crear un Formulario o Libro de Visitas

Con este código podemos crear un formulario para que complete el visitante. O también un libro de visitas, luego que el visitante apriete el botón "enviar", los datos serán enviados a tu casilla de correo.

Recomendar Pagina

Con este código podemos hacer que si a un visitante le gustó nuestra Web, la recomiende a un amigo escribiendo su dirección de correo electrónico en la casilla, al hacer click en "Recomendar esta Web" se envía un mensaje de correo con el asunto "Pienso que te puede interesar esta página..." y en el cuerpo del mensaje aparece la dirección completa donde se encuentra el código y el título de la misma.

Horas restantes para finalizar el día

Con este código insertamos un pequeño relojito que indica la cuenta regresiva de las horas, minutos y segundos que faltan para finalizar el día.

No dejar seleccionar el texto de nuestra Web:

Con este código vamos a impedir que los visitantes seleccionen el texto de nuestra página para luego copiarlo a otro lado.

Abrir una Web en Pop Up:

Con este código vamos a hacer que al entrar en nuestra página automáticamente se abra otra, ej. otra Web nuestra, una sección que queremos mostrar, una publicidad, etc.

07 mayo 2011

Redireccionar una página

Si tienes una dirección larga, y los servidores que te dan direcciones cortas no tienen buena capacidad de almacenamiento o de taza de transferencia de datos, con este código puede hacer que al escribir una dirección se abra otra, solo tenés que insertar este código en el index.html del dominio corto poniendo tu dirección actual donde está en verde:

 
 

Ultimos post agregados

Ultimos post