Mucha gente se vio cautivada por la euforia de el nuevo producto de Apple llamado iPad (¬¬). El día de su lanzamiento sin poder contenerse se lanzaron a abarrotar las tiendas sin saber siquiera que es lo que estaban adquiriendo, fieles a la “marca”, al status, a no dejar de ser considerados “geeks” por sus amigos, a ser los primeros en Twittear que ya la tenían en sus manos y llego el momento “habemus iPad”.

Veamos los diez puntos por los cuales aún no era el momento de adquirirla:

1.- El sistema operativo que usan es el mismo del Iphone (Iphone OS 3.2) esto significa que sufre las mismas carencias que este sistema, claro puedes Navegar por Internet, checar tu correo, escuchar música, leer libros y algunas cosillas mas. Pero si realmente quieres hacer algo de tu tarea, trabajo y si deseas hacerlo rápido te aseguro que harás a un lado tu iPad y terminaras en tu laptop.

2.- ¡¡¡El sistema no es multitareas!!! ¿Que significa esto?  Intenta escuchar radio por Internet y navegar al mismo tiempo. O bien trata de Twittear algo que recién estas leyendo en un blog. No puedes hacerlo eh… que lastima. Android, Palm e inclusive Windows Mobile no tienen problema absoluto con eso. No se en que estaban pensando los de Apple.

3.- No tiene cámara integrada, vaya aquí si no hay mucho que decir a favor de Apple, una cámara al frente es ya un básico de los dispositivos de este tipo de ultima generación (se habría aprovechado con el iChat) lo peor es que tampoco tiene cámara posterior para capturar imágenes o vídeos, aunque me imagino que se hubiera visto un poco ridículo a todo mundo tomando fotos con su “iPad cámara” de casi 10 pulgadas.

4.- Otro aspecto malo del diseño es su forma en si misma, es grande, pesada, difícil de sostener, creo que solo estando sentados cómodamente en un amplio sillón se puede usar con cierta comodidad, haz una prueba. ¿Que tan rápido puedes escribir un texto estando de pié? ¿Es muy lento no? ¿Cansa un poco no?.

5.- No tiene salida de video HDMI, así que si quieres ver esos videos que compraste en iTunes Store simplemente no podrás verlos en tu TV solo en tu pantalla pero bueno para eso puedes comprar, gastar, invertir o como le quieras llamar en Apple TV ¿cierto?.

6.- ¡¡¡ No reproduce Flash !!! Ahora resulta que a esto no es mayor problema, que a nadie le interesa Adobe y su producto Flash pero si hay muchos sitios en Flash y se los perderán por un simple capricho del señor Jobs. Youtube no es el único sitio de vídeos hay sitios como Disney y ESPN que tienen sus propias plataformas basadas en Flash. Recuerdan aquel comercial de Apple donde el padre quiere mostrarle unos dinosaurios en una pc a su hijo pero nunca termina de poderla configurar y el niño termina yendo con los vecinos porque tienen una Mac. ¿Que les dirán ahora sus hijitos cuando quieran ver a W. Poh en Disney en su Ipad en una animación Flash?… “Lo veré en mi tablet con Windows o Android ahí si veo Flash”.

7.- No puedes escalar el hardware, supón que compras el modelo de 64GB y lo llenas con información, vídeo, música. No puedes expandirlo a mas tamaño,  lo mismo pasa con la batería ya que esta no es intercambiable. En contraparte en el mercado hay mas tablets las cuales soportan conexión de distintos dispositivos, discos duros externos, baterías intercambiables, cámaras, etc.

8.- El PRECIO, veamos la tienda de Apple ofrece desde $7,500 a $10,500 los modelos con solo Wi-Fi y desde $9,500 a $10,500 los modelos con capacidad 3G que a su vez representarán más gasto por los costosos (pero limitados) planes de Telcel o Movistar. Si a eso sumas la cantidad de adaptadores y dispositivos extras como: Teclado, Base, Cables, Cables de Poder y muchos otros que seguramente Apple ya tiene en mente podrías aumentarle en equipamiento básico unos $3,000 pesos más.  En un precio mucho menor puedes obtener un mejor producto y lo que es mejor un producto compatible con hardware que seguramente tienes.

