Proyecto Final. Análisis de Aplicaciones para La Creación de Contenido Dinámico Con PHP

INSTITUTO TECNOLÓGICO DE DURANGO
Departamento de Sistemas y Computación

Licenciatura en Informática
Proyecto de Investigación:
Análisis de aplicaciones para la creación de contenido
dinámico en una página web con PHP
Taller de Investigación 2
Realizó:
Salvador Romero Chávez
Durango, Dgo., Diciembre 2009

Licenciatura en Informática I.T.D. Proyecto Final
Comité de revisión
Dora Luz González Bañales, Maestra
Salvador Romero Chávez i

Agradecimientos y Dedicatoria
Dedico el presente trabajo a mis padres que siempre me han apoyado en mis estudios.
Agradezco a mi maestra que fue la persona que me orientó y me ayudó a realizar esta
investigación.
Salvador Romero Chávez ii

Tabla de contenido.
AGRADECIMIENTOS Y DEDICATORIA ........................................................................................ II
ÍNDICE DE TABLAS............................................................................................................................ VI
ÍNDICE DE FIGURAS.........................................................................................................................VII
RESUMEN ............................................................................................................................................. IX
ABREVIATURAS ................................................................................................................................... X
CAPÍTULO I. INTRODUCCIÓN. ..........................................................................................................1
ANTECEDENTES. ....................................................................................................................................1
1.1 DEFINICIÓN DEL PROBLEMA. ..........................................................................................................1
1.2 OBJETIVO.........................................................................................................................................1
1.3 ALCANCES Y LIMITACIONES. ...........................................................................................................2
1.4 PREGUNTA DE INVESTIGACIÓN. ......................................................................................................2
1.5 ORGANIZACIÓN DEL CONTENIDO. ..................................................................................................2
CAPÍTULO II. INTRODUCCIÓN AL DISEÑO WEB. .......................................................................3
2.1 HISTORIA DE LA WORLD WIDE WEB. ...............................................................................................3
2.2 CONCEPTO DE PÁGINA WEB (ESTÁTICAS Y DINÁMICAS). ...............................................................4
CAPÍTULO III. DISEÑO WEB. .............................................................................................................8
3.1 ETAPAS DEL DISEÑO WEB. ...............................................................................................................8
3.1.1 PRIMERA ETAPA: PLANIFICAR. ...................................................................................................8
3.1.1.1 El Equipo. ...........................................................................................................................8
3.1.1.2 Reunir información. ............................................................................................................8
3.1.1.3 Determinar la misión y los objetivos del sitio. .....................................................................9
3.1.1.4 Determinar la/s audiencia/s destinadas y posibles. .............................................................9
3.1.1.5 Establecer un plan de trabajo..............................................................................................9
3.1.2 SEGUNDA ETAPA: CONCEBIR. .....................................................................................................9
Salvador Romero Chávez iii

3.1.2.1 Establecer criterios de calidad............................................................................................10
3.1.2.2 Determinar los contenidos..................................................................................................10
3.1.2.3 Determinar la estructura de los contenidos. ......................................................................11
3.1.2.4 Determinar el formato gráfico. ..........................................................................................11
3.1.2.5 Creación de documentos de trabajo interno. ....................................................................12
3.1.3. TERCERA ETAPA: CONSTRUIR, VISUALIZAR Y TESTEAR. ........................................................13
3.1.3.1. Construyendo y evaluando. .............................................................................................13
3.1.3.2 La página de acceso o principal. ........................................................................................14
3.1.3.3 Decisiones de Navegación. .................................................................................................15
3.1.3.4. Identidad Visual Corporativa. ...........................................................................................15
3.1.4 CUARTA ETAPA: LA PROMOCIÓN. .............................................................................................16
3.1.5 QUINTA ETAPA: EVALUAR..........................................................................................................17
3.1.6 SEXTA ETAPA: PUESTA AL DÍA Y EVOLUCIÓN. ...........................................................................19
CAPÍTULO IV. PLANIFICACIÓN DEL DISEÑO WEB. .................................................................20
4.1 NAVEGABILIDAD. ...........................................................................................................................20
4.2 USABILIDAD. ..................................................................................................................................21
4.3. ARQUITECTURA DE LA INFORMACIÓN. ........................................................................................22
CAPITULO V. LENGUAJES ORIENTADOS AL DISEÑO WEB. ..................................................27
5.1 ASP (ACTIVE SERVER PAGES). .....................................................................................................27
CAPÍTULO VI. LENGUAJE PHP. ......................................................................................................32
6.1. PLATAFORMAS PARA EL DESARROLLO DE PHP. .........................................................................32
6.1.1. NOTEPAD++. ..............................................................................................................................32
6.1.2 PHP DESIGNER. ..........................................................................................................................41
6.1.3 NETBEANS...................................................................................................................................42
6.1.4 PDT- ECLIPSE. ............................................................................................................................44
6.2 INTRODUCCIÓN AL LENGUAJE PHP. .............................................................................................46
6.2.1 SINTAXIS BÁSICA.........................................................................................................................46
Salvador Romero Chávez iv

6.2.2 TIPOS DE DATOS. .........................................................................................................................48
6.2.3 VARIABLES. .................................................................................................................................49
6.2.4 CONSTANTES. ..............................................................................................................................51
6.2.5 EXPRESIONES Y OPERADORES. ...................................................................................................51
6.2.6 ESTRUCTURAS DE CONTROL.......................................................................................................52
6.2.7 FUNCIONES..................................................................................................................................54
6.2.8 TABLAS........................................................................................................................................55
CAPÍTULO VII. METODOLOGÍA DE LA INVESTIGACIÓN. .....................................................58
7.1 DESCRIPCIÓN DE LA FORMA A INVESTIGAR. .................................................................................58
CAPÍTULO VIII. RESULTADOS. .......................................................................................................59
8.1 TABLA COMPARATIVA DE LAS DISTINTAS PLATAFORMAS PARA EL DESARROLLO DE PHP. .......59
8.2 RESULTADOS A FAVOR DE CADA PROGRAMA. .................................................................................60
CAPÍTULO IX. CONCLUSIONES. .....................................................................................................61
REFERENCIAS BIBLIOGRÁFICAS. .................................................................................................62
Salvador Romero Chávez v

Índice de Tablas
Tabla 8.1. Tabla comparativa de los programas. .................................................................. 59
Tabla 8.2. Resultado de los puntos obtenidos. ..................................................................... 60
Salvador Romero Chávez vi

Índice de Figuras
Figura 2.1. Partes de la web.................................................................................................... 4
Figura 2.2 Página web estática de los derechos humanos. ..................................................... 5
Figura 2.3 Página web dinámica de los derechos humanos. .................................................. 6
Figura 3.1. Ejemplo de un ordinograma fuente .................................................................... 11
Figura 3.2. Ejemplo de una maquetación sencilla ................................................................ 14
Figura 4.1. Características de la usabilidad. ......................................................................... 22
Figura 4.2. Los elementos de la experiencia de usuario. ...................................................... 24
Figura 4.3. Características de computadores y humanos. .................................................... 25
Figura 5.1. Función de las paginas ASP. .............................................................................. 27
Figura 5.2. Petición al servidor de PHP. .............................................................................. 30
Figura 6.1. Sintaxis coloreada a elección del usuario. ......................................................... 34
Figura 6.2. Autocompletado. ................................................................................................ 35
Figura 6.3. Multi-Vista. ........................................................................................................ 36
Figura 6.4. Posición dinámica de las vistas. ......................................................................... 37
Figura 6.5. Herramientas de zoom. ...................................................................................... 38
Figura 6.6. Puntos de marca. ................................................................................................ 39
Figura 6.7. Resaltado de paréntesis y sangría....................................................................... 40
Figura 6.8. Ventana de php Designer ................................................................................... 41
Figura 6.9. Ventana de NetBeans. ........................................................................................ 43
Figura 6.10. Ventana de Eclipse. .......................................................................................... 44
Figura 6.11. Ventana del Zend Studio. ................................................................................. 45
Figura 6.12. Salida del código “hola” en español. ............................................................... 50
Salvador Romero Chávez vii

Figura 6.13. Salida del código “hola” en inglés. .................................................................. 50
Figura 6.14. Ejemplo if-else ................................................................................................. 52
Figura 6.15. Ventana del ejemplo......................................................................................... 53
Figura 6.16 Ventana de ejemplo de la estructura ................................................................. 54
Figura 6.17. Ventana de ejemplo de la ................................................................................. 54
Tabla 8.1. Tabla comparativa de los programas. .................................................................. 59
Tabla 8.2. Resultado de los puntos obtenidos. ..................................................................... 60
Salvador Romero Chávez viii

Resumen
Esta investigación trata de las diferentes cosas que se tienen que tomar en cuenta para
crear o diseñar una página web.
Contiene un poco de historia de las páginas web, así como los dos tipos de páginas web que
hay, este documento también contiene las etapas por las cuales se debe de pasar para crear
la pagina web que es algo que hay que tomar en cuanta si es que se quiere diseñar una
página web con calidad.
Aquí se van a encontrar un poco de la usabilidad, navegabilidad y de la arquitectura de la
información que implica el diseño web.
También se habla un poco acerca de algunos lenguajes que están diseñados para programar
páginas web de contenido dinámico como el ASP, el Perl, el Java Script y el PHP que es al
lenguaje al que se enfoca esta investigación, y como esta investigación se enfoca en el
lenguaje PHP el objetivo de esta es analizar algunas plataformas para la generación de
contenido dinámico con el lenguaje ya mencionado, y por último se da una introducción al
lenguaje que viene siendo la sintaxis del mismo.
Salvador Romero Chávez ix

