Está en la página 1de 32

Buenas amigos!!!

en este post les voy a ensear a crear una pagina web basica para poder empezar a aprender como va la cosa. Lo mejor de todo es que ni siquiera deben saber programacion ni algoritmos. Por supuesto que si quieren ir mejorando su pagina deberan aprender HTML. pero por ahora no es necesario!!!! XD Y NO SE PREOCUPEN!!! ES MAS FACIL DE LO QUE PARECE!!!!

ENTONCES QUE NECESITAMOS PARA EMPEZAR?? Bueno antes que nada necesitan un par de programitas muy potentes y livianos.Se llaman NVU, y Filezilla
DESCARGA FILEZILLA : http://www.megaupload.com/?d=IL3RWLRN DESCARGA NVU : http://www.megaupload.com/?d=Q8ZPVS1A

Brebe introduccion a NVU Por que NVU?


NVU es un editor de pginas Web WYSIWYG multiplataforma basado en Mozilla Composer, pero de ejecucin independiente. Aade caractersticas nuevas como soporte integrado de CSS y mejor gestin del soporte FTP para actualizacin de los ficheros. Este editor facilita el desarrollo de pginas Web, gracias a las diferentes visualizaciones disponibles en su interfaz (cdigo fuente, ventana WYSIWYG, visin con tags de HTML realzados), entre los cuales es posible cambiar mediante un sistema de pestaas. NVU est disponible para Linux, Mac OS X y Microsoft Windows, aunque puede compilarse para cualquier plataforma

con el Netscape Portable Runtime.

Bueno empecemos. Una vez instalado NVU debemos abrirlo y nos aparecera una ventana como esta:

DESCRIPCION
Barra de titulo: A la izquierda de esta barra aparece el ttulo de la pgina Web que estamos editando y el nombre del archivo en caso de que ya lo hayamos guardado con anterioridad . A la derecha los botones de control de la venta minimizar, maximizar/restaurar y cerrar. Barra de mens: Con los mens Archivo, Ver, Insertar, Formato, Tabla, Herramientas, Ayuda. A travs de estos mens podemos acceder a todas las opciones del programa. Barra de redaccin: En ella aparecen botones con las opciones de uso ms habitual que se encuentran en la barra de men. A travs de estos botones accedemos ms rpidamente a estas opciones. Barras de Formato: Con botones que nos permiten acceder a opciones ms bsicas de formato de texto y prrafos. Estas son similares a las de cualquier procesador de textos. Bajo esta tenemos otra barra con ms opciones de formatos y adems de otras relacionadas con el formato aplicando estilos y las capas. Ventana de rea de edicin: En esta rea es donde diseramos y editaremos nuestras pginas. Es nuestro espacio de

