Contenido

Accesible News Slider, un slider que cumple las reglas del WCAG1.0

31 Ago

+ 2

Accesible News Slider, es un slider que se autopromociona indicando que cumple las reglas de accesibilidad marcadas en el WCAG 1.0. Y la verdad es que no es para menos, ya que este plugin para jQuery de tan solo 2kb de peso hace las delicias de más de uno.[Demo][Descargar][Via]

Excentricidades de un desarrollador

31 Ago

+ 38

Los programadores, solemos ser personas muy metódicas y acosumbradas a la rutina de sentarse delante del ordenador. A lo largo de años desarrollando, vamos acumulando vicios que marcan nuestra forma de programar. Hagamos un trato, yo te cuento los mios y tu me cuentas los tuyos, así no nos sentiremos bichos raros por tenerlos 😀

Nombres de variables y funciones

Tengo la manía de usar nombres en inglés para las funciones y nombres para las variables en castellano. No puedo explicar por que lo hago, pero es así.

function getValue($valor = "ejemplo") {}

Indentación de código

Gracias, o culpa, a mi amiga/compañera Marga tengo una manía, casi obseción con la indenteción del código. Cuando un compañero me pide que le eche una mano, tengo que perder unos minutos en indentar el código, lo hago inconscientemente.

function getValue($valores = "ejemplo") {
	if ($valores) {
		foreach ($valores as $valor) {
			if ($valor == "unovalor") return $valor;
		}
	}
}

Condesación de código

Esto además de ser una manía, es un problema, e intento evitarlo en medida de lo posible ya que mi código lo ha de mantener otras personas, y en algunas situaciones puede ser infumable compactar todo en una simple línea. El uso abusivo del operador ternario tiene la culpa.

var variable = "prueba";
alert ((!variable)?"NO":(variable != "prueba")?"NO2":"es una prueba");

Soy amigo de la variable $x, y de la $a, $y, $i,…

Es raro revisar mi código y no encontrar variables criptográficas como $x, $y, $a… generalmente para formar parte de un bucle, aunque no siempre las uso de esta forma,… esto es un problema para mi y mis compañeros ya que estas variables son en muchos casos indescfrables en el código.

for (var x=0; x < listado.length; x++) {
	y = a + listado[x];
}

¿Y tu? Cuentanos tus excentricidades

Añadir opciones al menú administrador de WordPress

31 Ago

+ 2

Retrofox, me pregunta en el foro como podemos añadir opciones al menú administrador mediante plugins, y la verdad es que el sistema que WordPress implementa para esto es muy interesante, así que deberíamos echarle un vistazo a lo que nos ofrece.

El Menú administrador

El menú de administrador de WordPress está compuesto de una serie de opciones que nos permite navegar por las diferentes opciones que todo blog basado en WordPress dispone y con las que podemos condicionar nuestro blog.

  • Tablero
  • Escribir
  • Administrar
  • Comentarios
  • BlogRoll
  • Presentación
  • Plugins
  • Usuarios
  • Opciones

Estas son las opciones que todo blogger se encuentra al entrar en su panel de administración. Cada una contiene una seríe de subcategorías que nos tienen las opciones más recogidas, evitando abrumar al usuario con todas las opciones posibles.

Continua —>

BlogDay 07

31 Ago

+ 6

Hoy es el BlogDay, un día destinado a  promover la filosofía blog y dar a conocer a los usuarios otros blogs. Como no quiero elegir a nadie en concreto he pensado que mejor me guio por la BlogoEdad y recomiendo a los usuarios que cumplen años hoy.

Muchas felicidades!!!