Abreviaturas
Abreviatura Significado
HTML Siglas de HyperText Markup Language (Lenguaje de Marcas de
Hipertexto).
CGI Common Gateway Interface, una tecnología que se usa en los servidores
web.
FTP Sigla en inglés de File Transfer Protocol - Protocolo de Transferencia de
Archivos.
CVS Concurrent Versions System, también conocido como Concurrent
Versioning System, es una aplicación informática que implementa un
sistema de control de versiones.
IDE Sigla en inglés de integrated development environment, entorno de
desarrollo integrado (IDE), también conocido como entorno de diseño
integrado o entorno de depuración integrada, es una aplicación de
software que proporciona las más completas instalaciones para los
programadores de computadoras para el desarrollo de software.
GUI Sigla en inglés graphical user interface, una interfaz gráfica de usuario,
es un tipo de elemento de la interfaz de usuario que permite a las
personas interactúan con programas en más de escribir, como
computadoras, dispositivos portátiles
UML Sigla en inglés Unified Modeling Language, es un general normalizado
lenguaje de modelado de propósito en el ámbito de la ingeniería de
software.
SOA Sigla en inglés Service Oriented Architecture, la Arquitectura Orientada
a Servicios, es un concepto de arquitectura de software que define la
utilización de servicios para dar soporte a los requisitos del negocio.
WYSIWYG Es el acrónimo de What You See Is What You Get (en inglés, "lo que ves
es lo que obtienes"). Se aplica a los procesadores de texto y otros
editores de texto con formato (como los editores de HTML) que
permiten escribir un documento viendo directamente el resultado final,
frecuentemente el resultado impreso.
STL Sigla en inglés Standard Template Library, biblioteca de plantillas
estándar es una biblioteca de software incluido parcialmente en el C + +
de la biblioteca estándar. Proporciona contenedores, iteradores,
algoritmos, y funtores.
API Siglas en inglés Application Programming Interface, es una interfaz que
un programa de software implementa a fin de que otro software para
interactuar con él, gran parte de la misma manera que el software puede
implementar un interfaz de usuario con el fin de permitir a los humanos
utilizan.
COBOL Acrónimo de COmmon Business -Oriented Language, Lenguaje Común
Orientado a Negocios.
PDF Acrónimo del inglés Portable Document Format, formato de documento
portátil, es un formato de almacenamiento de documentos.
GNU Licencia Pública General de GNU o más conocida por su nombre en
Salvador Romero Chávez x
inglés GNU General Publical License o simplemente su acrónimo del

inglés GNU GPL, es una licencia creada por la Free Software
Foundation, y está orientada principalmente a proteger la libre
distribución, modificación y uso de software.
ASP Active Server Pages.
AIfIA Instituto para la Arquitectura de la Información.
AI Arquitectura de la Información.
WIF Sigla en inglés Web Impact Factor, factor de impacto en la web.
RGB Descripción RGB (del inglés Red, Green, Blue; "rojo, verde, azul") de un
color hace referencia a la composición del color en términos de la
intensidad de los colores primarios con que se forma: el rojo, el verde y
el azul. Es un modelo de color basado en la síntesis aditiva, con el que es
posible representar un color mediante la mezcla por adición de los tres
colores luz primarios.
URL Sigla en inglés Universal Resource Locator.
HTTP Sigla en inglés Hypertext Transfer Protocol. Protocolo de transferencia
de hipertexto.
NCSA Es la sigla del National Center for Supercomputing Applications (Centro
Nacional de Aplicaciones de Supercomputación).
CERN Organización Europea de Investigación Nuclear.
WWW World Wide Web.
PHP Es un acrónimo recursivo que significa PHP Hypertext Pre-processor,
pre-procesador de hipertexto.
Salvador Romero Chávez xi

Capítulo I. Introducción.
Antecedentes.
En un principio el diseño de páginas web era muy simple debido a que las primeras
páginas que se diseñaron contenían puro texto, pero a medida que ha evolucionado la
tecnología, tanto los ordenadores como las redes de telecomunicaciones, se ha generado
nuevas formas de desarrollar la web.
La inclusión de imágenes fue la evolución más significativa, pero también debemos
mencionar el video y la animación, o los espacios 3D, lo que aporta valores estilísticos, de
diseño y de interactividad jamás imaginados antes.
El diseño de páginas web se ha desarrollado a medida que ha evolucionado Internet, pero
también han evolucionado a medida que los lenguajes de programación han ido
evolucionando. Existen varios lenguajes de programación que son orientados al diseño web
y esto permite que las páginas se diseñen con mayor creatividad y sean más atractivas para
el usuario, mediante pequeños videos, imágenes, colores, entre otros.
El diseño web forma parte importante dentro de la sociedad, porque a medida que han ido
evolucionando se pueden hacer más cosas a través de ellas como por ejemplo pagar algún
recibo por medio de internet, comprar algún producto, inscribirse en las instituciones, entre
muchas otras cosas más, esto a su vez hace más fácil la vida de las personas, pero todo esto
implica muchas otras cosas dentro del diseño web.
Antes de que se comience a diseñar una página web, es necesario tener una idea de cómo es
que se quiere diseñar la pagina, como las imágenes que va a llevar, para que servirá la
pagina entre muchas otras cosas más. Las páginas web deben tener una buena arquitectura
de la información y tener organizada la información de tal manera que sea atractiva y muy
llamativa para el usuario y de tal manera que no lo aburran, esto es un poco de todo lo que
debe llevar una página web y se debe de tomar en cuenta para su diseño.
(Publicaciones Vértice, 2005)
1.1 Definición del problema.

El problema aquí es que las páginas web que se crean con el lenguaje HTML son muy
estáticas y poco atractivas para el usuario, y con el lenguaje PHP que es orientado al diseño
web se pueden diseñar las páginas web más atractivas para el usuario.
Para crear páginas web dinámicas con PHP existen varias plataformas con las cuales se
pueden crear, el motivo por el que se realiza esta investigación es analizar diferentes
plataformas que permitan programar las páginas web con PHP y así ver cuál es la mas que
tiene mejores características , además que se conocería un poco este lenguaje de
programación.
1.2 Objetivo.
Lo que se pretende alcanzar al hacer esta investigación es analizar las diferentes
plataformas de desarrollo de páginas con contenido dinámico utilizando el lenguaje PHP, lo
que se quiere hacer con esta investigación es proporcionar o aportar información acerca de
las características que tienen las diferentes plataformas de desarrollo de lenguaje PHP, para
Salvador Romero Chávez 1

así hacer una comparación y ver cual plataforma es la más adecuada con respecto a la
facilidad de manejo de la misma.
1.3 Alcances y limitaciones.

A donde se quiere llegar con la investigación esa obtener toda la información sobre
distintas plataformas de desarrollo del lenguaje PHP para crear una página web de
contenido dinámico, como también conocer a fondo el lenguaje PHP.
Con toda la información obtenida de diferentes plataformas de desarrollo del lenguaje PHP
se hará un análisis de todas las características de las que constan cada una de las
plataformas y ya con esta información, hacer una comparación y evaluar las características
para así poder ver cual plataforma es la más adecuada para el desarrollo de una página web
con el lenguaje PHP.
La investigación nada más se enfocará en la recaudación de información acerca de varias
plataformas y también conocer a fondo el lenguaje PHP orientado al diseño web, a lo que
se refiere a los requisitos que debe llevar una página web como la usabilidad, la
arquitectura de la información, entre muchas otras cosas más, se hablara de ello pero no se
verá a fondo como el obtener información de distintas plataformas de desarrollo y conocer
a fondo el lenguaje PHP.
1.4 Pregunta de investigación.

¿Cuál es la plataforma más adecuada para los alumnos del tecnológico para desarrollar
páginas web de contenido dinámico con el lenguaje de programación PHP?
1.5 Organización del contenido.

El tipo de investigación que se usara para realizar este proyecto es la comparativa, ya que
se compararán las diferentes plataformas para así ver cuál es la más adecuada para el
desarrollo de una página web de contenido dinámico con el lenguaje PHP.
Este proyecto aportará información acerca de diferentes plataformas con las cuales se puede
crear una página web de contenido dinámico con el lenguaje PHP y un análisis de cuál es la
mejor plataforma para el desarrollo de una página web con PHP. También aportará
información de cómo utilizar el lenguaje PHP.
Espero que este proyecto cumpla con los objetivos que se han planteado, además que sirva
de información para todas aquellas personas que quieran diseñar su propia página web.

Capítulo II. Introducción al diseño web.

2.1 Historia de la world wide web.
La World Wide Web, WWW o, familiarmente, “la web nació en el año de 1990 en el
CERN (Consejo Europeo para la Investigación Nuclear).
Su desarrollador, un físico nuclear llamado Tim Berners-Lee, buscaba una forma de
publicar y compartir documentos entre sus compañeros científicos basada en hipertexto
(entramado de páginas conectadas mediante enlaces). Con esa idea creó el primer
navegador (WorldWideWeb) y sentó las bases en las que se apoya la actual web
(Publicaciones Vértice, 2005).
El gran avance de Berners-Lee fue unir hipertexto e internet. Entre la WWW y los
sistemas de hipertexto disponibles en aquel entonces existían algunas diferencias, como por
ejemplo: WWW sólo requería enlaces unidireccionales en vez de bidireccionales, es decir,
una persona podía enlazar con otro recurso sin necesidad de obtener un permiso del parte
del propietario de dicho recurso. Con esto se facilitaba considerablemente la
implementación de servidores web y navegadores. Otra diferencia radicaba en que la
WWW era no-propietaria permitiendo desarrollar servidores y clientes independientes y
añadir extensiones sin restricciones de licencia. Fue en 1993, cuando el CERN anuncia que
la web será gratuita para todos (Publicaciones Vértice, 2005).
Se considera que el punto de inflexión de la WWW comenzó con la introducción del

navegador web Mosaic en 1993, un navegador gráfico desarrollado por un equipo del
NCSA en la universidad de Illinois. Antes del lanzamiento de Mosaic, las páginas web no
integraban un alto entorno gráfico, así el interfaz gráfico de usuario de Mosaic permitió a la
WWW convertirse más rápidamente en el protocolo de internet más popular (Publicaciones
Vértice, 2005).
La web ha evolucionado muchísimo desde que la ideó Tim Berners-Lee. En sus

principios consistía en un sistema de publicación y enlazado por medio de hipertexto de
documentos estáticos, pero en la actualidad a la web se le están dando nuevos usos y
funcionalidades basados en la interacción con el usuario (Publicaciones Vértice, 2005).
La World Wide Web es un sistema hipermedia basado en el http (Hypertext Transfer

Protocol) que permite el acceso a fuentes de información en Internet. El sistemas también
interpreta otros protocolos utilizados en Internet, como ftp, gopher y telnet. En la Web se
presenta la información como una serie de documentos a menudo denominados "páginas
web", visibles en la pantalla de un ordenador y que se preparan utilizando el Hypertext
Markup Language (HTML). La página Web es transferida al ordenador del usuario
mediante le http, un protocolo del género cliente/servidor. Las páginas Web generalmente
residen en servidores http. El usuario solicita una página Web existente en un servidor http
mediante un software cliente especializado (navegador o browser), bien pulsando un enlace
hipertexto o designando una dirección concreta URL en la WWW. El servidor envía
entonces la información requerida al ordenador del usuario, el software o navegador

interpreta los códigos HTML y presenta la información contenida en la página Web de

forma inteligible en la pantalla del ordenador del usuario (Albarellano, 2006).
2.2 Concepto de página web (estáticas y dinámicas).

Una página web es una fuente de información adaptada para la WWW y se visualiza a
través de un navegador de internet o cliente web.
Está compuesta por multitud de archivos que pueden ser de imagen, de video y por
supuesto el archivo del código fuente. Dicho código está escrito en lenguaje HTML,
indicando con él donde colocar cada texto, imagen o video y la forma de éstos al colocarse
en la página (Publicaciones Vértice, 2005).
La web tiene actualmente al menos unas cuatro mil millones de páginas estáticas y un
número cientos de veces mayor de dinámicas (aquellas que sólo se crean producto de un
clic o de una consulta en un sitio web). Además, tenemos que agregar toda la web invisible,
en intranets o páginas con acceso restringido. La web oculta es seguramente miles de veces
más grande que la pública. La figura 1 muestra estas distinciones, minimizando el tamaño
tanto de la parte dinámica como de la oculta. Una última región, la web semántica, se
muestra en un tono más claro. En la actualidad, se estima que las páginas con información
semántica constituyen algo menos del 5%, aunque se espera que en el futuro sea mayor.
Esta información semántica, representada principalmente en los metadatos de cada página,
no es muy usada ya que existe un porcentaje mayor de páginas que tienen información no
fidedigna o directamente falsa (spamming de metadatos). Finalmente, la región con rayas
paralelas indica la zona que efectivamente poseen los buscadores web, que se corresponde
en gran parte con la zona pública estática y un poco de la dinámica (Baeza-Yates, 2004).
Figura 2.1 Partes de la web. (Baeza-Yates, 2004)

En la web se pueden crear dos tipos de páginas: estáticas y dinámicas.
Las paginas estáticas son aquellas que se construyen con lenguaje HTML, pueden
presentar textos estáticos acompañados de imágenes o archivos multimedia (puede ser
sonido o video) y a parte de los enlaces no permiten interactividad con el usuario. Son
fáciles de crear, aunque ofrecen pocas ventajas a los visitantes.
Las páginas estáticas por lo general ya no se utilizan en ningún lado porque son muy poco
atractivas y lo que se quiere es que muchas personas visiten frecuentemente tu página web
(Publicaciones Vértice, 2005).
Un ejemplo de una página web estática es la de los derechos humanos, que es como
estaba anteriormente porque actualmente está modificada y es una página dinámica.
A continuación se muestra la imagen de la página web estática:
Figura 2.2 Página web estática de los derechos humanos. (Publicaciones Vértice, 2005)
Cómo se puede observar no existe ningún elemento en la página que permita al usuario
interactuar con ella. Como ya se mencionó actualmente resulta muy difícil encontrar
páginas web estáticas.
Las páginas dinámicas contienen elementos que permiten al usuario interactuar con
ellas o bien presentan efectos especiales.
Un ejemplo de una página dinámica sería la nueva página de de los derechos humanos:
http://www.cndh.org.mx

Figura 2.3 Página web dinámica de los derechos humanos. (http://www.cndh.org.mx/

http://www.cndh.org.mx/)
Como se puede observar en la imagen, la página tiene hipervínculos que hacen interactuar
a la página con el usuario, así como también las imágenes que se muestran en el centro de
la página web, se les da un clic y te llevan a la información que muestran.
Para crear una página dinámica

inámica aparte de HTML se necesitaran otro tipo de lenguajes,
como el PHP, el JavaScript entre otros más. Las páginas dinámicas pueden ejecutarse en el
cliente (navegador) o en el servidor (Publicaciones Vértice, 2005).
Cuando una página HTML contiene script de cliente, el navegador se encarga de

interpretarlo y ejecutarlo. Que se ejecuten en uno u otro dependerá del uso que se le vaya
v a
dar a la página. Por ejemplo usos típicos de las páginas de cliente serían: efectos especiales
para webs como rollovers o control de ventas, cálculos, presentaciones en las que el texto
se desplace por la página, entre otros más (Publicaciones Vértice, 2005)..
Las paginas dinámicas de cliente se escriben básicamente en dos lenguajes de

programación: Javascript y VBScript.
Este tipo de páginas tienen la desventaja de que son muy dependientes del navegador en el
que se ejecutan y teniendo en cuenta que cada uno tiene sus propias características, no todas
las páginas se visualizaran igual en todos los navegadores. Como ventajas se pueden citar
que al ejecutarse en el navegador descargan de trabajo al servidor, que su respuesta ante la
petición de los usuarios es muy rápida, y que permiten la utilización de d recursos de la
maquina local (Publicaciones Vértice, 2005).
2005)

Las páginas dinámicas de servidor son ejecutadas por el servidor. El archivo HTML de la
página web llega al servidor y éste ejecuta los script contenidos en él devolviendo al cliente
sólo código HTML. Las paginas dinámicas de servidor se usan en aplicaciones web tales
como: foros, chats, y más concretamente en aquellas aplicaciones que requieren el acceso a
una base de datos situada en el servidor, como por ejemplo un banco.
Los principales lenguajes de programación existentes del lado del servidor son: ASP, JSP,
CGI, PHP (Publicaciones Vértice, 2005).

Capítulo III. Diseño web.

3.1 Etapas del diseño web.
Aquí se presentan las distintas etapas que forman parte de la creación de un sitio Web. Si
bien se establecen en forma cronológica como una sucesión de actividades, el acto de la
creación y puesta en marcha un sitio Web no es lineal. Como en la ejecución de cualquier
proyecto, muchas etapas se desarrollan en paralelo y algunas instancias implican volver
atrás. A diferencia de un documento registrado en otro soporte, un sitio Web no se
concluye, registra y distribuye, por el contrario permanece en un lugar lógico, presentado
información, creciendo, actualizándose o des actualizándose. Un sitio Web es un ser vivo,
nunca se culmina y esta característica incide en el proceso de su creación.
3.1.1 Primera Etapa: Planificar.

3.1.1.1 El Equipo.
Parte de la planificación de un sitio Web consiste en pensar en términos de equipo de

trabajo. Se trata del conjunto de técnicos que estarán a cargo de la concepción,
construcción, evaluación y mantenimiento del sitio.
Los miembros del equipo Web serán los responsables de todas aquellas estructuras no
visibles que hacen a la operatividad de un sitio, los usuarios se vinculan en realidad con la
punta de un iceberg. El equipo se basará en la convergencia de saberes y experiencias.
Debe estar integrado por técnicos de muy diversas disciplinas (que ya hemos mencionado),
capaces de contemplar los distintos aspectos que están en juego. Inicialmente, la mayoría
de las de las organizaciones tenían a cargo del sitio Web un Webmaster que trabajaba solo,
preparaba el servidor, editaba las páginas, hacía el diseño gráfico, y escribía o reunía los
textos. Con el tiempo se ha comprendido la complejidad de estos proyectos. Es muy
importe que el equipo tenga un líder (que puede en un futuro ser el Webmaster o no)
porque formar un equipo Web requiere un gran compromiso personal e institucional. Los
equipos no se construyen de la noche a la mañana, ni a partir de una decisión administrativa
o un mandato. Requieren un proceso de consolidación, que pasa por tiempos de búsqueda,
acuerdos y adecuación.
Un equipo Web debe estar en constante comunicación tanto con aquellos que le han
asignado su misión, como con sus destinatarios (clientes o usuarios). Su éxito se basa
además, en una estrecha colaboración y comunicación entre sus miembros (García de
León, 2002).
3.1.1.2 Reunir información.
Una vez determinado el equipo multidisciplinario que estará a cargo del proyecto, es
deseable que se reúna toda la información posible sobre creación de sitios Web, esto
incluye investigación sobre información tanto teórica como técnica, búsqueda de
bibliografía y normativa, así como la navegación y análisis de aquellos sitios referenciales,
próximos o pares, pasibles de ser emulados (García de León, 2002).

3.1.1.3 Determinar la misión y los objetivos del sitio.
Es importante establecer cuál será la misión del sitio, por más obvio que pueda parecer es
básico para el equipo del trabajo (en acuerdo con el marco institucional mayor), formular la
misión del sitio Web por escrito, discutirla y perfeccionarla. Igualmente se deben
establecer objetivos cumplir por el sitio, es muy posible que estos se modifiquen con el
tiempo, pero es importante que se establezcan como referentes para el trabajo y la acción
futura. Se trata de premisas básicas para la acción: “Se presentará...”; “Contendrá...” ; “Se
priorizará..” ; “Se tendrá presente...” ; ”Se omitirá...” . Se trata de establecer un mínimo
acuerdo de trabajo inicial al que se volverá en forma constante (García de León, 2002).
3.1.1.4 Determinar la/s audiencia/s destinadas y posibles.
Un sitio Web debe estar orientado a servir a las necesidades de sus usuarios. Quienes
elaboran una estructura Web deben conocer la audiencia a la cual se dirigen (usuarios
reales) y buscar, identificar y conocer a los posibles usuarios (usuarios potenciales). Toda
página Web debe presentar información útil a los intereses de la audiencia a la que se
dirige y declarar sus objetivos desde un comienzo dejando en claro que es lo que esas
páginas se proponen aportar. Existe un público específico para un producto específico y las
estructuras Web son más eficaces si se piensan y direccionan a audiencias específicas
constantemente estudiadas.
Es importante conocer nuestra primera audiencia destinada y contemplar otras audiencias
posibles, cada día es más frecuente que los sitios Web presente accesos por perfiles donde
toman en cuenta los distintos intereses que pueden llevar a un usuario a visitar un sitio
Web. Es fundamental en esta etapa recolectar la mayor información posible de los
usuarios, de lo contrario, nunca lograremos satisfacerlos ni con los contenidos, ni con los
caminos que diseñamos para ellos.
El conocimiento de la audiencia no se limita a esta primera etapa, deberá ser una acción
constante, a través de las mediciones de impacto ya sea con estudios estadísticos de uso del
servidor, encuestas o conociendo las preguntas de la audiencia, se trata de una tarea clave
para la retroalimentación (García de León, 2002).
3.1.1.5 Establecer un plan de trabajo.
Es necesario diseñar un plan de trabajo, un camino tentativo que guíe las acciones futuras
del equipo. El plan de trabajo estará presente a la hora de estructurar la información,
seleccionar los contenidos, elaborar, dar forma a los documentos y evaluar la gestión en su
conjunto. También se deberán establecer las etapas y los tiempos (García de León, 2002).
3.1.2 Segunda Etapa: Concebir.

El equipo de trabajo ya reunido, a la luz de la información recabada y las pautas
acordadas deberá en esta etapa “pensar” el sitio Web que se encamina a construir.
Mientras en la etapa de planificación se buscaba establecer “¿qué suministramos?” y “¿a
quién?” o “¿a quiénes?”, en esta etapa se formula el “¿cómo?”.

Se trata de cumplir los objetivos establecidos para las audiencias ya determinadas. Es el

momento de planificar el estado futuro, pensar libremente el punto de llegada y establecer
los camiones a recorrer (García de León, 2002).
3.1.2.1 Establecer criterios de calidad.
Las decisiones de calidad subyacen en la forma externa y visible de un sitio Web

vinculada a la arquitectura y el diseño de la información.
El equipo de trabajo deberá establecer los aspectos que contemplará para crear un producto
de calidad tanto en términos de contenidos y usabilidad, como de recuperación. Es
conveniente que tomen en cuenta como base los criterios ya establecidos en la literatura
especializada, así como listados para el chequeo de calidad (check lists).
Básicamente se toman en cuenta aspectos vinculados a: estructura; cumplimiento de
objetivos; conocimiento de la audiencia y adecuación; credibilidad y solvencia, autoría,
características de la URL; auspiciantes y publicidad; contenidos y valor agregado;
interactividad; accesibilidad; actualización; estructura hipertextual; acceso gráfico a la
estructura general, diseño; criterios ergonómicos, navegabilidad; identidad visual
corporativa; netiquette y recuperación e impacto.
En esta etapa se deben enunciar políticas de acción que sustenten la calidad, políticas que
pueden modificar y enriquecer el plan de trabajo inicial (García de León, 2002).
3.1.2.2 Determinar los contenidos.
Se deberá establecer que contenidos presentará el sitio para cumplir su misión y satisfacer
los requerimientos de la institución y la audiencia. Es necesario elaborar un plan de
desarrollo de contenidos, con información básica (a brindar necesariamente en primera
instancia) y ampliatoria, pasible de ser presentada en una etapa posterior. Estas decisiones
deben tomarse en acuerdo con los miembros de la institución.
La información a presentar no puede provenir directamente de textos creados para otro tipo
de medios (textos “planos” básicamente en soporte papel), como aquellos de presentación
institucional en libros, congresos o folletería. Los textos deben ser redactados y
presentados de acuerdo a las exigencias particulares de la escritura Web ¿Cómo deben ser
los textos a presentar en un Web? Deben ser breves, concisos y puntuales (nadie lee la
Web como un libro), muy estructurados que permitan una visión general y la opción a
ampliaciones o profundizaciones mediante enlaces. Deben tener títulos y subtítulos claros y
directos, que permitan gran movilidad, que vinculen a otros textos dentro y fuera del sitio
Web, o sea que no sean planos y permitan un abordaje dinámico y directo.
Las frases deben ser, cortas, simples y claras, redactadas en estilo directo. Se debe prever
además el acceso a documentos de sustento a veces textos extensos como tratados, leyes y
declaraciones, pero deben ser opcionales. Se deben redactar también buenos textos de
anticipación que den a l usuario el mayor número de elementos para saber a qué
información puede acceder si elige seguir navegando. Se deben citar siempre las fuentes del
texto, y la fecha de actualización (García de León, 2002).

3.1.2.3 Determinar la estructura de los contenidos.
Los primeros sitios Web desarrollados se bastaban en la premisa “recorra, espere y

verá”. Con el tiempo se comenzó considerar a la estructuración adecuada de la información
tan importante como los contenidos en sí mismos. La hipertextualidad es el recurso clave
para el establecimiento de estas estructuras.
No basta con que la información exista, debe tener una organización que facilite el acceso
y la presente como un todo. La lectura en la Web no es secuencial y se deben suministrar
las formas adecuadas para que la navegación sea directa y provechosa.
Es básico para organizar la información, dividirla en áreas (grandes unidades lógicas) y
subordinar a cada área la información pertinente, es decir, construir una estructura
jerárquica, establecer niveles y relaciones. La organización lógica del sitio permite que
usuarios lo recorran haciendo predicciones exitosas acerca de dónde encontrar las cosas.
En esta etapa se debe construir una representación gráfica de la estructura (estructura
conceptual) a desarrollar para presentar los contenidos acordados. Esta representación que
muestra no solo los contenidos, sino también su organización jerárquica y relaciones, se
llama ordinograma (García de León, 2002).
Figura 3.1 Ejemplo de un ordinograma fuente (García de León, 2002).
3.1.2.4 Determinar el formato gráfico.
Un sitio Web es una estructura de información que posee una expresión gráfica que
permite su visualización y navegación. El formato gráfico debe estar centrado en el usuario
y su accesibilidad y crear un la lógica visual que represente y optimice la lógica de la
estructura de contenidos. Así como se han elaborados pautas para reunir contenidos y
estructurarlos, corresponde en esta etapa, establecer los criterios gráficos que guiarán la
construcción de una primera versión del sitio (García de León, 2002).
El equipo de trabajo establecerá la forma más apropiada de presentar la estructura

acordada. Se trata de materializar el ordinograma concebido en borrador a través de
varias formas posibles de organización.
Se fijarán los criterios ergonómicos básicos a contemplar.

Se definirá la estructura de la página principal del sitio, también llamada de acceso

o home page.
Se establecerá también la forma de navegación, contemplando siempre varias

posibilidades como: cenefa lateral, cenefa horizontal, menús desplegables, menús
con teclas, barra de navegación, indicador de situación, entre otros.
Se acordará la presentación gráfica de los distintos niveles y áreas temáticas dentro

de la estructura, y los mecanismos de vinculación entre éstos.
En paralelo se registrará que recursos gráficos serán necesarios para la

materialización de estos mecanismos (logotipos, imágenes, iconos) con miras al
establecimiento de una identidad visual corporativa.
Se establecerá también la paleta de colores, los tipos de letras a usar y sus tamaños,
los cabezales y los pies de cada página también según niveles (García de León,
2002).
3.1.2.5 Creación de documentos de trabajo interno.
El equipo Web, establece, a lo largo de su gestión tanto en su relacionamiento con el

marco institucional, como en la interna de su trabajo: premisas útiles, pautas y políticas
generales para guiar su acción.
Es deseable que esa información se consolide en la creación de documentos. Algunos
equipos de trabajo crean estos documentos como páginas Web de acceso restringido que
permanecerán asociadas al sitio Web en creación, a las que llaman “páginas silenciosas”.
Se trata de un excelente recurso, tanto para efectuar el trabajo como para evaluarlo y
perfeccionarlo. Sirven para legar metodología, normalizar, transferir tareas, mantener la
calidad y, en el caso de algunas entidades que lideran áreas como las redes académicas y
los organismos gubernamentales, pautar la creación de nuevos sitios (García de León,
2002).
Veamos qué tipo de documentos pueden ser generados:
Plan de trabajo. Ya en la primera etapa de creación del sitio, se formula un plan

de trabajo tentativo para guiar las acciones futuras. Este plan está sujeto a las
modificaciones, propias de la marcha del proyecto. Tanto el plan inicial, como
todas sus versiones posteriores deberán estar siempre junto al equipo de trabajo. El
plan es doblemente útil para: ser seguido y para ser confrontado con la mecánica de
trabajo. Puede incluir un cronograma.
Premisas de acción y trabajo. Si se han establecido premisas vinculadas a las

decisiones de política o mecánica de trabajo, es conveniente una vez discutidas y
acordadas ponerlas por escrito.

Manual de estilo. Es una de las herramientas más útiles para el desarrollo de un

sitio Web. Se trata de un recurso complejo, requiere muchas horas de trapajo, su
creación es un proyecto en sí mismo, puede pensarse como desarrollo consecuente
del proyecto inicial. Debe contemplar los más diversos aspectos: ortografía,
tipografía, diseño de la página, iconos, estructura de encabezados, normas para
titular, criterios para incorporar metadatos, etc. En el inicio del proyecto los equipos
pueden usan manuales de estilo puestos a dominio público por otras organizaciones.
Caja de herramientas. Para reunir y normalizar todos los recursos gráficos usados
se crea las Cajas de Herramienta, que incluye cuándo y cómo usarlos. Las Cajas de
Herramientas sustentan la identidad visual corporativa. Muchas veces está
normalización se incorpora al Manual de Estilo o da inicio a este. Algunas
organizaciones desarrollan un Manual de Identidad Visual Corporativa.
El rojo que se ha adoptado como "rojo Universidad del Valle" en su versión para Internet
es el rojo puro, que resulta del número hexadecimal FF0000 (expresado en valor RGB).
Este color se deberá utilizar únicamente dentro del logo símbolo y si fuere necesario, en el
título principal del documento, pero nunca se deberá utilizar dentro de los colores de los
textos, enlaces, subtítulos y enlaces visitados de las páginas en HTML. Esto se hará para
mantener como un color independiente de todos los demás al "rojo Universidad del Valle"
(García de León, 2002).
3.1.3. Tercera Etapa: Construir, visualizar y testear.
Una vez que un sitio Web ha sido planeado y concebido, corresponde su

materialización en una estructura tentativa a ser analizada y confrontada con los propósitos
iníciales, antes de ser puesta a dominio público. En paralelo se deberán acordarán las
condiciones de técnicas del servidor y las normas de seguridad que garanticen la operativa.
Como por ejemplo:
El nivel de complejidad tecnológica para la edición (html solamente; Javascript;
Flash; Java; entre otros.)
Las posibilidades de los equipos que maneja en general el usuario.
Las diferentes formas de visualización según los distintos navegadores (browsers);
las distintas resoluciones de pantalla; los distintos tamaños de pantallas.
El tiempo de carga de los sitios y cada página (García de León, 2002).
3.1.3.1. Construyendo y evaluando.
Ha de crearse un prototipo del sitio, tal y como ha sido planificado y concebido.

La función principal del diseño de información consiste en minimizar la complejidad de los
contenidos y permitir el mejor acceso. La construcción del sitio se sustenta en recursos
visuales y auditivos en estructuras hipertextuales e interactivas.
Una vez creado el prototipo del sitio toma vida, deberá recorrerse, corroborando la
normalización de cada nivel, y las relaciones de los niveles entre sí, así como los enlaces no
jerárquicos que permiten una navegación global (de las páginas entre sí, dentro de cada
página y con otros sitios).

Se deberá también, corroborar el cumplimiento de las pautas acordadas en las etapas

anteriores, en términos de contenidos, estructura de la información, formato gráfico y
criterios de calidad. En esta instancia, a la luz de la estructura ya en acción, algunas pautas
acordadas pueden ser modificadas. Estas modificaciones deben consignarse en los
documentos de trabajo interno.
La mejor manera de evaluar el éxito de la construcción es por medio de pruebas con los
usuarios, sería ideal que se evalúe el prototipo con usuarios próximos considerados
audiencia destinada. Si se ha acordado presentar la información según perfiles de usuario,
es este el momento de recorrer los caminos pensados e incluso presentar estos perfiles a sus
destinatarios. Se podrá ver allí si se ha contemplado adecuadamente las necesidades de cada
perfil. Esta experiencia es muy rica pues permite conocer como interactúa el usuario con el
sitio, que hasta ahora sólo satisface la lógica de sus creadores. Esta instancia puede
llevarnos a reestructurar el prototipo y revisar incluso decisiones de etapas anteriores
Figura 3.2 Ejemplo de una maquetación sencilla (García de León, 2002).
3.1.3.2 La página de acceso o principal.
Los sitios Web giran en torno a su la página de acceso. Esta cumple una función clave, es
la puerta de entrada a toda la estructura desarrollada, la representa. Desde la página de
acceso se debe poder visualizarse la estructura completa del sitio y las formas de recorrerlo.
Le corresponde responder al usuario las siguientes preguntas:
¿Dónde está?
¿Quién está a cargo?
¿Qué puede encontrar?
¿Cómo?
Ha de contener los datos completos del sitio, su nombre y el de la entidad que lo genera,
el o los logotipos, los acrónimos si los hubiera, datos de los responsables, dirección,
teléfonos, correo electrónico, derechos de autor y fecha de actualización. Deber suministrar
también una breve explicación breve del propósito del sitio, y si corresponde, de la misión
de la organización que lo presenta. El diseño de la página principal debe corresponderse
con las decisiones de navegación. La calidad de uno es paralela a la calidad del otro, una
buena estructura de navegación necesita un buen punto de acceso que la muestre y oriente

en su recorrido. Así como, una página de acceso solo es buena si representa con justicia la
estructura que se propone anticipar (García de León, 2002).
3.1.3.3 Decisiones de Navegación.
Una mala de navegación puede echar por tierra los esfuerzos de selección de contenidos
estructuración y diseño gráfico. Un sitio Web bien diseñado deber prever las necesidades
de sus usuarios y también velar porque éstos encuentren la información que necesitan con
el mínimo esfuerzo. Los contenidos requieren una forma adecuada tanto de ser
estructurados como de ser recorridos. Si una estructura muy rica, no es fácilmente
abordable está condenada a naufragar. En ese caso es muy posible que los usuarios escojan
sitios de menor calidad pero más accesibles.
Las opciones de navegación deben ser claras, de formato constante (siempre el mismo
icono en el mismo sitio). Poder recorrer el sitio sin perderse mediante la presencia de una
barra de navegación, de un mapa del sitio, un sumario, un buscador interno indica
preocupación por brindar orientación al usuario. Es recomendable que la estructura sea
simple, e indique, en cada paso, los caminos posibles, nada puede quedar escondido o “ser
descubierto” accidentalmente. Por otra parte la necesidad de “scroll” debe ser minimizada,
cuando los documentos lo requieran por su extensión debe permitirse accesos puntuales.
El número de clicks que debe efectuar el usuario para acceder a los contenidos buscados
debe minimizarse. Se debe atender si: el usuario sabe dónde está; puede ir a la página que
lo llevó a la actual; tiene acceso directo a la página principal; puede acceder al resto del
menú; puede acceder al nivel inmediatamente anterior; existe un enlace que lo lleve a lo
alto del documento; le es posible saltar a diferentes apartados dentro de una misma página
y, por supuesto, si sabe qué tiene para recorrer. Estas decisiones serán incorporadas a los
documentos de trabajo (García de León, 2002).
3.1.3.4. Identidad Visual Corporativa.
Todas las páginas de un sitio Web deben mantener una imagen homogénea. Un sitio
Web debe tener una identidad visual que permita identificarlo y asociarlo, no solo a partir
de un logotipo o del uso de determinados colores, es deseable: la utilización de los mismos
iconos, siempre en los mismos lugares. Si los iconos proliferan, si se usan distintos iconos
para acceder a una misma función, o si existe una infinidad de fondos, el usuario no
identifica claramente el sitio como un todo, además no lograra asociar un recurso gráfico
específico de una función determinada. Por otra parte la utilización de elementos gráficos
comunes a todas las páginas, favorece la rapidez de carga de éstas, al aprovechar el caché
que incorporan los navegadores.
Las páginas Web deben considerarse una extensión de la entidad que los crea, un espacio
de representación corporativa (García de León, 2002).

3.1.4 Cuarta etapa: La Promoción.
Se debe tener siempre presente que un sitio Web es un espacio de acción para un
producto, o la extensión de institución, un ámbito a ser cuidado y promocionado como una
herramienta más de mercadeo. La promoción de un sitio Web debe responder a un plan.
Existen muchas formas distintas de efectuar esa tarea, todas pueden coexistir, ninguna debe
ser descartada (García de León, 2002).
Veamos algunas de estas formas:
Registro en buscadores y directorios. Por el solo hecho de existir, su página es

pasible de ser incorporada a estas estructuras. Sin embargo es deseable que el
equipo Web seleccione una lista de buscadores y directorios donde darse de alta.
Este tipo de registro garantiza algunos criterios de tematización así como cierto
rigor en los resúmenes y la categorización. Gran parte del trabajo de promoción se
efectúa en la etapa de construcción cuando se ponen en práctica aquellos criterios de
calidad que optimizan la recuperación, como asignación de meta contenidos, texto
alternativo en las imágenes, “titles” significativos, entre otros más (García de León,
2002).
Incorporar el sitio Web al mensaje corporativo. Es deseable añadir la URL

(Universal Resource Locator). Del sitio, en todos los documentos corporativos:
textos, correos electrónicos, carátulas de informes, ediciones, publicidad en todos
los medios y en la papelería en general.
Esta tarea se inicia con la aplicación de criterios de calidad cuando se crea la URL,
esta debe ser intuitiva, clara y contener el nombre o el acrónimo de la entidad o
producto al que permite acceder, esto facilita la asociación del usuario y refuerza las
posibilidades de localización. Así como enviar reseñas a publicaciones del área
presentando el sitio Web y hacerlo presente en eventos, congresos, ferias,
exposiciones y convenciones.
No debe descuidarse la comunicación informal, el contacto con usuarios calificados,
ni el "boca a boca" (García de León, 2002).
Es importante presentar el sitio en las listas de difusión, el correo electrónico y los

servicios de noticias, así como en páginas que recopilen enlaces a sitios similares.
Intercambiar anuncios gráficos conocidos como “banners”. Es posible

intercambiar “banners” con sitios que se consideren relevantes y prestigiosos.
Aquellos sitios Web que enlazados, se ofrecen generalmente, a poner a modo de
reconocimiento un “banner”.
Es importante no poner “banners” por obligación o reciprocidad, si no hay criterios
de calidad detrás de esa decisión.
El “banner” es parte de la marca, no solo debe usarse responsablemente, si va ser
creado debe ser diseñado responsablemente, tiene que evocar la estética del sitio
Web, ser claro, quedar asociado rápidamente a la identidad visual corporativa, ser

“liviano” y no una imagen pesada que conlleve dificultades de carga (García de

León, 2002).
3.1.5 Quinta etapa: Evaluar.
La evaluación es un factor esencial en la construcción, ejecución y mantenimiento de un

sitio Web. Se trata de una actividad que se efectúa en forma constante, a lo largo de todas
las etapas del proyecto Web. Es deseable que una vez que el sitio Web este en línea la
evaluación continúe en forma sistemática, con el fin de garantizar la su vigencia y calidad
La información obtenida a través de las diferentes formas de evaluación permite:
Confrontar la planificación y concepción con el producto.
Identificar carencias de contenido; diseño y actualización.
Identificar dificultades operativas y de navegación.
Conocer el impacto en los usuarios; así como las páginas más exitosas o menos
visitadas.
Conocer necesidades no contempladas hasta ahora.
Optimizar y establecer nuevos perfiles de usuarios.
Conocer el comportamiento del sitio frente a las herramientas de recuperación de

información.
Existe una evaluación que se efectúa a lo largo de las etapas anteriores, donde el equipo
de trabajo confronta aquello que se propuso crear, que planificó y concibió con el producto
que está en curso. Así, cuando se materializa la construcción del sitio a partir del modelo
concebido, se contemplan la opiniones de la entidad responsable, de los usuarios próximos,
en sus distintos perfiles (si es que se trabaja con perfiles), y la operatividad y visualización
del sitio según los distintos navegadores, o la distintas resoluciones de pantalla (García de
León, 2002).
Apenas creado el sitio Web corresponde un análisis global que atienda a su calidad y
cohesión:
¿Cumple la misión que inicialmente se le asignó?
¿Tiene los contenidos pensados?
¿Han sido estructurados con claridad y calidad?

¿Posee un formato gráfico adecuado?
¿Posee una identidad visual corporativa?
¿Tiene dificultades de operatividad?
¿Sigue las pautas de calidad establecidas?
¿Están funcionando los enlaces internos? ¿Y los externos?
¿Existen carencias o lagunas? ¿Cuáles?
Es en esta instancia donde una grilla creada para el control de las pautas de calidad (check
list) es de gran utilidad.
Una vez en marcha el sitio Web debe ser evaluado también por su impacto:
El servidor de un sitio Web proporciona información de primera mano sobre la

frecuencia de visitas: ¿quién o quiénes lo visitan?; ¿desde dónde?; ¿en qué
horarios?; ¿cuáles son las páginas más visitadas?; ¿cuáles tienen menos visitas?
Esta información suministra gran ayuda para conocer el sitio funcionando y ver sus
éxitos y dificultades (García de León, 2002).
Los correos de los usuarios permiten conocer aciertos, desaciertos y expectativas.

Se puede llegar descubrir que la existencia de un usuario no contemplado que
obligue a reformular el producto (García de León, 2002).
El equipo Web debe buscar su producto en herramientas de recuperación de la

información como buscadores y directorios, el silencio en estas herramientas puede
obedecer a distintas causas vinculadas al diseño, la disposición de los contenidos, la
falta de metadatos o la insuficiente tarea de promoción (García de León, 2002).
En ese ámbito existe un criterio de medición de impacto llamado WIF (Web Impact
Factor), un indicador que nace del cociente entre el número de citas externas que
recibe un sitio Web y el tamaño de sí mismo expresado en su número páginas. El
WIF puede obtenerse a través de buscadores como Google (www.google.com)
De hecho, el WIF nunca sustenta por sí mismo una evaluación de calidad, aparece
como un dato más, es una medida relativa, que tiene que ver con la popularidad
Es posible realizar encuestas a los usuarios, incluso desde el mismo sitio Web en
forma interactiva para conocer en forma sus opiniones, el valor estadístico es
discutible pero pueden proporciona r información útil y de primera mano (García de
León, 2002).

Es deseable crear un plan de evaluaciones periódicas para los distintos aspectos a atender:
actualización de contenidos, chequeo de enlaces, incorporación de documentos, entre otros
mas, se debe designar también los responsables de cada evaluación dentro del equipo. Este
plan de evaluación debe ser también evaluado periódicamente (García de León, 2002).
3.1.6 Sexta etapa: Puesta al día y evolución.
El mantenimiento y la actualización son tan o más importantes que el crecimiento en

términos de número de páginas o enlaces, sobre todo si estas incorporaciones no son
cuidadas. Ningún sitio Web es bueno o confiable solamente por su magnitud. Tan
constante como la evaluación y a consecuencia de ella, se debe crear un plan de
mantenimiento y desarrollo que contemple los resultados de la evaluación y el
cumplimiento de los objetivos del sitio y la entidad que le dio origen.
Debe contemplarse también el perfeccionamiento y la adopción de nuevas formas tanto
técnicas como de contenido, para optimizar las prestaciones brindadas.
Es importante determinar dentro del equipo de trabajo: ¿quién actualiza? ¿qué se actualiza
y cada cuánto tiempo?; ¿qué información se revisa? ¿quién la revisa y cada cuánto
tiempo?; ¿qué información es de actualidad? ¿quién la incorpora y cómo?; ¿dónde se
almacena después? y ¿cómo se la recupera?.
Es deseable que el plan de mantenimiento y desarrollo adquiera forma gráfica. La
actualización y el desarrollo de un sitio Web, es la prueba de su credibilidad más allá del
impulso inicial de su creación y es también la garantía de su vigencia (García de León,
2002).

Capítulo IV. Planificación del diseño web.
4.1 Navegabilidad.
Son muchas las maneras a través de las cuales podemos definir el concepto de
“navegabilidad”. De cara al análisis que ahora estamos realizando, nos referiremos a la
capacidad que tiene el usuario de desplazarse por un sitio web en cuestión. La
navegabilidad se concentra, en primer lugar, en la página de inicio de un sitio web, y debe
guardar una relación estrecha con la satisfacción de necesidades de los diferentes tipos de
usuario que visitan el lugar. Diremos que hay una buena navegabilidad si un tipo de usuario
encuentra en la página de inicio (y también en el resto del sitio web) una buena
accesibilidad de enlaces que le conducen a lo que está buscando. Y diremos que el sitio
web posee una navegabilidad negativa si ocurre lo contrario.
Refiriéndonos al ejemplo que hemos planteado al hablar de un sitio web de una ONG,
diremos que hay una buena navegabilidad si un tipo de usuario –por ejemplo, aquel que
desea hacerse socio mediante una aportación económica fija todos los meses– encuentra de
una manera fácil, accesible, rápida y sencilla todos aquellos enlaces que le conducen a los
contenidos que le son necesarios para satisfacer esa necesidad (Jaime Alonso, 2007).
Puede llevarse a cabo un conjunto de preguntas sobre los enlaces, las cuales nos serán de
utilidad para mejorar la navegabilidad del sitio:
¿Los enlaces son fácilmente reconocibles como tales? ¿Su caracterización

indica su estado (visitados, activos,…).
Los enlaces no sólo deben reconocerse como tales, sin que su caracterización debe
indicar su estado (para orientar al usuario), y ser reconocidos como una unidad
(enlaces que ocupan más de una línea) (Jaime Alonso, 2007).
¿Es predecible la respuesta del sistema antes de hacer clic sobre el

enlace?(Jaime Alonso, 2007)
¿Se ha controlado que no haya enlaces que no llevan a ningún sitio?(Jaime

Alonso, 2007)
Las imágenes enlace, ¿se reconocen como clicables? ¿Incluyen un atributo

‘title’ describiendo la página de destino?
En este sentido, también hay que cuidar que no haya imágenes que parezcan enlaces
y en realidad no lo sean (Jaime Alonso, 2007).
¿Se ha evitado la redundancia de enlaces?

Al analizar un sitio web es prioritario preguntarse si se da una navegabilidad
positiva o negativa. Es preciso justificar la respuesta llevándola al caso concreto de
cada uno de los tipos de usuario. Lograr una navegabilidad óptima es una tarea
complicada, pero cuando se consigue, el sitio alcanza un alto valor añadido (Jaime
Alonso, 2007).

Se han establecido una serie de aspectos relacionados con la navegabilidad, que algunos
evaluadores incluyen en el criterio de funcionalidad.
La planificación de los recursos y estrategias de navegación a la hora de diseñar un sitio
web es fundamental para conseguir un resultado óptimo de localización de la información y
de orientación para el usuario. Por esa razón, se han valorado tres elementos en este
apartado (Pinto et al, 2004):
1. Menú de contenidos siempre visible y en el mismo lugar.
2. La consistencia en la terminología utilizada, que proporciona coherencia y

homogeneidad al sitio web.
3. La presencia de botones de navegación que permitan recorrer el sitio web de manera

lógica (Pinto et al, 2004).
4.2 Usabilidad.
Todos somos conscientes de que la web se está convirtiendo en un elemento clave, tanto
en el desarrollo de las empresas como de las instituciones, ofreciendo información y una
amplia gama de servicios a través de la misma.
A pesar de ello, la web (o Internet) sigue sin ser indispensable para un extensa parte de la
población y conseguir que se conviertan en internautas y/o futuros clientes on-line
dependerá directamente de su facilidad de uso, es decir, de su usabilidad.
Dicha usabilidad aporta el enfoque imprescindible para que las páginas de una empresa o
entidad tengan el suficiente atractivo para que el visitante no sólo se quede y las visite, sino
que regrese en el futuro. Para ello el diseño de las páginas, sus funciones, mensajes y
contenidos deben estar diseñados e implantados para que lo pueda usar cualquier persona
(Lorés et al, 2004).
Los beneficios que la usabilidad puede aportar a la implementación de sitios web deben
mirarse desde varias ópticas distintas:
Desarrollo:
Reducción de los costes de producción, mantenimiento y soporte.

Disminución de los costes de uso.
También produce menores costes de desarrollo al establecerse pautas
generalizadas de diseño, reutilizables en diferentes aplicaciones
departamentales (uso interno) y incremento de ventas (Lorés et al, 2004).
Usuario:
Permiten una mayor productividad y una reducción del esfuerzo.
La confianza que produce la facilidad de uso facilitará su “fidelización” (el
visitante volverá y posiblemente recomendará nuestro sitio a sus conocidos
y amistades).

Si no es usable disminuyen la salud, bienestar y motivación y pueden

incrementar el absentismo (Lorés et al, 2004).
Comercial:
Permite un mejor marketing.
Garantiza aplicaciones más competitivas.
Menor soporte al cliente.
Facilidad en sustituciones y rotación de personal (ventas) (Lorés et al, 2004).
La usabilidad es una característica que mide qué tan intuitiva y fácil de usar es una
página web para el usuario común (Ortega, 2006).
Mide 3 grandes aspectos como se muestra a continuación:
Figura 4.1 Características de la usabilidad. (Ortega, 2006)
4.3. Arquitectura de la información.
La arquitectura de información (AI) se ocupa del diseño estructural de los sistemas de

información, su problema central es la organización, recuperación y presentación de
información mediante el diseño de ambientes intuitivos.
Es comparable a la arquitectura tradicional de los espacios públicos: consiste en la creación
de los planos que usarán los constructores para levantar zonas que serán visitadas
diariamente por cientos de personas. Como en todos los espacios públicos, gran parte de los
visitantes que ingresan a éstos lo hace por primera vez. Esto implica que el aprendizaje de
la navegación en dicho lugar debe ser altamente intuitivo. La mayor diferencia entre la
arquitectura tradicional y la de información es que los espacios digitales son intangibles, el
diseñador debe suplir la falta de referencias concretas para la orientación con claves
visuales en la pantalla (Baeza-Yates et al, 2004).

La definición de la arquitectura de la información más aceptada se divide en tres fases:
1.- El diseño estructural de ambientes de información compartidos.
2.- El arte y la ciencia de organizar y rotular sitios web, intranets, comunidades en línea y
software para soportar la usabilidad y la buscabilidad (la capacidad de poder buscar y
encontrar un sitio).
3.- Una emergente comunidad de práctica enfocada en la aplicación de principios del

diseño y la arquitectura en el paisaje digital.
En esta definición además llama la atención la referencia a “el arte y la ciencia”. Lo que
esta frase quiere decir es que la AI requiere tanto de rigurosidad y precisión como de
creatividad, talento y experiencia. El profesional de la AI debe ser tanto científico como
artesano.
Siguiendo con la definición consensuada por los fundadores de AIfIA, se da especial
importancia a la organización y rotulado de los sistemas. La organización de la información
es materia central de la biblioteconomía. El rotulado consiste en poner un nombre o
etiqueta a cada uno de los elementos de la clasificación, a las categorías. También pasa por
poner títulos a cada página y dar nombre a todos los botones que realizan una acción en el
sistema. Todos ellos deben ser descritos en el lenguaje de los usuarios y conservarán cierta
consistencia, formando parte de un único sistema.
AIfIA incorpora también en el segundo punto el diseño del software a que forma parte de
los sistemas de información, es una definición inclusiva que recoge todas las dimensiones
descritas por Garrett en su modelo “los elementos de la experiencia de usuario”, como se
muestra en la figura 4.2. Es bajo esta noción amplia de AI, que abarca elementos como el
diseño de información y diseño de interacción, que proponemos el presente artículo y su
modelo final (Baeza-Yates et al, 2004).

Figura 4.2 Los elementos de la experiencia de usuario. (Baeza-Yates et al, 2004)
Durante su primera ola de evolución, el desarrollo web tendió a enfocarse en la dimensión

tecnológica de los sistemas, pero actualmente está aumentando el reconocimiento de los
aspectos humanos de los modelos de información como parte fundamental de su éxito.
Muchas compañías que se inician en el desarrollo web tienden a forzar terminología y
organización interna de la empresa en sus sistemas y sitios; es el lenguaje que ellos utilizan
diariamente y les resulta natural para describir sus contenidos y herramientas. Luego
reciben cantidad de llamadas de personas que son incapaces de encontrar información que
efectivamente se encuentra disponible, pero se esconde tras una organización y lenguaje
interno propio. Cuando se organiza y rotula el sitio de acuerdo con la mentalidad y lenguaje
de los usuarios, los resultados mejoran de manera notable: “el secreto de hacer un sitio que
guste a la gente es involucrarlos en el proceso de diseño” (Baeza-Yates et al, 2004).

La arquitectura de la información se divide a su vez en dos grupos que son los siguientes:
1.- Diseño de interacción. Define el comportamiento de los aparatos y herramientas que

usamos diariamente. Todos los dispositivos tecnológicos que nos rodean tienen su propio
diseño de interacción. Podemos verlo fácilmente al comparar aparatos similares de
diferentes fabricantes: equipos de sonido, de vídeo, teléfonos móviles, automóviles, por
mencionar algunos. La forma en la que estos artilugios nos ofrecen acceso a sus diferentes
funciones es siempre producto de las personas que los diseñan.
Cuando ha sido diseñado con sus usuarios en mente, no pensamos en su operación:
simplemente lo utilizamos. Si tenemos problemas para comprender cómo usarlo,
generalmente significa que fue diseñado sin mucho estudio acerca de los usuarios finales y
sus necesidades, de acuerdo con las características de computadores y humanos para el
diseño de la interacción, como se muestra en la siguiente figura (Baeza-Yates et al, 2004).
Figura 4.3 Características de computadores y humanos. (Baeza-Yates et al, 2004)
Para crear interacción con las aplicaciones, y que sean intuitivas, deben ser diseñadas de
acuerdo con las estructuras mentales y lenguaje de los usuarios lo cual se logra a través de
una serie de métodos que incorporan la investigación de usuarios como parte central del
proceso de diseño (Baeza-Yates et al, 2004).
En términos abstractos, el comportamiento percibido por el usuario en la interacción con

el sistema debe resultar cortés y amable. Una funcionalidad bien diseñada pone a trabajar a
la máquina y no a la persona y utiliza lo mejor de ambos mundos para diseñar el punto de
encuentro de manera que el usuario resulte satisfecho con el uso del sistema (Baeza-Yates
et al, 2004).

2.- Diseño de interfaces. Busca organizar cada página o pantalla del sistema de la manera
más clara posible. En esta área la clave es priorizar mediante el contraste. Las restricciones
de tamaño y resolución de pantallas no dejan espacio para la sutileza, todos los elementos
deberán estar ordenados en una clara prioridad visual que facilite su entendimiento (Baeza-
Yates et al, 2004).
Las interfaces de un sitio web normalmente deben reunir elementos comunes a la

estructura del sitio (ej.: sistemas globales de navegación) con componentes particulares de
cada página. Una vez más conocer las necesidades, lenguaje y estructuras mentales de los
usuarios será fundamental para el éxito del diseño logren satisfacer adecuadamente las
necesidades de los usuarios (Baeza-Yates et al, 2004).
“Cuando se organiza y rotula el sitio de acuerdo con la mentalidad y lenguaje de los

usuarios, los resultados mejoran de manera notable” (Baeza-Yates et al, 2004).
Sin embargo esto no siempre es así. En muchas ocasiones, los sitios se convierten en
obstáculos de factor entre el usuario y la fuente de información. Una de las razones por lo
que esto puede ocurrir se debe a que los autores de las páginas las han elaborado sin tener
en consideración los más mínimos principios que garanticen que el documento sea
aprovechado en su plenitud. No los han elaborado considerando su usabilidad (Baeza-Yates
et al, 2004).

Capitulo V. Lenguajes orientados al diseño web.
5.1 ASP (Active Server Pages).
Las páginas ASP, también llamadas páginas activas son páginas que contienen el código
HTML, Script de cliente y un Script que se ejecuta en el servidor, dando como resultado
código HTML.
Especificando que al cargar una página ASP en nuestro navegador, no se carga la página
ASP como tal, sino el resultado de la ejecución de la página ASP o sea la salida de la
página ASP y que se trata de código HTML.
ASP (Active Server Page) es un lenguaje de programación para Web y con la ayuda de
HTML pues se puede crear una página Web.
Hay que destacar que ASP es una tecnología propietaria de Microsoft y que el uso de esta
tecnología implica el uso de los productos de Microsoft (Acosta, 2008).
Figura 5.1 Función de las paginas ASP. (Acosta, 2008)
Ciertamente ASP es una mezcla entre una página HTML y un programa que da como
resultado una página HTML que es enviada al cliente (navegador).
Para que ASP sea una página que hoy en día tenga bastante aceptación en el mundo
cibernauta ha tenido que sufrir diversas transformaciones; desde sus inicios que en un
principio no tenía mucha aceptación hasta hoy en que la mayoría de empresas desea
desarrollar sitios Web (Acosta, 2008).
El ASP ha ido evolucionando, desde sus inicios con CGI que sólo permitía escribir un
programa ejecutable en prácticamente cualquier lenguaje, que era capaz de leer lo que un
cliente enviaba desde un formulario; pasando por el ASP 1, ASP 2, ASP 3 y hasta ASP.
NET en el que se puede modificar (Acosta, 2008).

Las ventajas y desventajas de este lenguaje son las siguientes:
Ventajas:
Se encarga de detectar el tipo de navegador utilizado por el cliente a la hora de

realizar una petición al servidor y en consecuencia, determina la versión HTML que
éste soporta.
Es liviano.
Se puede utilizar en cualquier computadora que esté conectada a la red que tenga
instalado un navegador.
Es muy fácil de programar y tiene muchas utilidades que con una breve línea de
aprendizaje pueden ser modificadas a su gusto.
Tiene la facilidad de conectarse con la base de datos, que hace que sea muy fácil.
Permite a los proveedores de Web ofrecer aplicaciones de negocios interactivos y

no simplemente meros contenidos publicables.
Una de las limitaciones en el desarrollo con ASP es que con el tradicional

utilizamos lenguajes de scripting no tipeados como VSBcrip o JScrip. Podemos
instalar otros motores scripting que impongan verificación de tipos; sin embargo, no
son universalmente conocidos o utilizados como los anteriores (Acosta, 2008).
Desventajas:
Una de las limitaciones en el desarrollo con ASP es que con el tradicional

utilizamos lenguajes de scripting no tipeados como VSBcrip o JScrip. Podemos
instalar otros motores scripting que impongan verificación de tipos; sin embargo, no
son universalmente conocidos o utilizamos como los anteriores.
Tiene que correr en PCs normales que tengan Windows y un servidor Web (Acosta,
2008).
5.2 Perl.
Perl es la alternativa más popular a PHP, seguramente porque es el lenguaje más antiguo
también dentro de las alternativas. En internet nos encontramos numerosos recursos que
utilizan Perl, muchos de las aplicaciones "open source" requieren tener Perl instalado
correctamente. Perl tiene una ventaja y es que es muy flexible, y también tiene una gran
cantidad de módulos ya escritos.
Bien escritos los scripts en Perl se asemejan bastante a PHP. La principal causa de la sucia
apariencia de Perl es por la afición de sus desarrolladores a la escritura en "una línea"
empaquetando numerosas funcionalidades en una sola línea de código (Muñoz, 2007).

¿Por qué deberías aprenderlo?
La potencia de Perl a la hora de procesar grandes cantidades de datos lo hace realmente

popular a la hora de desarrollar aplicaciones del lado del servidor, aprender Perl o Php es
básico a la hora de desarrollar aplicaciones Web (Muñoz, 2007).
5.3 Java Script.

Se trata de un lenguaje de programación del lado del cliente, porque es el navegador el
que soporta la carga de procesamiento. Gracias a su compatibilidad con la mayoría de los
navegadores modernos, es el lenguaje de programación del lado del cliente más utilizado
(Muñoz, 2007).
La programación de Javascript se realiza dentro del propio documento HTML. Esto

quiere decir que en la página se mezclan los dos lenguajes de programación, y para que
estos dos lenguajes se puedan mezclar sin problemas se han de incluir unos delimitadores
que separan las etiquetas HTML de las instrucciones Javascript (Pedregosa, 2005).
La razón de mayor peso es que es utilizado por millones de páginas webs para validar
formularios, crear cookies, detectar navegadores y mejorar el diseño, su fácil aprendizaje lo
hace un lenguaje muy demandado (Muñoz, 2007).
5.4 PHP.
PHP usa una mezcla entre interpretación y compilación para intentar ofrecer a los
programadores la mejor mezcla entre rendimiento y flexibilidad.
PHP compila para tu código una serie de instrucciones (llamadas opcodes) siempre que
estas son accedidas. Estas instrucciones son entonces ejecutadas una por una hasta que el
script termina. Esto es diferente a la manera convencional de compilación de lenguajes
como C++ donde el código es compilado a código ejecutable que es después ejecutado. Php
es recompilado cada vez que se solicita un script. Una ventaja importante de interpretar el
código es que toda la memoria usada por tu código es manejada por PHP, y el lenguaje
automáticamente vacía esta memoria cuando el script finaliza. Esto significa que no
tenemos que preocuparnos de las conexiones a la base de datos, porque PHP lo hará por
nosotros (Muñoz, 2007).
Aunque el lenguaje se puede usar para realizar cualquier tipo de programa, es en la

generación dinámica de páginas web donde ha alcanzado su máxima popularidad. En
concreto, suele incluirse incrustado en páginas HTML (o XHTML), siendo el servidor web
el encargado de ejecutarlo (Palomo et al, 2009).

Algunas de las características de su enorme popularidad son:
Es un lenguaje libre. Puede descargarse de http://www.php.net.
Está disponible para muchos sistemas (GNU/Linux, Windows, UNIX, entre otros).
Tiene una extensa documentación oficial en varios idiomas (disponible libremente

en http://www.php.net).
Existen multitud de extensiones: para conectar con bases de datos, para manejo de
sockets, para generar documentos PDF, para generar dinámicamente páginas en
Flash, entre otros.
Al ejecutarse en el servidor, los programas PHP lo pueden usar todo tipo de

máquinas con todo tipo de sistemas operativos.
En caso de que un cliente falle (por error hardware, virus, entre otros) se puede
seguir usando el sistema desde otro cualquiera que tenga un navegador web con
conexión al servidor (Palomo et al, 2009).
Para incluir código PHP basta con precederlo de la etiqueta <?php, y cerrarlo con ?>. Si
el servidor web está correctamente configurado, detectará código PHP y, en vez de
proporcionarle el contenido de la página directamente al cliente (lo que significaría que
recibiría el código fuente del programa), ejecuta el programa y devuelve su resultado al
navegador (Palomo et al, 2009).
Así pues, el esquema de una petición sería como sigue:
Figura5.2 Petición al servidor de PHP. (Palomo et al, 2009)

Es uno de los lenguajes de programación más populares, la gran fluidez y rapidez de sus
scripts y su prometedor futuro, desarrollar aplicaciones Webs utilizando lenguajes como C
o COBOL son cosas del pasado (Muñoz, 2007).

Capítulo VI. Lenguaje PHP.

6.1. Plataformas para el desarrollo de PHP.
6.1.1. Notepad++.
Notepad++ es un editor gratuito de código fuente, que soporta varios lenguajes de

programación y se ejecuta en MS Windows.
Este proyecto, basado en el componente de edición Scintilla (un poderoso editor), está
escrito en C++ utilizando directamente la API de win32 y STL (lo que asegura una
velocidad mayor de ejecución y un tamaño más reducido del programa final), se distribuye
bajo los términos de la Licencia Pública General de GNU.
Este es un proyecto maduro. Sin embargo, podrá observar que, al tratarse del proyecto de
un solo hombre, aún no carece de errores y sí de algunas características (Belmonte, 2009).
Algunas características de Notepad++ son las siguientes:
Sintaxis coloreada y envoltura de sintaxis (Belmonte, 2009).
WYSIWYG. Se puede imprimir el código fuente (o lo que se quiera) en color

(Belmonte, 2009).
Sintaxis coloreada a elección del usuario. Permite al usuario definir su propio

lenguaje: no sólo las palabras clave para la sintaxis coloreada, sino también las
palabras clave para la envoltura de sintaxis, los comentarios clave y los operadores
como se muestra en la figura 6.1 (Belmonte, 2009).
Autocompletado. Para la mayoría de los lenguajes soportados, el usuario puede

hacer su propia lista de API o descargarlo. Una vez instalado el archivo de API, se
teclea Ctrl+espacio para ejecutar esta acción como se ve en la figura 6.2
(Belmonte, 2009).
Multi-Documento. Se pueden editar varios documentos al mismo tiempo

(Belmonte, 2009).
Multi-Vista. Se puede usar dos vistas al mismo tiempo. Esto significa que puede
visualizar (editar) dos documentos diferentes a la vez como se ve en la figura 6.3.
También se puede visualizar y editar un mismo documento en vistas y posiciones
diferentes. La modificación del documento en una vista quedará reflejada también
en la otra (es decir se modifica el mismo documento a pesar de que en realidad está
viendo una copia (Belmonte, 2009).
Soporte para Buscar/Reemplazar expresiones regulares. Se puede buscar y

reemplazar una cadena usando expresiones regulares (Belmonte, 2009).

Soporte completo para Arrastrar y colocar. Se pueden abrir documentos

arrastrándolo y soltándolo en la aplicación. Además también se puede mover el
documento desde una posición (o vista) a otra arrastrando y soltando (Belmonte,
2009).
Posición dinámica de las vistas. El usuario puede fijar la posición de los

documentos dinámicamente (solamente hay dos opciones: organizar las ventanas en
horizontal o en vertical); como se ve en la figura 6.4 (Belmonte, 2009).
Detección automática del estado del documento. Si se modifica o elimina un

archivo que está actualmente abierto en Notepad++, el programa avisará de tal
situación y preguntará que se desea hacer con el mismo (actualizarlo o eliminarlo)
(Belmonte, 2009).
Herramienta de Zoom. Esta es otra fantástica función del componente Scintilla.

Sólo se tiene que ver la figura 6.5 (Belmonte, 2009).
Funcionamiento bajo entornos multilingües. Puede instalar el programa bajo una

edición de la plataforma Windows en chino, japonés coreano, árabe y hebreo
(Belmonte, 2009).
Puntos de marca. Tan sólo con hacer clic en el margen de marcas (situado justo a
la derecha del margen de número de línea) o pulsar Ctrl+F2 puede establecer o
borrar un punto de marca de libro. Para ir a un punto de marca, pulse F2 (Siguiente
marcador) o Shift+F2 (Anterior marcador). Para borrar todos los marcadores, ir al
menú Buscar->Borrar todos los puntos de marca. Figura 6.6 (Belmonte, 2009).
Resaltado de paréntesis y sangría. Cuando el cursor se encuentre justo al lado de

uno de estos símbolos { } [ ] ( ), dicho carácter (símbolo de apertura) y su opuesto
(símbolo de cierre) serán resaltados, junto con la línea de sangría (si la hubiera) con
el fin de localizar los bloques de código más fácilmente. Figura 6.7 (Belmonte,
2009).
Grabación y reproducción de macros. Se pueden guardar varias macros y editar

sus atajos de teclado (Belmonte, 2009).

Figura 6.1 Sintaxis coloreada a elección del usuario. (Belmonte, 2009)

Figura 6.2 Autocompletado. (Belmonte, 2009)

Figura 6.3 Multi-Vista. (Belmonte, 2009)

Figura 6.4 Posición dinámica de las vistas. (Belmonte, 2009)

Figura 6.5 Herramientas de zoom. (Belmonte, 2009)

Figura 6.6 Puntos de marca. (Belmonte, 2009)

Figura 6.7 Resaltado de paréntesis y sangría. (Belmonte, 2009)

6.1.2 PHP Designer.

PHP Designer es una potente herramienta para aquellos programadores que trabajen con
PHP.
El programa ayuda a hacer más claro el código fuente y a ahorrar tiempo gracias a sus
múltiples herramientas y utilidades específicas para PhP.
PHP Designer incluye las librerías más comunes de PhP así como los scripts y códigos
prediseñados más utilizados. Además permite utilizar la función de autocompletar el código
mientras escribes y coloreará el texto para hacer más clara su lectura.
El programa dispone de un entorno claro y cómodo para el programador. PHP Designer es
totalmente gratuito.
Figura 6.8 Ventana de php Designer.

6.1.3 NetBeans.
¿Qué es NetBeans?
Un IDE multilenguaje completo y modular.

Soporte para Java SE, Java EE, Java ME.
Gran cantidad de módulos de terceros (plugins).
Desarrollo intuitivo drag-and-drop.
Debugger, Profiler, Refactoring, completa código (Cerda, 2009).
Gratis y Open Source.

Open source desde Junio de 2000.
Gran comunidad de usuarios y desarrolladores (Cerda, 2009).
Una plataforma para construir aplicaciones.

Aplicaciones completas para el cliente.
Crea ventanas, menús, barras de herramientas y acciones fácilmente (Cerda, 2009).
Lo que se puede hacer con netbeans es lo siguiente:
Desarrollar aplicaciones:
De escritorio.
Web.
Mobile.
Enterprise.
Con:
Java.
C/C++.
Ruby on Rails.
PHP, Groovy, Python, Javascript.
Entre otras cosas más (Cerda, 2009).
Características de NetBeans:
Mejoras en el editor de código.

Soporte para Ruby, JRuby, Ruby on Rails.
Instalación y actualización más simple.
Diseñador de GUIs fácil de usar.
Profiling integrado.
Características visuales para desarrollo web.
Creador gráfico de juegos para celulares.
Mejoras para SOA y UML.
Soporte para PHP.

Los sistemas operativos con los que funciona son los siguientes: Binarios para
OpenSolaris, Linux, Windows y Mac OS (Cerda, 2009).
Figura 6.9 Ventana de NetBeans. (Cerda, 2009)

6.1.4 PDT- Eclipse.

Es un IDE para PHP, es 100% gratis, la version 2.1 pesa aproximadamente 140 MB,
disponible para las plataformas Windows, Linux, MacOs; tiene las mismas características
que Netbeans y Zend Studio.
Figura 6.10 Ventana de Eclipse.

6.1.5. Zend Studio.

Los expertos en PHP consideran a Zend Studio como el entorno IDE más maduro y con
más características útiles. La última versión ofrece manipulación avanzada de bases de
datos y otras mejoras (Möhrke, 2008).
Características de Zend Studio:
Perfiles.
Analizador de Código.
Soporte para CVS.
Inspectores.
Soporte FTP.
Depuración Remota.
Descripción de funciones en la terminación de código.
Búsqueda de ficheros.
Impresión.
Sangrado de código (Möhrke, 2008).
Figura 6.11 Ventana del Zend Studio. (Möhrke, 2008)

6.2 Introducción al lenguaje PHP.
6.2.1 Sintaxis básica.
PHP es sensible a las mayúsculas.
¿Cómo se incrusta en la página web?
<?PHP ... ?>

recomendado, siempre disponible
<?= expresión ?>
equivale a <? echo expresión ?>
Las instrucciones se separan con un ; como en C. La marca final ?> implica un ;
Comentarios: como en C, /* … */ y //
Para imprimir: echo y print
echo: muestra una o más cadenas.

echo cadena1 [, cadena2…]; // no es una función.
echo “Hola mundo”;

echo “Hola “, “mundo”;
print: muestra una cadena.

print cadena; // no es una función
print “Hola mundo”;

print “Hola “ . “mundo”;
Ejemplo:
<HTML>
<HEAD>
<TITLE>Mi primer programa en PHP</TITLE>
</HEAD>
<BODY>
<?PHP
print (“Hola mundo”);
?>
</BODY>
</HTML> (González, 2007)

Uso de \n para generar código HTML legible.
a) Sin \n
print (“Párrafo 1”);
Código PHP print (“Párrafo 2”);
Código HTML Párrafo 1Párrafo

2
Párrafo 1
Salida Párrafo 2
Uso de \n para generar código HTML legible.
b) Con \n
Código PHP print (“Párrafo 1\n”);

print (“Párrafo 2\n”);
Código HTML Párrafo 1

Párrafo 2
Salida Párrafo 1
Párrafo 2
Inclusión de ficheros externos:

include()
require()
Ambos incluyen y evalúan el fichero especificado.

Diferencia: en caso de error include() produce un warning y require() un error fatal.
Se usará require() si al producirse un error debe interrumpirse la carga de la página
(González, 2007).
Ejemplo:
<HTML>
<HEAD>
<TITLE>Título</TITLE>
<?PHP
// Incluir bibliotecas de funciones
require ("conecta.php");

require ("fecha.php");
require ("cadena.php");
require ("globals.php");
?>
</HEAD>
<BODY>
<?PHP
include ("cabecera.html");
?>
// Código HTML + PHP
...
<?PHP
include ("pie.html");
?>
</BODY>
</HTML>
(González, 2007)
6.2.2 Tipos de datos.
PHP soporta 8 tipos de datos primitivos:
Tipos escalares: boolean, integer, double, string.

Tipos compuestos: array, object.
Tipos especiales: resource, NULL .
El tipo de una variable no se suele especificar. Se decide en tiempo de ejecución en función

del contexto y puede variar (González, 2007).
Funciones de interés:
La función gettype() devuelve el tipo de una variable (González, 2007).
Las funciones is_type comprueban si una variable es de un tipo dado: is_array(),

is_bool(), is_float(), is_integer(), is_null(), is_numeric(), is_object(), is_resource(),
is_scalar(), is_string() (González, 2007).
La función var_dump() muestra el tipo y el valor de una variable. Es especialmente

interesante con los arrays (González, 2007).
Tipo integer (números enteros): 27, -5, 0.

Tipo double (números reales): 1.234, -5.33.
Tipo boolean (lógico): Valores: true, false (insensibles a las mayúsculas). El 0 y la cadena
vacía tienen valor false.

Tipo string: Las cadenas se encierran entre comillas simples o dobles:
‘simples’: admite los caracteres de escape \’ (comilla simple) y \\ (barra). Las

variables NO se expanden.
“dobles”: admite más caracteres de escape, como \n, \r, \t, \\, \$,\”. Los nombres de
variables SÍ se expanden.
Ejemplos:
$a = 9;
print ‘a vale $a\n’; // muestra a vale $a\n
print “a vale $a\n”; // muestra a vale 9 y avanza una línea
print “<IMG SRC=‘logo.gif’>”; // muestra <IMG SRC=‘logo.gif’>
print “<IMG SRC=\”logo.gif\”>”; // muestra <IMG SRC=“logo.gif”>
Acceso a un carácter de la cadena: La forma es $inicial = $nombre{0};
6.2.3 Variables.
Las variables siempre van precedidas de un $

El nombre es sensible a las mayúsculas.
Comienzan por letra o subrayado, seguido de letras, números o subrayado.
Variables predefinidas: $GLOBALS, $_SERVER, $_GET, $_POST,
$_COOKIES, $_FILES, $_ENV, $_REQUEST, $_SESSION
Ámbito: globales al fichero (excepto funciones) o locales a una función.
Ejemplo:
$valor = 5;
print “El valor es: “ . $valor . “\n”;
print “El valor es: $valor\n”; // ojo: comillas dobles
Resultado:
El valor es: 5.
Variables variables.
Se pueden crear nombres de variables dinámicamente.

La variable variable toma su nombre del valor de otra variable previamente
declarada (González, 2007).
Ejemplo:
$a = "hola";
$$a = "mundo";
print "$a $hola\n";
print "$a ${$a}";
Resultado:
hola mundo
hola mundo

Ejemplo de variables variables: página internacionalizada 1 en español:
<?PHP
$mensaje_es="Hola";
$mensaje_en="Hello";
$idioma = "es";
$mensaje = "mensaje_" .
$idioma;
print $$mensaje;
?>
Como se ve en la figura 6.12 es como se vería en la página web en el idioma español:
Figura 6.12 Salida del código “hola” en español. (González, 2007)
Ejemplo de variables variables: página internacionalizada 2 en inglés:
<?PHP
$mensaje_es="Hola";
$mensaje_en="Hello";
$idioma = "en";
$mensaje = "mensaje_" .
$idioma;
print $$mensaje;
?>
Como se ve en la figura 6.13 es como se vería en la página web en el idioma inglés:
Figura 6.13 Salida del código “hola” en inglés. (González, 2007)

6.2.4 Constantes.
Definición de constantes:
define (“CONSTANTE”, “hola”);
print CONSTANTE;
No llevan $ delante.
Sólo se pueden definir constantes de los tipos escalares (boolean, integer, double,
string).
6.2.5 Expresiones y operadores.
Operadores aritméticos:
+, -, *, /, %, ++, --
Operador de asignación:
=
Operadores combinados: .=, +=, y otros más.
$a = 3; $a += 5; a vale 8
$b = “hola ”; $b .= “mundo”; b vale “hola mundo”
Equivale a $b = $b . “mundo”;
Operadores de comparación:
==, !=, <, >, <=, >= y otros.
Operador de control de error: @. Antepuesto a una expresión, evita cualquier mensaje de

error que pueda ser generado por la expresión
Operadores lógicos:
and (&&), or (||), !, xor
and/&& y or/|| tienen diferentes prioridades
Operadores de cadena:
concatenación: . (punto)
asignación con concatenación: .=
Precedencia de operadores (de mayor a menor):
++, --
*, /, %
+,-
<, <=, >, >=
==, !=
&&
||

and
or
6.2.6 Estructuras de control.
Estructuras selectivas:
if-else
switch
Estructuras repetitivas:
while
for
foreach
Estructura selectiva if-else:
if if (condición1)
(condición) sentencia 1
else if (condición2)
sentencia 2
if ...
(condición) else if (condición n)
sentencia n
sentencia 1 else
else sentencia n+1
Mismo comportamiento que en C.

Las sentencias compuestas se encierran entre llaves.
elseif puede ir todo junto.
Ejemplo de estructura selectiva if-else:
<?PHP
if ($sexo == ‘M’)
$saludo = "Bienvenida, ";
else
$saludo = "Bienvenido, ";
$saludo = $saludo . $nombre;
print ($saludo);
?> Figura 6.14 Ejemplo if-else (González, 2007)
Esto se ve en la figura 6.14.

Estructura selectiva switch.
switch (expresión)
{
case valor_1:
sentencia 1
break;
case valor_2:
sentencia 2
break;
…
case valor_n:
sentencia n
break;
default
sentencia n+1
}
Mismo comportamiento que en C, sólo que la expresión del case puede ser integer, float o
string.
Ejemplo de estructura selectiva switch:
switch ($extension)
{
case ("PDF"):
$tipo = "Documento Adobe PDF";
break;
case ("TXT"):
$tipo = "Documento de texto";
break;
case ("HTML"):
case ("HTM"):
$tipo = "Documento HTML";
break;
default:
$tipo = "Archivo " . $extension;
} Figura 6.15 Ventana del ejemplo
switch (González, 2007)
print ($tipo);
El resultado de esto se ve en la figura 6.15.
Estructura repetitiva while:

while (condición)
sentencia

Ejemplo de estructura repetitiva while:
<?PHP
print ("<UL>\n");
$i=1;
while ($i <= 5)
{
print ("<LI>Elemento $i</LI>\n");
$i++;
}
print ("</UL>\n"); Figura 6.16 Ventana de ejemplo de la estructura
while repetitiva (González, 2007)
?>
Estructura repetitiva for:

for (inicialización; condición; incremento)
sentencia
Ejemplo de estructura repetitiva for:
<?PHP
print ("<UL>\n");
for ($i=1; $i<=5; $i++)
print ("<LI>Elemento $i</LI>\n");
print ("</UL>\n");
?>
Figura 6.17 Ventana de ejemplo de la
estructura for repetitiva. (González, 2007)
6.2.7 Funciones.
Ejemplo:
function suma ($x, $y)
{
$s = $x + $y;
return $s;
}
$a=1;
$b=2;
$c=suma ($a, $b);
print $c;
Por defecto los parámetros se pasan por valor.

Paso por referencia:

function incrementa (&$a)
{
$a = $a + 1;
}
$a=1;
incrementa ($a);
print $a; // Muestra un 2
Argumentos por defecto:
function muestranombre ($titulo = "Sr.")

{
print "Estimado $titulo:\n";
}
muestranombre ();
muestranombre ("Prof.");
Salida:
Estimado Sr.:
Estimado Prof.:
Los argumentos con valores por defecto deben ser siempre los últimos:
function muestranombre ($nombre, $titulo= "Sr.")

{
print "Estimado $titulo $nombre:\n";
}
muestranombre (“Fernández”);
muestranombre (“Fernández”, "Prof.");
Salida:
Estimado Sr. Fernández:

Estimado Prof. Fernández:
6.2.8 Tablas.
Sintaxis:
array ([clave =>] valor, ...)
La clave es una cadena o un entero no negativo. El valor puede ser de cualquier tipo válido
en PHP, incluyendo otro array.

Ejemplos:
$color = array (‘rojo’=>101, ‘verde’=>51, ‘azul’=>255);
$medidas = array (10, 25, 15);
Acceso:
$color[‘rojo’] // No olvidar las comillas
$medidas[0]
El primer elemento es el 0.
La estructura de control foreach permite iterar sobre arrays.

Sintaxis:
foreach (expresión_array as $valor)
sentencia
foreach (expresión_array as $clave => $valor)
sentencia
Ejemplos:
foreach ($color as $valor)
print “Valor: $valor \n”;
foreach ($color as $clave => $valor)
print “Clave: $clave; Valor: $valor \n”;
Salida:
Valor: 101
Valor: 51
Valor: 255
Clave: rojo; Valor: 101
Clave: verde; Valor: 51
Clave: azul; Valor: 255
6.2.9 Bibliotecas de funciones.

Existen muchas bibliotecas de funciones en PHP.
Algunos ejemplos:
Funciones de manipulación de cadenas.

Funciones de fecha y hora.
Funciones de arrays.
Funciones de ficheros.
Funciones matemáticas.
Funciones de bases de datos.
Funciones de red.
Algunas bibliotecas requieren la instalación de componentes adicionales.

Todas las funciones de biblioteca están comentadas en la documentación de PHP.
Funciones de manipulación de cadenas.

explode(). Divide una cadena en subcadenas
array explode (string separator, string string [, int limit])
rtrim(), ltrim(), trim(). Eliminan caracteres a la derecha, a la izquierda o por ambos lados
de una cadena.
stringrtrim ( string str [, string charlist])
strstr(). Busca la primera ocurrencia de una subcadena.
strtolower() / strtoupper(). Convierte una cadena a minúscula / mayúscula.
strcmp() / strcasecmp(). Compara dos cadenas con/sin distinción de mayúsculas.
strlen(). Calcula la longitud de una cadena.
Funciones de fecha y hora.

date(). Formatea una fecha según un formato dado.
Ejemplo:
$fecha = date ("j/n/Y H:i");
print ("$fecha");
Resultado:
26/9/2005 17:36
strtotime().Convierte una fecha en un timestamp de UNIX.
Ejemplo:
$fecha = date ("j/n/Y", strtotime(“5 april 2001"));
print ("$fecha");
Resultado:
5/4/2001
Funciones de arrays.
array_count_values(). Calcula la frecuencia de cada uno de los elementos de un array.
array_search(). Busca un elemento en un array.
count(). Cuenta los elementos de un array.
sort(), rsort(). Ordena y reindexa un array (r=decreciente)
ksort(), krsort(). Ordena por claves un array (r=decreciente)

Capítulo VII. Metodología de la investigación.
7.1 Descripción de la forma a investigar.

Para comenzar este proceso de investigación de usara el positivismo, ya que toda la
información que se obtendrá saldrá de fuentes confiables de investigaciones científicas.
Después usare un enfoque deductivo, se empezara a hablar de las páginas web en general
hasta llegar al diseño de la página dinámica. La estrategia de investigación que usare será la
confrontación teórica y empírica, ya que con la información obtenida se tratara de comparar
con la práctica y así ver qué resultados se obtienen. El horizonte de tiempo que usare es el
transversal, por que se dispone solo de seis meses para la realización de la investigación.
Los métodos de recolección de datos que se usaran son las encuestas y algunas otras
fuentes como la observación y la entrevista.

Capítulo VIII. Resultados.
8.1 Tabla comparativa de las distintas plataformas para el desarrollo de PHP.
Programa/Car Idioma en Autocompleta Multidocu Resalt- Fácil Facilidad Manejo Multi- Gratu- Man- Base de To-
acteríst-ica español. do de código. mento. ado de man- de compila- de platafo- ito. ejo de datos tal.
sintaxis. ejo. ción. proye- rma. base integr-
ctos de ada.
grand- datos.
es.
Notepad++
8/11
PHP
Designer 8/11
NetBeans
10/11
PDT-
Eclipse 9/11
Zend
Studio 8/11
Tabla 8.1 Tabla comparativa de los programas.

8.2 Resultados a favor de cada programa.
Programa. Acumulado. Equivalente.
Notepad++ 8/11 72.72%
PHP Designer 8/11 72.72%
NetBeans 10/11 90.90%
PDT-Eclipse 9/11 81.81%
Zend Studio 8/11 72.72%

Tabla 8.2 Resultado de los puntos obtenidos.

Capítulo IX. Conclusiones.
Como se ve, todos los programas que se compararon, en la actualidad son muy eficientes
para el desarrollo de PHP y la mayoría de ellos se pueden ejecutar en cualquier plataforma,
unos programas son más complejos que otros. Pero al aprender a utilizar uno de estos
programas nos ayuda mucho en el desarrollo de contenido dinámico para una página web.
En la tabla donde se hizo la comparación de los programas, el programa que salió más alto
según las características que yo consideré que debe tener el programa es el NetBeans, ya
que nada mas le falta tener una característica que es la de base de datos integrada.
Pero el que yo considero que es el mejor de estos programas es el Zend Studio porque trae
muchas características que facilitan mas el desarrollo de PHP, y el motivo por el cual salió
bajo es que este programa no es multiplataforma y aparte de esto no es gratuito, así que si
se quiere adquirir se tiene que pagar por él y no puedes ejecutarlo en cualquier sistema
operativo.
La conclusión a la que llegue es que si se quiere desarrollar PHP sin ningún costo y con un
buen programa que facilite la programación, yo recomiendo a NetBeans y si se cuenta con
el dinero suficiente para comprar el Zend Studio, lo recomiendo en lugar de NetBeans,
aunque este último también es muy bueno.

Referencias bibliográficas.
Acosta Pintado Eliana. “Lenguaje de programación para Web: ASP”. [En línea].
Universidad católica Santo Toribio de Mogrovejo. Facultad de educación. <http:
//www.scribd.com/doc/2413026/Lenguaje-de-programacion-para-Web-ASP>. [Consulta:
27 noviembre 2009].
Albarellano, Francisco. “Historia de internet. Periodismo Especializado”. [En línea]Año

2006
<http://www.newsmatic.epol.com.ar/index.php?Accion=VerArticulo&NombreSeccion=UN
IDAD%202&aid=12972&pub_id=147> [Consulta: 22 septiembre 2009].
Baeza-Yates, Ricardo. “Excavando la web”. En: El profesional de la información, 2004,

enero-febrero, v. 13, n. 1, pp. 4-10. [En línea].
<http://ignucius.bd.ub.es:8180/dspace/bitstream/123456789/411/1/WEB_MINING.pdf>
[Consulta: 19 octubre 2009].
Baeza-Yates Ricardo, Cuauhtémoc Rivera Loaiza y Javier Velasco Martín. “Arquitectura

de la información y usabilidad en la web”. [En línea]. <
http://www.elprofesionaldelainformacion.com/contenidos/2004/mayo/1.pdf>. [Consulta: 17
noviembre 2009].
Belmonte Maira. “About Notepad++”. [En línea]. < http://notepad-

plus.sourceforge.net/es/site.htm>. [Consulta: 28 noviembre 2009].
Cerda Felipe. “Netbeans 6.5 El único IDE que necesitas.” [En línea]. Sun Campus
Ambassador. <http://www.techbloog.com/talks/netbeans65es_cl.pdf>.
[Consulta: 28 noviembre 2009].
García de León, Alicia. “Etapas en la creación de un sitio web”. En: Biblios, 2002, octubre-
diciembre, v. 14, pp. 18.<http://dialnet.unirioja.es/servlet/articulo?codigo=293019>
[Consulta: 26 octubre 2009].
González Romano José Mariano. “Lenguaje PHP básico”. [En línea].

<http://www.scribd.com/doc/32773/PHP-Basico>. [Consulta: 29 noviembre 2009].
Jaime Alonso. “Comunicar en el Web: Propuesta de Criterios para Analizar Sitios en

Internet” [en línea]. Facultad de Comunicación y Documentación Universidad de Murcia
(España).<teknokultuhttp://teknokultura.rrp.upr.edu/pdf/alonso.pdfra.rrp.upr.edu>
Lorés Jesús, Toni Granollers. “La Ingeniería de la Usabilidad y de la Accesibilidad aplicada

al diseño y desarrollo de sitios web”. [En línea].
Departament Informatica, universitat de Lleida, campus de cappont.
<http://griho2.udl.es/mpiua/TrabajosRelacionados/IngUsabWEB%28JLores_TGranollers%
29.pdfZ>. [Consulta: 16 noviembre 2009].

Möhrke Carsten. “Exploración del Entorno de Desarrollo Zend Studio 4 DESARROLLO

RÁPIDO”. [En línea]. <http://www.linux-magazine.es/issue/10/Zend.pdf>. [Consulta: 29
noviembre 2009].
Muñoz Casanova Diana Cecilia. “Introducción a la teoría de Lenguajes”. [En línea].