trabajo. Cada pgina que estemos editando se mostrara en esta rea, pudiendo cambiar de una a otra mediante las pestaas que se muestran en la parte superior con el titulo de cada pgina. Tambin podemos mostrar las reglas en esta rea, que nos ayudaran a dimensionar diversos objetos. Si no entiendes que hace exactamente cada una de las pestaas que estan marcadas en rojo, no te preocupes, para que te des una idea: 1.Normal: es el modo WYSIWYG WYSI... QUE!? significa What You See Is What You Get (en ingls, "lo que ves es lo que obtienes" todo lo que escribamos ah ser traducido a cdigo HTML automticamente. 2.Etiquetas HTML: igual al anterior, solo que veremos las etiquetas HTML. 3.Cdigo Fuente: esta es la pestaa que mas utilizaremos, ah es donde vemos el cdigo de fuente de nuestra pagina web, tambin nos acostumbraremos a escribir todo ah (Si llegaste hasta aqu no estars pensando en abandonar no? jeje). 4.Vista preliminar: esta pestaa tambin la utilizaremos muy seguido, en ella podremos ver como va quedando nuestra pagina web, muy til.

Bueno todo esto es aburrido asi que te lo podes saltear.Aunque si tenes ganas de aprender un poquito mas...
ALGUNOS CONCEPTOS BSICOS LA WORLD WIDE WEB Y LAS PGINAS WEB La World Wide Web (WWW) es un servicio grfico de Internet que proporciona una red de documentos interactivos. Fue inventada por un laboratorio suizo, el CERN, en 1991. Es el servicio de Internet con mayor xito y que crece con ms rapidez. Su xito se debe a la facilidad de uso, a la capacidad de presentar informacin diversa, actualizada y proveniente de cualquier punto del planeta y a la sencillez con la que es posible crear y publicar documentos en este sistema. Por supuesto que no es un lugar; se trata, en realidad, de secciones de informacin separadas y almacenadas en ordenadores denominados servidores, estando todos ellos conectados a travs de diversos medios (satlites, lneas telefnicas, fibra ptica,...) y entendindose con un protocolo (lenguaje) comn. Cuando se navega por la Web utilizamos un navegador y accedemos a ficheros almacenados en dichos servidores. Un explorador de Web es un programa que permite navegar por la WWW, por ejemplo, Mozilla Firefox o Internet Explorer. Tambin se les conoce como navegadores, visualizadores, browsers, etc. El explorador solicita una pgina a un servidor (proporcionndole la informacin necesaria sobre su direccin en Internet) y ste se la enva. Para establecer el intercambio de informacin, los exploradores y los servidores utilizan un conjunto de reglas de comunicacin llamadas Protocolo de Transferencia de Hipertexto (HTTP); por este motivo, todas las direcciones de pginas Web comienzan con http:// aunque no es necesario teclear estos caracteres en los navegadores actuales. Los ficheros a los que accedemos se denominan pginas Web, que pueden contener: Texto. Hipervnculos. Para explorar la WWW los usuarios navegan de una pgina a otra sealando y haciendo clic en hipervnculos de texto o grficos, que son puntos del documento que permiten acceder a otra seccin del mismo (hipervnculos internos) o a otro documento (hipervnculos externos). Se les denomina tambin vnculos, enlaces, nodos o links. Los exploradores suelen sealar la presencia de un hipervnculo en el documento mediante la transformacin de la apariencia del puntero del ratn: generalmente, al colocarse encima de un hipervnculo, se transforma en una mano que seala algo. Tablas. Formularios. Marcos (frames).

Imgenes estticas o en movimiento. Sonidos. Etc. Las pginas Web son los documentos bsicos de la World Wide Web. Estn basadas en la tecnologa hipermedia, que integra las posibilidades de los multimedia y del hipertexto, con lo que se puede navegar en un mar de informacin textual, grfica y sonora. Un sitio Web es, simplemente, una coleccin de pginas enlazadas que contienen informacin relacionada. 4.2. EL LENGUAJE HTML (nociones bsicas) Hasta hace poco la creacin de pginas Web era algo reservado a personas con grandes conocimientos de informtica, puesto que debajo de una pgina subyace un lenguaje: el Lenguaje de Marcas de HiperTexto (Hypertext Markup Languaje) o HTML. Algo as como un armazn informtico que no vemos cuando navegamos por las pginas, pero que est all, tras lo que s vemos, para hacer que eso exista. El HTML es un lenguaje en permanente evolucin. La meta es conseguir un sistema que integre cada vez ms y mejores formas de presentacin de informacin. A medida que el HTML evoluciona, las nuevas versiones de los exploradores agregan funcionalidades ms avanzadas, como controles ActiveX, programas VBSript, programas CGI, programas Java, Flash, etc., que refuerzan, sobre todo, las caractersticas interactivas de la tecnologa hipermedia. A modo de ejemplo, ya que no vamos a utilizar el HTML directamente para crear los documentos Web, pero si conocer su estructura para futuras aplicaciones, pueden verse a continuacin algunas de las reglas de funcionamiento del lenguaje: Todos los documentos HTML debe estar entre las marcas <HTML> y </HTML>: <HTML> [Todo el documento] </HTML> El documento en s est dividido en dos zonas principales: El encabezamiento, que se encierra con las etiquetas <HEAD> y </HEAD>; dentro del encabezamiento hay informacin del documento, que no se ve en la pantalla principal, principalmente el ttulo del documento, comprendido entre las etiquetas <TITLE> y </TITLE>. Todas las etiquetas necesitan tener una marca de inicio y una de final (apertura y cierre): <X> Inicio de una etiqueta (signo menor que + marca + signo mayor que) </X> Cierre de una etiqueta (signo menor que + barra + marca + signo mayor que). a) El cuerpo es una parte fundamental del documento: es todo lo que aparecer en la pantalla principal (texto, imgenes, etc.). Est comprendido entre las etiquetas <BODY> y </BODY> La estructura tpica de una pgina Web es la siguiente: <HTML> <HEAD> <TITLE> Ttulo de la pgina </TITLE> </HEAD> <BODY> [Contenido: texto, fotos, tablas, etc.] </BODY> </HTML> Afortunadamente, con los programas actuales (Mozilla Composer, NVU...) no es necesario que conozcamos nada de HTML para hacer nuestras pginas. El programa emplea una interfaz parecida a un procesador de textos, en la que el usuario aade texto y le da formato, inserta imgenes,... y genera las correspondientes etiquetas de HTML. Esto se conoce como Lo-Que-Ves-Es-Lo-Que-Obtienes (WYSIWYG, What-You-See-Is-What-You-Get).

