Recursos Web

Siempre que empiezo con el tema de HTML, a mis alumnos les llama la atención el que ‘caracteres’ tan cotidianos para nosotros (la ñ, las vocales acentuadas, el espacion en blanco…) no sean entendibles para los navegadores.

Por mucho que intentemos ir colocando el código correcto conforme escribimos, o que usemos la opcion ‘buscar y reemplazar’ de nuestro editor favorito,  si no estamos acostumbrados,  es normal que se nos escape algún carácter y tengamos que hacer correcciones una vez que tenemos la web subida al servidor. Un coñazo, todo sea dicho.

Para intentar evitar este tipo de cosas, hoy os muestro una sencilla y útil página web que se encarga de traducir lo que escribimos a texto entendible por los navegadores. Esto es, que hace toda la transformación de caracteres problemáticos de nuestro texto por nosotros. Como resultado nos devuelve un texto totalmente apto para colocar en nuestra web.

Pero no acaba ahí la cosa, esta web también hace el paso inverso. Es decir, podemos darle un texto con los caracteres pasados a codificación HTML y la página nos devolverá el texto con acentos, espacios, arrobas…

Html-Ent.com

Para finalizar me gustaría indicar que es facil hacer una web con la funcionalidad que presenta esta que os enseño…¿verdad? Os animo a ver si sois capaces de “copiar” el funcionamiento de esta web (que seguro que lo sois).

Como pista os dire una palabra…htmlentities

Aqui os dejo una cortita entrada muy interesante del blog ‘blocdeesbozos‘ de mi alumnito frikidelosquedacharlas preferido.

Comenta como hacer funcionar ‘min-height’ en Internet Explorer. Copio tal cual:

Es una combinación de selectores CSS para conseguir que un div tenga un alto mínimo. Esto viene muy bien para decorar tablas que, vía MySQL, tendrán resultados diferentes en función de lo que se busque. Gracias a esto, la imagen de fondo de la tabla siempre aparecerá:

    .tabla{
           min-height:500px;
           height:auto !important;
           height:500px;
    }

Me hizo falta para una cosa del trabajo, y después de mucho buscar, dí con la solución. Aquí podéis ver una prueba. Independientemente del tamaño que alcance esa lista (podéis probar con varias provincias), la marca de agua colocada en el fondo siempre mantendrá el mismo alto, y por tanto se verá entera.

Articulo original : Blocdeesbozos

Las imagenes bullets son iconitos pequeños que se usan para sustituir las viñetas en las listas y mejorar asi su estilo. No es dificil hacerse una bullet para nuestras listas, pero para la gente vaga (o poco creativa :p) voy a mostrar una página con 200 bullets gratuitas listas para usar: 200 Bullets Gratis

Ahora no teneis excusa para dejarme las viñetas que traen por defecto las listas en HTML

A peticion de Juan, voy a inaugurar una serie de post dedicados a fuentes de iconos gratuitos. Se que hay muchas paginas con este tipo de material y mi recomendacion es que useis “San Google”. Aún asi, nunca esta de mas tener este tipo de recursos ordenaditos en el blog. Comenzamos…

• Helix Icons
• Device Icon Set
• Office Space
• Massive Media Icons
• Starbucks Coffe Icons
• Nes Icon Packs
• Old School Icons
• Pandora Dock Icons
• Package Icons
• Sweets Icons Set
• MacBook Air and iMac
• Apple Led Display Icons
• Camera Icons
• Digital Icons
• Pioneer Camp
• Mouse Season 02
• Mighty Mouse
• Pool
• Disk Icons
• Realist Icons
• Moleskine Icons

Normalmente en clase nosotros solemos comprobar las paginas para los dos navegadores más usados: Internet Explorer y Firefox. Sin embargo, existen muchos mas navegadores minoritarios. ¿Necesito instalarmelos todos para comprobar que mi pagina funciona bien en ellos? Esta claro que no.

Para comprobar como quedan nuestras paginas en varios navegadores podemos usar BroserShot

En ella nos encontraremos una tres listas extensas de casi todos los navegadores que existen asi como de sus  sus diferentes versiones. Ordenados todos por sistema operativo .

Marcamos los que deseamos que compruebe (cuantos mas marquemos, mas tarda en dar el resultado), colocamos la direccion de nuestra pagina web (que debe estar subida a internet) donde pone enter URL Here y, si queremos, tocamos las listas desplegables de abajo que hacen referencia a la resolucion de pantalla, Javascript, Flash… Si no nos preocupa ese tipo de cosas, dejamos el valor que traen por defecto: No interesa

