Diseño Web

Ξ 2 comentarios

Cómo hacer paginas Web – Parte 2

por Xabadu
Cómo hacer paginas Web – Parte 2

Lo prometido es deuda. Tal como definimos al comienzo del tutorial anterior, hoy les traemos la 2da parte de esta tremenda saga en la que intentamos de alguna forma facilitar la tarea de la creación y diseño de sitios Web, enfocándonos en todo tipo de aspectos, en especial en algunos bastante “ocultos” como son la planificación y actividades que rodean a la puesta en marcha de este tipo de proyectos.

Bueno, sin más que decir, como siempre, toda la información después del salto.

Cómo hacer páginas Web – Parte 2

En esta parte del tutorial veremos los siguientes puntos:

  1. Definiendo la infraestructura
  2. Suscripcion de servicios
  3. Comenzando la construccion

1.- Definiendo la infraestructura de nuestro sitio:

Después de haber realizado toda la planificación de nuestro futuro sitio Web (como hicimos en la parte 1 de este tutorial), ha llegado el momento de empezar a meter mano en la parte más “física” de nuestra futura página y para eso es importante partir por lo que será la infraestructura del sitio Web.

Por infraestructura nos referimos a todos los aspectos necesarios de Hardware y Software que utilizaremos para la construcción del sitio en si, así que entrando en detalle:

Hardware: Cuando hablamos del hardware que utilizaremos para nuestro sitio, nos referimos básicamente al alojamiento que utilizaremos para presentar nuestra página en Internet. Si bien dentro de la planificación recomendamos la busqueda preliminar de posibles alternativas de alojamiento, sería bueno ya en este punto definir la opción que utilizaremos, ya que antes de construir el tener el alojamiento definido nos permitirá establecer de mejor forma las limitaciones y el alcance que podra tener nuestro sitio Web.

Alternativas de alojamiento hay muchas, tanto gratuitas como pagadas, variando principalmente en las características ofrecidas y exponiendo cada una de ellas ciertas ventajas y desventajas como por ejemplo:

  1. Los alojamientos gratuitos son ideales para sitios pequeños que recien comienzan, sobretodo por no haber necesidad de invertir dinero (que al comienzo puede ser muy escaso) y porque en algunos casos ofrecen una serie de funcionalidades que resultan más que suficiente para webmasters inexpertos o para diseñadores que no harán uso de tecnologías muy específicas o avanzadas.
  2. Por otro lado, los alojamientos gratuitos presentan en algunos casos, la postura de algunos banners o popups (ventanas emergentes) de publicidad relativa a la compañía que les otorga el alojamiento, la cual puede convertirse en algo molesto sobre el sitio que presentaremos.
  3. Los alojamientos pagados presentan la desventaja de tener que desembolsar una cantidad de dinero sobre un servicio del cual aun no sabemos si lograremos algún tipo de retorno, pero por otro lado nos ofrecen servicio y soporte personalizado para nuestras necesidades, lo que a su vez nos permite ofrecer un servicio mucho más continuo y serio a nuestros usuarios finales.