BUENO AHORA SI....EMPECEMOS!!!!

Una vez arrancamos el programa, ya tenemos en la ventana del mismo una pgina Web en blanco sobre la que poder trabajar. No obstante, antes de comenzar con la confeccin de nuestras pginas, vamos a crear un sitio Web en nuestro ordenador para almacenar en l todas las pginas que hagamos y los archivos que contengan (imgenes, objetos asociados, etc.).Aconsejo hacer la carpeta en mis documentos, pero la pueden hacer donde quieran,solo recuerden el nombre. Entonces iremos a "archivo" y a continuacin haremos clic en "nuevo", se nos abrira una mini ventana como esta:

Nos aseguramos de tener la configuracin igual que en la imagen y hacemos clic en "Crear". Una vez hecho esto veremos una pagina en blanco, aun no le hemos puesto nombre, para eso hacemos clic en "archivo" y luego en "guardar".

En la ventana que nos aparece tenemos que poner el nombre del archivo, como dijimos antes lo llamaremos index.html luego hacemos clic en aceptar. Nota: Es importante que el nombre sea "index", de lo contrario al entrar a la direccin principal de nuestra pgina no veremos nada Ahora nos aparecer una ventana que nos pregunta donde queremos guardar ese archivo, es fcil, lo hacemos en la carpeta que creamos antes clic en guardar y listo, si vamos a esa carpeta tendremos que ver el archivo index.html:

Ya tenemos la primer pagina de nuestra web, ahora falta lo mas importante, agregarle contenido

Bueno empecemos a agregar algun texto a nuestra pagina, En tonces en la pestaa modo normal simplemente escribimos!!!! siii!!! simplemente como si fuera un procesador de texto. Podemos cambiar la fuente, alinear al centro,tamao de letra, etc....Tan facil como eso!!!!!!

Si vamos a la pestaa Vista preliminar podremos ver nuestro progreso como si se estuviera viendo en un navegador!!!

INSERTAR IMGENES
Para insertar una imagen en el documento seleccionar la opcin de men Insertar >> Imagen, se mostrar la siguiente caja de dilogo, con diversas solapas:

Ubicacin: se indica de dnde tomar la imagen, pulsando en el botn Elegir archivo, se explora el sistema de archivos para seleccionar la imagen. Tambin se indica el texto alternativo que se mostrar de la imagen y un texto de ayuda cuando se pase el ratn por encima. Dimensiones: se puede cambiar el tamao de la imagen. Apariencia: se establecen las distancias entre la imagen y el texto, as como la alineacin del texto alrededor de la imagen. Enlace: se puede establecer un hipervnculo para la imagen. Botn Edicin avanzada: para establecer opciones avanzadas como atributos HTML, eventos de JavaScript, estilos, etc. Una vez insertada la imagen, se pueden establecer sus propiedades haciendo doble pulsacin sobre ella, seleccionando la opcin de men Formato >> Propiedades de la imagen o a travs del men contextual.

