Javier Belmonte Guardiola

Una de las cosas que más me desconcertó en los primeros días de adaptación al iPhone fue la escasa duración de la batería, sobre todo cuando lo utilizaba a pleno rendimiento. En aquellos primeros días de uso eran varias las veces que debía de recargar el iPhone provocándome, además de la incómoda necesidad de tener contínuamente a mano el cargador, la errónea sensación de que la duración de la batería era más bien insuficiente.

Con el tiempo, algo de sentido común, y la experiencia en el uso, he conseguido disminuir el consumo de la batería del iPhone a unos niveles más razonables, pudiendo incluso llegar a aguantar de un día para otro sin necesidad de volver a enchufarlo al cargador. Y lo que es mejor, todo ello sin tener que reducir el uso que habitualmente realizo del iPhone.

Es por ello por lo que me permito aquí la licencia de lanzar 5 trucos o consejos para reducir el consumo de batería del iPhone.

1. Desactivar el 3G: Resulta extraño pensar en un iPhone sin una conexión de datos 3G permanentemente activada, pero también hemos de ser conscientes del elevado consumo que de ello se deriva. Por tanto lo mejor es mantener el 3G activado cuando sea realmente necesario, al enviar un mail, consultar una web o descargar una aplicación del App Store por ejemplo.
2. Desactivar el Wi-Fi: Igual que en el caso anterior, si sabemos que no vamos a tener una necesidad real de conexión, no tiene sentido tener habilitado el Wi-Fi. Menos aún si no disponemos de una red Wi-Fi a nuestro alcance, puesto que estará siempre tratando de encontrar una red disponible. Por otro lado, si tenemos la oportunidad, conviene utilizar Wi-Fi en lugar de 3G, ya que la conexión Wi-Fi consume mucha menos batería. Resulta interesante saber también que al activar el Wi-Fi se deshabilita por defecto la conexión 3G.
3. Bloqueo automático: Aunque siempre tenemos la posibilidad de bloquear manualmente nuestro iPhone, la cual es sin duda la mejor opción de todas, no está de más activar el bloqueo automático. En mi caso lo tengo configurado para que el iPhone se bloqueé tras un minuto de inactividad. Simple y efectivo.
4. Notificaciones Push: Las noficaciones Push son quizás la mayor causa del rápido consumo de la batería del iPhone. Para mitigar este efecto podemos decidir cómodamente entre mantenerlas siempre activadas o establecer una frecuencia de actualización. En mi caso casi siempre las tengo activadas, lo cual es idóneo por ejemplo para recibir el correo electrónico de forma instantánea en el iPhone, pero en ocasiones puntuales decido optar por una frecuencia de actualización de 30 minutos, en función siempre de las necesidades de cada momento.
5. Jugar con el Brillo: Otra de las formas más interesantes, y recomendadas por Apple, para reducir el consumo de la batería del iPhone es la de jugar con el brillo de la pantalla. Es conveniente activar la opción de que sea el propio iPhone el que ajuste de manera totalmente automática el brillo de nuestra pantalla. Como alternativa, en caso de no utilizar esta opción, resulta conveniente mantener un nivel de brillo moderado o ajustado al entorno en el que nos encontramos.

¿Y vostros, conocéis o sabéis de otros trucos para reducir el consumo de vuestro iPhone?

Como ya comenté en mi presentación, uno de los temas principales que se abordará en este blog es el que tiene que ver con las hojas de estilo, también denominadas cascade style sheet y más conocidas como CSS, el termino que se utiliza habitualmente cuando nos referimos a ellas.

Pues bien, las claves fundamentales a la hora de realizar un archivo CSS es que hemos de intentar siempre, como en cualquier otro lenguaje informático, que nuestro código sea limpio, claro y conciso, pero sobre todo hemos de saber optimizar nuestras líneas de código.

Un buen truco para empezar, muy sencillo, a la par que práctico, consiste en utilizar de forma apropiada y eficiente los atributos de los que disponemos, ya que muchos serán los casos en los que podremos simplificar mediante el uso de un único atributo.

Pero veámoslo mejor con par de ejemplos.

Ejemplo 1:

Tenemos definidos los siguientes atributos para las etiquetas div

div {
margin-top: 10px;
margin-bottom: 5px;
margin-right: 15px;
}

No obstante podemos utilizar directamente el atributo margin (top,right,bottom,left)

div {
margin: 10px 15px 5px 0px;
}

Como se puede observar, hemos optimizado considerablemente las líneas de CSS utilizadas, y el resultado es el mismo. Este sencillo truco se puede aplicar también al atributo padding.