9.- La iPad no es un reemplazo de Smartphone y tampoco lo es de Laptop, sus defensores dicen que si la ves tal cual estas equivocado (y vaya que sí) pero si dicen que están creando un segmento “nuevo” un segmento entre el smartphone y la laptop (o netbook), no veo razón alguna ni necesidad de este “segmento nuevo”. Por ejemplo mi smartphone (y conozco muchos similares) hace lo mismo que la iPad y muchísimo más. Un Smartphone basado en Android (htc, motorola droid x) es multitareas, te permite checar tu correo, navegar, tiene cámaras (frontal y posterior), es un teléfono, tiene aplicaciones para leer  libros, redes sociales,  para jugar, para trabajar, es mucho mas barato, etc, etc. Si a eso agregas que estos smartphones los puedes adquirir en la compañía de tu preferencia, Iusacell, telcel, movistar, nextel. Esto se traduce en más y mejores opciones, más competitividad entre compañías lo cual siempre viene beneficiando al usuario osea a nosotros.

10.- Aplicaciones, la mayoría de las aplicaciones actualmente solo son las mismas versiones de Iphone (aprovechando que es el mismo sistema operativo) escaladas a una pantalla mayor, me puse a ver la lista de las aplicaciones que ofrecen para Ipad y me doy cuenta que muchas de ellas también ya existen para Android, los desarrolladores con cada vez mayor frecuencia las liberan también para en su versión para Android o algún otro sistema (blackberry, windows mobile). Esto habla de que un avance increíble en el numero y principalmente la calidad de las aplicaciones que son liberadas para distintos sistemas impulsado por el crecimiento de dispositivos  en el mercado.

Para finalizar

He tenido oportunidad de verla y probarla llegando a la conclusión que en cuanto a Hardware teniendo ese espacio de 10 pulgadas por 8 pulgadas de ancho (aprox.) fácilmente se hubiera podido lograr una mejor versión, con cámara frontal y posterior, mas puertos, lector de tarjetas para incrementar memoria, capacidad de conectar discos duros externos y en cuanto al Sistema también hubiera sido genial ver una version Ipad OS multitareas, con soporte Flash y todo esto a un precio mas atractivo.

Lamentablemente ya es costumbre que las primeras versiones de cada producto de Apple tengan detalles de este tipo y sean muy caros. La respuesta en mi opinión es aún no.

Como funciona esta Api?

1.- Solicitemos la fuente deseada

<!-- Donde en el parametro family va la fuente que necesitamos -->

<link href=' http://fonts.googleapis.com/css?family=Droid+Sans' rel='stylesheet' type='text/css' />

Existe una lista de fuentes aquí

2.- Usando CSS ya disponemos de la fuente

body{
font-family:'Droid Sans', Lucida Grande, Verdana, Sans-serif;
}

En caso de que el navegador no soporte “Google Font” simplemente nos mostrara la siguiente fuente disponible. Pueden ver la lista de navegadores disponibles en las FAQ del sitio.

Deben de tomar en cuenta que el comportamiento de esta Api varía dependiendo del navegador, en Firefox primero se renderea el texto usando una fuente disponible del sistema (lo cual me parece genial) mientras se carga la fuente del sitio de Google, en otros navegadores los textos no se renderean ( ={ ) hasta cargar por completo la fuente. Ademas notemos que se agregara peso al sitio por la descarga de la fuente a usar, ustedes evalúen si usan esta Api o no. Yo creo que si valen la pena unos kb’s mas por la satisfacción visual de nuestros visitantes.

]]> http://bensite.info/2010/07/google-font-api/feed/ 1 http://bensite.info/2009/09/toolkit-indispensable-para-desarrollo-web/ http://bensite.info/2009/09/toolkit-indispensable-para-desarrollo-web/#comments Thu, 24 Sep 2009 17:55:04 +0000 BeN http://bensite.info/?p=60 A continuación algunas de las herramientas indispensables para desarrollar en sus rubros correspondientes:

En cualquier sistema operativo puedes desarrollar Web ya que existe software multiplataformas o bien hay alternativas, en mi caso mucho tiempo use Windows y no estaba mal; su version XP es muy estable y manteniendolo limpio y actualizado creo que no da problemas.

Ahora uso Mac OS X en su version Snow Leopard y definitivamente no lo cambio ya que la facilidad de uso del sistema es lo que principalmente me a hecho quedarme con este S.O.