Las imgenes en las pginas Web las colocamos: Dentro de la pgina y Como fondo de la misma. Primero vamos a ver la insercin de imgenes en la pgina y, posteriormente, la eleccin de imgenes de fondo. Las imgenes funcionan ms o menos como en un procesador de textos. En las pginas Web se suelen utilizar los formatos siguientes: GIF. Para dibujos e imgenes con pocos colores. Este formato nos permite elegir un color transparente y hacer animaciones. JPEG o PNG. Para fotos e imgenes que requieren ms calidad. No obstante, no permite transparencias ni animaciones. Para incluir imgenes en una pgina de NVU podemos copiarlas en el portapapeles con otro programa (por ejemplo alguno de dibujo, un procesador de textos,...) y luego pegarla en la pgina Web que estamos diseando. Cada uno emplear el mtodo que vea ms cmodo y que le sea ms usual (recordamos que una misma cosa se puede hacer de varias formas). Nosotros vamos a seguir con nuestra costumbre: primero copiamos en la carpeta que nos interesa el/los archivos elegidos y, posteriormente, los incluimos en nuestra pgina. Una vez hecho esto, para insertar una imagen en una pgina, procederemos tal y como se ha comentado al comienzo de este apartado, mostrndose a continuacin una pantalla como la siguiente, teniendo dos opciones: La primera ser insertar una imagen desde la carpeta imgenes que hemos comentado previamente, para lo cual haremos clic en Elegir archivo

En esta pantalla seleccionaremos la imagen que queramos aadir en nuestra Web. La segunda ser indicar una direccin url en donde se encuentre la imagen a insertar. En este caso la imagen de mi avatar de Taringa!

Una vez copiada la ruta de la imagen, volvemos a la ventana de nuestro editor NVU y en el apartado Ubicacin de la imagen pegamos la ruta de la imagen que queremos insertar, tal y como observamos a continuacin.

Texto alternativo, quedando la imagen insertada en la pgina que estamos creando tal y como vemos a continuacin. AVISO: Realizando la insercin de imgenes de esta manera, tenemos el riesgo de que cuando la imagen deje de estar ubicada en el servidor correspondiente, no aparezca en nuestra Web pues la ruta de la misma ha cambiado.

IMGENES COMO FONDO DE PGINA


Ahora colocaremos una imagen de fondo de pgina. Para ello pinchamos sobre la pgina en Formato >> Colores y fondo de pgina... Luego, en el cuadro de dilogo que se nos muestra pinchamos en Imagen de Fondo; activamos la casilla Imagen de fondo y pinchamos en el botn Elegir archivo....

Si la imagen es ms pequea que la zona de visualizacin de una pgina (como en esta imagen elegida para el fondo), la repite en forma de mosaico ocupando toda la pantalla. Por eso las imgenes de fondo siempre hay que seleccionarlas bien para que no dificulten la lectura del texto.

Esto mismo que hemos descrito para el fondo de la pgina sirve para el fondo de una tabla que pongamos en ella (ms adelante hablaremos de las tablas).

VER NUESTRO TRABAJO


Una vez que hemos creado nuestra pgina, podemos visualizarla desde el programa navegador (recomendamos Mozilla Firefox). Para esto arrancamos el navegador por defecto que tengamos en nuestro ordenador desde NVU de varias formas: 1. Seleccionando la opcin Visualizar pgina en el navegador desde el men Archivo 2. Pinchando el botn situado en la Barra de herramientas. Tambin se puede abrir desde el navegador seleccionando el archivo de nuestra pgina Web. Hay que tener en cuenta que cada vez que realice modificaciones en su pgina, podr ver reflejados los cambios en el programa navegador, por lo que se guardar la pgina antes de verla. En la metodologa de trabajo para la edicin de pginas Web es importante trabajar siempre con las dos aplicaciones abiertas: el programa que permite crear las pginas (en nuestro caso, NVU) y la aplicacin que permite visualizarlas (el navegador).

TABLAS
Son estructuras que permiten organizar la informacin en la pantalla. Son muy tiles para combinar texto, imgenes y espacio en blanco en formas que no se pueden llevar a cabo de otro modo. Por ejemplo, se puede utilizar las tablas para crear columnas de texto, para integrar texto e imgenes, para crear mrgenes amplios o cuadros laterales,...

INSERTANDO UNA TABLA


Para insertar una tabla de manera rpida, seleccionaremos la opcin de men Insertar >> Tabla. Se mostrar una caja de dilogo con varias solapas para establecer las caractersticas de la tabla. Tambin podemos hacer clic en el icono Tabla mostrndose el mismo cuadro de dilogo

Rpido: para establecer el nmero de filas y columnas de forma visual con el ratn. Preciso: aqu se puede indicar, en los campos adecuados, el nmero de filas y de columnas, as como establecer el ancho total de la tabla en tantos por cien o en pixels. Tambin se puede indicar el grosor del borde. Celda: se establecen las caractersticas de la celda, como la alineacin vertical y horizontal, el espaciado entre celdas. Botn Edicin avanzada: para establecer opciones avanzadas como atributos HTML, eventos de Javascript, estilos, etc. Una vez creada la tabla, pueden editarse sus propiedades desde la opcin de men Tabla >> Propiedades de la tabla. Tambin con el men contextual, estando situado el cursor dentro de la tabla se pueden establecer las propiedades a nivel de celda, haciendo clic en Propiedades de celda de tabla.