En el momento que le damos al boton Submit, nos aparecera un tiempo estimado. El primer tiempo que nos da es el tiempo de espera EN COLA, es decir, lo que tenemos que esperar hasta que nuestra petición empiece a procesarse (os aviso que la pagina tiene mucho uso siempre). Una vez acabado ese tiempo, nos dará el tiempo que va a tardar en sacarnos los resultados. Cuantos mas navegadores hayamos marcado, mas tardará.

Conforme vaya obteniendo resultados, ira poniendo pequeñas fotos para que vayamos viendolas. Al final, podremos descargarnos un archivo .zip con fotos de nuestra pagina tomadas en los distintos navegadores elegidos.

Much@s me habeis preguntado que hosting de pago uso para subir las paginas serias. Eso, algunas veces, lo decide el cliente o lo selecciono yo en funcion de la pasta que me paguen. Normalmente pillo hosting de USA porque me sale mas barato al cambio :p

Sin embargo, gracias a vuestro compañero Haku (aka Ale friki) os presento un hosting nacional con unos precios muy competitivos. Pagando apenas 28E al año, tendremos dominio y un servicio de hosting bastante decente (2gb de espacio, PHP5, cuentas de correo ilimitadas, BD ilimitadas, phpMyAdmin…)

Podeis verlo todo en su pagina: Mas Barato Imposible

He encontrado varios “creadores de botones” online. Algunos estan bien otros no aportan nada o son liosos y poco intuitivos.

Como aun no he probado muchos, os voy colocando los que he podido “catar” y asi tengo material para rellenar mas entradas del blog xD.

BUTTONATOR

Es un generador hecho en Ajax muy intuitivo y funcional. Elegimos el tipo de botón de entre las plantillas predefinidas (hay que arrastrar la plantilla), el texto, el tipo de letra, los colores de fondo, adornos y … voilá!!! En tan solo 3-4 clicks tenemos un botoncito.

Una vez acabado podemos descargarnos el .gif  correspondiente.

Para los que no saben manejar algún programa de diseño gráfico, esta aplicación esta muy bien.

Sin embargo, no aporta mucho a los que sabemos hacer botones con Photoshop (o programas similares). Si acaso, de esta forma es mas rápido obtener el botón y podria servirnos para salir del paso en algún momento de apuro.

Aqui os dejo un par de sitios muy buenos donde podemos subir nuestras paginas y no pagar nada.

Alojamientogratuito.info

Acostumbrado a ver las pocas prestaciones que ofrecen los hostings gratuitos, cuando vi lo que ofertaban en este sitio no me lo podia creer…

1. 800 megas de espacion en disco (lo normal son 100 megas).
2. 20 gb de transferencia al mes.
3. Soporte para PHP 5
4. 10 Bases de datos!!!! (1 y gracias en la mayoria de hostings gratis).
5. phpMyAdmin.
6. 10 subdominios.
7. 10 cuentas de correo POP3 (por la cara ).
8. Panel de administración…y una serie de cosas menos relevantes.

Tan solo te pone UN LINEA de texto de publicidad. Tanto pagina como el panel de control están en español y todos los datos de acceso los puedes guardar en un .pdf para no tener que estar abriendo el correo cada vez que quieras consultarlos.

Pero que ocurriría si existiera otro sitio de hosting gratuito que mejorara la oferta anterior…  pues si, lo hay:

Byethost

Estos son ya la leche. Tienen LO MISMO que la pagina anterior, pero multiplicado por 5 (esto es porque los de alojamientogratuito son resellers de Byethost).

1. 5500 Megas de espacio!!! (5 gigas y medio para ti solito por la cara).
2. 200 gigas de transferencia mensual.
3. 50 Subdominios.
4. 50 Bases de Datos.
5. phpMyADmin para la gestion de BBDD.
6. Infinitas cuentas de correo POP3 (LOL!!)
7. PHP5, Panel de administración… bla, bla, bla
8. y NADA de publicidad.

Lo que perdemos con respecto al anterior es que la pagina esta en inglés (ya ves tu que pena) aunque el panel de control lo podemos poner en español.

Como pega a AMBOS tan solo decir que el formulario de registro hace las validaciones en el servidor (no usa JavaScript ni Ajax) y por lo tanto, si nos equivocamos en un campo, tendremos nuestro bonito formulario vacio y habrá que rellenarlo entero otra vez.

Espero que os haya gustado estos sitios y recordad, SON GRATIS. Esto tiene sus desventajas como que la indexación en buscadores no es muy buena y que nuestra pagina va a tener una coletilla en la URL. Aun asi, por el precio que nos cobran, ambos estan muy bien (mejor el segundo que el primero, no??). Sobre todo para subir plataformas online para un curso web o blogs aburridos que nadie lee nunca :p