Veamos otro ejemplo más.

Ejemplo 2:

Definimos los siguientes atributos para las etiquetas table

table {
border-color: #000000;
border-style: solid;
border-width: 10px;
}

No obstante podemos utilizar directamente el atributo border (width,style,color)

table {
border: 10px solid #000000;
}

Como ya se ha dicho con anterioridad, hemos de intentar que nuestro archivo CSS sea siempre lo más limpio y organizado posible. Una buena forma de lograrlo es estructurándolo de forma que podamos encontrar fácilmente las distintas clases que hemos definido. Para ello resulta vital la inclusión de comentarios, que pueden cumplir una doble función, informar y a la vez separar o agrupar nuestro código.

Remarcar que los comentarios en CSS se insertan entre las etiquetas /* para indicar el comienzo, y */ para marcar el final del comentario.

Veámos un ejemplo práctico.

Ejemplo 1:

/* === CABECERA ==== */
.HeaderContainer { … }
.HeaderLink { … }

/* === PIE DE PÁGINA ==== */
.FooterContainer { … }
.FooterLink { … }

Como se puede observar, hemos definido dos líneas de comentarios, que nos agrupan y separan los CSS utilizados en la implementación de la Cabecera por un lado, y los utilizados en la implementación del Pie de página por el otro. Cumpliendo así esa doble función que mencionabamos con anterioridad de organizar e informar.

Además la inclusión de estos comentarios ira creciendo en importancia, a medida que se incrementen las líneas de nuestro código, y el número de atributos CSS que vayamos definiendo. También será importante en el caso de que sean varias las personas que tengan que utilizar y trabajar sobre ese código CSS. Cuanto más conciso, claro y definido sea nuestro código, como ocurre generalmente en programación, mucho mejor.

Trabajar con Flash supone todo un reto para los que venimos del mundo Web ya que, aunque aparentemente sencillo, la potencia y versatilidad que encierra ActionScript combinado con las posibilidades gráficas que ya de por si ofrece Flash, hacen de esta herramienta un verdadero misterio y quebradero de cabeza para los que somos relativamente ajenos al diseño gráfico.

Por suerte, este no es del todo mi caso, ya que siempre me he sentido atraído por la capacidad y la plasticidad visual de Flash, la que para mi sin duda es la herramienta más utilizada para crear animaciones y llamativos efectos visuales, a la espera del despegue definitivo de Silverlight.

Por ello me atrevo ahora a dar algunos de los trucos o consejos que me han ayudado a sacar el máximo partido de Flash en estos años de uso de la herramienta. Aquí va el primero de ellos…

DETENER UN FOTOGRAMA DURANTE UN INTERVALO DE TIEMPO

Muchas veces, cuando estamos trabajando con una animación, más concretamente cuando queremos pasar de una transición a otra, de un fotograma a otro, puede interesarnos establecer un cierto periodo de pausa justo al cargar el nuevo fotograma, o incluso antes de cargarlo, algo que habitualmente, si somos primerizos e inexpertos, se suele conseguir simplemente añadiendo un mayor número de fotogramas.

No obstante, mediante ActionScript podemos evitarnos la creación de fotogramas innecesarios, manteniendo así un cierto criterio, orden y control sobre las escenas. Además también podremos controlar en todo momento el intervalo de tiempo que queremos que se detenga nuestra animación, sin tener que estar contando fotogramas ni tener que hacer cálculos con los fps.

El código en que deberemos incluir como acción en el fotograma que queremos que se detenga por un intervalo de tiempo es el siguiente:

Ejemplo 1:

stop();

function seguir():Void {
play();
clearInterval(retardo);
}

retardo = setInterval(this, “seguir”, 3000);

Donde el valor marcado en negrita es el intervalo de tiempo en milisegundos.

Para los que os interese un poco más saber que se está haciendo con estas líneas de código, deciros que simplemente estamos ejecutando una parada de la animación mediante la llamada a la función stop(). A esto le sigue una llamada a la función setInterval() que es la que se encarga de introducir el retardo tras el cual se realizará una llamada a la función que hemos definido previamente como seguir(). Esta función que hemos creado nosotros y hemos denominado arbitrariamente seguir() es la que se encarga de reanudar la animación mediante la ejecución primero de la función play() y justo después de clearInterval(), que es la que anula y cierra la llamada inicial a setInterval().

Más información sobre las funciones predefinidas aquí utilizadas (en inglés):

stop () : Definición en el Sitio de Adobe Flash
play () : Definición en el Sitio de Adobe Flash
setInterval () : Definición en el Sitio de Adobe Flash
clearInterval () : Definición en el Sitio de Adobe Flash