Tal como hemos dicho, razones hay variadas y dependerá de los alcances de cada uno el tipo de servicio que debemos seleccionar, pero aquí hay algunos aspectos en los que nos debemos preocupar al momento de seleccionar:

  • Espacio: Parece obvio, pero nunca esta demás mencionarlo. El espacio que nos ofrezcan será vital una vez que nuestro sitio este andando. Este espacio debemos verlo tal como si fuera un disco duro y por eso es importante planificar la forma en que guardaremos nuestros archivos y la estructura en sí para no encontrarnos con un espacio agotado que no nos permita subir nuevas cosas.
  • Límite de transferencia mensual: La transferencia mensual se refiere a todo el tráfico que se genera desde tu sitio y hacia el. Por ejemplo, si todos los archivos correspondientes a tu página Web suman en total 100 KB, cada vez que un usuario entre a la página, descargará 100 KB desde el servidor. Además contabiliza el posible tráfico enviado desde y hacia los correos electrónicos (en caso de que el alojamiento los ofrezca). Es por esto que hay que tener en cuenta el límite de transferencia que establezca nuestro proveedor, ya que una vez consumido ese límite, nuestro sitio quedará abajo (offline) hasta el inicio del mes siguiente. La relación se puede sacar con una simple regla matemática de Lim de transf / peso de nuestra pagina = Total de visitas mensuales posibles. Lo ideal es buscar un proveedor con transferencia ilimitada, pero no en todos los casos es posible.
  • Soporte de lenguajes dinámicos: Si bien esta opción en teoría solo corre si necesitamos hacer uso de lenguajes dinámicos (como PHP, JSP, ASP, etc), nunca está demás buscar soporte para estos lenguajes (PHP es el más común que se ofrece y uno de los mejores, si no el mejor y más usado), ya que aunque nosotros no sepamos desarrollar en lenguajes dinámicos, si podemos descargar y hacer uso de aplicaciones que los utilicen (como foros, sistemas de noticias, etc) por lo que se nos exigirá poder soportarlos. Normalmente, los distintos alojamientos se mantienen actualizados con los soportes a últimas versiones, así que podemos confiar que es un ítem no dificil de obtener.
  • Bases de datos: Lo mismo que el caso anterior. Para aplicaciones que queramos instalar, normalmente se nos solicitará bases de datos, por lo que es bueno tener. Normalmente los alojamientos ofrecen bases de datos MySQL, por lo óptimas que son para el trabajo en Web. Contrario a lo que se cree, no necesitamos 1 base de datos para cada aplicación que vayamos a instalar. Dentro de una podemos generar tablas necesarias para foros, sistemas de noticias, autentificaciones y todo lo que necesitemos. Quizás pueda no ser óptimo por temas de orden, pero si se puede.
  • Cuentas y acceso FTP: FTP es un protocolo de transferencia de archivos a través del cual nosotros enviaremos los archivos de nuestra página al sitio en sí, por eso es importante fijarse que tengamos acceso FTP para acceder via clientes (Como FileZilla o CuteFTP) en vez de acceso mediante Web, el cual puede ser engorroso y problemático en algunos casos. Además en caso de que trabajemos con mas gente en la creación de este sitio, puede ser importante que nos ofrezcan más de una cuenta, pero no es algo vital.
  • Cuentas de correo: Esto corre más para los alojamientos pagados, los que muchas veces nos ofrecen cuentas de email alojadas en el mismo servidor, de una forma segura y que combinadas con un dominio nos permitirá tener una cuenta de correo profesional para los visitantes.
  • Servicios adicionales: Este es más un plus que una necesidad. Distintos alojamientos ofrecen servicios extras que nunca esta demás tener en consideración, como Aplicaciones para instalar, contadores, sistemas de estadísticas, etc. Mientras más cosas tengamos a la mano por un lado es mejor, ya que no será necesario buscar otras alternativas.

Para el caso de los alojamientos gratuitos, hay algunos tips que nos pueden ayudar en caso de limitaciones del servicio que nos ofrecen como por ejemplo:

  1. Para el tema del espacio, siempre tenemos la posibilidad de alojar algunos archivos en otros servidores y vincularlos desde nuestro sitio, así además evitaremos sobrecarga sobre el servidor principal donde trabajemos.
  2. En cuanto a la transferencia, una buena solución es la suscripción a algunos servicios que eviten la sobrecarga, como por ejemplo Flickr para alojar imágenes u servicios de alojamiento (como Rapidshare) para archivos que queramos que la gente descargue y a los que simplemente vincularemos desde nuestra página.
  3. Para los correos, hay empresas que ofrecen correos gratuitos, los cuales traen alguna publicidad o limitacion en el dominio, pero es una buena opción.