A final de cuentas cada quien puede usar el Sistema que le agrade mas o bien el que tenga a la mano, ya que con practica y adaptabilidad todo mundo le saca el provecho requerido.

Concentremonos en Desarrollo Web, excluyendo un poco contenidos como multimedia o flash, vamos al html, css, php, etc.

Editor HTML y CSS ?

Considero que Adobe Dreamweaver es una herramienta muy completa para estas tareas, si estas maquetando tu sitio y haciendo el diseño Html, Dreamweaver te hará la vida mas facil. Ademas de que te permitira tener tu codigo mas claro y ordenado.

Editor PHP?

Creo que el mejor editor de desarrollo que existe es Eclipse -www.eclipse.org- en su version Galileo que es la mas reciente podemos crear proyectos Php y “Compilarlos” o hacerles un Build de forma que si nuestro proyecto consta de muchos archivos, clases, objetos, funciones, etc. Eclipse nos ayude a la hora de programar activando opciones de autoacompletar o informandonos sobre los parametros que necesitan las funciones o los tipos de datos de las variables, etc. Ademas tambien nos informa de errores de codigo y nos los subraya de forma que errores “de dedo” que a veces nos quitan tiempo no ocurran nunca mas.

Eclipse no es un editor exclusivamente Php, tambien funciona para html, css, java, js, etc. Así que puedes editar todo tu proyecto Web con esta herramienta, pero falta lo mejor… es completamente Gratis.

Framework PHP ?

Muchos aun dudan de la necesidad de usar o no un Framework y creo que esto se debe en ocasiones al tamaño de los proyectos, sin embargo creo que para estandarizar tu codigo y mejorarlo es necesario usar un Framework. En este sitio http://www.phpframeworks.com/ se hace una comparacion de la mayoria de Frameworks que existen por ahi, aqui va en cuestion de gusto y practica, el Framework que les recomiendo es sin duda el de Zend.

Zend Framework es gratuito y (una vez que lo entiendes) facil de usar, te simplifica el trabajo y te ayuda a generar codigo seguro, ya tiene mas de diez millones de descargas y en su sitio tienen una guia de desarrollo y una gran cantidad de ejemplos. Si van por este framework, no pueden ir mal: http://framework.zend.com/

Extras

Cliente FTP: Transmit, Filezilla

Administrador de Base de Datos: En este caso uso Mysql y el administrador que prefiero es Mysql Administrator el cual tiene todo lo necesario para crear y administrar nuestras bases de datos.

Navegador: Firefox con el Add-on Firebug

Servidor de Pruebas: MAMP

Cual es el software que usan ustedes? Deberia cambiar tajantemente alguno?

En este proceso es cuando muchas veces nos encontramos ciertos problemas y más aún cuando esta dividido el equipo de diseño del de programación; todos sabemos que no es tarea fácil convertir un bonito diseño a una página web funcional con código claro, que cumpla los estándares actuales y que sea visible en todos los navegadores, si a eso agregamos versiones “print ready” y opciones de accesibilidad les aseguro que no será tarea fácil.

Es en este punto cuando un Css Framework es de utilidad y a mi modo de ver indispensable.

Un Css Framework, también conocido como Framework de diseño no es otra cosa que un archivo de hoja de estilos previamente listo que permite de manera fácil, cumpliendo estándares de diseño web, el diseño y maquetación de una página web. Esto lo hace previendo y corrigiendo incompatibilidades entre navegadores y teniendo toda una serie de opciones para que el diseño sea fácil y muy veloz.

Despues de probar las diferentes opciones que hay por ahí en Internet opte por usar Blueprint el cual es simple pero completo.

Por default Blueprint posee un Grid de 950px de ancho, con 24 comunas de 30px cada una de las cuales son llamadas span-1 de 30px, span-2 de 60px, span-3 de 90px así hasta span-24 de 950px. y un margen de 10px entre cada una, dándonos la posibilidad de hacer nuestras combinaciones de acuerdo a las necesidades que tengamos.

Su uso es simple ya que tiene nombres de clases predefinidas que hacen el trabajo y solo basta incluir los archivos Css en el encabezado de nuestro sitio, veamos unos ejemplos:

Una Sola columna, Header, Contenido y Pie