Por problemas con la hora del server puse los que cumplieron años ayer :(, así que estos son los que cumple años hoy.

Redirecciónes 301 en varios lenguajes

30 Ago

+ 8

Estoy desempolvando los borradores, y este llevaba ahi guardado unos cuantos meses, pero creo que puede ser interesante-

El código 301, por si solo me recuerda a un juego de dardos bastánte entretenido en el que has de ir descontando puntos hasta llegar a 0. Si lo extrapolamos a Internet, ese número se convierte en algo muy interesante y necesario de conocer para cualquier desarrollador/administrador web.

El HTTP Status Code 301, nos informa acerca del movimiento definitivo de una aplicación web. Esto significa que si un User-agent (como por ejemplo un robot) se pasea por nuestro sitio y se encuentra este error, tendrá en cuenta que tu sitio web se ha movido permanentemente a otro sitio.

Usando esta redirección, nos aseguramos que valores relacionados con nuestra aplicación se traspasarán a la nueva dirección, esto implica valores como PageRank, backlinks…

Por este motivo es algo debemos tener en cuenta cuando decidimos cambiar de forma permanente nuestra URL. Así que veamos como hacer esto en varios lenguajes para no perder el trabajo que ya hayamos hecho.

.httaccess

Options +FollowSymLinks
RewriteEngine on
RewriteRule (.*) http://www.yournewdomain.com/$1 [R=301,L]
//sin www 
Options +FollowSymlinks
RewriteEngine on
rewritecond %{http_host} ^www.yourdomain.com [nc]
rewriterule ^(.*)$ http://yourdomain.com/$1 [r=301,nc]
//con www 
Options +FollowSymlinks
RewriteEngine on
rewritecond %{http_host} ^yourdomain.com [nc]
rewriterule ^(.*)$ http://www.yourdomain.com/$1 [r=301,nc]

PHP

header( "HTTP/1.1 301 Moved Permanently" );
header( "Location: http://www.your-new-url.com" );

Cold Fusion

<.cfheader statuscode="301" statustext="Moved permanently">
<.cfheader name="Location" value="http://www.new-url.com">

GI-Perl

$q = new CGI;
print $q->redirect("http://www.your-new-url.com/");

ASP

<%@ Language=VBScript %>
<%
Response.Status="301 Moved Permanently";
Response.AddHeader("Location","http://www.your-new-url.com/");
%>;

ASP.NET

<script runat="server">
private void Page_Load(object sender, System.EventArgs e) {
	Response.Status = "301 Moved Permanently";
	Response.AddHeader("Location","http://www.your-new-url.com");
}
</script>

JSP 

<%
response.setStatus(301);
response.setHeader( "Location", "http://www.new-url.com/" );
response.setHeader( "Connection", "close" );
%>

Ruby on Rails

def old_action
	headers["Status"] = "301 Moved Permanently"
	redirect_to "http://www.new-url.com/"
end

shortKeys, controla las teclas con jQuery

30 Ago

+ 3

shortKeys es un plugin para jQuery que nos permite añadir un control de las teclas pulsadas por el usuario y a las que podremos añadirles una funcionalidad extra, reforzando los accesos directos de teclado de nuestras aplicaciones.

Ejemplo de uso

var jsonKeys = {
	'N': function () { alert("Has pulsado la N"); },
	'32': function () { alert("Has pulsado el espacio"); }
}
$(document).shortkeys(jsonKeys);

Por desgracias el tema de los códigos keyCode es algo que aún no está muy definido y los diferentes navegadores tratan a ciertas teclas especiales de una forma determinada, por lo cual en Safari y Opera tendremos problemas al usar este plugin.

[Demo][Descargar]

Cuidado con los ataques de hackers

29 Ago

+ 1

Mi buen amigo Xavi Llinas consigue alegrarme el día con esta noticia en la que nos muestra la cara más simpática de los «ataques de hackers». No tiene desperdicio xDDD

6 motivos por los que IE6 debe morir

29 Ago

+ 38

Firefox a pesar de hacernos felices, pero no hace ser conscientes de los motivos por los que Internet Explorer debería implosionar en si mismo y desaparecer cuanticamente. Algunos de estos motivos son:

  1. El soporte a las transpariencias en PNG
  2. Problemas con float + margin /padding
  3. Imposibilidad de usar pseudo-clases y pseudo-elementos.
  4. No tiene soporte CSS para min-height
  5. Problemas con la imagen de background de los enlaces en CSs
  6. Es posible colgar el navegador mediante código.

¿Se te ocurre alguna más?

Selectors API, mejorando la interacción con nuestro DOM

29 Ago

+ 9

Hoy via Ajaxian, leo que la W3C ha publicado un borrador sobre Selectors API, que se trata de mejorar el actual sistema de referencia de objetos del actual DOM. Al igual que herramienta como cssQuery de Dean Edwars, podremos acceder a cualquier elemento de nuestro árbol DOM usando la nomenclatura de CSS.

Para ello dispondremos de dos nuevas métodos hijos del objeto Document que nos permitirá hacer referencia a uno o varios elementos.

querySelector()

Element querySelector(in DOMString selectors, in NSResolver nsresolver);

Con esta función podremos seleccionar un solo elemento usando  la estructura usada actualmente en CSS.

Ejemplo

//Javascript actual 
function getObj() {
	var obj = document.getElementsByTagName("a");
	for (i in obj.length)
		if (obj[i].href == "http://www.google.es") return obj[i];
	return null;
}

var result = getObj();

//Selectors API
var result = document.querySelector('a[href="http://www.google.es"]');

querySelectoAll()

StaticNodeList  querySelectorAll(in DOMString selectors, in NSResolver nsresolver);

Con esta función podremos obtener una lista de elementos que cumplan las características que estamos buscando usando los selectores.

Ejemplo

//HTML
<table id="score">
  <thead>
    <tr>
      <th>Test
      <th>Result
  <tfoot>
    <tr>
      <th>Average
      <td>82%
  <tbody>
    <tr>
      <td>A
      <td>87%
    <tr>
      <td>B
      <td>78%
    <tr>
      <td>C
      <td>81%
</table>
//Javascript actual
var table = document.getElementById("score");
var groups = table.tBodies;
var rows = null;
var cells = [];

for (var i = 0; i < groups.length; i++) {
  rows = groups[i].rows;
  for (var j = 0; j < rows.length; j++) {
    cells.push(rows[j].cells[1]);
  }
}
//Selectors API 
var cells = document.querySelectorAll("#score>tbody>td:nth-of-type(2)");

Aunque en la API esté la cosa bastante clara y se haya decidido que esta funcionalidad será incrustada en el nuevo core DOM 3, aún se está debtiendo sobre que nombres se van a usar. Parece que la cosa está entre selectElement() / selectAllElements() y querySelector() / querySelectorAll();.

FancyForms, mejorando el aspecto de los checkbox

29 Ago

+ 5

Parte de la elegancia del sitio de MooTools son los pequeños y cuidados detalles que proporcionan un aspecto cuidado y elegante. Ahora nuestras aplicaciones pueden ser igual de cuidadas y podemos ofrecer al usuario un diseño elegante gracias a FancyForm.

Con FancyForm, podemos cuidar esos pequeños detalles, como los checkbox y radiobuttons de nuestros formularios. Como una buena extensión de MooTools el tamaño es uno de los puntos más cuidados, y con solo 3kb de librería podemos disfrutar de toda la funcionalidad que FancyForm ofrece.

fancyform.jpg

[Demo][Descargar