PAGINAS

WEB

VER INTRO

PAGINAS

WEB

Carlos Donoso C.

Silver Hands Research

¿Qué vamos a cubrir?

Día 1 – Conceptos y Definiciones Base

Día 2 – Programando con HTML y PHP

Día 3 – Ejercicios Practicos

Día 4 – Frames y Macros

Día 5 – Servidores Web y Upload

Día 6 – Apache y PHP

Día 7 – Consejos y Utilitarios

Ronda de Preguntas y Evaluación

Objetivo Educacional

El presente curso, pretende demostrar distintos

puntos de vista, que deben considerarse al

momento de diseñar una pagina web.

El punto de vista de un diseñador, orientado

hacia las animaciones, colores, técnicas de

diseño y aplicaciones graficas.

El punto de vista de un programador, orientado

hacia la funcionalidad y navegabilidad de una

pagina web.

Día 1 Conceptos y Definiciones Básicas

Internet

Dominios

Hosting

Servidores

Paginas Web Estáticas y Dinámicas

HTML

PHP

CMS

XML

APACHE / MYSQL / PHP

SHAREPOINT

Conceptos Básicos

Internet es el legado del sistema de protección de

los Estados Unidos para mantener sus

computadoras militares conectadas en caso de un

ataque militar y la destrucción de uno o varios de

los nodos de su red de computadoras.

En la actualidad es una enorme red que conecta

redes y computadoras distribuidas por todo el

mundo, permitiéndonos comunicarnos y buscar y

transferir información sin grandes requerimientos

tecnológicos ni económicos relativos para el

individuo.

Dominios

Un dominio de Internet es un nombre

base que agrupa a un conjunto de

equipos o dispositivos y que permite

proporcionar nombres de equipo más

fácilmente recordables en lugar de una

dirección IP numérica.

Dominios

(.org) dominios de primer nivel para organizaciones

(.edu) dominios de primer nivel educativos

(.info) dominio nivel superior previsto para las

páginas web informativas

(.net) dominio de nivel superior previsto para las

páginas de servicios web

(.com) dominio de nivel superior comerciales

(.mil) dominio de Internet genérico para el

Departamento de Defensa de los Estados Unidos

Disponibilidad de un dominio

Hosting

Hosting es una palabra del Ingles que

quiere decir dar hospedar o alojar.

Aplicado al Internet, significa poner una

pagina web en un servidor de Internet

para que ella pueda ser vista en

cualquier lugar del mundo entero con

acceso al Internet.

ESPACIO EN DISCO

TRAFICO DE SITIO

Paginas Web - Definición Una página web es una fuente de información adaptada

para la World Wide Web (WWW) y accesible mediante un

navegador de Internet. Esta información se presenta

generalmente en formato HTML y puede contener

hiperenlaces a otras páginas web, constituyendo la red

enlazada de la World Wide Web.

Las páginas web pueden ser cargadas de un ordenador o

computador local o remoto, llamado Servidor Web, el cual

servira de HOST. El servidor web puede restringir las páginas

a una red privada, por ejemplo, una intranet, o puede publicar

las páginas en el World Wide Web. Las páginas web son

solicitadas y transferidas de los servidores usando el

Protocolo de Transferencia de Hypertexto (HTTP - Hypertext

Transfer Protocol). La acción del Servidor HOST de guardar

la página web, se denomina "HOSTING".

Paginas Web

Estáticas v.s. Dinámicas

Las páginas web pueden consistir en archivos de texto

estático, o se pueden leer una serie de archivos con

código que instruya al servidor cómo construir el HTML

para cada página que es solicitada, a esto se le conoce

como Página Web Dinámica.

Las páginas web dinámicas son aquellas que pueden

acceder a bases de datos para extraer información que

pueda ser presentada al visitante dependiendo de

ciertos criterios. Ejemplo de esto son páginas que tienen

sistemas de administración de contenido o CMS. Estos

sistemas permiten cambiar el contenido de la página

web sin tener que utilizar un programa de ftp para subir

los cambios.

Navegadores Un Navegador Web puede tener una Interfaz de

Usuario Gráfica (GUI - Graphical User Interface),

como Internet Explorer, Netscape Navigator, Mozilla

Firefox, etc. El más popular es el Internet Explorer de

Microsoft.

Los usuarios con navegadores gráficos pueden

deshabilitar la visualización de imágenes y otros

contenidos multimedia, para ahorrar tiempo, ancho de

banda o simplemente para simplificar su navegación.

También se puede descartar la información de

fuentes, tamaños, estilos y esquemas de colores de

las páginas web y aplicar sus propias CSS

estilizándola a su gusto.

Buscadores

Lo más importante a la hora de crear una

página web es su optimización web y el

posicionamiento conseguido en los motores de

búsqueda, como Google, Lycos, Altavista, etc.