Universidad Nacional del Santa. Facultad de ingeniería.
<http://www.scribd.com/doc/4750046/HISTORIA-DE-LOS-LENGUAJES-DE-
PROGRAMACION>. [Consulta: 27 noviembre 2009].
Ortega Elodia. “La usabilidad y el diseño web". [En línea]. Universidad de sonora.
Departamento de psicología y ciencias de la comunicación. < psicom.uson.mx>. [Consulta:
16 noviembre 2009].
Palomo Duarte Manuel, Montero Pérez Ildefonso.” Programación en PHP a través de

ejemplos”. [En línea]. Departamento de Lenguajes y Sistemas Informáticos. Universidad de
Cádiz. Universidad de Sevilla. Departamento de Lenguajes y Sistemas Informáticos.
<http://www.scribd.com/doc/16948557/Programacion-PHP-a-traves-de-ejemplos>.
Pedregosa Pareja Miguel Ángel. Diseño y Programación de Páginas Web, España 2005, pp
385.
Pinto Molina María, José Luis Alonso berrocal, José Antonio Cordón García, Viviana
Fernández Marcial, Carlos García Figuerola, Javier García marco, Carmen Gómez
Camarero, Ángel Francisco Zazo y anne-vinciane Doucet. “Análisis cualitativo de la
visibilidad de la investigación de las universidades españolas a través de sus páginas web”.
[En línea]. Universidad de granada, universidad de salamanca, universidad de san pablo
CEU, universidad de Zaragoza, universidad de Málaga.
<http://redc.revistas.csic.es/index.php/redc/article/view/157/211>
Publicaciones vértice. “Diseño de páginas web 2”. [en línea].