INSERTAR O ELIMINAR FILAS Y COLUMNAS Si se desea aadir filas o columnas (o incluso celdas), puede hacerse desde la opcin de men Tabla >> Insertar, seleccionando la opcin deseada. Fila superior: inserta una fila encima de la fila en que est el cursor. Fila inferior: inserta una fila debajo de la fila en que est el cursor. Columna anterior: inserta una columna a la izquierda de la columna en que est el cursor. Columna posterior: inserta una columna a la derecha de la columna en que est el cursor. Celda anterior: inserta una celda a la izquierda de la celda en que est el cursor. Celda posterior: inserta una celda a la derecha de la celda en que est el cursor. Si se desea eliminar filas o columnas (o incluso celdas), puede hacerse desde la opcin de men Tabla >> Borrar, seleccionando la opcin deseada. Tabla: elimina la tabla entera. Fila: elimina la fila en que est el cursor. Columna: elimina la columna en que est el cursor. Celda: elimina la celda en que est el cursor. Contenido de la celda: elimina el contenido de la celda, pero no la celda en s. Si se desea seleccionar filas, columnas, celdas o la tabla entera, puede hacerse desde la opcin de men Tabla >> Seleccionar, seleccionando la opcin deseada. NO VOY A PROFUNDIZAR MAS EN ESTE TEMA PORQUE ES LO MISMO QUE PARA UN EDITOR DE TEXTO O CALCULO

Bueno amigos este ya es uno de los ultimos temas que veremos en este tutorial: los enlaces.

