Hace tiempo os hablé ya por aquí en este post de varios anuncios cegadores que había visto en una web, pero lo de hoy se lleva la palma.

Me disponía a consultar en la web oficial de Telecinco la programación de su cadena para hoy, cuando me encuentro con lo siguiente:

Y lo peor no es el color. Lo peor es que después de dedicarle 5 minutos aún no sé como cerrar el dichoso anuncio, que te tapa un 80% de la página, dejándola totalmente inaccesible. Si le dáis a la flecha, se despliega parte del anuncio con un efecto muy chachi-piruli, pero yo sigo sin saber cómo cerrarlo para poder acceder al menú de la izquierda.

Y es que si encima de usar anuncios enormes y cegadores, no dejáis cerrarlo al usuario, ¿quién os va a seguir visitando?

De verdad, si alguien consigue cerrarlo (ya no sé si será cosa del Firefox porque no lo veo normal, una metedura de pata como esa no podría estar online más de 2 minutos sin que nadie pidiera responsabilidades), que me lo diga, porque no quiero quedarme con la intriga, aunque tengo muy claro que a partir de ahora recurriré al teletexto para el tema de programaciones de esta cadena (que por otro lado, tampoco es que haya mucho que mirar…), más viejo y todo lo que queráis, pero al menos no me quedaré ciega en el intento.

Actualizado: Pues al parecer, con el IE el fondo del anuncio se ve transparente (y no verde fosforito). Algo es algo, pero me encantan esos ’super-diseñadores’ que creen que el Firefox y demás alternativas están sobrevalorados o, peor aún, no saben ni que existen xD

Imageshack es una web de alojamiento gratuito de imágenes, a la que acudo frecuentemente para subir imágenes que uso en este blog, en otros foros, en tutoriales, y demás. Recientemente han cambiado el diseño (por otro más horrendo aún), pero bueno, lo que me importaba era la funcionalidad y el servicio que ofrecía. Hasta ahora.

La publicidad que tenía era odiosa, y en grandes cantidades. Pero se han superado. Si usas esta web con asiduidad y aún no te ha tocado sufrir los ataques cegadores de uno de sus banners, eres afortunado. Estoy hablando de un cuadradito, que pasa de verde fosforito a blanco en tan sólo medio segundo, y ale, así parpadeando todo el rato. De verdad que duele. Y duele el doble cuando, para colmo de la mala suerte, te tocan dos anuncios cegadores iguales a la vez.

Imaginaros eso, parpadeando a toda velocidad (nótese que eso es una captura mía reducida, imaginároslo en tamaño real, ocupando gran parte del navegador, de verdad que tenéis que verlo, porque es aún más exagerado de lo que parece). No, señores de Imageshack, eso no se hace.

Si me dieran un euro cada vez que recibimos un email o un mensaje privado preguntando cómo hacer una web, ahora sería rica. Mucha gente nos pregunta también dónde se pueden descargar el diseño de Heroes Spain. Bien, ese diseño no está para descargar, lo diseñamos nosotros, los admins de Heroes Spain (o Veronica Mars Spain o Anatomía de Grey Spain, se les puede aplicar lo mismo), en exclusiva para nuestra web. Otra de las preguntas que recibo es que si me quiero unir a un determinado proyecto para ayudar con la web. Por desgracia no, no puedo, no tengo tiempo material para más webs. Por todo esto intentaré hacer una especie de resumen al que enlazar cada vez que me hagan esta misma pregunta.

Alojamiento
Lo primero que se necesita para hacer una web es el alojamiento, el dónde vamos a subir nuestra web. Como sabréis, hay alternativas gratis o de pago. Si es un proyecto serio, vale más apostar por un buen host de pago, que son más estables y con un soporte mejor. Pero si estás comenzando con una web, recomiendo que se use un host gratuito al principio, para al menos ir haciendo pruebas y demás. En este campo tenemos a Byethost.com y 110mb.com, ambos gratuitos y, aunque no son perfectos, repito, son gratuitos.