<http://books.google.com.mx/books?id=Oe3ZB03eRngC&printsec=frontcover&client=fire
fox-a#v=onepage&q=&f=false> [Consulta: 7 septiembre 2009].
Publicaciones Vértice. Diseño de páginas web (II). España 2006.

Proyecto Final. Análisis de Aplicaciones para La Creación de Contenido Dinámico Con PHP

Încărcat de

Informații document

Titlu original

Drepturi de autor

Formate disponibile

Partajați acest document

Partajați sau inserați document

Opțiuni de partajare

Vi se pare util acest document?

Este necorespunzător acest conținut?

Drepturi de autor:

Formate disponibile

Proyecto Final. Análisis de Aplicaciones para La Creación de Contenido Dinámico Con PHP

Încărcat de

Drepturi de autor:

Formate disponibile

INSTITUTO TECNOLÓGICO DE DURANGO

Departamento de Sistemas y Computación

Durango, Dgo., Diciembre 2009

Dora Luz González Bañales, Maestra

Salvador Romero Chávez i

Salvador Romero Chávez ii

AGRADECIMIENTOS Y DEDICATORIA ........................................................................................ II

CAPÍTULO I. INTRODUCCIÓN. ..........................................................................................................1

1.1 DEFINICIÓN DEL PROBLEMA. ..........................................................................................................1

