Trucos para mejorar su Web: Scripts

Mostrando entradas con la etiqueta Scripts. Mostrar todas las entradas

martes, 10 de mayo de 2011

Insertar en mi web: Horas restantes para finalizar el día:

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.

El reloj...

<body>

<p>El reloj...</p>

<form name="Reloj">

<input type="text" size="7" name="tiempo" value="mm:hh:ss" title="Tiempo restante para finalizar el día">

<script language="JavaScript">

<!--

var tiempoAtras;

updateReloj();

function updateReloj() {

var tiempo = new Date();

var hora = 23-tiempo.getHours();

var minutos = 59-tiempo.getMinutes();

var segundos = 59-tiempo.getSeconds();

tiempoAtras= (hora < 10) ? hora :hora;

tiempoAtras+= ((minutos < 10) ? ":0" : ":") + minutos;

tiempoAtras+= ((segundos < 10) ? ":0" : ":") + segundos;

document.Reloj.tiempo.value = tiempoAtras;

setTimeout("updateReloj()",1000);

}

//-->

</script>

</form>

</body>

Via: http://www.usuarios.sion.com/

lunes, 9 de mayo de 2011

Gury – librería Javascript para HTML5 Canvas

Gury es una librería Javascript que nos ayuda a crear aplicaciones web, proporcionándonos una interface fácil de usar para trabajar con HTML5 Canvas.

Con Gury podrás crear elementos Canvas y trabajar con ellos de manera sencilla. Incluye funciones para cambiar los tamaños, aplicar estilos, agregar objetos y animarlos.

Los diseñadores de esta librería quisieron que fuera lo menos complicada posible. Por lo cual, se basaron en la filosofía de Jquery. Con Gury sólo necesitas una sola línea de código para construir un Canvas completo.

El principal objetivo de Gury es suministrarnos un marco para trabajar con la API de HTML5 Canvas, de un modo más simple.

La API de Gury dispone de una excelente documentación, con ejemplos claros y sencillos. Esta documentación está dividida en secciones: Core Gury, Manipulación de objetos, Dibujo y animación, Eventos.

Trabajar con Gury en tus proyectos con HTML5 Canvas puede resultarte de gran ayuda, en especial si aún no te sientes familiarizado con la API de HTML5 Canvas.

Vía: http://wwwhatsnew.com

jueves, 14 de enero de 2010

¿Como insartar un contador de visitas en mi web?

Contadores de visitas

Los contadores de visitas son esos sencillos códigos que podemos colocar en nuestras páginas para mostrar un gráfico con el número de visitas que recibió la misma. Existen infinidad de sitios que brindan este servicio, ofreciendo contadores con distintos tamaños, colores y estilos, de esta manera podemos utilizar el más adecuado para el diseño de nuestro sitio. Hay 2 tipos de contadores: Aquellos que muestran cuántas veces fue visitada una determinada página, y aquellos que sólo muestran el número de visitas simultáneas en línea (también llamados contadores de usuarios online o usuarios conectados).

La instalación es común en la mayoría de los servicios: rellenamos un formulario con algunos datos como la URL de nuestro sitio, e-mail, etc. y se genera un código que deberemos insertar en el código fuente de la página donde deseamos que se muestre el contador.

Contadores de visitas

Easytrafficcounter.com

contadores de visitas

Unos 50 estilos aprox. Posibilidad de seleccionar entre 4 y 10 dígitos para el contador.

Amazingcounters.com

Contadores de visitas

Muy buen servicio con más de 400 estilos de contadores agrupados por categorías. Opción de asignar un valor inicial y de contar visitas únicas o totales. Desde contadores en chino hasta en códigos de barra, muy variado. Recomiendo los micro contadores (Ver imagen) ya que son dificiles de encontrar en otros servicios.

Micodigo.com

Contador con posibilidad de integrar 3 datos en forma optativa: Visitas totales,visitas de hoy y visitas online.

Thewebhitcounter.com

Similar al segundo. También agrupados por categorías. Si bien hay varios que se repiten, coloco la url del sitio por las dudas encuentren alguno distinto que les guste.

Contadorweb.net

Puedes seleccionar entre más 80 estilos diferentes. Opción para ingresar valor inicial.

Contadorgratis.web-kit.org

Unos 75 estilos. Opción de valor inicial.

Contadores.pagerank-tracking.com