Software: Aquí nos referimos a todas las aplicaciones que utilizaremos para la construcción de nuestro sitio Web. Desde editores de páginas, hasta programas de edición de imagenes o animaciones, siempre es bueno asistirse mediante distintos software para evitar trabajo demás y obtener mejores resultados. Hoy en día hay alternativas tanto gratuitas como pagadas para cada tipo de programa necesario, por lo que buscando con un poco de paciencia puede que obtengamos todo lo que necesitamos sin pagar un solo peso. A continuación una lista del software mínimo que necesitariamos:

  • Editor de páginas Web: Es el principal. Nos permitirá hacer la construcción y edición completa de nuestros sitios. Es el programa en el que pasaremos más tiempo trabajando y normalmente son aplicaciones del tipo ‘WYSIWYG’ (What you see is what you get – Lo que ves es lo que obtienes), o sea, que lo que vemos en el programa será el resultado final. La alternativa más conocida es sin duda Adobe Dreamweaver, la cual es pagada, pero hay alternativas buenas gratuitas como NVU.
  • Editor de imagenes: Nuestro sitio Web debe tener imágenes. Desde el logotipo hasta distintas fotos, lo mas probable es que debamos editar algunas de sus características antes de subirlas. Hay alternativas pagadas como Adobe Photoshop , como tambien gratuitas como es el caso de GIMP.
  • Cliente FTP: Tal como dijimos en el parrafo anterior, un cliente FTP nos permite transferir archivos desde nuestro computador hasta el servidor donde alojaremos nuestra página Web. Accederemos al servidor mediante una URL, nombre de usuario y contraseña que el proveedor nos dará y la interfaz de trabajo es similar al explorador de Windows. Aquí hay alternativas como CuteFTP en el caso de las pagadas, y otras como Filezilla en el caso de las gratuitas.

Además hay algunas aplicaciones extras que nunca esta demás tener como software de animaciones (como Adobe Flash), aplicaciones para creación de logotipos (como AAA Logo) y otras. Este tipo de aplicaciones quizás las vayamos descubriendo a medida que vayamos desarrollando. Pero tal como decimos, son opcionales, los requerimientos mínimos estan en la lista anterior.

Ahora, pasando al segundo ítem:

Suscripción de servicios: En la puesta en marcha de nuestro sitio Web siempre es bueno hacer uso de variados servicios que pueden darle un valor extra al contenido que presentamos, a continuación algunas sugerencias:

  • Flickr: Es un servicio gratuito (y pagado para cuentas premium) que nos permite subir y mantener imágenes de forma organizada en una red social en la que otros usuarios pueden suscribirse a nuestras actualizaciones de imagenes y comentar las fotos que subimos. Si ese no es nuestro interés, podemos utilizarlo solo para subir las imagenes y vincularlas desde nuestro sitio para evitar la sobrecarga de nuestro servidor.
  • Twitter: Un famoso servicio que nos permite hacer actualizaciones cortas y seguidas del tipo “Que estoy haciendo?” al cual otros usuarios se pueden suscribir y ver las actualizaciones que vayamos poniendo. Ideal si en alguna sección tenemos actualizaciones constantes como noticias, etc.
  • YouTube: Todos conocemos YouTube, pero muchas veces no vemos el alcance que este puede tener para beneficiar nuestro sitio Web. Si ofrecemos algún tipo de contenidos en videos, bien podriamos crear un canal en YouTube para tener suscriptores y establecer la posibilidad de que nuestro sitio se promocione para gente de distintos lugares que lleguen a nuestros videos.
  • Feedburner: Este servicio nos permite establecer un feed de tipo RSS (Really Simple Sindication) para que nuestros usuarios puedan seguir nuestras actualizaciones mediante la suscripción a nuestro “feed”. Es un servicio bastante simple de implementar y le permite a los suscriptores evitar la entrada innecesaria a nuestros sitios si no hemos actualizado.
  • Facebook: Un segundo.. Facebook es una red social ¿Cierto?, ¿Qué tiene que ver con mi página Web?.. Bueno si, Facebook es una red social, y dentro de ella podemos establecer una entidad (como grupo o página) relativa a nuestro sitio Web. Nunca hay que descartar el hecho de que Facebook llegue a una gran cantidad de usuarios y por lo tanto más gente podrá ver la página que ofrecemos.

Quizás está demás mencionarlo, pero el primer paso a considerar en estas suscripciones es la creación y/u obtención de una cuenta de correos oficial de nuestro sitio Web, ya sea gratuita o pagada, para mantener ahí toda la información relativa al sitio y no mezclarla con nuestra cuenta personal. Además siempre se verá más profesional el uso de una cuenta dedicada por sobre una cuenta propia.

Y en el último ítem de esta edición:

Comenzando la construcción:

Si finalmente después de tanto trabajo en papel (aunque necesario), podemos empezar a tirar las primeras líneas reales de como sera nuestro sitio Web desde aspectos de diseño. Si recuerdan, o más bien si leyeron la primera parte, al final hicimos un diseño previo en papel de la forma que tendrá nuestro sitio Web, el cual finalmente utilizaremos.