<div class="container"><!-- Container es una clase predefinida de blueprint dentro de la cual va toda la maquetacion, al igual que span-24  -->
 <div id="encabezado" class="span-24">
        Encabezado
    </div>
    <div id="contenido" class="span-24">
        Cuerpo
    </div>
    <div id="pie" class="span-24">
        Pie
    </div>
</div>

Pueden verlo funcionando aquí

2 columnas, Header, Menú, Contenido y Pie

<div class="container"><!-- Container es una clase predefinida de blueprint dentro de la cual va toda la maquetacion, al igual que span-24, span-4, span-20 y la clase last  -->
    <div id="encabezado" class="span-24">
        Encabezado
    </div>
    <div id="barra_izquierda" class="span-4">
    	Barra Izquierda
    </div>
    <div id="contenido" class="span-20 last">
        Cuerpo
    </div>
    <div id="pie" class="span-24">
        Pie
    </div>
</div>

Pueden verlo funcionando aquí

3 columnas, Header, Menú Izquierdo y Derecho, Contenido y Pie

<div class="container">
    <div id="encabezado" class="span-24">
        Encabezado
    </div>
    <div id="barra_izquierda" class="span-4">
        Barra Lado Izquierdo
    </div>
    <div id="contenido" class="span-16">
        Contenido
    </div>
    <div id="barra_derecha" class="span-4 last">
        Barra Lado Derecho
    </div>
    <div id="pie" class="span-24">
    	Pie de Pagina
    </div>
</div>

Pueden verlo funcionando aquí

Sin duda cualquier necesidad que se les presente de diseño podrán resolverla gracias a este framework css solo basta leer un poco la documentación y ver los ejemplos. Blueprint ya es un básico.

Y es muy cierto ya que actualmente si quieres hacer algo que viste en un sitio seguramente con ayuda de google encontraras un script listo para descargarse o un post en algún blog en el que hay un tutorial de como hacerlo y código ya hecho.

Pero, cual es el problema?

Se pierde la curva de aprendizaje y generalmente y lo digo sin temor a equivocarme la mayoría de ocasiones que se hace eso no se termina entendiendo ni el 50% del codigo que hay en nuestra aplicación.

Y con esto no digo que hay que inventar el hilo negro, el usar codigo ya escrito es muy bueno ya que ahorra tiempo y en muchos casos estandariza aplicaciones, sin embargo hay que conocer el codigo que usamos.

En conclusión, lo mejor es tardarse un poco mas de tiempo, pero entender bien lo que se hace, todas y cada una de las funciones ya que en un futuro esto nos hara mejores desarrolladores.

El articulo inspiración es este articulo en el blog de Soh Tanaka

<div id="div_a_actualizar">Esta es la zona que se actualizara</div>
<ul>
<li><a href="pagina1.html" class="links">Pag. 1</a></li>
<li><a href="pagina2.html" class="links">Pag. 2</a></li>
<li><a href="pagina3.html" class="links">Pag. 3</a></li>
<li><a href="pagina4.html" class="links">Pag. 4</a></li>
</ul>

Tenemos las distintas opciones y pongan atencion que todos comparten la clase links

Ahora el JS

window.addEvent('domready', function() {

function links (){
//A todos los elementos de la clase links se les agrega el evento click y la funcion llamar_ajax, pasando como parametro el objeto <a>
$$('.links').addEvent('click',function(ev){
new Event(ev).stop();
llamar_ajax(this);
});

}

function llamar_ajax (objeto){
var req = new Request.HTML({
//objeto es el <a> al que se dio click, de el obtenemos con la funcion getProperty la propiedad href, para saber que pagina abriremos+
url:objeto.getProperty('href'),
update:$('div_a_actualizar')
});
req.send();
}//fin de llamar_ajax

//Procesamos todos los links inicialmente
links();

});

El Js tiene la funcion links que lo unico que hace es recorrer cada uno de los vinculos (identificados por la clase links) y les asigna la funcion llamar_ajax pasando como parametro el objeto <a> (para eso sirve el “this”).

La función llamar_ajax hace el llamado y toma del <a> que se le paso en la variable objeto la propiedad href para hacer el request.

Pueden verlo funcionando aquí

Si quieren implementarlo solo peguen los codigos donde corresponda y recuerden que esta hecho con la version mas reciente de mootools. Asi que hay que agregarlo a las cabeceras del sitio.

23 de Junio de 2008