1.3 ALCANCES Y LIMITACIONES. ...........................................................................................................2

1.4 PREGUNTA DE INVESTIGACIÓN. ......................................................................................................2

1.5 ORGANIZACIÓN DEL CONTENIDO. ..................................................................................................2

CAPÍTULO II. INTRODUCCIÓN AL DISEÑO WEB. .......................................................................3

2.1 HISTORIA DE LA WORLD WIDE WEB. ...............................................................................................3

2.2 CONCEPTO DE PÁGINA WEB (ESTÁTICAS Y DINÁMICAS). ...............................................................4

CAPÍTULO III. DISEÑO WEB. .............................................................................................................8

3.1 ETAPAS DEL DISEÑO WEB. ...............................................................................................................8

3.1.1 PRIMERA ETAPA: PLANIFICAR. ...................................................................................................8

3.1.1.1 El Equipo. ...........................................................................................................................8

3.1.1.2 Reunir información. ............................................................................................................8

3.1.1.3 Determinar la misión y los objetivos del sitio. .....................................................................9

3.1.1.4 Determinar la/s audiencia/s destinadas y posibles. .............................................................9

3.1.1.5 Establecer un plan de trabajo..............................................................................................9

3.1.2 SEGUNDA ETAPA: CONCEBIR. .....................................................................................................9

