15
Redes de Datos Redes de Datos Conocimientos Básicos del Diseño Web Conocimientos Básicos del Diseño Web A- Conceptos generales B- Conceptos de Diseño C- Pasos para planificar un Web Empresarial D- Herramientas de Trabajo E- Publicar la Web

Diseño Web

Embed Size (px)

DESCRIPTION

Introducción al Diseño Web - Conceptos Básicos

Citation preview

Page 1: Diseño Web

Redes de DatosRedes de DatosConocimientos Básicos del Diseño WebConocimientos Básicos del Diseño Web

A- Conceptos generalesB- Conceptos de DiseñoC- Pasos para planificar un Web

EmpresarialD- Herramientas de TrabajoE- Publicar la Web

Page 2: Diseño Web

A- CONCEPTOS GENERALESA- CONCEPTOS GENERALES

Diccionario de términos de interés Diccionario de términos de interés para un creador de Web´s para un creador de Web´s

Direcciones Electrónicas Direcciones Electrónicas

Errores más comunesErrores más comunes

Direcciones de la WWWDirecciones de la WWW

Page 3: Diseño Web

Diccionario de términos de Diccionario de términos de interés para un creador de Web´sinterés para un creador de Web´s

http://www.arrakis.es/~wenceslahttp://www.arrakis.es/~wenceslao/CursoWeb/1/terminos.htmlo/CursoWeb/1/terminos.html

Consulta este link para mayor información

Agradecemos al autor, por poner a nuestra disposión tan valiosa y completa información

Page 4: Diseño Web

Direcciones ElectrónicasDirecciones Electrónicas

Forma de ubicar unívocamente a cada Forma de ubicar unívocamente a cada persona y computadora. Cada computadora persona y computadora. Cada computadora conectada a Internet posee un número conectada a Internet posee un número único llamado IP. Cuando una dirección único llamado IP. Cuando una dirección electrónica ingresa en la máquina, electrónica ingresa en la máquina, comienza a trabajar un DNS (Servidor de comienza a trabajar un DNS (Servidor de Dominio o Domain Name Server), Dominio o Domain Name Server), computadora especial que convierte o computadora especial que convierte o transforma los nombres de la dirección en transforma los nombres de la dirección en una dirección IP. Existen tres tipos: una dirección IP. Existen tres tipos:

Las de computadoras (llamadas Las de computadoras (llamadas dominios)dominios) Las de personas (casillas de E-mail) Las de personas (casillas de E-mail) Las de recursos (por ejemplo, una Las de recursos (por ejemplo, una página de la Web)página de la Web)

Page 5: Diseño Web

• Direcciones de ComputadorasDirecciones de Computadoras

Por ejemplo: www.arrakis.com.es Por ejemplo: www.arrakis.com.es

El esquema básico sería:El esquema básico sería:

Dominio=computadora.organización.tipo.paísDominio=computadora.organización.tipo.país

Page 6: Diseño Web

• Direcciones de DominiosDirecciones de Dominios Son únicas en el mundo, no puede haber dos Son únicas en el mundo, no puede haber dos iguales. iguales. Se escriben siempre en minúscula. Se escriben siempre en minúscula. Nunca llevan espacios entre palabras. Nunca llevan espacios entre palabras. Se componen de caracteres comunes: letras, Se componen de caracteres comunes: letras, números, guiones. números, guiones. Nunca debe usarse la ñ ni letras acentuadas, Nunca debe usarse la ñ ni letras acentuadas, ni $, ni #, ni otro carácter de ese tipo. ni $, ni #, ni otro carácter de ese tipo. Cada parte se separa por puntos. Cada parte se separa por puntos. No hay un máximo de caracteres de longitud. No hay un máximo de caracteres de longitud. Sin embargo, siempre se trata de hacerlas lo Sin embargo, siempre se trata de hacerlas lo más cortas posibles. más cortas posibles.

Page 7: Diseño Web