Como muchos de vosotros sabréis, el posicionamiento en buscadores o SEO se ha convertido en una de las claves principales que hay que controlar y manejar a la hora de lanzar un proyecto en Internet, sobre todo si lo que pretendemos es alcanzar cierta magnitud de tráfico y de visitantes. Antaño era realmente importante aparecer en los grandes directorios como Yahoo!, y para ello bastaba con que tu site fuera revisado y aceptado, sin conocerse muy bien cuales eran los criterios para realizar dicha selección. Pero la irrupción de los buscadores, los crawlers y sobre todo la presencia amenazante de Google, ha hecho que el cuidado, la presencia y optimización de los sitios web sea realmente importante para su buen posicionamiento.

Cuando tenemos el control total sobre nuestro proyecto web, resulta realmente interesante aplicar técnicas básicas ya desde la primera confección de nuestros XHTML o sites en PHP. Algunas de las técnicas básicas más comunmente empleadas y aceptadas son, entre muchas otras, el minucioso cuidado de las etiquetas TITLE y DESCRIPTION, el resaltar nuestras palabras relevantes mediante la utilización de la negrita o el uso adecuado de las cabeceras H1, H2…

Pero cuando estamos utilizando un CMS, sobre todo cuando éste es Open Source, nos encontramos en cierto modo algo limitados a la hora de poder plantear y ejecutar estas interesantes mejoras. Por suerte, WordPress ofrece un código bastante limpio y muy optimizado de cara al SEO, y aunque finalmente acabamos dependiendo de cómo han sido implementadas las plantillas en PHP, éstas suelen estar también muy orientadas al posicionamiento en buscadores.

No obstante hay pequeños detalles que se nos escapan, como es la posibilidad de personalizar los TITLE y los DESCRIPTION de cada una de nuestras páginas, entradas o categorías. Para solventar este problema existe un interesante plugin, el All in One SEO Pack, con el que podremos gestionar de forma genérica el comportamiento de las mencionadas etiquetas TITLE y DESCRIPTION de los distintos apartados de nuestro blog en WordPress.

Personalmente yo ya he empezado a ponerlo en práctica, y resulta realmente útil, sobre todo si lo que queremos es aprovechar la jerarquización de nuestro blog, para que además de en la propia url, ésta quede también patente en el TITLE de cada post.

Por poner un ejemplo, cuando se acceda directamente a este post que estoy ahora escribiendo, y que almacenaré en mi categoría de SEO, el TITLE tendrá previamente insertado el nombre de la categoría a la que pertenece. Una opción que me interesa mucho utilizar por dos razones, tanto para ubicar correctamente y en todo momento a mis posibles lectores, como para que los propios buscadores sepan rápidamente cual va a ser la temática más importante que acompañará a este post.

¿Qué otras opciones se os ocurren para estructurar un TITLE?

El poder de Google es inmenso, aunque todavía algunos no seamos conscientes de ello, hasta el punto de que ellos mismos nos llegan a sugerir el uso de etiquetas especificas, al margen de cualquier estandar HTML o XHTML, la mayoría de las cuales solo es capaz de interpretar el propio Robot de Google. Uno de los casos más llamativos quizás sea el de la etiqueta “nofollow” cuyo uso se esta extendiendo más allá incluso de lo que se esperaba en un principio.

Inicialmente las mentes pensantes de Google en su constante lucha contra el spam, sobre todo en relación a los blogs y la generación automática de comentarios, decidieron sacarse de la manga una etiqueta especial que añadir a los enlaces con la intención de evitar el abuso de los spammers, quienes en muchos casos con esta técnica lograban inundar de direcciones y enlaces todos los blogs y foros a su alcance, así como aumentar de manera ilegítima el PageRank de sus páginas web.

Con esta peculiar medida a cualquier enlace normal del tipo…

<a href=”http://googleando.wordpress.com”>Googleando</a>

… si le añadimos la etiqueta rel=”nofollow” …

<a href=”http://googleando.wordpress.com”> rel=”nofollow”>Googleando</a>

… le estamos indicando al Robot de Google que no escanee dicho enlace.

Con esta sencilla medida logramos dos cosas muy importantes y ciertamente interesantes para nuestro proyecto web. La primera, tener a nuestro alcance y bajo nuestro control la posibilidad de elegir que enlaces queremos que reconozca Google y cuales no. La segunda y quizás la más importante, es que nos permite además decidir cuales de los enlaces que contiene nuestra web son lo suficientemente importantes o adecuados como para permitirles traspasar parte de nuestro PageRank.