Salvador Romero Chávez iii

3.1.2.1 Establecer criterios de calidad............................................................................................10

3.1.2.2 Determinar los contenidos..................................................................................................10

3.1.2.3 Determinar la estructura de los contenidos. ......................................................................11

3.1.2.4 Determinar el formato gráfico. ..........................................................................................11

3.1.2.5 Creación de documentos de trabajo interno. ....................................................................12

3.1.3. TERCERA ETAPA: CONSTRUIR, VISUALIZAR Y TESTEAR. ........................................................13

3.1.3.1. Construyendo y evaluando. .............................................................................................13

3.1.3.2 La página de acceso o principal. ........................................................................................14

3.1.3.3 Decisiones de Navegación. .................................................................................................15

3.1.3.4. Identidad Visual Corporativa. ...........................................................................................15

3.1.4 CUARTA ETAPA: LA PROMOCIÓN. .............................................................................................16

3.1.5 QUINTA ETAPA: EVALUAR..........................................................................................................17

3.1.6 SEXTA ETAPA: PUESTA AL DÍA Y EVOLUCIÓN. ...........................................................................19

CAPÍTULO IV. PLANIFICACIÓN DEL DISEÑO WEB. .................................................................20

4.1 NAVEGABILIDAD. ...........................................................................................................................20