LOS ENLACES
Son estructuras que permiten organizar la informacin en la pantalla. Son muy tiles para combinar texto, imgenes y espacio en blanco en formas que no se pueden llevar a cabo de otro modo. Se trata de un enlace a: otras pginas de Internet (por ejemplo, a la pgina principal de Taringa!: http://www.taringa.net), a documentos almacenados en el sistema (otros archivos .html guardados en el disco duro, en un CD, archivos de sonido, de vdeo, etc.), a secciones dentro de la misma pgina (por ejemplo, se suele emplear al final de la pgina un enlace Ir arriba que permite volver al principio de la misma con un solo clic del ratn; esto lo veremos en la siguiente unidad) o a una direccin de correo electrnico. Generalmente se reconocen al explorar la pantalla porque el puntero del ratn, al colocarse encima de un enlace, se transforma en una mano que seala algo. Los enlaces pueden estar asociados a casi cualquier elemento que aparece en una pgina Web (imagen, vdeo o texto). Antes de crear un enlace, debemos seleccionar el elemento al que va a estar asociado, y la forma de hacerlo vara segn el elemento de que se trate: Si se trata de seleccionar un texto podemos seleccionar: una palabra haciendo doble clic sobre ella, con tres clics se selecciona un prrafo, varias palabras se seleccionan sealando la primera y arrastrando el ratn hasta la ltima. Si se trata de una imagen o un vdeo, bastar con hacer clic sobre el elemento deseado para seleccionarlo.

Una vez seleccionado el elemento, podemos asociarle un enlace de varias formas: 1. Haciendo clic sobre el icono que est en la barra de herramientas. 2. Seleccionando la opcin Enlace en el men Insertar. 3. Haciendo clic con el botn derecho del ratn en Crear enlace y aadir la direccin url correspondiente (en el ejemplo se ha elegido mi avatar de perfil). Cualquiera de estas acciones producir un cuadro de dilogo

En el campo correspondiente escribiremos la direccin completa de la pgina Web con la que est relacionada el enlace (o podemos copiarla de otro lugar y pegarla aqu). En el grfico vemos que el enlace de la imagen va a ser la pgina de mi perfil de taringa!! Podemos igualmente realizar otras acciones: Elegir archivo: elegiremos un archivo al que enlazar nuestra imagen. Lo anterior es una direccin correo electrnico: establece un enlace para enviar correo electrnico. Notas: Para establecer un enlace entre dos pginas, es conveniente que hayan sido creadas con anterioridad. Probemos abriendo nuestra pagina en el navegador y veremos como nos lleva a la pagina elegida.

ENLACES INTERNOS O MARCADORES (ENLACES DENTRO DE UN DOCUMENTO)


Los enlaces dentro del mismo documento permiten a los visitantes de una pgina hacer clic y saltar rpidamente a una parte de la misma. Por ejemplo, se puede crear un ndice al principio de la pgina y los usuarios pueden hacer clic en un elemento del ndice para ver la seccin de la misma a la que apunta dicho elemento. Estos enlaces dentro de la misma pgina se emplean cuando no es demasiado grande. Si es as, lo usual es distribuir su contenido en varias pginas y establecer enlaces entre ellas (una pgina gigantesca es ms lenta de cargar que varias pequeas, sobre todo cuando nos interesa nicamente una parte de su contenido). Y como ponemos estos enlaces? Bueno en nuestra pagina pondremos dos enlaces: Vamos a subir el cursor al principio de la pgina (a la primera lnea). Una vez tenemos el cursor en el sitio en el que se quiere crear un marcador, seleccionamos la opcin Enlace interno el men Insertar. Una vez hecho esto, se nos muestra un cuadro de dilogo en el que debemos escribir un Nombre del enlace interno: y luego agregarlo a la lista de enlaces internos. En nuestro caso vamos a escribir como nombre de marcador Arriba. Pinchamos en

el botn Aceptar para validar este marcador que hemos creado.

Bueno ahora los invito a hacer lo mismo para crear el enlace interno Abajo al final de nuestra pagina, sieguiendo los mismos pasos anteriores. Bueno una vez creado los dos enlaces haremos lo siguiente: Nos vamos a la primera linea y escribimos la palabra Abajo Luego seleccionamos la palabra Abajo hacemos click derecho y vamos a crear enlace,nos saldra una ventana como esta:

En la ventana debemos ir al menu desplegable ubicacion del enlace y seleccionar #Abajo

Nos quedara de este modo:

De que nos sirve esto?Bueno muy simple, nuestra palabra Abajo se "enlaza " con nuestro enlace interno Abajo, de esta forma al hacer click en la palabra Abajo nos llevara al final de la pagina. Ahora los invito a hacer 2 cosas: la primera es crear el Arriba para que cuando estemos al final de la pagina nos lleve arriba. y la segunda es probar los enlaces en nuestro navegador, veran que les saldra re facil!!!!

Bueno amigos el Post esta llegando a su fin,pudimos crear una pagina web basica con imagenes,links y texto,pero nos falta subirla a internet,bueno a eso vamos ahora.

Como subir una pagina Web


En esta ultima parte del post aprenderemos a subir nuestra pagina web, con el programa FTP descargado y veremos como se usa. Para esto necesitamos un hosting. Pero Que es un hosting? Un hosting es el servicio que nos permite guardar nuestra pgina web para que sea visible en internet. Tipos de hosting El alojamiento web se divide en seis tipos: gratuitos, compartidos, revendedores, servidores virtuales, servidores dedicados y de co-locacin. * Hosting gratuito: El alojamiento gratuito es extremadamente limitado cuando se lo compara con el alojamiento de pago. Estos servicios generalmente agregan publicidad en los sitios y tienen un espacio y trfico limitado. * Hosting compartido (shared hosting): En este tipo de servicio se alojan clientes de varios sitios en un mismo servidor, gracias a la configuracin del programa servidor web. Resulta una alternativa muy buena para pequeos y medianos clientes, es un servicio econmico y tiene buen rendimiento. * Hosting de imgenes: Este tipo de hospedaje se ofrece para guardar tus imgenes en internet, la mayora de estos servicios son gratuitos y las pginas se valen de la publicidad colocadas en su pgina al subir la imagen. * Hosting revendedor (reseller): Este servicio de alojamiento est diseado para grandes usuarios o personas que venden el servicio de Hosting a otras personas. Estos paquetes cuentan con gran cantidad de espacio y de dominios disponibles para cada cuenta. * Servidores virtuales (VPS, Virtual Private Server): mediante el uso de una mquina virtual, la empresa ofrece el control de un ordenador aparentemente no compartido. As se pueden administrar varios dominios de forma fcil y econmica, adems de elegir los programas que se ejecutan en el servidor. Por ello, es el tipo de producto recomendado para empresas de diseo y programacin web. * Servidores dedicados: El trmino servidor dedicado se refiere a una forma avanzada de alojamiento web en la cual el cliente alquila o compra un ordenador completo, y por tanto tiene el control completo y la responsabilidad de administrarlo. El cuidado fsico de la mquina y de la conectividad a Internet es tarea de la empresa de alojamiento, que suele tenerlo en un centro de datos. * Colocacin (o housing): Este servicio consiste bsicamente en vender o alquilar un espacio fsico de un centro de datos para que el cliente coloque ah su propio ordenador. La empresa le da la corriente y la conexin a Internet, pero el ordenador servidor lo elige completamente el usuario (hasta el hardware).

Elegir un buen servicio de hosting Un buen servicio de hosting es fundamental para que nuestra pagina web tenga xito, si el hosting que contratamos es malo, nuestra pgina web corre peligro. Que debo tener en cuenta a la hora de contratar un servicio de hosting? Lo fundamental es tener en claro como esta hecha nuestra pgina y cuantos visitantes aspiramos tener, debemos tener en cuenta: Un servicio de hosting recomendado tendra: * Servidor: Apache. * Sistema Operativo: Linux. * Modulo: Rewrite (mod_rewrite) activado. * Espacio en disco: necesario (segn nuestro sitio web, lo mnimo recomendado es 1 GB). * Transferencia: ac debemos tener en cuenta las visitas que tendremos, lo minimo que recomiendo es 5GB, aunque cuando el sitio crezca inebitablemente tendras que aumentar esa cifra. * Soporte tcnico: 24 horas, 7 dias a la semana. * Tiempo online: arriba del %95, esto garantiza que nuestro sitio este disponible a toda hora. * Cuentas de email: mas de 10. * Bases de datos: MySQL (segn lo que utilicemos), mas de 5. [size=12]La tarea de busqueda de un Hosting se las dejare a uds, ya que hay muchisimas opciones y para todos los gustos. Simplemente googleen Hosting gratuito[/size] Muy bien!ya tenemos nuestra pgina Web terminada, como dije antes hay que elegir un hosting para alojar la pgina y registrar un dominio.Pero que es un Dominio? Un dominio es el nombre con el que se ingresa a una pagina web, por ejemplo, el dominio de Taringa es http://www.taringa.net/ Lo que nos viene a la cabeza inmediatamente es Como registro mi dominio?

Que es registrar un dominio?


Registrar un dominio es, bsicamente, tomar el control durante un periodo de tiempo (el tiempo que estemos dispuestos a pagar, mnimo 1 ao) de un nombre de dominio para usarlo como queramos. Cmo registrar un dominio? Para registrar un dominio hay que seguir estos pasos: * Buscar un registrador que ofrezca el dominio que nosotros queremos, si queremos, por ejemplo, un dominio .com.ar, tendremos que ir a nic.ar. * Una vez que hayamos seleccionado el dominio o dominios deberemos completar un formulario con nuestros datos personales y con el periodo de tiempo que deseemos tenerlo en nuestra posesin. * Ahora procederemos a comprarlo, la mayora de los registradores aceptan tarjetas de crdito y transferencia bancaria. * Una vez comprado tendremos que dar los datos de configuracin, para esto tendramos que haber contratado un servicio de hosting previamente, si ya lo tenemos, pedimos que nos faciliten los datos de delegacin (IP del servidor, Name Servers, etc). * Hecha ya la configuracin del dominio, tendremos que esperar entre 4 y 8 horas para un dominio .com o .net y 24/48 horas para los otros as los cambios surgen efecto. * Ya podemos acceder a nuestra pgina web desde nuestro dominio recin comprado.

O sea tenemos que pagar para tener nuestro dominio?la respuesta es no!!!
Hay varios tipos de dominios gratis,pero el que usare aqui es el dominio .TK Dominios .TK Los dominios TK son otorgados desde DOT.TK, puedes elegir entre un dominio TK gratuito y uno pago, cual es la

diferencia? si pagas por registrarlo el dominio ser tuyo legalmente, sino te lo registrarn a nombre de la empresa, yo te recomiendo que si tu sitio tiene pocas visitas uses el dominio .TK gratuito.Obviamente en nuestro caso utilizaremos uno gratuito Registrar un dominio .TK gratis Para registrar un dominio TK gratis primero iremos a la pagina oficial DOT.TK donde veremos esto:

Donde esta marcado con un recuadro rojo debemos poner el dominio TK que queremos registrar y hacer clic en SIGUIENTE >>

En este paso elegimos si queremos el dominio TK gratis o si queremos pagarlo y que quede a nuestro nombre, nosotros vamos a elegir la versin gratuita, una vez que eligas haces clic en SIGUIENTE >>

Aqu vamos por pasos: 1. Paso 1: En el primer paso debemos poner la URL de nuestra pagina web, si est alojada en un hosting gratuito tendrs que poner la URL que utilizas para ingresar a tu pagina web. En cambio, si tienes un hosting de pago que te da sus DNS debes hacer clic en USE DNS FOR THIS DOMAIN. 2. Paso 2: En el segundo paso solo debes ingresar tu email personal. 3. Paso 3: En el paso tres debes ingresar los caracteres que ves en la imagen, respetando maysculas y minsculas. Luego haces clic en SIGUIENTE

Aqu debes elegir un nombre de usuario y contrasea para tu cuenta en DOT TK y luego clic en SIGUIENTE >>

Listo! ahora se ha enviado un correo electrnico a tu direccin de email, debes abrirlo y seguir las instrucciones para activar tu dominio.

Bueno ya tenemos nuestro Hosting y nuestro dominio. Ahora utilizaremos el programa FTP Filezilla para subir nuestra pagina. Asi que abrimos Filezilla y veremos una ventana asi...

Ahora veremos que significan esos numeros: 1. Servidor: aqu debemos poner la direccin FTP que nos da nuestro hosting, generalmente (en el 90% de los casos) la direccin que debes poner ah es ftp.tudominio.com. 2. Nombre de usuario: el nombre de usuario para la cuenta FTP a la que te quieres conectar, generalmente es el mismo que utilizas para entrar a tu panel del hosting. 3. Contrasea: igual que el anterior, la contrasea para el nombre de usuario de la cuenta FTP, generalmente es la misma que la que utilizas para entrar al panel de tu hosting. 4. Directorio local: en este panel vers todas las carpetas y archivos que hay en tu computadora, para subir tu pagina web debers ir hasta la carpeta donde tienes tu pagina web terminada. 5. Directorio remoto: en este panel vers todas las carpetas y archivos que hay en tu servidor (la computadora donde vas a subir la pagina web), una vez que subas todos los archivos deberas ver lo mismo en ambos paneles (4 y 5). 6. Barra de estado: aqu vers el progreso de los archivos cuando los subas. Muy bien, ya conocemos cada parte del programa, ahora vamos a subir nuestra pagina web Paso 1: nos conectaremos a nuestro servidor, para eso completaremos los campos 1, 2 y 3, una vez que se haya conectado veremos varias carpetas en el panel 5 de la imgen. Paso 2: en el panel de directorio local (N 4) buscaremos la carpeta donde estan los archivos de nuestra pagina web. Paso 3: en el panel de directorio remoto (N 5) nos dirigiremos a la carpeta public_html o www (depende de cada hosting, si contrataste hostgator vers la carpeta public_html).

Paso 4: una vez que tengamos localizada la carpeta de nuestro sitio en el panel 4 y la carpeta public_html en el panel 5 podemos comenzar a subir la pagina web, para esto seleccionaremos los archivos que queremos subir (en el panel 4 de la imgen), haremos un clic derecho y luego clic en subir. Si todo fue bien veremos en el panel 6, en la pestaa "Transferencias satisfactorias" que hay un numero con la cantidad de archivos que subimos.

Bueno finalmente cuando terminemos tendremos nuestra pagina web hecha. Por supuesto que si tenemos archivos que estan en nuestro equipo hay que subirlos. Bueno amigos,fue un poco largo este tutorial,espero que les haya servido, a mi me sirvio pero me costo un poco, no hacer el tutorial sino hacer y subir la pagina. Y todo es a prueba y error, si no te sale no te desesperes,segui intentando, googlea, pedi ayuda!!! hay mucha gente dispuesta a ayudar. Por supuesto que este tutorial no va a terminar aca. A medida que vaya aprendiendo cosa las ire agregado a este tuto!!!! Bueno amigos eso fue todo. Aca les dejo el link de la pagina que creamos a lo largo del tutorial...
http://www.chewbaccataringuero.tk/

También podría gustarte