¿Qué hay que mirar a la hora de escoger el alojamiento? Sobre todo el espacio que ofrecen (lógico) y la transferencia de datos o bandwidth, que no es tan famosa pero es muy muy importante. Para un fansite medio que empieza, 200mb de espacio (que serán más si se quiere añadir una galería completa) y unos 2 o 3 gb de transferencia es más que de sobra.
Además, si se quiere tener una galería, es necesario mirar que el host tenga capacidad PHP&MySQL con al menos una base de datos.

FTP
Una vez que tenemos el alojamiento, necesitaremos un programa con el que subir los archivos. Mi recomendación es el programa Filezilla, que es gratuito y muy sencillo de usar. Podéis encontrar un tutorial en español aquí, pero recordad que siempre podéis usar google para buscar más y mejores tutoriales.

Programas propiamente dichos para crear una web
Una web sencilla (no vamos a meternos aquí con demasiada historia) se compone de código HTML y CSS. Coged por ejemplo este blog, y en vuestro navegador ir a Ver>>Código Fuente. ¿Véis todo ese código? Pues así se hace una web. Pero no os preocupéis, hay programas del tipo WYSIWYG (What you see is what you get, lo que ves es lo que hay) que te dejan diseñar la web gráficamente y ellos te lo convierten todo a código. Es el caso del Frontpage (de Microsoft) o del Dreamweaver (de Adobe). Recomiendo activamente el segundo.
Hay miles de tutoriales y tutoriales en internet sobre cómo manejar el programa, objetivo que queda fuera de este artículo, pero que podéis buscar en google.

Dreamweaver es una buena herramienta para empezar, aunque tarde o temprano tendrás que aprender HTML y CSS, pero si quieres hacer una web sencillita y nada del otro mundo, es la mejor alternativa.

Diseño Gráfico
Nuestra web tendrá, obviamente, una cabecera o demás extras que le queráis poner. ¿Cómo hacer estas imágenes? La mejor alternativa es el programa Adobe Photoshop. Al principio es algo complicadillo de usar, pero hay cientos de tutoriales online que nos pueden ayudar a coger las bases. Existen alternativas gratuitas a este programa, como pueden ser The Gimp o Paint.net

Scripts varios
Una vez ya tenemos hecha nuestra web sencillita, podemos recurrir a la ayuda de scripts, o programas que podemos instalar para complementar nuestra web. Uno de ellos por ejemplo es Cutenews, que sí, es el que usamos nosotros para las noticias. Su instalación es sencilla y nos permite actualizar la página principal con noticias desde un sencillísimo panel de administración. Otro de los scripts más usados en los fansites es la Coppermine Gallery, que permite tener una galería completa y ordenada, muy fácil de actualizar.

Por norma general, todos los scripts vienen con un ‘readme.txt’ en su interior que contiene las instrucciones de instalación. Además, en sus páginas webs suelen tener respuesta a preguntas frecuentes o incluso foros en los que puedes plantear cualquier problema que te surja.

Algo muy muy importante a tener en cuenta es que si se usa un script de un sitio desconocido o un script como los que mencionamos arriba, pero una versión antigua, estamos comprometiendo la seguridad de nuestro sitio. Sólo confiad en scripts conocidos y mantenerlos actualizados siempre a la última versión que salga.

Foro
Hoy en día casi todas las webs tienen foros, es un hecho. A la hora de crear un foro, tienes que escoger entre dos opciones fundamentales: crearlo en tu espacio web o usar los servicios de un tercero. El primero de los casos tiene como ventajas que siempre puedes personalizarlo a tu gusto y puedes hacer copias de seguridad. Como desventajas, que tienes que tener actualizada la versión del foro a la última versión para evitar problemas de seguridad, que te gastará espacio, transferencia y recursos de tu alojamiento y que los mejores foros (Invision o VBulletin) son de pago. Por este motivo nosotros optamos por Invisionfree, un sistema de alojamiento de foros gratuito y que para nuestra web sencilla es lo ideal (si habláramos de algo en plan profesional ya tendríamos que plantearnos el comprar una licencia de Invision o VBulletin y hacer un foro en condiciones).

Te registras en www.invisionfree.com y ellos te dan tu foro, listo para usar. Te despreocupas de actualizaciones de seguridad, de la instalación… En su foro de soporte encontrarás la respuesta a la mayoría de preguntas o problemas que vayas teniendo a medida que lo vayas usando (por favor, todas las dudas que tengáis sobre el sistema InvisionFree planteárselas a ellos en su foro de soporte, nosotros NO proporcionamos soporte de ningún tipo). Podéis buscar themes o layouts para vuestro Invisionfree en este otro foro.