4.2 USABILIDAD. ..................................................................................................................................21

4.3. ARQUITECTURA DE LA INFORMACIÓN. ........................................................................................22

CAPITULO V. LENGUAJES ORIENTADOS AL DISEÑO WEB. ..................................................27

5.1 ASP (ACTIVE SERVER PAGES). .....................................................................................................27

CAPÍTULO VI. LENGUAJE PHP. ......................................................................................................32

6.1. PLATAFORMAS PARA EL DESARROLLO DE PHP. .........................................................................32

6.1.1. NOTEPAD++. ..............................................................................................................................32

6.1.2 PHP DESIGNER. ..........................................................................................................................41

6.1.4 PDT- ECLIPSE. ............................................................................................................................44

6.2 INTRODUCCIÓN AL LENGUAJE PHP. .............................................................................................46

6.2.1 SINTAXIS BÁSICA.........................................................................................................................46

Salvador Romero Chávez iv

6.2.2 TIPOS DE DATOS. .........................................................................................................................48

6.2.3 VARIABLES. .................................................................................................................................49

6.2.4 CONSTANTES. ..............................................................................................................................51

6.2.5 EXPRESIONES Y OPERADORES. ...................................................................................................51

6.2.6 ESTRUCTURAS DE CONTROL.......................................................................................................52

CAPÍTULO VII. METODOLOGÍA DE LA INVESTIGACIÓN. .....................................................58

7.1 DESCRIPCIÓN DE LA FORMA A INVESTIGAR. .................................................................................58

CAPÍTULO VIII. RESULTADOS. .......................................................................................................59

8.2 RESULTADOS A FAVOR DE CADA PROGRAMA. .................................................................................60

CAPÍTULO IX. CONCLUSIONES. .....................................................................................................61

REFERENCIAS BIBLIOGRÁFICAS. .................................................................................................62