80 estilos aprox. Opción de valor inicial.

Contadorgratis.es

10 estilos. Contador de visitas únicas y totales.

Contadorweb.com

Unos 10 estilos aproximadamente. Además posee un directorio para incluir nuestro sitio.

Contadores de usuarios online o conectados

Whos.amung.us

Contador gráfico muy fácil de instalar (Lo cité en el blog hace un tiempo).

Micodigo.com

Contador gráfico. Este servicio, ya citado más arriba, cuenta con opción de visitas online.

Promociona.net

Contador no gráfico con posibilidad de modificar tamaño, color y tipo de letra. Requiere registración (gratuita).

Usuarios-online.com

Un contador muy sencillo. No gráfico.

http://www.tooler.com.ar/category/servicios/

sábado, 2 de enero de 2010

Redirección 301: cambiar URL de forma permanente

La Redirección 301

En muchos casos nos encontramos con la situación de que teniendo la dirección de una página, hemos cambiado a una URL nueva, y por supuesto queremos que nuestros visitantes actuales se enteren de que hay una nueva dirección para acceder.

Pongamos así, el hipotético caso de que tenemos una web (http://micarromelorobaron.blogspot.com/). Por una serie de razones hemos decidido cambiar a una URL nueva: ya sea porque hemos cambiado dedominio, el hosting tenía dominio propio y nos gusta más un dominio.com, etc…

En nuestro ejemplo hemos cambiado de dirección porque la longitud de la URL que teníamos no nos parecía adecuada. Asi pues, cambiamos a una nueva URL:

http://www.micarromelorobaronanochemientrasdormia.com/.

El usuario webmaster suele realizar una de las tareas siguientes para solucionar esta situación:

Avisar por texto e incluir un enlace: El webmaster ha preparado una página para que al acceder a la dirección anterior muestre un texto avisando al visitante humano que la página ha cambiado de dirección, junto a un enlace para acceder a la nueva dirección. La peor solución de todas.
Una redirección META: El webmaster incluye el siguiente código HTML en su dirección anterior:

 <head>

<meta http-equiv="refresh"

content="0;URL=http://www.nuevaurl.com/">

<title>Hemos cambiado de dirección</title>


Con ello realiza una redirección a nivel del navegador (pero que sólo algunos navegadores lo efectuan) y la cuál tarda más en realizarse. Viene a ser mejor que la anterior, pero sigue siendo una mala solución.
Redirección a nivel del servidor: El webmaster coloca el siguiente código, en un lenguaje de servidor, como por ejemplo ASP o PHP:
 <?php

header("Location: http://www.nuevaurl.com/");

?>  

Con este ejemplo, hacemos una redirección instantánea. El usuario no se da cuenta de que hay una redirección, excepto por el cambio de la URL. Es una de las mejores soluciones, no obstante, no es la mejor.
Redirección 301: Esta redirección trata a nivel de usuario humano exactamente igual que la anterior, pero con un ligero cambio que es muy importante.
La mayoría de los buscadores o robots indexadores, al encontrar una redirección 301 saben que la URL ha cambiado a la web redirigida, actualizando en un breve espacio de tiempo todas las URLs antiguas de su base de datos a la nueva URL. Esto es muy importante, ya que en un buscador como Google, por ejemplo, perdería el número de enlaces existentes a su web, muchos usuarios no entrarían y buscarían otra web por no tener que volver a pinchar en un enlace, etc.
 <?

Header( "HTTP/1.1 301 Moved Permanently" );

Header( "Location: http://www.nuevaurl.com" );

?> 
¡Por fin! Hemos llegado a la mejor redirección posible La redirección 301 es muy importante por esta última razón. Siempre se debe mantener una dirección principal de esta forma para no duplicar contenido

miércoles, 9 de diciembre de 2009

¿Como insertar un Calendario en mi Web? III

If you need a simple, elegant calendar to display the current days of the month, the current date is highlighted within the Calendar. Basic Calendar is an excellent script for the purpose. Uses CSS to allow easy changing to its appearance, everything from calendar dimensions, colors, down to the font used to highlight the current day. Easily expand script to display multiple months, either all at once or otherwise. You can create simple functions to display the calendar dynamically, such as on demand using a drop down menu.

Details

Cost: Free

CodeThatCalendar

CodeThatCalendar enables you to easily add the date/time picker to your form or page. Both popup and inline calendars are supported. Features include support for current date and week highlighting, localization, CSS support; Ability to setup start year, date; Configurable scrolling feature; Support for various date formats; Ability to configure the Calendar through the CSS styles; Inline calendar support; Unlimited number of the calendar controls on the same form/page; All titles can be configured so localization of the calendar is easy.

Cost: Freeware
Version: 1.01
Platforms: Windows, Linux

DatePicker Control

The DatePicker lets users easily select valid dates. No need to worry about date formats, by picking dates it's always correct. Browsing through the years is possible. Works with pre-1970 dates (no unix-style limitation). Allowed input formats are: American mm/dd/yyyy (12/31/2003), European dd.mm.yyyy (31.12.2003) and ISO yyyy-mm-dd (2003-12-31). The style and colors can be highly customized by color names and/or css classes. Dates can be selected and typed in. Validation of typed in dates - eg 2001/02/29 won't be accepted. Knows leap years.

Cost: Free/$20.00 - $460.00
Version: 4.5
Platforms: All

FlatCalendarXP

FlatCalendarXP is arguably the most powerful and configurable JavaScript calendar available. There are very few, if any, things that other JavaScript calendars can do that FlatCalendarXP can not. You'll be amazed to see how simple and fast it is to get it generated by a calendar tag. It features database-driven events/agendas, real cross-browser capability, extremely customizable UI, super easy-to-use design and a compact and fast JavaScript engine. It works perfectly with ASP.NET, ASP, JSP, PHP, ColdFusion and other web frameworks.

Cost: Free/$109.00 - $999.00
Version: 9.4.246

Javascript Date Selector

The Javascript Date Selector allows you to remove clumsy date fields on forms. With this date selector you can configure numerous date formats such as European date format (dd/mm/yyyy) or USA date format (mm/dd/yyyy). The date selector allows you to use either a mouseover or a onclick action to force the graphical calendar to popup. From there it allows you to navigate through months or years so that you can select the exact date you want. Once selected it automatically generates the date in the format that your script is set to.

Details

Cost: Free/$40.00 - $350.00

PopCalendarXP

PopCalendarXP is a good looking JavaScript date picker that comes with many convenient features to facilitate date inputs on your webpage. In short words, it's simple outside while powerful inside and all well documented that even people with little JavaScript experience can get it working in no time. It features auto-adaptive positioning, database-driven events/agendas, real cross browser capability, extremely customizable UI, super easy-to-use design and many handy options. It works perfectly with.NET, ASP, JSP, PHP and so on.

Cost: Free/$109.00 - $199.00
Version: 8.1

ScriptCalendar

ScriptCalendar is a DHTML JavaScript Calendar that displays dates in typical wall calendar format for a specified month. The calendar is interactive and the user may select any month or year to display. The calendar has events that may be displayed within a date and these events are customizable. ScriptCalendar is consists entirely of javascript, no server side processing required. The events may be stored in a dcevent.js file, or in XML format. An XML toolkit is included which provides a GUI interface for adding or modifying events.

Details

Cost: Trial/$45.00
Version: 4.0
Platforms: All

Simple Calendar Widget

Here's a flexible, simple pop-up calendar written to work across browsers. It's fully commented and customisable for language, colours, date format and the week's start day. The pop-up displays a month at a time from a specified range of years. The optional year, month and day input determines the initial month displayed. Allows disabling of dates, date ranges and days of the week. This is ideal for combination with server-side technologies to produce a professional application.

Details

Cost: Free
Version: 3.70
Platforms: All

Tigra Calendar

Popup timestamp picker is a JavaScript applet that makes it easy for your visitors to fill out the date/time field(s) of your form, by selecting the date from a popup calendar. Script saves the time for those internet/intranet developers who need intuitive, easy to use client-side date or timestamp input control.

Details

Cost: Free
Version: 3.2
Platforms: All

Date Picker

The Date Picker object is the ideal calendar solution that allows you to create attractive calendar user controls quickly, easily and with no effort. The object provides you, as the developer, with the assurance and security that your user-inputs follows acceptable date formats and standards. The clickable dropdown calendar provides your users with an easy to use and intuitive control that prevents users from entering incorrect or invalid responses. The calendar dropdown will only activate if your user needs to input a date.

Details

Cost: $19.00
Version: 3
Platforms: All

Diseño Web, Registro de dominio y Hospedaje Web