Y esto es todo
Comprended por favor que sois muchos los que nos hacéis este tipo de preguntas, y que no podemos ser ‘guías’ de 20 personas que están haciendo su web, ni de 20 administradores que tienen dudas sobre cómo hacer no se qué cosa con InvisionFree. Hay cientos de tutoriales online, o incluso podéis comprar libros, que los hay. Con un poco de esfuerzo y dedicación cualquiera puede crear una página web sencilla y, citando cierto anuncio tan de moda, nosotros no la podemos hacer por ti.

Últimamente me paso mucho por el blog bittbox, donde hay un montón de recursos como pinceles y tutoriales esencialmente para el Adobe Illustrator (que tengo pensado aprender algún día). Es un blog bastante interesante para aquellos a los que os guste el diseño en general.

En la entrada más reciente, ofrecen una lista de 7 fuentes bastante interesantes con un estilo medio grunge (así como sucias) y medio script (de caligrafía a mano). Porcelain (ver imagen) es una de ellas. Yo no soy muy experta en fonts ni mucho menos, es más, siempre me cuesta encontrar las adecuadas a la hora de diseñar algo, pero sin duda las 7 alternativas que nos presentan son bastante decentes y pueden resultar bastante útiles. Haz click aquí para ver la lista completa en bittbox.

¿Alguna vez te has preguntado cómo fue la primera versión del programa Adobe Photoshop? Pues la lanzaron allá por 1990, sólo para Mac. El interfaz, simple al máximo, tan simple como que no tenía colores. Ni atajos de teclado, ni muchas de las herramientas que hoy en día conocemos.

Si queréis ver más capturas, os recomiendo estas dos páginas: guidebookgallery y creativebits.org. Como podéis ver es “casi igualito” que la versión más reciente, la CS3. Estos chic@s de Adobe sí que saben currárselo.

Hoy os voy a recomendar mi blog favorito: Smashing Magazine, sin duda uno de los más famosos e importantes hoy en día en el mundillo del diseño y del desarrollo web.

En el encontraréis interesantes artículos con información más interesante aún sobre multitud de temas: desde recopilaciones de los favicons más chulos del momento, pasando por varios y geniales themes para wordpress y varios y geniales diseños webs, hasta posts con ‘tips’ de Ajax o ideas CSS. Son demasiados posts interesantes para resumir en sólo un párrafo.

También suelen postear de vez en cuando recopilaciones de enlaces a tutoriales para Photoshop o Illustrator, e incluso recopilaciones de descargas útiles para todo diseñador.

A diferencia de muchos otros blogs de esta temática, Smashing Magazine no tiene posts nuevos cada día, pero es algo que no se echa en falta si tenemos en cuenta que cada 4 o 5 días nos presentan un post completísimo e interesante para aquellos interesados en todo este mundillo. Y sí, otra desventaja es que es en inglés, pero no nos engañemos, hoy por hoy es difícil de encontrar un blog sobre esta temática en castellano con una calidad medianamente aceptable.

Sin duda un blog altamente recomendado, al que debéis echar un vistazo y añadir a vuestro lector RSS.

Sé que muchos echábais de menos mis posts cegadores con imágenes de lo que no hacer al diseñar una web. Pues, coged vuestras gafas de sol y prepararos, porque continuamos con esta “tradición”.

Y para comenzar, uno de los clásicos, por desgracia para nosotros: el texto rosa/fuxia sobre azul eléctrico de fondo. Si me dieran 5 céntimos cada vez que veo esta combinación, o alguna de sus sucedáneas como amarillo fosforito sobre azul, ahora mismo sería rica.

Hay muchas formas de escoger los colores que combinan bien para una web. Hay programas, webs online (como ColorBlender), miles de tutoriales, se pueden coger de una foto directamente… Pero sorprendentemente la gente se empeña en seguir cegando al personal. Y de verdad, para que una web llame la atención, no hace falta que se usen colores como esos. En dos palabras: hacen daño xD