Para alcanzar las primeras posiciones en los

resultados de una consulta con un

buscador, existen gran cantidad de trucos no

legales para la optimización de una página

Web que la mayoría de los buscadores

penalizan por ser ilegales. Confunden a los

usuarios y no ofrecen información útil sobre las

consultas.

DREAMWEAVERDreamweaver es la herramienta de diseño de páginas web

más avanzada, tal como se ha afirmado en muchos medios.

Aunque sea un experto programador de HTML el usuario que

lo maneje, siempre se encontrarán en este programa razones

para utilizarlo, sobretodo en lo que a productividad se refiere.

Cumple perfectamente el objetivo de diseñar páginas con

aspecto profesional, y soporta gran cantidad de tecnologías,

además muy fáciles de usar:

Hojas de estilo y capas

Javascript para crear efectos e interactividades

Inserción de archivos multimedia...

Además es un programa que se puede actualizar con

componentes, que fabrica tanto Macromedia como otras

compañias, para realizar otras acciones más avanzadas.

FLASHProbablemente, uno de los avances más importantes en

materia de diseño en el web ha sido la aparición de la

tecnología desarrollada por Macromedia denominada Flash.

Flash es la tecnología más comúnmente utilizada en el Web

que permite la creación de animaciones vectoriales. El interés

en el uso de gráficos vectoriales es que éstos permiten llevar

a cabo animaciones de poco peso, es decir, que tardan poco

tiempo en ser cargadas por el navegador.

Los vectores con los que trabaja Flash sólo son, por decirlo de

alguna manera, siluetas que casi no ocupan espacio y se

pueden modificar fácilmente y sin gasto de memoria en disco.

FIREWORKSEs una aplicación en forma de estudio (basada en la forma de

estudio de Adobe Flash®) pero con más parecido a un taller

destinado para la edición y optimización para web de gráficos

en mapa de bits o vectoriales.

Originalmente fue desarrollado por Macromedia, compañía

que fue comprada en 2005 por Adobe Systems. Fireworks

está enfocado en la creación y edición de gráficos para

internet. Está diseñado para integrarse con otros productos de

Adobe, como Dreamweaver y Flash. Está disponible de forma

individual o integrado en Adobe CS3.

http://www.macromedia.com

http://www.teletutoriales.es

http://www.flash.com

http://www.monografias.com

http://www.gmail.com

http://www.wikipedia.com

http://www.softonic.com

http://www.limewire.com

http://www.emule.com

http://www.jomla.com

PREGUNTAS Y RESPUESTAS

Formatos de programación de

Paginas Web

• HTML

• Hyper Text Markup Language (Lenguaje de Marcas de

Hipertexto)

• PHP

•HP Hypertext Pre-processor

• XML

•Extensible Markup Language (lenguaje de marcas

extensible)

• CMS

•Sistema de gestión de contenidos (Content Management

System)

HTMLHyper Text Markup Language (Lenguaje de Marcas de Hipertexto)

Es usado para describir la estructura y el contenido en forma de

texto, así como para complementar el texto con objetos tales como

imágenes. HTML se escribe en forma de "etiquetas", rodeadas por

corchetes angulares (<,>). HTML también puede describir, hasta un

cierto punto, la apariencia de un documento, y puede incluir un

script (por ejemplo Javascript), el cual puede afectar el

comportamiento de navegadores web y otros procesadores de

HTML.

<!DOCTYPE HTML PUBLIC “ -//W3C//DTD HTML 4.01//EN“>

<html lang="es">

<head>

<title>Ejemplo</title>

</head>

<body>

<p>ejemplo</p>

</body>

</html>

PHPPHP es un lenguaje interpretado de propósito general

ampliamente usado y que está diseñado especialmente para

desarrollo web y puede ser incrustado dentro de código

HTML. Generalmente se ejecuta en un servidor web, tomando

el código en PHP como su entrada y creando páginas web

como salida. Puede ser desplegado en la mayoría de los

servidores web y en casi todos los sistemas operativos y

plataformas sin costo alguno. PHP se encuentra instalado en

más de 20 millones de sitios web y en un millón de servidores,

aunque el número de sitios en PHP ha compartido algo de su

preponderante sitio con otros nuevos lenguajes no tan

poderosos desde agosto de 2005. Este mismo sitio web de

Wikipedia está desarrollado en PHP. Es también el módulo

Apache más popular entre las computadoras que utilizan

Apache como servidor web. La versión más reciente de PHP

es la 5.2.9-1 (for Windows) del 10 de Marzo de 2009.

PHP<?php

// Si existe la variable $_POST['muestra'], entonces muestra la comida favorita

if (isset($_POST['muestra']))