Ese diseño indicará la forma que tendra nuestro sitio (o al menos la página principal), por lo que es recomendable darse un tiempo de navegar por distintos sitios para ir sacando ideas y principalmente preocuparse de dejar espacio adecuado para todo lo que queramos presentar.

Un aspecto que es importante recordar es nunca sobrecargar nuestra página principal (a la cual desde ahora llamaremos index, que es el nombre que el servidor reconocerá como página indice o principal). Un index con mucho contenido puede resultar molesto a la vista de los usuarios y ocasionar que se sientan desorientados, por lo que solamente debemos presentar el contenido que sea necesario y el resto almacenarlo en distintas secciones.

Una vez que tenemos una idea más o menos clara de lo que queremos hacer para nuestro index, tenemos 2 posibilidades para seguir:

  1. Construir el index desde cero, haciendo uso del editor Web y de imagenes, construyendo y rellenando parte por parte.
  2. Utilizar una plantilla o template: Este punto, si bien es rechazado y repudiado por muchos diseñadores, no deja de ser útil. Las plantillas o templates son prediseños hechos por diseñadores y puestos a disposición de otros para utilizarlos y modificarlos. Normalmente ahorran mucho trabajo ya que el molde se encuentra hecho y definido y solo debemos editar lo que estimemos conveniente. Pueden encontrar un gran número de plantillas disponibles en distintos sitios Web alrededor de Internet, algunas gratis y otras pagadas.

Como siempre, cada opción presenta sus ventajas y desventajas (el uso de plantillas implica que puedan haber otros sitios similares al nuestro por ejemplo) y dependerá de las necesidades y conocimientos de cada uno la elección a tomar. Desde nuestro punto de vista no hay un gran dilema con el uso de plantillas, ya que uno debe hacer uso de todas las herramientas disponibles para facilitar nuestro trabajo.

En esta parte les recomendamos tomarse un tiempo para decidir la opción a utilizar y sobretodo el diseño que haremos o utilizaremos. Debemos sentirnos 100% satisfechos con la forma de nuestro sitio ya que es donde más pasaremos tiempo trabajando y debe ser algo que represente a la perfección, o de la mejor forma posible, el sitio que queremos presentar. Nuestro gusto siempre influye mucho, pero también debemos pensar en la comodidad y funcionalidad para los usuarios que visitarán el sitio.

Y con esto terminamos la 2da parte de nuestra saga de tutoriales sobre construcción de sitios Web. Aún nos falta para llegar al punto final, pero hemos avanzado bastante desde el comienzo, haciendo cada paso con dedicación y cuidado. Nada nos asegura el éxito, pero una buena preparación nos ayuda a reducir de la mejor forma el margen de error.

En la próxima edición de estos tutoriales veremos los siguientes puntos:

  1. Estableciendo un esquema en el diseño.
  2. Definición de hojas de estilo.
  3. Accesibilidad y usabilidad de sitios Web.

Esperamos que este tutorial, así como el anterior y los futuros, sean de utilidad para Uds. Como siempre este tutorial ha sido desarrollado y documentado por el equipo de Comolohago.cl, por lo que cuenta con nuestro Sello de garantía.

Como siempre, si tienen comentarios o consultas, no duden en dejarlos en el área presentada a continuación para asistirlos.

Muchas gracias por leer y será hasta una próxima oportunidad.

Comparte este tutorial

El culpable de todo esto

Las tardes gloriosas de domingo y las grandes ovaciones a estadio lleno, no son algo extraño para Xabadu. Luego de ser descubierto a los 4 años en un partido de barrio por los ojeadores del gran Aviación F.C., sacudió el mercado nacional al ser traspasado en $500 pesos chilenos (1 USD) y 3 coca colas al renombrado Estrella Blanca de Lolol. Luego de una impresionante carrera por equipos como Lozapenco, Santa Cruz, Deportivo Lago Chungará y una incursión en la 3a división del futbol de Kazajstan, su record imbatible hasta la fecha de 1257 goles en 20 partidos lo llevo a ser elegido como uno de los arqueros más recordados en la historia pelotera nacional. Una lesión en el colmillo superior derecho lo llevó al retiro el año 2003, pero está de vuelta y sin duda que su jerarquía y experiencia internacional será un gran aporte.

En los barrios marginales se le conoce como: Xabadu

Comentarios en Facebook

2 Comentarios

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Gente linda que nos quiere

Donde mas estamos