• Direcciones PersonalesDirecciones Personales La dirección electrónica es correspondiente La dirección electrónica es correspondiente a la computadora (dominio) que contenga a la computadora (dominio) que contenga su casilla de correo, más un nombre de su casilla de correo, más un nombre de usuario. Entre ambas partes se escribe el usuario. Entre ambas partes se escribe el símbolo @ llamado arroba. Ejemplo: símbolo @ llamado arroba. Ejemplo: usuario@dominiousuario@dominio donde: donde:El nombre de usuario puede ser el nombre, El nombre de usuario puede ser el nombre, apodo, apellido, seudónimo o lo que se apodo, apellido, seudónimo o lo que se desee, y se sugiere que no supere los 8 desee, y se sugiere que no supere los 8 caracteres. Ejemplo: caracteres. Ejemplo: [email protected][email protected]

Page 8: Diseño Web

Errores más comunesErrores más comunesEl mensaje nunca llega, o llega a otra persona. El mensaje nunca llega, o llega a otra persona. El mensaje vuelve acompañado de un mensaje de error. (Si El mensaje vuelve acompañado de un mensaje de error. (Si el mensaje que se recibe de vuelta es el mensaje que se recibe de vuelta es domain not found, domain not found, server not found, uknown server o no route to hostserver not found, uknown server o no route to host, puede , puede deberse a que se cometió un error al escribir la dirección deberse a que se cometió un error al escribir la dirección del dominio de esa persona (de la @ para la derecha). del dominio de esa persona (de la @ para la derecha). Si el mensaje es Si el mensaje es user not founduser not found ("no se encontró al ("no se encontró al usuario") el error se cometió en el nombre de la persona es usuario") el error se cometió en el nombre de la persona es decir, de la @ hacia la izquierda. decir, de la @ hacia la izquierda.

Para evitar errores, es conveniente releer con cuidado la Para evitar errores, es conveniente releer con cuidado la dirección del destinatario y recordar que: dirección del destinatario y recordar que: Nunca hay espacios en blanco Nunca hay espacios en blanco No se permiten caracteres raros (#,$,&) ni letras No se permiten caracteres raros (#,$,&) ni letras acentuadas. acentuadas. Los distintos componentes se separan con un punto y Los distintos componentes se separan con un punto y

la @ El dominio nunca debe ser escrito en mayúsculas.la @ El dominio nunca debe ser escrito en mayúsculas.

Page 9: Diseño Web

Direcciones de la WWWDirecciones de la WWW

URL=http://dominio/directorio/archivoURL=http://dominio/directorio/archivo

La estructura básica de una URL es la siguiente:La estructura básica de una URL es la siguiente:

Por ejemploPor ejemplo:: http://www.google.com.ar/http://www.google.com.ar/

Page 10: Diseño Web

B- CONCEPTOS DE DISEÑOB- CONCEPTOS DE DISEÑO

Lo Visual dentro del Lo Visual dentro del Proceso Creativo aplicado Proceso Creativo aplicado a la Web a la Web

Recursos con los que Recursos con los que cuenta el diseñadorcuenta el diseñador

Modelos de WebModelos de Web

Page 11: Diseño Web

C- PASOS PARA PLANIFICAR C- PASOS PARA PLANIFICAR UN WEB EMPRESARIALUN WEB EMPRESARIAL

IntroducciónIntroducción– La empresa dispone de una imagen corporativa que La empresa dispone de una imagen corporativa que

utiliza habitualmente en sus productos y en los utiliza habitualmente en sus productos y en los medios de comunicación de los que se sirve para medios de comunicación de los que se sirve para difundirlos. difundirlos.

– Dispone de una campaña publicitaria o se encuentra Dispone de una campaña publicitaria o se encuentra en proceso de elaboración de dicha campañaen proceso de elaboración de dicha campaña

Análisis de la SituaciónAnálisis de la Situación– Definición de la empresaDefinición de la empresa– Público objetivoPúblico objetivo– Nivel de competitividadNivel de competitividad– Formas habituales de distribución de los productosFormas habituales de distribución de los productos– Situación actual:Situación actual: Objetivo y Diagnóstico de la NecesidadObjetivo y Diagnóstico de la NecesidadMetodologíaMetodología

Page 12: Diseño Web

Desarrollo Desarrollo – Organigrama de navegación Organigrama de navegación

Aspecto FormalAspecto Formal– Desarrollando un Estilo:Desarrollando un Estilo:

AudaciaAudaciaCoherenciaCoherenciaActividadActividadAgudezaAgudezaDesequilibrioDesequilibrio AsimetríaAsimetríaRegularidad Regularidad FragmentaciónFragmentación

C- PASOS PARA PLANIFICAR C- PASOS PARA PLANIFICAR UN WEB EMPRESARIAL (cont)UN WEB EMPRESARIAL (cont)

Page 13: Diseño Web

D- HERRAMIENTAS DE TRABAJOD- HERRAMIENTAS DE TRABAJO

¿Qué programas tengo que ¿Qué programas tengo que usar para construir la Web? usar para construir la Web? HTMLHTML

¿Cómo publicar la Web? ¿Cómo publicar la Web? Clientes FTPClientes FTP

¿Cómo puedo ver Web´s?¿Cómo puedo ver Web´s?NavegadoresNavegadores

Page 14: Diseño Web

E- PUBLICAR LA WEBE- PUBLICAR LA WEBEnviar la Web al Servidor: FTP Enviar la Web al Servidor: FTP

Los clientes FTP son los más indicados para ello, por ej. Los clientes FTP son los más indicados para ello, por ej. Leech FTP, Cute FTP, Ws_FTP. Los programas de FTP Leech FTP, Cute FTP, Ws_FTP. Los programas de FTP sirven para transferir archivos de tu ordenador a otro sirven para transferir archivos de tu ordenador a otro remoto. Para que las páginas Web se puedan ver hay que remoto. Para que las páginas Web se puedan ver hay que enviar todos los archivos perfectamente estructurados en enviar todos los archivos perfectamente estructurados en directorios a un ordenador o mejor dicho, servidor que directorios a un ordenador o mejor dicho, servidor que esté preparado para ello. esté preparado para ello. El programa de FTP tiene un aspecto muy parecido al del El programa de FTP tiene un aspecto muy parecido al del explorador de Windows. Podrás ver que aparece, por un explorador de Windows. Podrás ver que aparece, por un lado, la estructura de tu disco duro, con sus directorios y lado, la estructura de tu disco duro, con sus directorios y archivos, y por otro, la del servidor. En nuestro caso verás archivos, y por otro, la del servidor. En nuestro caso verás cuando te conectes a tu espacio en nuestros servidores, cuando te conectes a tu espacio en nuestros servidores, que por defecto habrá un archivo llamado index.html.que por defecto habrá un archivo llamado index.html.

Lo más importante es conectarse:Lo más importante es conectarse:

Page 15: Diseño Web

E- PUBLICAR LA Web (cont)E- PUBLICAR LA Web (cont)Algunos de los programas de FTP van a solicitarnos Algunos de los programas de FTP van a solicitarnos

muchos datos cuando se realiza la acción de conectar. muchos datos cuando se realiza la acción de conectar. Sólo 4 son básicas y las 3 últimas las imprescindibles. Sólo 4 son básicas y las 3 últimas las imprescindibles. Profile name o nombre de conexiónProfile name o nombre de conexión: No es importante : No es importante pero sí interesa poner cualquier nombre para saber a pero sí interesa poner cualquier nombre para saber a posteriori que los datos que se usan a continuación posteriori que los datos que se usan a continuación corresponden a esa Web en particular. corresponden a esa Web en particular. Host NameHost Name: Este campo, como los próximos es : Este campo, como los próximos es esencial. Aquí hay que poner ftp.arrakis.es (escribe esencial. Aquí hay que poner ftp.arrakis.es (escribe sólo lo que está en negrita). sólo lo que está en negrita). User IDUser ID: Este es el Nombre de Usuario o Login (que es : Este es el Nombre de Usuario o Login (que es lo mismo). lo mismo). PasswordPassword: Esta es la Contraseña que se haya elegido : Esta es la Contraseña que se haya elegido para el nombre de usuario vas a utilizar. para el nombre de usuario vas a utilizar.

Con estos datos en teoría ya se puede acceder a tu espacio Con estos datos en teoría ya se puede acceder a tu espacio y transferir tus archivos desde tu ordenador. y transferir tus archivos desde tu ordenador. Por ejemplo: Leech FTP, Cute FTP, Ws_FTP son algunos servidores FTP

gratuitos