{

echo 'Hola, '.$_POST['nombre'].', tu comida favorita es:'. $_POST['comida'].'';

} else {

// Si no, muestra un formulario solicitando la comida favorita

?>

<form method="POST" action="<?php echo $_SERVER['PHP_SELF'];?>">

¿Cuál es tu nombre?

<input type="text" name="nombre" />

¿Cuál es tu comida favorita?

<select name="comida">

<option value="Spaguetis">Spaguetis</option>

<option value="Asado">Asado</option>

<option value="Pizza">Pizza</option>

</select>

<input type="submit" name="muestra" value="Seguir" />

</form>

<?php

} //Fin del bloque else

XMLXML es una tecnología sencilla que tiene a su alrededor otras

que la complementan y la hacen mucho más grande y con

unas posibilidades mucho mayores. Tiene un papel muy

importante en la actualidad ya que permite la compatibilidad

entre sistemas para compartir la información de una manera

segura, fiable y fácil.

XML proviene de un lenguaje inventado por IBM en los años

setenta, llamado GML (Generalized Markup Language), que

surgió por la necesidad que tenía la empresa de almacenar

grandes cantidades de información. Este lenguaje gustó a la

ISO, por lo que en 1986 trabajaron para normalizarlo, creando

SGML (Standard Generalized Markup Language), capaz de

adaptarse a un gran abanico de problemas. A partir de él se

han creado otros sistemas para almacenar información.

CMSUn Sistema de gestión de contenidos (Content Management

System en inglés, abreviado CMS) es un programa que

permite crear una estructura de soporte (framework) para la

creación y administración de contenidos, principalmente en

páginas web, por parte de los participantes.

Consiste en una interfaz que controla una o varias bases de

datos donde se aloja el contenido del sitio. El sistema permite

manejar de manera independiente el contenido y el diseño.

Así, es posible manejar el contenido y darle en cualquier

momento un diseño distinto al sitio sin tener que darle formato

al contenido de nuevo, además de permitir la fácil y

controlada publicación en el sitio a varios editores. Un ejemplo

clásico es el de editores que cargan el contenido al sistema y

otro de nivel superior (directorio) que permite que estos

contenidos sean visibles a todo el público (los aprueba).

Creando una Website en HTML

Uso de CMSJOOMLA / MAMBO

PAGINA WEB

DISEÑO DE ARTES O SHOTS

ELABORACION DE MAPA DE

SITIO

INCLUSIÓN DE DISEÑO Y

PROGRAMACIÓN

SUBIDA A LA WEB EN

DOMINIO TEMPORAL

DEPURACIÓN Y SUBIDA A

DOMINIO DEFINITIVO.

PAGINA WEB

DISEÑO DE ARTES O SHOTS

PAGINA WEB

ELABORACION DE MAPA DE

SITIO

PAGINA WEB

INCLUSIÓN DE DISEÑO Y

PROGRAMACIÓN

http://www.webstandards.org/files/acid2/test.html

PAGINA WEB

SUBIDA A LA WEB EN

DOMINIO TEMPORALDEPURACIÓN Y SUBIDA A

DOMINIO DEFINITIVO.

FTP – FILE TRANSFER PROTOCOL

File Transfer Protocol o

Protocolo de Transferencia

de Archivos, es un protocolo

de red para la transferencia de

archivos entre sistemas

conectados a una red TCP,

basado en la

arquitectura cliente-servidor.

Desde un equipo cliente se

puede conectar a un servidor

para descargar archivos

desde él o para enviarle

archivos, independientemente

del sistema operativo utilizado

en cada equipo.

Subiendo archivos vía FTP

Servidor ApacheEl servidor HTTP Apache es un servidor web HTTP de código abierto para

plataformas Unix (BSD, GNU/Linux, etc.), Windows, Macintosh y otras, que

implementa el protocolo HTTP/1.11 y la noción de sitio virtual. Cuando

comenzó su desarrollo en 1995 se basó inicialmente en código del popular

NCSA HTTPd 1.3, pero más tarde fue reescrito por completo. Su nombre

se debe a que Behelendorf eligió ese nombre porque quería que tuviese la

connotación de algo que es firme y enérgico pero no agresivo, y la tribu

Apache fue la última en rendirse al que pronto se convertiría en gobierno

de EEUU, y en esos momentos la preocupación de su grupo era que

llegasen las empresas y "civilizasen" el paisaje que habían creado los

primeros ingenieros de internet. Además Apache consistía solamente en

un conjunto de parches a aplicar al servidor de NCSA. Era, en inglés, a

patchy server (un servidor "parcheado").

El servidor Apache se desarrolla dentro del proyecto HTTP Server (httpd)

de la Apache Software Foundation.

Apache presenta entre otras características altamente configurables,

bases de datos de autenticación y negociado de contenido, pero fue

criticado por la falta de una interfaz gráfica que ayude en su configuración.

APACHE MY-SQL PHP

PREGUNTAS Y RESPUESTAS

PRACTICA