ModuloGAW2019 PDF

CARRERA PROFESIONAL
COMPUTACIÓN E INFORMÁTICA
Gestión y Administración Web
Mg. Ing. David Gil Meza

Unidad Didáctica: Gestión y Administración Web 1
INSTITUTO DE EDUCACIÓN SUPERIOR

TECNOLÓGICO PÚBLICO “TRUJILLO”
Dirección
Pasaje Olaya N° 180
Teléfono
044-233351
GESTIÓN Y ADMINISTRACIÓN WEB

Guía de Aprendizaje Copyright © 2019
por David Gil Meza
Todos los derechos reservados.
Elaboración y diseño:
Mg. Ing. David GiL Meza
Trujillo, marzo del 2019
Módulo 3: Gestión de Aplicaciones para Internet y Producción Multimedia

Ing. David Gil
Información Curricular
Unidad Didáctica Gestión y Administración Web

Módulo Técnico Profesional N° 03 Gestión de Aplicaciones para Internet y Producción
Multimedia
Competencia del Módulo Técnico Diseñar, desarrollar, administrar, gestionar e implementar
Profesional productos multimedia y aplicaciones para Internet, teniendo
en cuenta los requerimientos del cliente.
Créditos 4
Semestre Académico V
Turno Diurno/Nocturno
Horas semanales 06
Horas semestrales 108
Capacidad Terminal Planificar, implementar y administrar aplicaciones web
de base de datos, de acuerdo a los requerimientos del
cliente, aplicando conceptos, técnicas y herramientas
especializadas para que la información organizacional
llegue a los usuarios adecuados de forma adecuada y en
el tiempo adecuado.

Ing. David Gil
Introducción
La internet y especialmente uno de sus servicios la
Word Wide Web (WWW) son, posiblemente, los
desarrollos más importantes en la historia de la
computación. Estas tecnologías han llevado a
cientos de millones de personas en el mundo a la era
de la informática; además, se han convertido
actualmente en parte integral de la vida diaria.
En los primeros días de la WWW los “sitios web”
consistían básicamente en un poco más de un
conjunto de archivos de hipertexto enlazados que
presentaban información mediante texto y gráficos
limitados. Además, todos querían tener presencia
en la web produciéndose un desarrollo caótico de la
misma y una proliferación de sitios web
desarrollados por entusiastas y aficionados.
Con el paso de los años y el desarrollo y mejora de
las tecnologías de internet, los sitios web han sufrido
una natural evolución y con ayuda de tecnologías
complementarias nacen las aplicaciones web que
proporcionan capacidad de cálculo y procesamiento
de información.
Si bien es cierto las características de las aplicaciones web difieren a las de las aplicaciones tradicionales,
es necesario que al igual que las aplicaciones tradicionales se dé un enfoque disciplinado que garantice
un desarrollo, implementación y mantenimiento exitoso.
Una vez que una empresa u organización cuenta con su sitio web, es una tarea frecuente la
actualización de la información en el mismo, agregar recursos o ideas para mejorar su funcionamiento,
así como también gestionar el espacio de alojamiento del sitio, cuentas de email, transferencia de
archivos, actualizaciones de seguridad, respaldos, redireccionamiento, entre otras actividades con el
fin de brindar un mejor servicio a sus clientes y usuarios. La tarea conlleva una gran responsabilidad
para quien esté a cargo de la misma, ya sea por la información que se maneja, la interpretación
correcta de lo que necesita el cliente para su implementación técnica y la difusión asociada a los fines
de la organización/empresa/individuo.
Esta experiencia didáctica es eminentemente práctica sin descuidar el necesario soporte teórico que
permita al estudiante planificar, desarrollar, implementar y mantener el sitio web organizacional;
gestionar contenidos, de acuerdo a los requerimientos del cliente, aplicando conceptos, técnicas y
herramientas especializadas para que la información organizacional llegue a los usuarios adecuados
de forma adecuada y en el tiempo adecuado.
En tal sentido, al inicio se sitúa al estudiante en el contexto de las tecnologías web y el desarrollo de
aplicaciones web con PHP y MySQL; luego, elaboran un proyecto de desarrollo web de acuerdo al
proceso de la ingeniería web; a continuación, se entrena al estudiante para el uso adecuado de uno de
los sistemas de gestión de contenidos más utilizados actualmente en el mercado como es WordPress.
Finalmente, se presentan conceptos, técnicas y herramientas para optimizar y posicionar sitios web.

Ing. David Gil
Tabla de contenido
Información Curricular ....................................................................................................... 2
Introducción ....................................................................................................................... 3
Indicador de logro 1 ......................................................................................................... 10
Actividad 1: Formulación y planeación para aplicaciones web .................................. 11

Ingeniería web........................................................................................................................ 11
Atributos de los Sistemas y Aplicaciones basados en Web ........................................................................ 11
Estratos de la ingeniería web .................................................................................................................... 12
El proceso de Ingeniería Web ................................................................................................................... 13
Formulación y Planeación para Ingeniería Web ....................................................................... 14

Formulación de Sistemas Basados en Web ............................................................................................... 14
Planeación de Proyectos de Ingeniería Web ............................................................................................. 15
Actividad 2: Modelado de análisis para aplicaciones web ......................................... 17

Requisitos para el análisis de las aplicaciones web ................................................................... 17
La jerarquía de usuario ............................................................................................................................. 17
Desarrollo de casos de uso ....................................................................................................................... 17
Afinación del modelo de caso de uso ........................................................................................................ 17
El modelo de análisis para aplicaciones web ............................................................................ 17

El modelo de contenido .......................................................................................................... 18
El modelo de interacción......................................................................................................... 18
El modelo funcional ................................................................................................................ 18
El modelo de configuración ..................................................................................................... 18
Análisis relación – navegación ................................................................................................. 18
Actividad 3: Modelado de diseño para aplicaciones web .......................................... 20

Pirámide del diseño IWeb ....................................................................................................... 20
Diseño de la Interfaz de la WebApp......................................................................................... 20
Principios del diseño de la interfaz ........................................................................................................... 21
Directrices del diseño de la interfaz .......................................................................................................... 21
Diseño estético ....................................................................................................................... 22

Diseño de contenido ............................................................................................................... 22
Diseño arquitectónico ............................................................................................................. 22
Diseño de navegación ............................................................................................................. 23
Semántica de navegación ......................................................................................................................... 23
Sintaxis de navegación .............................................................................................................................. 23

Ing. David Gil
Diseño al nivel de componenetes ............................................................................................ 23
Actividad 4: Introducción a las Tecnologías Web ...................................................... 25

Cómo funciona la web ............................................................................................................ 25
Paradigma cliente-servidor ..................................................................................................... 26
Características de las entidades participantes en el diálogo: ..................................................................... 26
Qué son los DNS ..................................................................................................................... 26

Protocolos de internet ............................................................................................................ 27
HTTP (Hypertext Transfer Protocol) .......................................................................................................... 27
Navegadores Web .................................................................................................................. 28

Los motores de renderizado ..................................................................................................................... 28
Servidores web ....................................................................................................................... 28
Actividad 5: Tecnologías front-end y back-end.......................................................... 29

Aplicaciones Web ................................................................................................................... 29
¿Qué es una aplicación web de base de datos? ........................................................................ 29
Tecnologías front-end ............................................................................................................. 30
Desarrollo front-end ................................................................................................................................. 30
Código HTML ............................................................................................................................................ 30
Estructura HTML ....................................................................................................................................... 31
Hojas de estilo en cascada (CSS: Cascading Stylesheets) ........................................................................... 31
El lenguaje JavaScript ............................................................................................................................... 32
Tipos de imagen en la web ....................................................................................................................... 32
Web API ................................................................................................................................................... 33
Fuentes Web ............................................................................................................................................ 33
Tecnologías back-end.............................................................................................................. 34
Código de lado del servidor ...................................................................................................................... 35
Lenguajes de servidor ............................................................................................................................... 35
Trabajando con datos ............................................................................................................................... 36
CMS (Content Management System) ........................................................................................................ 36
Red de entrega de contenidos (CDN Content Delivery Network) .............................................................. 36
Servicios en la nube .................................................................................................................................. 37
Actividad 6: MySQL .................................................................................................. 38

Introducción ........................................................................................................................... 38
Ventajas de MySQL................................................................................................................................... 38
¿Cómo trabaja MySQL? ............................................................................................................................ 39
Comunicación con el servidor MySQL ....................................................................................................... 39
La Comunicación con MySQL ................................................................................................... 39

Construyendo consultas SQL .................................................................................................................... 39
Envió de consultas SQL ............................................................................................................................. 40
Construcción de una Base de Datos ......................................................................................... 40

Ing. David Gil
Creando una nueva base de datos ............................................................................................................ 40

Visualización de las bases de datos ........................................................................................................... 40
Eliminación de una base de datos ............................................................................................................. 40
Agregar tablas a una base de datos .......................................................................................................... 41
Cambiar la estructura de la base de datos ................................................................................................ 41
Manipulando Datos de la Base de Datos ................................................................................................... 41
Controlando el Acceso a los Datos ............................................................................................................ 41
Configuración de cuentas MySQL ............................................................................................................. 42
Copias de respaldo de los Datos ............................................................................................................... 42
Restauración de Datos .............................................................................................................................. 43
Actividad 7: PHP ....................................................................................................... 44

Introducción ........................................................................................................................... 44
Ventajas de PHP ....................................................................................................................................... 44
¿Cómo trabaja PHP? ................................................................................................................................. 45
Adición de una sección PHP a una página HTML....................................................................... 45

Sentencias PHP ....................................................................................................................... 45
Sentencias simples ................................................................................................................................... 46
Variables PHP ......................................................................................................................... 47

Constantes PHP ...................................................................................................................... 47
Trabajar con números ............................................................................................................. 47
Trabajar con cadena de caracteres .......................................................................................... 48
Trabajar con tiempo y fechas .................................................................................................. 48
Comparación de valores.......................................................................................................... 49
Comentarios en PHP ............................................................................................................... 50
Arreglos PHP .......................................................................................................................... 50
Creación de matrices ................................................................................................................................ 50
Sentencias Condicionales ........................................................................................................ 51

Sentencia if ............................................................................................................................................... 51
Sentencias switch ..................................................................................................................................... 51
Sentencias Repetitivas ............................................................................................................ 52

El bucle for ............................................................................................................................................... 52
El bucle while ........................................................................................................................................... 52
El bucle do .. while .................................................................................................................................... 52
Funciones ............................................................................................................................... 53
Actividad 8: PHP y MySQL......................................................................................... 54

Ventajas de la Relación ........................................................................................................... 54
¿Cómo trabajan MySQL y PHP juntos? ..................................................................................... 54
Funciones PHP y MySQL .......................................................................................................... 54
Estableciendo una conexión .................................................................................................... 55

Ing. David Gil
Selección de una base de datos ................................................................................................................ 55

Obteniendo información de una base de datos ........................................................................................ 56
Capturando y usando datos ...................................................................................................................... 56
Colocando información en una base de datos .......................................................................... 56

Preparando los datos ................................................................................................................................ 56
Colocar los datos en variables................................................................................................................... 56
Usar el formato correcto .......................................................................................................................... 56
Limpieza de los datos ............................................................................................................................... 56
Escapar de datos ...................................................................................................................................... 56
Actividad 9: WordPress ............................................................................................ 59

Sistemas de Gestión de Contenidos (Content Management Systems). ...................................... 59
Creación de contenido .............................................................................................................................. 59
Gestión de contenido ............................................................................................................................... 59
Publicación ............................................................................................................................................... 60
Presentación ............................................................................................................................................ 60
Tipos de gestores de contenidos............................................................................................................... 60
Ventajas de un CMS .................................................................................................................................. 61
¿Cómo funciona un CMS? ......................................................................................................................... 61
¿Qué necesito saber antes de utilizar un CMS?......................................................................................... 62
WordPress.............................................................................................................................. 62
Características .......................................................................................................................................... 63
El panel de administración ........................................................................................................................ 63
Administración de entradas ...................................................................................................................... 63
Administración de categorías ................................................................................................................... 64
Administración de etiquetas de entradas ................................................................................................. 64
Administración de contenido multimedia ................................................................................................. 64
Actividad 10: Apariencia........................................................................................... 65

Administración de temas ........................................................................................................ 65
Administración de widgets ...................................................................................................... 65
Administración de menús ....................................................................................................... 65
Actividad 11: Usuarios .............................................................................................. 66

Administración de perfil de usuario ......................................................................................... 66
Administración de usuarios ..................................................................................................... 66
Administración de roles .......................................................................................................... 66
Actividad 12: Páginas ............................................................................................... 67

Diferencia entre entrada y página ........................................................................................... 67
Administración de páginas ...................................................................................................... 67
Administración de comentarios............................................................................................... 68

Ing. David Gil
Actividad 13: Plugins y herramientas ........................................................................ 69

¿Qué son los plugins? ............................................................................................................. 69
Diferencia entre temas (themes) y complementos (plugins) ..................................................... 69
Complementos gratuitos y premium ....................................................................................... 69
Evaluar plugins ....................................................................................................................... 70
Complementos (plugins) populares: ........................................................................................ 70
All One in SEO: .......................................................................................................................................... 70
Akismet: ................................................................................................................................................... 70
Broken Link Checker: ................................................................................................................................ 70
Google Analitycs: ...................................................................................................................................... 71
Share & Follow: ........................................................................................................................................ 71
Contact Form 7: ........................................................................................................................................ 71
Google +1 Button: .................................................................................................................................... 71
WP Touch: ................................................................................................................................................ 71
FeedBurner FeedSmith Extend: ................................................................................................................ 71
Actividad 14: Posicionamiento Web (SEO) ................................................................ 74

¿Qué es el SEO? ...................................................................................................................... 74
Definición de SEMPO (Search Engine Marketing Professional Organization) ............................................. 74
Definición complementaria ...................................................................................................................... 74
Definición amplia e inclusiva..................................................................................................................... 74
Algunas consideraciones........................................................................................................................... 74
Diferencias entre SEO y SEM ................................................................................................... 74

Ventajas de ser visibles en buscadores .................................................................................... 75
¿Cómo funcionan los buscadores?........................................................................................... 75
Los tres pilares del SEO ........................................................................................................... 75
Indexabilidad ............................................................................................................................................ 75
Contenido ................................................................................................................................................. 76
Popularidad. ............................................................................................................................................. 76
Técnicas onsite vs Técnicas offsite ........................................................................................... 76

Técnicas onsite ......................................................................................................................................... 76
Técnicas offsite ......................................................................................................................................... 77
SEO White Hat Vs SEO Black Hat.............................................................................................. 78
Actividad 15: Herramientas SEO ............................................................................... 79

Metodología y proceso del SEO ............................................................................................... 79
FASE I–Descubrimiento del Cliente ........................................................................................................... 79
FASE II–Análisis de Palabras Clave............................................................................................................. 80
FASE III–Optimización de Contenido ......................................................................................................... 81
FASE IV–Popularidad ................................................................................................................................ 82
FASE V–Seguimiento ................................................................................................................................. 83

Ing. David Gil
Recomendaciones de buenas prácticas en SEO ........................................................................ 84
Actividad 16: Google AdWords ................................................................................. 86

Introducción a Google AdWords.............................................................................................. 86
Ventajas de Google AdWords .................................................................................................. 86
• Genera tráfico de forma inmediata .................................................................................................. 86
• AdWords es modulable .................................................................................................................... 86
• Accesible para casi todos los presupuestos ...................................................................................... 87
• AdWords es inbound marketing ....................................................................................................... 87
• ROI fácil de medir ............................................................................................................................. 87
• Permite generar reconocimiento de marca ...................................................................................... 87
• Permite segmentaciones precisas .................................................................................................... 87
• En campañas de búsqueda sabemos exactamente qué busca el usuario .......................................... 87
Tipos de campañas ................................................................................................................. 88

 Campañas de búsqueda ................................................................................................................... 88
 Campañas de display ........................................................................................................................ 88
 Campañas de Shopping .................................................................................................................... 88
 Campañas de vídeo .......................................................................................................................... 88
 Anuncios de video en YouTube ........................................................................................................ 89
 Campañas de aplicación universal .................................................................................................... 89
 Campañas de remarketing ............................................................................................................... 89

Ing. David Gil
Indicador de logro 1
Descripción:
 Elabora proyecto de desarrollo de aplicación web utilizando correctamente conceptos,

técnicas y herramientas de la ingeniería web.

Ing. David Gil
Actividad 1: Formulación y planeación para aplicaciones web

Ingeniería web
La World Wide Web y la Internet que la alimenta son, posiblemente, los desarrollos más importantes
en la historia de la computación. Estas tecnologías nos han llevado a la era de la informática; además
se han convertido en parte integral de la vida diaria en nuestros días.
Si volteamos la mirada hacia el pasado, el crecimiento caótico de la tecnología web tubo su origen en
la creciente necesidad de estar, para bien o para mal, en el ciberespacio; es por ello que los
programadores desarrollan sitios web por doquier sin reparar en la calidad de los mismos. Al inicio,
debido a que los requerimientos de estos sitios eran sencillos los inconvenientes pasaron por
desapercibidos; confome los requerimientos de las aplicaciones web se tornaron más complejos,
quedaron al descubierto las falencias del desarrollo sin ningún criterio técnico.
Para evitar una web enmarañada y lograr mayor éxito en el desarrollo y la aplicación de sistemas
basados en Web complejos y a gran escala, existe una apremiante necesidad de enfoques disciplinados
y nuevos métodos y herramientas con que desarrollar, desplegar y evaluar los sistemas y aplicaciones
basados en Web. Tales enfoques y técnicas deben considerar las características especiales de los
nuevos medios, los ambientes y escenarios operativos, y la multiplicidad de perfiles de usuario que
colocan desafios adicionales al desarrollo de aplicaciones basadas en Web.
La ingeniería web aplica “sólidos principios científicos, de ingeniería y de administración, y enfoques
disciplinados y sistemáticos para el desarrollo, despliegue y mantenimiento exitoso de sistemas y
aplicaciones basadas en web de alta calidad.
Atributos de los Sistemas y Aplicaciones basados en Web

En los primeros días de la World Wide Web los “sitios web” consistían en poco más que un conjunto
de archivos de hipertexto ligados que presentaban información mediante texto y gráficos limitados.
Conforme el tiempo pasó, el HTML aumentó al desarrollar herramientas (por ejemplo, XML, Java) que
permitieron a los ingenieros web ofrecer capacidades de cálculo junto con información. Nacieron los
sistemas y aplicaciones basados en web. En la actualidad, las aplicaciones web han evolucionado en
sofisticadas herramientas de computación que no sólo proporcidonan función por si mismas al usuario
final, sino que también se han integrado con bases de datos corporativas y aplicaciones de negocios.
Las aplicaciones web son diferentes a las muchas otras categorias de software informático; los sistemas
basados en web involucran una mezcla entre publicación impresa y desarrollo de software, entre
marketing e informática, entre comunicaciones internas y relaciones externas, y entre arte y tecnología.
En la mayoría de las aplicaciones web se encuentran los siguientes atributos.
• Intensidad de red. Una aplicación web reside en una red y debe satisfacer las necesidades de una
variada comunidad de clientes. Una aplicación web puede residier en la Internet. Alternativamente,
una aplicación puede colocarse en una Intranet o en una Extranet.
• Concurrencia. Un gran número de usuarios puede tener acceso a la aplicación web al mismo
tiempo. En muchos casos, los patrones de uso entre los usuarios finales variarán enormemente.
• Carga impredecible. El número de usuarios de la aplicación web puede variar en órdenes de
magnitud de día con día.
• Desempeño. Si un usuario de la aplicación web debe esperar demasiado puede decidir irse a
cualquier otra parte.
• Disponibilidad. Aunque la expectativa de una disponibilidad del total es poco razonable, los
usuarios de las aplicaciones web populares con frecuencia demandan acceso bre la base de
“24/7/365”.
• Gobernada por los datos. La función primordial de muchas aplicaciones web es usar hipermedia
para presentar contenido de texto, gráficos, audio y video al usuario final. Además, por lo general,

Ing. David Gil
las aplicaciones web se utilizan para tener acceso a información que existe en bases de datos que
originalmente no eran parte integral de ambiente basado en web (por ejemplo, comercio
electrónico o aplicaciones financieras).
• Sensibilidad al contenido. La calidad y naturaleza estética del contenido sigue siendo un
importante determinante de la calidad de una aplicación web.
• Evolución continúa. A diferencia del software de aplicación convencional, que evoluciona a lo largo
de una serie de planeadas liberaciones espaciadas cronológicamente, las aplicaciones web
evolucionan de manera continua.
• Inmediatez. Aunque la inmediatez es una característica de muchos dominios de aplicación, las
aplicaciones web con frecuencia muestran un tiempo para comercializar que puede ser cuestión
de unos cuantos días o semanas.
• Seguridad. Puesto que las aplicaciones web están disponibles mediante el acceso a la red, es difícil,
si no imposible, limitar la población de usuarios finales que pueden tener acceso a la aplicación.
Con la finalidad de proteger el contenido confidencial y ofrecer modos seguros de transmisión de
datos, se deben implementar fuertes medidas de seguridad a lo largo de la infraestructura que
sustenta una aplicación web y dentro de la aplicación misma.
• Estética. Una parte innegable de la apariencia de una aplicación web es su presentación y la
disposición de sus elementos. Cuando una aplicación se diseña para comercializar o vender
productos o ideas, la estética puede tener tanto que ver con el éxito como el diseño técnico.
Estratos de la ingeniería web

El desarrollo de aplicaciones Web incorpora métodos de proceso especializados, métodos de
ingeniería de software adaptados a características de desarrollo de las aplicaciones Web y un conjunto
de importantes tecnologías que permitan un correcto desarrollo de las mismas. Los procesos, métodos
y tecnologías (herramientas) proporcionan un enfoque en estratos de la IWeb que es conceptualmente
idéntico a los estratos de la ingeniería de software.
Proceso
Los modelos de procesos Web adoptan la filosofía de desarrollo ágil. El desarrollo ágil enfatiza un
enfoque de desarrollo riguroso que incorpora rápidos ciclos de desarrollo.
Dichas actividades de marco de trabajo se deben definir dentro de un proceso que:
Adopte el cambio. Aliente la creatividad y la independencia del equipo de desarrollo y fortalezca la
interacción con el usuario. Construya sistemas que utilicen pequeños equipos de desarrollo. Subraye
el desarrollo evolutivo o incremental mediante el uso de cortos ciclos de desarrollo.
Métodos
Los métodos de la IWeb abarcan un conjunto de labores técnicas que permiten al ingeniero Web
comprender, caracterizar y luego construir una aplicación Web de alta calidad. Los métodos de la IWeb
se puedes categorizar de la siguiente manera:
• Métodos de comunicación: Definen el enfoque con que se facilita la comunicación entre
ingenieros web y los demás participantes de la WebApp.
• Métodos de análisis de requisitos: Proporcionan una base para comprender el contenido que se
entregará una WebApp, la función que proporcionará al usuario final y los modos de interacción
de cada clase de usuario requerirá mientras ocurra la navegación por medio de ls WebApp.
• Métodos de diseño: Abarcan una serie de técnicas de diseño que abordan el contenido, la
aplicación y la arquitectura de información, así como el diseño de interfase y la estructura de
navegación de la WebApp.
• Métodos de prueba: Incorporan revisiones técnicas formales tanto de contenido y el modelo de
diseño como de una amplia variedad de técnicas de pruebas que abordan conflictos al nivel de

Ing. David Gil
componente y arquitectónicos, pruebas de la nevegación, pruebas de usabilidad, seguridad y

configuración.
Herramientas y tecnologías
Las tecnologías abarcan un amplio conjunto de descripción de contenido y lenguaje de modelación por
ejemplo: HTML, VRML, XML, etc. lenguajes de programación por ejemplo java, php, jsp, etc. recursos
de desarrollo basados en componentes por ejemplo corba, com, activeX, .net, etc. navegadores,
herramientas multimedia, herramientas de auditoría de sitio, herramientas de conectividad de base
de datos, herramientas de seguridad, servidores y utilidades de servidor, y herramientas de
administración y análisis de sitio.
El proceso de Ingeniería Web

Los atributos de los sistemas y aplicaciones basados en web tienen una profunda influencia sobre el
proceso de ingeniería web que se elija.
La efectividad de cualquier proceso de ingeniería depende de su adaptabilidad. Esto es, la organización
del equipo de proyecto, los modos de comunicación entre miembros del equipo, las actividades de
ingeniería y las tareas que deben realizarse, la información que se recolecte y cree, y los métodos
empleados para producir un producto de alta calidad deben estar adaptados a la gente que realiza el
trabajo, el plazo y las restricciones del proyecto, y al problema que se quiere resolver. Antes de definir
un marco de trabajo de proceso para Ingeniería Web se debe reconocer que:
1. Las aplicaciones web con frecuencia se entregan de manera incremental. Esto es, las
actividades del marco de trabajo ocurrirán de manera repetida conforme cada incremento se
someta a ingeniería y se entregue.
2. Los cambios ocurrirán frecuentemente. Estos cambios pueden ocurrir como resultado de la
evaluación de un incremento entregado o como consecuencia de cambiar las condiciones de
los negocios.
3. Los plazos son cortos. Esto aminora la creación y revisión de voluminosa documentación de
ingeniería, pero no excluye la simple realidad de que el análisis crítico, el diseño y la prueba
deben registrarse en alguna forma.
A continuación se aborda el marco de trabajo para el proceso de ingeniería web.
o Comunicación con el cliente. Dentro del proceso de ingeniería web la comunicación con el cliente
se caracteriza por medio de dos grandes tareas: el análisis del negocio y la formulación. El análisis
del negocio define el contexto empresarial-organizativo para la aplicación web. Además, se
identifican los participantes, se predicen los potenciales cambios en el ambiente o los requisitos
del negocio, y se define la integración entre la aplicación web y otras aplicaciones de negocios,
bases de datos y funciones. La formulación es una actividad de recopilación de requisitos que
involucra a todos los participantes. El intento es describir el problema que la aplicación web habrá
de resolver (junto con los requisitos básicos para la aplicación web) con el aprovechamiento de la
mejor información disponible. Además, se intenta identificar áreas de incertidumbre y dónde
ocurrirán cambios potenciales.
o Planeación. Se crea el plan de proyecto para el incremento de la aplicación web. El plan consiste
de una definición de tareas y un calendario de plazos respecto al periodo (usualmente medido en
semanas) proyectado para el desarrollo del incremento de la aplicación web.
o Modelado. Las labores convencionales de análisis y diseño de ingeniería del software se adaptan
al desarrollo de la aplicación web, se mezclan y luego se funden en la actividad de modelado de la
ingeniería web. El intento es desarrollar análisis “rápidos” y modelos de diseño que definan
requisitos y al mismo tiempo representen una aplicación web que los satisfará.
o Construcción. Las herramientas y la tecnología de la ingeniería web se aplican para construir la
aplicación web que se ha modelado. Una vez que se construye el incremento de aplicación web,
se dirige una serie de pruebas rápidas para asegurar que se descubran los errores en el diseño (es

Ing. David Gil
decir: contenido, arquitectura, interface, navegación). Pruebas adicionales abordan otras

características de la aplicación web.
o Despliegue. La aplicación web se configura para su ambiente operativo, se entrega a los usuarios
finales y luego comienza un periodo de evaluación. La retroalimentación acerca de la evaluación
se presenta al equipo de ingeniería web y el incremento se modifica conforme se requiera.
Formulación y Planeación para Ingeniería Web

Comenzar siempre es difícil. Por una parte, existe una tendencia a diferir, a esperar hasta que toda t
este cruzada y toda i tenga punto antes de que comience el trabajo. Por otra parte, hay un deseo de
saltar ya, de comenzar a construir incluso antes de que en realidad se conozca que se necesita hacer.
Ambos enfoques son inapropiados y por ello las dos primeras actividades del marco de trabajo de la
ingeniería web destacan la formulación y la planeación. La formulación valora la necesidad subyacente
de la aplicación web, las características y funciones globales que desean los usuarios y el ámbito del
esfuerzo de desarrollo. La planeación aborda los elementos que deben definirse para establecer un
flujo de trabajo y programa, y a rastrear el trabajo conforme avanza el proyecto.
Formulación de Sistemas Basados en Web

La formulación se sistemas y aplicaciones basados en web representa una secuencia de acciones de
ingeniería web que comienza con la identificación de las necesidades del negocio, se mueve hacia una
descripción de los objetivos de la aplicación web, define grandes características y funciones y realiza
la recopilación de requisitos que conducen al desarrollo de un modelo de análisis. La formulación
permite que los clientes y el equipo de desarrollo establezcan un conjunto común de metas y objetivos
para la construcción de la aplicación web. También identifica el ámbito del esfuerzo de desarrollo y
proporciona un medio para determinar un resultado exitoso. El análisis –una actividad técnica que es
una continuación de la formulación- identifica los requisitos funcionales, de comportamiento y de
datos para la aplicación web.
Preguntas de formulación
Se sugiere un conjunto de preguntas que deben formularse y responderse al comienzo de la etapa de
formulación:
• ¿Cuál es la principal motivación (necesidad del negocio) para la aplicación web?
• ¿Cuáles son los objetivos que debe satisfacer la aplicación web?
• ¿Quién usará la aplicación web?
Recopilación de requisitos para aplicaciones web

Los objetivos globales de la recopilación de requisitos para aplicaciones web son:
 Identificar requisitos de contenido.
 Identificar requisitos funcionales.
 Definir escenarios de interacción para diferentes clases de usuarios.
Los siguientes pasos de la recopilación de requisitos se dirigen para lograr estos objetivos:
1. Pedir a los clientes que definan las categorías de usuario y describan cada categoría.
2. Comunicarse con los clientes para definir los requisitos básicos de la aplicación web.
3. Analizar la información recopilada y utilizar la información para realizar un seguimiento con
los clientes.
4. Definir casos de uso que describan escenarios de interacción para cada clase de usuario.

Ing. David Gil
Planeación de Proyectos de Ingeniería Web

Dada la inmediatez de las aplicaciones web es razonable preguntar: ¿en realidad se necesita gastar
tiempo y esfuerzo en la planeación y administración de una aplicación web? Dado que la gestión del
proyecto se indica para los proyectos tradicionales, parecería razonable argumentar que también
estaría indicada para los grandes proyectos electrónicos. Los pequeños proyectos electrónicos tienen
características especiales que los diferencian de los proyectos tradicionales. Sin embargo, incluso en
el caso de los pequeños proyectos electrónicos, la planeación se debe realizar, se deben considerar los
riesgos, se debe establecer un programa y se deben definir controles de modo que eviten la confusión,
la frustración y el fracaso.
El Equipo de Ingeniería Web

Un equipo de ingeniería web exitoso mezcla una amplia variedad de talentos que deben trabajar como
equipo en un ambiente de proyecto con alta presión. Los plazos son cortos, los cambios son
inexorables y la tecnología continúa cambiando. La creación de un equipo que se consolide no es un
asunto sencillo.
Los siguientes papeles se deben distribuir entre los miembros del equipo de ingeniería web.
 Desarrolladores/proveedores de contenido. Dado que el contenidos controla inherentemente las
aplicaciones web, una función del equipo se debe enfocar en la generación o recopilación del
contenido.
 Editores de web. El variado contenido que generan los respectivos desarrolladores/proveedores
se debe organizar para incluirlo en la aplicación web. Además, alguien debe actuar como conexión
entre el equipo técnico que diseña la aplicación web y los desarrolladores/proveedores de
contenido sin conocimientos técnicos. Este papel lo satisface el editor web, quien debe entender
tanto el contenido como la tecnología de la aplicación web.
 Ingeniero web. El ingeniero web se involucra en un amplio rango de actividades durante el
desarrollo de una aplicación web, que incluyen la obtención de requisitos, el modelado de análisis,
el diseño arquitectónico, de navegación y de interfase, la implementación de la aplicación y de las
pruebas. También debe tener una sólida comprensión de las tecnologías de componentes, de las
arquitecturas cliente/servidor, de HTML/XML y de tecnologías de bases de datos, y un
conocimiento práctico de los conceptos multimedia, de las plataformas hardware/software, de la
seguridad de redes y de cuestiones de apoyo a sitios web.
 Expertos en dominios empresariales. Un experto en dominio empresarial debe ser capaz de
responder todas las preguntas relacionadas con metas, objetivos y requisitos empresariales
relacionados con la aplicación web.
 Especialistas de soporte. Este papel se asigna a la persona(s) que es (son) responsable(s) del apoyo
continuo a la aplicación. Puesto que las aplicaciones web evolucionan continuamente, el
especialista de soporte es responsable de las correcciones, adaptaciones y mejoras al sitio, que
incluyen actualizaciones de contenido, implementación de nuevos procedimientos y formas, y
cambios al patrón de navegación.
 Administrador. Usualmente llamado “web master”, esta personas tiene la responsabilidad de la
operación diaria de la aplicación web, lo que incluye: desarrollo e implementación de políticas para
la operación de la aplicación, establecimientos de procedimientos de soporte y retroalimentación,
implementación de seguridad y derechos de acceso, medición y análisis de tráfico del sitio web,
coordinación de los procedimientos de control de cambios y coordinación con el especialista de
soporte. El administrador también puede estar involucrado en las actividades técnicas que realizan
los ingenieros web y los especialistas de soporte.
Planeación de aplicaciones web: subcontratación

Un porcentaje sustancial de las aplicaciones web se subcontrata con proveedores que (supuestamente)
se especializan en el desarrollo de sistemas y aplicaciones basados en web. En tales casos, un negocio
(el cliente) pide un precio fijo para desarrollar la aplicación web de uno o más proveedores, evalúa los
precios competitivos y luego elige un proveedor para efectuar el trabajo.

Ing. David Gil
Planeación de aplicaciones web: ingeniería web en casa

Conforme las aplicaciones web se vuelven más extensas y estratégicas para los negocios, muchas
compañías han optado por controlar el desarrollo en casa. No sorprende que la ingeniería web en casa
se gestione de manera un poco diferente a un esfuerzo de subcontratación.
Los pasos siguientes se recomiendan para proyectos de ingeniería web pequeños y de tamaño
moderado:
 Entender el ámbito, las dimensiones de cambio y las restricciones del proyecto.
 Definir una estrategia de proyecto incremental.
 Realizar análisis de riesgo.
 Desarrollar una estimación rápida.
 Elegir un conjunto de tareas (descripción del proceso).
 Establecer un programa.
 Definir mecanismos de rastreo del proyecto.
 Establecer un enfoque de gestión del cambio.
• Pressman, R. (2005). Ingeniería del Software – Un enfoque práctico (6 ed.). México, D.F.,
México: McGraw-Hill.

Ing. David Gil
Actividad 2: Modelado de análisis para aplicaciones web

A simple vista, existe una aparente contradicción cuando se
considera el modelado de análisis dentro del contexto de la
ingeniería web. Ya se ha mencionado que las WebApps tienen
características como la inmediates y una volatilidad contraria al
modelado detallado, ya sea en la etapa del análisis o en la del
diseño. Y si se realiza algún tipo de modelado, la filosofía ágil
sugiere que el modelo del análisis se minimice en favor del
modelado de diseño limitados.
Requisitos para el análisis de las aplicaciones web
El análisis de requisitos para las aplicaciones web abarca tres grandes tareas: formulación, recopilación
de requisitos y modelado de análisis. Durante la formulación se identifican la motivación (metas) y los
objetivos básicos para la aplicación web, y también se definen las categorias de usuarios. Cuando
comienza la recopilación de requisitos se intensifica la comunicación entre el equipo de ingeniería web
y los accionistas (por ejemplo: clientes, usuarios finales). Los requisitos de contenido y funcionales se
enlistan y se desarrollan los escenarios de interacción (casos de uso) escritos desde el punto de vista
del usuario final. La intención es establecer una comprensión básica de por qué se construirá la
WebApp, quién la usará y que problema resolverá a sus usuarios.
La jerarquía de usuario
Las categorías de usuarios finales que interactuarán con la WebApp se identifican como parte de las
tareas de formulación y de recopilación de requisitos. En la mayoría de los casos, las categorias de
usuario son relativamente limitadas y no necesitan una representación UML. Las categorias de usuario
(actores) indican la funcionalidad que ofrecerá la WebApp; además, señalan la necesidad de que se
desarrollen casos de uso para cada usuario final anotado en la jerarquía.
Desarrollo de casos de uso

Los casos de uso se desarrollan para cada categoria de usuario descrita en la jerarquía de usuario. En
el contexto de la ingeniería web, el caso de uso en si mismo es relativamente informal: un párrafo
narrativo que describe una interacción específica entre un usuario y la WebApp.
Afinación del modelo de caso de uso

A la par que se crean los diagramas de caso de uso para cada categoría de usuario, se desarrolla una
vista superior de los requisitos de la WebApp observables de manera externa. Los casos de uso se
organizan en paquetes funcionales y cada paquete se valora para garantizar que es:
• Comprensible: todos los clientes entienden el propósito del paquete.
• Cohesivo: el paquete aborda funciones relacionadas cercanamente una con otra.
• Libremente acoplados: las funciones o clases dentro del paquete colaboran una con otra, pero
la colaboración exterior del paquete se mantiene en un mínimo.
• Jerarquicamente superficial: las jerarquías funcionales profundas son difíciles de navegar y
entender para los usuarios; en consecuencia, el número de niveles dentro de una jerarquía de
casos de uso debe reducirse siempre que sea posible.
El modelo de análisis para aplicaciones web

El modelado de análisis para una WebApp se basa en la información que contienen los casos de uso
desarrollados para la aplicación. Las descripciones de los casos de uso se analizan gramaticamente
para identificar potenciales clases de análisis y las operaciones y atributos asociados con cada clase.
Se identifica el contenido que presentará la WebApp y se extraen las funciones que se desarrollarán a
partir de las descripciones de caso de uso. Finalmente, los requisitos específicos de la implentación se

Ing. David Gil
deben desarrollar de modo que el ambiente y la infraestructura que apoyan la WebApp pueden
construirse.
El modelo de contenido
El modelo de contenido contiene elementos estructurales que proporcionan una importante visión de
los requisitos de contenido para una WebApp. Dichos elementos estructurales incluyen objetos de
contenido (por ejemplo: texto, imágenes, gráficos, fotos, video, audio) que se presentan como parte
de la WebApp. Además, el modelo de contenido incluye todas las clases de análisis: entidades visibles
para el usuario que se crean o manipulan conforme éste interactua con la WebApp. Una clase de
análisis incluye atributos que la describen, operaciones que afectan el comportamiento requerido de
la clase y colaboraciones que permiten la comunicación de la clase con otras clases.
Al igual que otros elementos del modelo de análisis, el modelo de contenido se deriva a partir de un
examen cuidadoso de los casos de uso desarrollados para la WebApp. Los casos de uso se analizan
gramaticalmente para extraer objetos de contenido y clases de análisis.
El modelo de interacción
Describe como interactúa el usuario con la WebApp. Este modelo de interacción lo componen cuatro
elementos:
1) Casos de uso
2) Diagramas de secuencia
3) Diagramas de estado
4) Prototipo de interfaz de usuario
El modelo funcional
El modelo funcional aborda dos elementos de procesamiento de la WebApp y cada uno representa un
grado diferente de la abstracción de procedimientos:
1) Funcionalidad observable respecto al usuario y que entrega al usuario final la WebApp.
2) Las operaciones dentro de las clases de análisis que implementan comportamientos asociados
con la clase.
El modelo de configuración
Las WebApps se deben diseñar e implementar de forma que se acomoden a una diversidad de
ambientes, tanto del lado del servidor como de lado del cliente. La WebApp puede residir en un
servidor que proporcione acceso via internet, una Intranet o una Extranet. Se deben especificar el
hardware del servidor y el ambiente del sistema operativo. Además, se deben considerar aspectos de
interoperabilidad en el lado del servidor. Si la WebApp debe tener acceso a una gran base de datos o
interoperar con las aplicaciones corporativas existentes en el lado del servidor, se deben especificar
las interfaces apropiadas, los protocolos de comunicación y la información complementaria necesaria.
Análisis relación – navegación

El análisis relación-navegación (ARN) proporciona una serie de pasos de análisis que permiten
identificar relaciones entre los elementos descubiertos como parte de la creación del modelo de
análisis. El enfoque ARN se organiza en cinco pasos:
1) Análisis de los participantes: identifica las diversas categorias de usuario y establece una
apropiada jerarquía de participantes.
2) Análisis de elementos: identifica los objetos de contenido y los elementos funcionales de
interés para los usuarios finales.
3) Análisis de relaciones: describe las relaciones entre los elementos WebApp.

Ing. David Gil
4) Análisis de navegación: examina cómo los usuarios pueden acceder a elementos individuales
o grupos de elementos.
5) Análisis de evaluación: considera temas pragmáticos (por ejemplo: costo/beneficio) asociados
con la implementación de las relaciones definidas con anterioridad.
• Conallen, J. (2000). Building Web Applications with UML. Addison – Wesley.

• McGraw-Hill Education, https://www.mheducation.com/highered/home-guest.html

Ing. David Gil
Actividad 3: Modelado de diseño para aplicaciones web

Cuando se aplica el diseño dentro del contexto de la ingeniería
web, se deben considerar cuestiones tanto genéricas como
específicas. Desde un punto de vista genérico, el diseño resulta
en un modelo que guía la construcción de la WebApp. El
modelo de diseño, sin importar su forma, debe contener
suficiente información para reflejar cómo habrán de traducirse
los requisitos de los participantes (definidos en un modelo de
análisis) en contenido y código ejecutable. Pero el diseño
también debe ser específico. Debe abordar atributos clave de
una WebApp en una forma que permita al ingeniero web construir y ponerla a prueba de manera
efectiva.
Pirámide del diseño IWeb
El diseño conduce a un modelo que contiene la mezcla adecuada de estética, contenido y tecnología.
La mezcla variará dependiendo de la naturaleza de la WebApp, y, como consecuencia, las actividades
de diseño también variarán.
Diseño de
la interfaz
Diseño
estético
Diseño de
contenido
Diseño de navegación
Diseño arquitectónico
Diseño de componentes
Diseño de la Interfaz de la WebApp

Toda interfaz del usuario debe presentar las siguientes características: fácil de aprender, fácil de
navegar, intuitiva, consistente, eficiente, libre de errores y funcional. Debe ofrecer al usuario final una
experiencia satisfactoria y gratificante. Los conceptos, principios y métodos de diseño de la interfaz
brindan al ingeniero web las herramientas requeridas para lograr esta lista de atributos.

Ing. David Gil
Principios del diseño de la interfaz

 Anticipación: una WebApp se debe diseñar de modo que anticipe el siguiente movimiento del
usuario.
 Comunicación: la interfaz debe comunicar el estado de cualquier actividad que haya iniciado
el usuario.
 Consistencia: el uso de los controles de navegación, menús, iconos y estética deben ser
consistentes a través de toda la WebApp.
 Autonomía controlada: la interfaz debe facilitarle al usuario el movimiento a través de toda la
WebApp, pero lo debe hacer en una forma que refuerce las convenciones de navegación
establecidas para la aplicación.
 Eficiencia: el diseño de la WebApp y su interfaz deben optimizar la eficiencia laboral del
usuario, no la eficiencia del ingeniero web que la diseña y la contruye o el ambiente cliente-
servidor que la ejecuta.
 Flexibilidad: la interfaz debe ser lo suficientemente flexible como para permitir que algunos
usuarios realicen tareas directamente y otros exploren la WebApp en una forma un tanto
aleatoria.
 Enfoque: la interfaz de la WebApp (y el contenido que presenta) debe enfocarse en las tareas
importantes para el usuario.
 Ley del Fitt: “El tiempo para adquierir un objetivo es una función de la distancia a la que se
halla y de su tamaño”.
 Objetos de interfaz humana: se ha desarrollado una gran librería de objetos de interfaz
humana reutilizables para WebApps.
 Reducción de latencia: más que obligar al usuario a esperar el fin de alguna operación interna,
la WebApp debe usar la multitarea en una forma que permita al usuario proceder con el
trabajo como si la operación hubiese sido completada.
 Facilidad de aprendizaje: la interfaz de una WebApp se debe diseñar para minimizar el tiempo
de aprendizaje y, una vez aprendido, reducir el reaprendizaje requerido cuando se vuelva a
visitar la WebApp.
 Metaforas: una interfaz que utilice una metafora de interacción es más fácil de aprender y de
usar, en tanto la metáfora sea apropiada para la aplicación y el usuario.
 Mantener la integridad del producto de trabajo: un producto de trabajo debe guardarse de
manera automática de modo que no se perderá si ocurriese un error.
 Legibilidad: toda la información presentada a través de la interfaz debe ser legible para
jovenes y viejos.
 Estado de rastro: cuando sea adecuado, el estado de la interacción del usuario debe rastrearse
y alamacenarse de modo que un usuario pueda salir y regresar más tarde al lugar de donde
salió.
 Navegación visible: una interfaz de WebApp bien diseñada proporciona “la ilusión de que los
usuarios están en el mismo lugar y que se les lleva el trabajo hata sus lugares”
Directrices del diseño de la interfaz

• La rapidez de lectura en un monitor de computadora es aproximadamente 25 por ciento más
lenta respecto de la lectura de impresos. En consecuencia no fuerce al usuario a leer
voluminosas cantidades de texto, en particular cuando se explica la operación de la WebApp
o se ofrece ayuda en la navegación.

Ing. David Gil
• Evite los signos de “en construcción”; crean expectativas y provocan un vinculo innecesario
que es seguro para la decepción.
• Los usuarios prefieren no desplazarse. La información importante debe estar dentro de las
dimensiones de una ventana típica de navegador.
• Los menús de navegación y los encabezados deben estar diseñados de manera consistente y
deben estar disponibles en todas las páginas que estén disponibles para el usuario. El diseño
no debe descansar en las funciones del navegador para asistir en la navegación.
• La estética nunca debe sustituir la funcionalidad.
• Las opciones de navegación deben ser obvias, incluso para el usuario casual.
Diseño estético
El diseño estético es un esfuerso artístico que complementa los aspectos técnicos de la ingeniería Web.
Sin él, una aplicación web puede ser funcional, pero sin atractivo. Con él, una WebApp lleva a sus
usuarios a un mundo que los incluye en un ámbito tanto emocional como intelectual.
El diseño estético considera cada aspecto de la presentación y percepción de una WeppApp. El proceso
de diseño estético comienza con la plantilla y procede hacia la consideración de esquemas de color
globales, tipos de fuentes, tamaños y estilos, el uso de medios audiovisuales complementarios y todos
los demás elementos estéticos de una aplicación.
Diseño de contenido
El diseño del contenido se enfoca en dos asuntos de diseño diferentes, cada uno lo abordan individuos
con distintos conjuntos de habilidades. El diseño del contenido desarrolla una representación de
diseño para los objetos de contenido y representa los mecanismos que se requieren para que
establezcan sus relaciones no con otros. Esta actividad de diseño lo dirigen los ingenieros web.
Además, el diseño de contenido se ocupa de la representación de la información dentro de un objeto
de contenido específico: actividad de diseño que dirigen los publicistas, los diseñadores estéticos y
otros que generan el contenido de una WebApp.
Una vez modelados todos los objetos de contenido, la información que cada objeto entregará debe
crearse y luego formaterase para satisfacer mejor las necesadades del cliente. La creación del
contenido es el trabajo de los especialistas que diseñan el objeto de contenido al proporcionar un
esbozo de la información qe se entregará y una indicación de los tipos de objetos de contenido
genéricos mediante los cuales se entregará la información. También se puede aplicar el diseño estético
para representar la apariencia y percepción adecuados para el contenido.
Diseño arquitectónico
El diseño arquitectónico está enlazado con las metas establecidas para la WebApp, el contenido que
se presentará, los usuarios que la visitarán y la filosofía de navegación que se establezca. El diseñador
arquitectónico debe identificar la arquitectura de contenido y la arquitectura de la WebApp. La
arquitectura de contenido se centra en la forma en la que los objetos de contenido se estructuran
para su representación y navegación. La arquitectura de WebApp aborda la forma en la que la
aplicación se estructura para gestionar la interacción del usuario, manejar las tareas de procesamiento
internas, efectuar la navegación y presentar el contenido.
En la mayoría de los casos, el diseño arquitectónico se dirige en paralelo con el diseño de la interfaz,
el estético y el de contenido. Puesto que la arquitectura WebApp puede tener una fuerte influencia
sobre la navegación, las decisiones tomadas durante esta actividad de diseño influirán en el trabajo
dirigido durante el diseño de navegación.

Ing. David Gil
Diseño de navegación
una vez establecida la arquitectrura de WebApp y la identificación de los componenetes, el diseñador
debe definir las rutas de navegación que habiliten para los usaurios el acceso al contenido y las
funciones de la WebApp. Para lograr esto el diseñador debe identificar la semántica de navegación
para diferentes usuarios del sitio y definir la mecánica (sintaxis) que logra la navegación.
Semántica de navegación
Conforme cada usuario interactúa con la WebApp, encuentra una serie de unidades semánticas de
navegación (USN), “un conjunto de estructuras de información y navegación relacionadas que
colaboran en el cumplimiento de un subconjunto de requisitos de usuario relacionados”.
La estructura de una USN está compuesta de un conjunto de subestructura de navegación que se
llaman formas de navegación (FdN). Una FdN representa la mejor forma o ruta de navegación para los
usuarios con ciertos perfiles para lograr su meta o submeta deseada.
Sintaxis de navegación
Conforme el diseño se lleva a cabo se define la mecánica de navegación. Algunas opciones son:
• Vínculo de navegación individual.
• Barra de navegación horizontal
• Columna de navegación vertical
• Pestañas
• Mapas de sitio
Diseño al nivel de componenetes

El diseño de componentes desarrolla la lógica de procesamiento detallado que se requiere para
implementar componentes funcionales.
Las modernas aplicaciones web entregan funciones de procesamiento cada vez más elaboradas que
realizan procesamiento localizado para generar capacidad de contenido y navegación en forma
dinámica; ofrecen capacidades de computación o procesamiento de datos que son adecuadas para el
dominio de negocios de la WebApp; proporcionan acceso sofisticaddos a bases de datos, establecen
interfases de datos con sistemas corporativos externos. Para lograr estas (y muchas otras) capacidades,
el ingeniero web debe diseñar y construir componentes de programa que sean idénticos en forma a
los componenetes de software para el software convencional.
• Conallen, J. (2000). Building Web Applications with UML. Addison – Wesley.

• McGraw-Hill Education, https://www.mheducation.com/highered/home-guest.html

Ing. David Gil
Descripción:
 Crea aplicaciones web básicas aplicando correctamente los fundamentos de las tecnologías
web.

Ing. David Gil
Actividad 4: Introducción a las Tecnologías Web

Cómo funciona la web
De la mano con la gran proliferación del uso de ordenadores en la actualidad, en los últimos años
hemos sido testigos del nacimiento y crecimiento explosivo de uno de las tecnologías que puede ser
considerada como la más importante dentro del campo de la computación; se trata de Internet y
específicamente uno de sus servicios que es el más ampliamente difundido y vistoso la World Wide
Web (WWW). Esta tecnología surgió como un proyecto gubernamental de los Estados Unidos para
interconectar centros de investigación e instalaciones militares, posteriormente se masificó su uso y
hoy por hoy es impensable un mundo sin Internet. Internet ha cambiado nuestros hábitos y nuestra
forma de pensar. Han surgido nuevas disciplinas como: eBusiness, eGovernment, eComerse, etc. e
infinidad de nuevos términos: chatear, en línea, no disponible, etc. La forma de comunicarnos ha
sufrido un cambio drástico debido a Internet. Los negocios, estudios, salud en fin cada campo del
quehacer humano tiene cabida en la Internet. Usted puede comprar y vender sin salir de casa y en
contados segundos, puede pagar las cuentas, realizar operaciones bancarias, recibir capacitación sin
siquiera moverse y en la comodidad de su hogar
Es así que el desarrollo de sitios Web ha proliferado por doquier y esta tendencia va en aumento. Todos
quieren estar en el ciber espacio desde las grandes compañías pasando por las medianas y pequeñas
hasta el usuario común que tiene su página personal en algún lugar de la Internet y se ha asegurado
un lugar en este mundo digital.
Internet es una red mundial de ordenadores conectados entre sí mediante cables telefónicos, satélites
y otros medios. Para simplificar diremos que todos los ordenadores involucrados en internet se pueden
dividir en dos categorías: servidores y clientes.
Los servidores son donde se encuentra la mayoría de la información disponible en internet. Se trata de
ordenadores especializados que almacenan la información, la comparte con otros servidores y la pone
a disposición del público en general.
Los clientes son cualquier ordenador estándar que a través de un programa navegador (Google
Chrome, Internet Explorer o Mozilla Firefox, etc.) la gente usa para acceder a la World Wide Web.
Cuando un ordenador se conecta a internet, conecta con un tipo especial de servidor proporcionado y
operado por un proveedor de servicios de Internet (ISP por sus siglas en inglés). El trabajo de este “ISP
Server” es establecer un enlace entre el navegador cliente y el resto de Internet. Un único servidor ISP
se encarga de las conexiones a Internet de muchos clientes individuales.
Los servidores ISP reciben peticiones de los clientes para acceder a páginas Web, consultar el correo
electrónico, etc. A fin de atender a los clientes con las páginas y archivos que piden, servidores ISP
deben conectarse a otros servidores de Internet, los servidores host.
Los servidores host son donde los sitios web “viven”. Cada sitio web en el mundo se encuentra en un
servidor host en alguna parte. El trabajo del servidor host es almacenar la información y ponerla a
disposición de otros servidores.
Para ver una página web desde el navegado cliente, la siguiente secuencia ocurre:
1. Escribes una URL en la Barra de direcciones, buscas algo en Google o haces clic en un hipervínculo.
2. Se establece una conexión entre el browser y el servidor para satisfacer el requerimiento.
3. Tu navegador envía una petición al servidor ISP pidiendo la página.
4. Tu servidor ISP mira en una enorme base de datos de direcciones de Internet y encuentra el
servidor host exacto donde se encuentra el sitio web en cuestión, entonces envía ese servidor
anfitrión una solicitud de la página.
5. El servidor host envía la página solicitada a tu servidor ISP.
6. El ISP envía la página al navegador y la visualizas en pantalla.
7. Se cierra la conexión establecida en el punto 2.

Ing. David Gil
Paradigma cliente-servidor
Lo podemos definir como un patrón arquitectónico para el desarrollo de sistemas distribuidos. Este
tipo de arquitectura distribuye una aplicación entre dos o más componentes especializados cuya
ejecución se distribuye entre uno o más equipos.
Define dos tipos de entidades diferenciadas (asimétricas) que se responsabilizan de acciones
diferentes: clientes y servidores con roles distintos.
Un modelo de interacción que se basa en el concepto de servicio implementado sobre un diálogo:
“petición-respuesta”.
Cliente (parte activa):
 Demanda servicios a los servidores.
 Se asume que cada petición deberá obtener
respuesta.
 Diseñado para soportar la interacción con el
usuario final.
Servidor (parte pasiva)
 Espera las peticiones de los clientes.
 Procesa esas peticiones y envía una respuesta.
 Diseño orientado a maximizar la eficiencia.
Esta arquitectura también permite la posibilidad de aplicar el patrón cliente-servidor en múltiples
niveles de abstracción dentro de un mismo sistema distribuido (arquitecturas multinivel [n-tier ])
Características de las entidades participantes en el diálogo:
Características de los clientes

• Componente del sistema que interactúa con el usuario.
• No comparte sus recursos con otros clientes (en general).
• No suelen tener restricciones especiales respecto a rendimiento, fiabilidad y escalabilidad.
• No suele requerir equipos de altas prestaciones.
• Un fallo en un cliente no afecta al resto del sistema.
• Debe dar soporte a restricciones relativas a ergonomÍa (facilidad de uso) y seguridad (evitar
comprometer los demás componentes).
Características de los servidores:

 Componente del sistema que presta servicios a los clientes.
 Gestiona y comparte sus recursos con los clientes a los que sirve.
 Suele tener restricciones especiales respecto a rendimiento, fiabilidad, escalabilidad y seguridad.
 Capacidad suficiente para atender múltiples clientes.
 Fallos en el servidor son críticos e invalidan el sistema.
 El número de clientes (peticiones) puede ser muy variable y aumentar si así se requiere.
 Evitar comprometer la seguridad de los recursos o datos gestionados y de los clientes.
Muchos servicios de Internet dan soporte a aplicaciones cliente-servidor. Estos servicios se conocen
por el protocolo que implementa la aplicación. Conocidos servicios de Internet son HTTP, FTP, DNS,
finger, gopher y otros.
Qué son los DNS
El sistema de nombres de dominio (Domain Name System) es un sistema de nomenclatura jerárquico
descentralizado para dispositivos conectados a redes IP como Internet o una red privada. Este sistema
asocia información variada con nombre de dominio asignado a cada uno de los participantes. Su
función más importante es "traducir" nombres inteligibles para las personas en identificadores

Ing. David Gil
binarios asociados con los equipos conectados a la red, esto con el propósito de poder localizar y
direccionar estos equipos mundialmente.
El servidor DNS utiliza una base de datos distribuida y jerárquica que almacena información asociada
a nombres de dominio en redes como Internet. Aunque como base de datos el DNS es capaz de asociar
diferentes tipos de información a cada nombre, los usos más comunes son la asignación de nombres
de dominio a direcciones IP y la localización de los servidores de correo electrónico de cada dominio.
Protocolos de internet
La familia de protocolos de Internet es un conjunto de protocolos de red en los que se basa Internet y
que permiten la transmisión de datos entre computadoras.
En ocasiones se le denomina conjunto de protocolos TCP/IP, en referencia a los dos protocolos más
importantes que la componen, que fueron de los primeros en definirse, y que son los dos más
utilizados de la familia:
TCP: protocolo de control de transmisión.
IP: protocolo de Internet.
Existen tantos protocolos en este conjunto que llegan a ser más de cien diferentes, entre ellos se
encuentran:
ARP: protocolo de resolución de direcciones, para encontrar la dirección física (MAC) correspondiente
a una determinada IP.
FTP: protocolo de transferencia de archivos, popular en la transferencia de archivos.
HTTP: protocolo de transferencia de hipertexto, que es popular porque se utiliza para acceder a las
páginas web.
POP: protocolo de oficina de correo, para correo electrónico.
SMTP: protocolo para transferencia simple de correo, para el correo electrónico.
Telnet (Telecommunication Network): para acceder a equipos remotos.
HTTP (Hypertext Transfer Protocol)

Protocolo que controla la transferencia de datos en la World Wide Web WWW, proporciona un
vehículo de entrega para las imágenes, gráficos, vídeo, hipertexto u otros datos en la Web.
Mientras se recorre la Web, el explorador intercambia mensajes con los servidores Web gracias al
HTTP. Cada vez que hace un clic en un hipervínculo o pasa de un recurso a otro, el explorador utiliza
HTTP para acceder al recurso seleccionado.
HTTP es un protocolo sin estado, en otras palabras, el explorador y el servidor deben crear y después
cortar una conexión de red por cada operación HTTP, a este conjunto de peticiones y respuestas se
denomina transacción.
Mediante HTTP los clientes y los servidores determinan de forma dinámica el formato de los
documentos, lo que permiten que utilicen formato de datos no estándar para el intercambio de datos.
Si el receptor no tiene un modo de ver o acceder a los datos, puede descargar un programa
complemento que le permita recibir el contenido. Las cabeceras de HTTP pueden contener
información acerca de los objetos que transmite la aplicación a través de la Web. Con la información
de las cabeceras, las aplicaciones Cliente-Servidor negocian formatos que pueden utilizar para
transferir los objetos. Si no reconocen la información de la cabecera, la ignoran. Por tanto, puede
probar nuevos protocolos en la Web sin comprometer la integridad del HTTP. Además, el protocolo
está basado en texto por lo cual es legible y no necesita decodificación.

Ing. David Gil
Navegadores Web
Un navegador web (también llamado browser) es una
aplicación que se instala en la computadora del cliente y
que, mediante una conexión a Internet, permite acceder a
todos los sitios de la red mundial y así visualizar páginas de
hipertexto estáticas y dinámicas.
Existen navegadores para diferentes dispositivos y
plataformas. Cada uno con sus propias características, todos
tienen la misma finalidad: ofrecerle al navegante una
representación lo más fiel posible del recurso al que está accediendo, que, por lo general, será un sitio
o una aplicación web. Existen diferentes navegadores, dentro de los principales podemos mencionar:
Internet Explorer, Firefox, Chrome, Apple Safari y Opera.
Los motores de renderizado

Son el verdadero corazón del navegador. De ellos depende la representación final de los elementos de
una página web, y, en ellos, también recae la palabra compatibilidad.
Es un componente interno del navegador que tiene la capacidad de tomar el contenido HTML y CSS y
representarlo en el dispositivo de salida (por lo general, la pantalla)
Servidores web
Un servidor web o servidor HTTP es un programa informático que procesa
una aplicación del lado del servidor realizando conexiones bidireccionales
y/o unidireccionales y síncronas o asíncronas con el cliente generando o
cediendo una respuesta en cualquier lenguaje o Aplicación del lado del
cliente. El código recibido por el cliente suele ser compilado y ejecutado
por un navegador web. Para la transmisión de todos estos datos suele
utilizarse algún protocolo. Generalmente se utiliza el protocolo HTTP para
estas comunicaciones, perteneciente a la capa de aplicación del modelo
OSI. El término también se emplea para referirse al ordenador que ejecuta
el programa. Se pueden utilizar varias tecnologías en el servidor para
aumentar su potencia más allá de su capacidad de entregar páginas HTML;
éstas incluyen scripts CGI, seguridad SSL y páginas activas del servidor
(ASP).

Ing. David Gil
Actividad 5: Tecnologías front-end y back-end

Aplicaciones Web
En ingeniería de software una aplicación web es aquella
que los usuarios usan accediendo a un servidor web a
través de Internet o de una intranet. Las aplicaciones
web son populares debido a la practicidad del navegador
web como cliente ligero. La habilidad para actualizar y
mantener aplicaciones web sin distribuir e instalar
software en miles de potenciales clientes es otra razón
de su popularidad. Aplicaciones como los webmail, wikis,
weblogs, MMORPGs, tiendas en línea son ejemplos bien
conocidos de aplicaciones web.
Una aplicación Web consta de una o más páginas
conectadas entre sí. Un buen punto de partida sería decir
que una página Web es un archivo de texto que contiene
lenguaje de marcas de hipertexto (HTML), etiquetas de formato y vínculos a archivos gráficos y a otras
páginas Web.
El archivo de texto se almacena en un servidor de Web al que pueden acceder otras computadoras
conectadas ese servidor, vía Internet o una LAN. Al archivo se puede acceder utilizando exploradores
Web que no hacen otra cosa que efectuar una transferencia de archivos e interpretación de las
etiquetas y vínculos HTML, y muestran el resultado en el monitor.
¿Qué es una aplicación web de base de datos?

Una aplicación es un programa o un conjunto de programas diseñados para su uso por un usuario final
(por ejemplo, clientes, proveedores, etc.). Si el usuario final interactúa con la aplicación a través de un
navegador Web, la aplicación basada en web o aplicación web. Si la aplicación Web requiere el
almacenamiento a largo plazo de la información utilizando una base de datos, es una aplicación Web
de base de datos.
Una aplicación Web de base de datos está diseñada para ayudar al usuario realizar una tarea. Puede
ser una sencilla aplicación que muestra información en una ventana del navegador (por ejemplo, las
oportunidades actuales de empleo cuando el usuario selecciona un anuncio de trabajo) o un programa
complicado con funcionalidades extendidas (por ejemplo, la aplicación bookordering en Amazon.com
o en la aplicación de licitación en eBay).
Una aplicación Web de base de datos consta de sólo dos piezas:
• Base de datos: La base de datos es la memoria a largo plazo de
su aplicación de base de datos Web. La aplicación no puede
cumplir su propósito sin la base de datos. Sin embargo, la base
de datos por sí sola no es suficiente.
• Aplicación: La aplicación es el programa o grupo de programas
que realizan las tareas. Los programas creados muestran lo que
el usuario ve en la ventana del navegador, ellos aseguran que la
aplicación interactúe mediante la aceptación y procesamiento de
la información que el usuario escribe en la ventana del
navegador, ellos almacenan y recuperan la información en la
base de datos.

Ing. David Gil
Tecnologías front-end
Son todas aquellas tecnologías que corren del lado del cliente, es decir, todas aquellas tecnologías que
corren del lado del navegador web, generalizándose más que nada en tres lenguajes, HyperText
Markup Language (HTML) que estructura los contenidos de las páginas web, hojas de estilo en cascada
(CSS) para describir el aspecto y el formato de la página web más algo de código ejecutable realizado
en lenguaje de script del navegador (JavaScript), la persona encargada del front-end, se dedica solo a
estas tres tecnologías, aunque esto no significa que no sepa cómo trabaja el back-end, ya que es
necesario para que pueda consumir datos y pueda estructurar correctamente un maquetado en HTML
y CSS para su mejor comodidad y la comodidad del back-end a la hora de colocarlo sobre un servidor.
Desarrollo front-end
El desarrollo front-end es el que se encarga de la parte visible con la que interactúa el usuario, es decir
el desarrollo front-end desarrolla las interfaces de la aplicación web; es el responsable de mostrar los
contenidos, de controlar la interacción del usuario y de las peticiones al servidor. Los contenidos deben
ser presentados estéticamente a los usuarios, las interfaces que se construyen deben ser fáciles de
usar para ello los desarrolladores front-end deben utilizar adecuadamente las tecnologías front-end y
además conocer otras tecnologías relacionadas a fin de lograr interfaces agradables visualmente, pero
a su vez que permitan la interacción exitosa del usuario con la aplicación web.
Código HTML
HTML, sigla en inglés de HyperText Markup Language (lenguaje de marcas de hipertexto), hace
referencia al lenguaje de marcado para la elaboración de páginas web. Es un estándar que sirve de
referencia del software que conecta con la elaboración de páginas web en sus diferentes versiones,
define una estructura básica y un código (denominado código HTML) para la definición de contenido
de una página web, como texto, imágenes, videos, juegos, entre otros. Es un estándar a cargo del
World Wide Web Consortium (W3C) o Consorcio WWW, organización dedicada a la estandarización
de casi todas las tecnologías ligadas a la web, sobre todo en lo referente a su escritura e interpretación.
Se considera el lenguaje web más importante siendo su invención crucial en la aparición, desarrollo y
expansión de la World Wide Web (WWW). Es el estándar que se ha impuesto en la visualización de
páginas web y es el que todos los navegadores actuales han adoptado.
El lenguaje HTML basa su filosofía de desarrollo en la diferenciación. Para añadir un elemento externo
a la página (imagen, vídeo, script, entre otros.), este no se incrusta directamente en el código de la
página, sino que se hace una referencia a la ubicación de dicho elemento mediante texto. De este
modo, la página web contiene solamente texto mientras que recae en el navegador web (interpretador
del código) la tarea de unir todos los elementos y visualizar la página final. Al ser un estándar, HTML
busca ser un lenguaje que permita que cualquier página web escrita en una determinada versión,
pueda ser interpretada de la misma forma (estándar) por cualquier navegador web actualizado.
Sin embargo, a lo largo de sus diferentes versiones, se han incorporado y suprimido diversas
características, con el fin de hacerlo más eficiente y facilitar el desarrollo de páginas web compatibles
con distintos navegadores y plataformas (PC de escritorio, portátiles, teléfonos inteligentes, tabletas,
vipers etc.) No obstante, para interpretar correctamente una nueva versión de HTML, los
desarrolladores de navegadores web deben incorporar estos cambios y el usuario debe ser capaz de
usar la nueva versión del navegador con los cambios incorporados. Normalmente los cambios son
aplicados mediante parches de actualización automática (Firefox, Chrome) u ofreciendo una nueva
versión del navegador con todos los cambios incorporados, en un sitio web de descarga oficial (Internet
Explorer). Por lo que un navegador desactualizado no será capaz de interpretar correctamente una
página web escrita en una versión de HTML superior a la que pueda interpretar, lo que obliga muchas
veces a los desarrolladores a aplicar técnicas y cambios que permitan corregir problemas de
visualización e incluso de interpretación de código HTML. Así mismo, las páginas escritas en una
versión anterior de HTML deberían ser actualizadas o reescritas, lo que no siempre se cumple. Es por
ello que ciertos navegadores todavía mantienen la capacidad de interpretar páginas web de versiones

Ing. David Gil
HTML anteriores. Por estas razones, todavía existen diferencias entre distintos navegadores y
versiones al interpretar una misma página web.
Estructura HTML
<html>
<head>
Información técnica para el navegador
</head>
<body>
Contenido que se mostrará en la página
</body>
</html>
Hojas de estilo en cascada (CSS: Cascading Stylesheets)

CSS es un lenguaje de hojas de estilos creado para controlar el aspecto o presentación de los
documentos electrónicos definidos con HTML y XHTML. CSS es la mejor forma de separar los
contenidos y su presentación y es imprescindible para crear páginas web complejas.

Ing. David Gil
El lenguaje JavaScript
JavaScript es un lenguaje de programación interpretado, dialecto del estándar ECMAScript. Se define
como orientado a objetos, basado en prototipos, imperativo, débilmente tipado y dinámico.
Se utiliza principalmente en su forma del lado del cliente (client-side), implementado como parte de
un navegador web permitiendo mejoras en la interfaz de usuario y páginas web dinámicas, aunque
existe una forma de JavaScript del lado del servidor (Server-side JavaScript o SSJS). Su uso en
aplicaciones externas a la web, por ejemplo, en documentos PDF, aplicaciones de escritorio
(mayoritariamente widgets) es también significativo.
JavaScript fue desarrollado originalmente por Brendan Eich de Netscape en 1995 con el nombre de
Mocha, el cual fue renombrado posteriormente a LiveScript, para finalmente quedar como JavaScript.
Desde entonces JavaScript se ha convertido en uno de los lenguajes de programación más populares
en internet. Al principio, sin embargo, muchos desarrolladores renegaban del lenguaje porque el
público al que va dirigido lo formaban publicadores de artículos y demás aficionados, entre otras
razones. La llegada de Ajax devolvió JavaScript a la fama y atrajo la atención de muchos otros
programadores. Como resultado de esto hubo una proliferación de un conjunto de frameworks y
librerías de ámbito general, mejorando las prácticas de programación con JavaScript, y aumentado el
uso de JavaScript fuera de los navegadores web, como se ha visto con la proliferación de entornos
JavaScript del lado del servidor. En enero de 2009, el proyecto CommonJS fue inaugurado con el
objetivo de especificar una librería para uso de tareas comunes principalmente para el desarrollo fuera
del navegador web.
En junio de 2015 se cerró y publicó el estándar ECMAScript 62021 con un soporte irregular entre
navegadores y que dota a JavaScript de características avanzadas que se echaban de menos y que son
de uso habitual en otros lenguajes como, por ejemplo, módulos para organización del código,
verdaderas clases para programación orientada a objetos, expresiones de flecha, iteradores,
generadores o promesas para programación asíncrona.
La versión 7 de ECMAScript se conoce como ECMAScript 2016, y es la última versión disponible,
publicada en junio de 2016. Se trata de la primera versión para la que se usa un nuevo procedimiento
de publicación anual y un proceso de desarrollo abierto.
Tipos de imagen en la web

Uno de las principales decisiones a la hora de incluir gráficos en tu web será elegir el formato correcto
para cada tipo de imagen de manera que logres una correcta relación entre la calidad visual de la
misma y su peso en Kb.
 JPG
JPEG (Joint Photographic Experts Group) es un algoritmo diseñado para comprimir imágenes con
24 bits de profundidad o en escala de grises. Normalmente se le llama JPG debido a la extensión
que tiene en sistemas operativos que sólo aceptan tres letras de extensión.
JPEG (JPG) es un algoritmo de compresión con pérdida. Esto significa que al utilizar la imagen tras
la compresión no obtenemos exactamente la misma imagen que teníamos antes de la compresión.
Una de las características que hacen muy flexible el JPEG (JPG) es el poder ajustar el grado de
compresión. Si especificamos una compresión muy alta se perderá una cantidad significativa de
calidad, pero obtendremos ficheros extremadamente pequeños. Con una cantidad de compresión
baja obtenemos una calidad muy parecida a la del original, y un fichero pequeño.
 GIF
El formato GIF (Graphic Interchange Format) es un formato de archivos gráficos de mapa de bits
(una trama) desarrollado por Compuserve. Existen dos versiones de este formato de archivos: GIF
87a y GIF 89a, desarrolladas en 1987 y 1989 respectivamente.
GIF 87a soporta la compresión LZW, el entrelazado (posibilidad de una visualización progresiva),
una paleta de 256 colores y la posibilidad de crear imágenes animadas (GIF animados)

Ing. David Gil
almacenando varias imágenes en un mismo archivo. GIF 89a añade la posibilidad de definir un
color transparente en la paleta y precisar el tiempo de las animaciones.
 PNG
El formato PNG (Portable Network Graphics) es un formato de archivos de gráficos de mapa de
bits (una trama). Fue desarrollado en 1995 como una alternativa gratuita al formato GIF, cuyos
derechos pertenecen a Unisys (propietario del algoritmo de compresión LZW) y a quien los editores
de software deben pagar regalías por usar este formato.
 SVG
SVG (Scalable Vector Graphics) es abierto y está basado en los gráficos XML, un formato que se
está incorporando a los estándares Web. Muchos buscadores ya soportan SVG en cierto grado.
Puede ser utilizado tanto para imágenes como para animaciones. Dado que SVG es un formato de
gráficos vectorizados, las imágenes puedes ser redimensionadas y transformadas sin sufrir
pérdidas de calidad ni deformaciones.
Web API
La interfaz de programación de aplicaciones (API: Application Programming Interface), es un conjunto
de subrutinas, funciones y procedimientos (o métodos, en la programación orientada a objetos) que
ofrece cierta biblioteca para ser utilizado por otro software como una capa de abstracción.
Una API es una “llave de acceso” a funciones que nos permiten hacer uso de un servicio web provisto
por un tercero, dentro de una aplicación web propia, de manera segura.
Fuentes Web
Se refiere al tipo de letra usada en la World Wide Web. Cuando fue creado HTML, tanto la fuente
tipográfica como el estilo venían determinados exclusivamente por las preferencias del navegador web
utilizado. No existió ningún mecanismo para el control del tipo de letra en las páginas web hasta que
en 1995 Netscape introdujo la etiqueta <font></font>, la cual fue estandarizada en HTML 2. No
obstante, la fuente especificada por esta etiqueta tenía que estar instalada en el ordenador del usuario
o tener una fuente de reserva como la predeterminada para la web; Sans-serif o un tipo de letra
monoespaciado. La primera especificación de hojas de estilo en cascada (CSS en sus siglas en inglés)
fue publicada en 1996 y proporcionaba las mismas prestaciones.
En 1998 fue publicado el estándar de CSS2, que intentaba mejorar el proceso de elección de fuentes
tipográficas por medio de procedimientos como el de coincidencia de fuentes, síntesis y descarga.
Estas técnicas no se llegaron a utilizar demasiado y fueron eliminadas de la especificación en CSS2.1.
Sin embargo, Internet Explorer agregó soporte para descarga de fuentes en la versión 4.0, publicada
en 1997. Más tarde se incluyó la descarga de fuentes en el módulo de fuentes de CSS3, y desde
entonces ha sido implementada en Safari versión 3, Firefox versión 3,5 y Opera. Subsecuentemente,
se ha incrementado el interés sobre la tipografía para la web, así como el uso de descarga de fuentes.

Ing. David Gil
Tecnologías back-end
La parte servidor de las aplicaciones web está formada por páginas estáticas que siempre muestran el
mismo contenido y por programas o scripts que son ejecutados por el servidor web cuando el
navegador del cliente solicita algunas páginas. La salida de este script suele ser una página HTML
estándar que se envía al navegador del cliente. Tradicionalmente este programa o script que es
ejecutado por el servidor web se basa en la tecnología Common Gateway Interface (CGI).
La programación del servidor mediante CGI es compleja y laboriosa. El protocolo HTTP no almacena el
estado entre una conexión y la siguiente (es un protocolo sin estado), por lo que es el programador el
que se tiene que encargar de conservarlo. Esto conduce a que el programador tenga que dedicar parte
de su tiempo a programar tareas ajenas al objetivo de la aplicación, lo que suele ser origen de diversos
problemas.
Sin embargo, con la entrada en 1995 de Microsoft en el mundo Internet y la salida al mercado de su
servidor web (Internet Information Services) se abrió un nuevo campo para las aplicaciones web:
Internet Server Application Program Interface (ISAPI). Se trata de un conjunto de funciones que el
servidor web pone a disposición de los programadores de aplicaciones web. Con ISAPI, los
programadores pueden crear Dynamic Link Library (DLL) con funciones que son invocadas para
determinados archivos (se ejecutan cuando el cliente solicita un archivo con una determinada
extensión).
Todo el sistema Active Server Pages (ASP), no es más que una DLL del tipo ISAPI que es invocada
automáticamente para los archivos cuya extensión sea .asp. La DLL ASP preprocesa el archivo .asp
interpretando su código como un script a ejecutar en el servidor. Sin embargo, ella no interpreta
directamente el código, sino que en función del lenguaje en el que está escrito, invoca a otra DLL que
se encarga de ejecutar el script. Después recoge la salida y se la envía al servidor web, el cual a su vez
la reenvía al cliente.
Las ventajas que presenta ASP frente a CGI son:
 Las páginas basadas en CGI resultan difíciles de mantener, ya que las instrucciones HTML se
encuentran insertadas en el propio código del programa CGI, mezclándose sus funcionalidades.
 La ejecución de un programa CGI es muy ineficiente, debido al proceso de carga del código en
memoria que se realiza cada vez que un usuario requiere su ejecución. La existencia de múltiples
clientes simultáneos supone múltiples copias del programa en memoria del servidor.

Ing. David Gil
 La unión de ISAPI con el servidor web es más “fuerte” (están más integrados), su ejecución es más
rápida, con lo que se logra que las aplicaciones
basadas en ISAPI tengan un mayor rendimiento
que las basadas en CGI.
Además de ASP, existen otras tecnologías destinadas
a programar la parte servidor de las aplicaciones
web: ColdFusion, Java Server Pages (JSP), serv-lets,
PHP, etc. Todas ellas son muy similares, se basan en
los mismos principios y ofrecen resultados
equivalentes.
Código de lado del servidor

Es una tecnología que consiste en el procesamiento de una petición de un usuario mediante la
interpretación de un script en el servidor web para generar páginas HTML dinámicamente como
respuesta.
Lenguajes de servidor
Los Lenguajes de programación del lado del servidor son especialmente útiles en trabajos que se tiene
que acceder a información centralizada, situada en una base de datos en el servidor, y cuando por
razones de seguridad los cálculos no se pueden realizar en la computadora del usuario.
Es importante destacar que los lenguajes de programación del lado del servidor son necesarios porque
para hacer la mayoría de las aplicaciones web se debe tener acceso a muchos recursos externos a la
computadora del cliente, principalmente bases de datos alojadas en servidores de Internet.
Las páginas dinámicas del servidor se suelen escribir en el mismo archivo HTML, mezclado con el código
HTML, al igual que ocurría en las páginas del cliente. Cuando una página es solicitada por parte de un
cliente, el servidor ejecuta los scripts y se genera una página resultado, que solamente contiene código
HTML. Este resultado final es el que se envía al cliente y puede ser interpretado sin lugar a errores ni
incompatibilidades, puesto que sólo contiene HTML.
Luego es el servidor el que maneja toda la información de las bases de datos y cualquier otro recurso,
como imágenes o servidores de correo y luego envía al cliente una página web con los resultados de
todas las operaciones. Las ventajas de este tipo de programación son que el cliente no puede ver los
scripts, ya que se ejecutan y transforman en HTML antes de enviarlos. Además, son independientes
del navegador del usuario, ya que el código que reciben es HTML fácilmente interpretable.
Para escribir páginas dinámicas de servidor existen varios lenguajes, entre estos tenemos:
 Practical Extraction and Report Language (PERL): es un lenguaje de programación desarrollado
por Larry Wall inspirado en otras herramientas de UNIX. PERL es el lenguaje más utilizado para la
creación de programas CGI en los servidores web. Es más rápido que los programas shell script de
UNIX, puede leer y escribir ficheros binarios, y puede procesar ficheros grandes. La ventaja más
importante de PERL sobre C es que PERL no necesita ser recompilado, es un lenguaje interpretado.
 Active Server Pages (ASP): es una tecnología del lado servidor de Microsoft para páginas web
generadas dinámicamente, que ha sido comercializada como un anexo a Internet Information
Services (IIS). EL estándar ASP permite poder utilizar cualquier lenguaje para la programación, si
bien Microsoft favorece que se utilice el VBScript, y en segundo término el JScript (versión del
estándar Javascript hecha por Microsoft). En teoría, y mediante la programación, es posible
adaptar versiones de lenguajes como Pascal, C y otros, para utilizarlos dentro de páginas ASP.
 Java Server Pages (JSP): es la tecnología para generar páginas web de forma dinámica en el
servidor, desarrollado por Sun Microsystems, basado en scripts que utilizan una variante del
lenguaje Java. La tecnología JSP, o de JavaServer Pages, es una tecnología Java que permite a los
programadores generar dinámicamente HTML, XML o algún otro tipo de página web. Esta
tecnología permite al código Java y a algunas acciones predefinidas ser embebidas en el contenido

Ing. David Gil
estático. La principal ventaja de JSP frente a otros lenguajes es que permite integrarse con clases
Java (.class) lo que permite separar en niveles las aplicaciones web, almacenando en clases java las
partes que consumen más recursos, así como las que requieren más seguridad, y dejando la parte
encargada de formatear el documento ‘html’ en el archivo jsp. Además, Java se caracteriza por ser
un lenguaje que puede ejecutarse en cualquier sistema, lo que sumado a jsp le da mucha
versatilidad.
 Hipertext Preprocesor (PHP): PHP (acrónimo recursivo de “PHP: Hypertext Preprocessor”,
originado inicialmente del nombre PHP Tools, o Personal Home Page Tools) es un lenguaje de
programación interpretado. Aunque fue concebido en el tercer trimestre de 1994 por Rasmus
Lerdorf no fue hasta el día 8 de junio de 1995 que fue lanzada la versión 1.0. Se utiliza entre otras
cosas para la programación de páginas web activas, y se destaca por su capacidad de mezclarse
con el código HTML. Aunque su creación y desarrollo se da en el ámbito de los sistemas libres, bajo
la licencia GNU, existe además un compilador comercial denominado (Zend Optimizer). El
desarrollo del código abierto por un lado y el firme respaldo comercial por el otro, han elevado a
PHP a alcanzar una popularidad más que notable.
Trabajando con datos

Muchos sitios web necesitan almacenar información de los usuarios como nombres de usuario,
contraseñas, etc. Los datos en internet se han convertido en algo esencial y se pueden gestionar de
diferentes formas, de manera general se puede almacenar los datos en el cliente o se puede almacenar
en el servidor.
Cookie: galleta o galleta informática es una pequeña información enviada por un sitio web y
almacenada en el navegador del usuario, de manera que el sitio web puede consultar la actividad
previa del usuario.
API Web Storage: es una de las APIs de HTML5 que nos permite guardar datos de tipo/valor (key/value)
sin tener que utilizar cookies, es decir, no depende del tráfico de Internet.
XML: siglas en inglés de eXtensible Markup Language, traducido como "Lenguaje de Marcado
Extensible" o "Lenguaje de Marcas Extensible", es un meta-lenguaje que permite definir lenguajes de
marcas desarrollado por el World Wide Web Consortium (W3C) utilizado para almacenar datos en
forma legible.
JSON: acrónimo de JavaScript Object Notation, es un formato de texto ligero para el intercambio de
datos.
Bases de datos: Una base de datos o banco de datos es un conjunto de datos pertenecientes a un
mismo contexto y almacenados sistemáticamente para su posterior uso. Reside en el servidor y puede
almacenar todo tipo de información.
Existen programas denominados sistemas gestores de bases de datos, abreviado SGBD (del inglés
database management system o DBMS), que permiten almacenar y posteriormente acceder a los datos
de forma rápida y estructurada.
CMS (Content Management System)

Un sistema de gestión de contenidos es un programa desarrollado para que cualquier usuario pueda
administrar y gestionar contenidos de una web con facilidad y sin conocimientos de programación
Web.
Red de entrega de contenidos (CDN Content Delivery Network)

Se trata de una red de entrega de contenidos compuesta por diferentes ordenadores. Es decir, CDN
hace referencia a un conjunto de servidores ubicados en diferentes puntos geográficos que contienen
copias de contenidos alojados en otros servidores, y es un servicio del que puedes disponer en los
mejores proveedores de hosting. Por consiguiente, busca optimizar el acceso a la información de la

Ing. David Gil
red de redes, puesto que el usuario llegará a aquellas copias de datos que se encuentren más próximas
a su posición.
Servicios en la nube
La computación en la nube (cloud computing), conocida también como servicios en la nube,
informática en la nube, nube de cómputo, nube de conceptos o simplemente "la nube", es un
paradigma que permite ofrecer servicios de computación a través de una red, que usualmente es
Internet.
• The World Wide Wed Consortium, www.w3.org

• Wikipedia, www.wikipedia.org
• Webkit, www.webkit.org/getting-the-code/
• Gecko, www.developer.mozilla.org/en-US/docs/Mozilla/Gecko
• Directnic, www.directnic.com
• 1&1, www.1and1.com
• Arsys, www.arsys.es
• Programación web, https://programacionwebisc.wordpress.com/2-3-lenguajes-de-
programacion-del-lado-del-servidor/

Ing. David Gil
Actividad 6: MySQL
Introducción
MySQL es un RDBMS (Relational Data Base Management System) rápido y fácil, utilizado en muchos
sitios Web. Sus desarrolladores se enfocaron desde el principio principalmente en la velocidad. En aras
de la rapidez, tomaron la decisión de ofrecer menos funciones que sus competidores principales (tales
como Oracle y Sybase). Sin embargo, a pesar
de que MySQL no cuenta con todas las
funcionalidades que sus competidores
comerciales poseen, tiene todas las
características que necesitan la mayoría de los
desarrolladores de base de datos. Es más fácil
de instalar y de usar que sus competidores
comerciales, y la diferencia de precio está muy
a favor de MySQL.
El RDBMS MySQL fue desarrollado originalmente por una compañía sueca, pero ahora está
desarrollado, comercializado y respaldado por Sun Microsystems. La empresa otorga licencias de dos
maneras:
 MySQL Community Server: una descarga gratuita, la edición de código abierto de MySQL,
lanzado tempranamente y, a menudo con las características más avanzadas. Cualquiera que
conozca los requerimientos GPL puede utilizar el software de forma gratuita.
 MySQL Enterprise Suscripción: Una amplia oferta de apoyo a la producción, herramientas de
seguimiento, y el software de base de datos MySQL. Por una tarifa de suscripción de pago al
año por cada servidor, se dispone de actualizaciones mensuales de software, servicios de
consultoría, soporte técnico y otros servicios.
Ventajas de MySQL
MySQL es una base de datos popular entre los desarrolladores Web. Su velocidad y su pequeño tamaño
lo hacen ideal para un sitio Web. A esto se añade el hecho de que es de código abierto. Algunas de sus
ventajas son:
 Es rápido. El objetivo principal de la gente que desarrolló MySQL fue la velocidad. Así, el
software fue diseñado desde el principio pensando en la velocidad.
 No es costoso. MySQL es gratuito bajo la licencia GPL de código abierto, y la tasa de licencia
comercial es razonable.
 Es fácil de usar. Usted puede construir e interactuar con una base de datos MySQL utilizando
algunas declaraciones simples en el lenguaje SQL, que es el lenguaje estándar para
comunicarse con los RDBMS.
 Puede correr en muchos sistemas operativos. MySQL se ejecuta en muchos sistemas
operativos - Windows, Linux, Mac OS, la mayoría de variedades de Unix (incluyendo Solaris y
AIX), reeBSD, OS/2, Irix, y otros.
 Está disponible en casi todos los hosts de Internet. Si usted va a correr su sitio Web en una
empresa de alojamiento web, MySQL está ampliamente disponible sin costo adicional.
 El soporte técnico está ampliamente disponible. Una gran base de usuarios ofrece soporte
gratuito a través de listas de correo. Los desarrolladores de MySQL también participar en las
listas de correo electrónico.
 Es seguro. El sistema flexible de autorización de MySQL permite otorgar algunos o todos los
privilegios de base de datos (por ejemplo, el privilegio de crear una base de datos o suprimir
los datos) a los usuarios o grupos específicos de usuarios. Las contraseñas están cifradas.

Ing. David Gil
 Es compatible con bases de datos grandes. MySQL maneja bases de datos de hasta 50 millones
de registros o más. El tamaño límite predeterminado para una tabla es de 4 GB, pero este
puede aumentar (si su sistema operativo puede manejarlo) a un límite teórico de 8 millones
de terabytes (TB).
 Es personalizable. La licencia de código abierto GPL permite a los programadores modificar el
software MySQL para adaptarse a entornos específicos.
¿Cómo trabaja MySQL?
El software MySQL consiste en el servidor MySQL, varios programas de utilidad que ayudan en la
administración de bases de datos MySQL, y algunos programas de apoyo que el servidor MySQL
necesita. El corazón del sistema es el servidor MySQL.
El servidor MySQL es el administrador del sistema de base de datos. Se ocupa de todas las instrucciones
de la base de datos. Por ejemplo, si desea crear una nueva base de datos, se envía un mensaje al
servidor MySQL que dice "crear una nueva base de datos y llamarlo NewData." El servidor MySQL a
continuación, crea un subdirectorio con el nombre de NewData en su directorio de datos, y pone los
archivos necesarios con el formato requerido en el subdirectorio NewData. De la misma manera, para
añadir datos a la base de datos, envía un mensaje al servidor MySQL, dándole los datos e indicando
donde se desea que los datos que se añadan.
Antes de que pueda dar instrucciones al servidor MySQL, debe estar en ejecución a la espera de
peticiones. El servidor MySQL se instala generalmente de manera que se inicia cuando el equipo se
inicia y continúa funcionando todo el tiempo. Esta es la configuración habitual para un sitio Web. Sin
embargo, no es necesario configurarlo para iniciarse cuando se inicia el equipo. Si es necesario, se
puede iniciar manualmente cada vez que desee acceder a una base de datos. Cuando se está
ejecutando, el servidor MySQL escucha continuamente los mensajes que se dirigen a él.
Comunicación con el servidor MySQL
Toda su interacción con la base de datos se lleva a cabo a través del envío de mensajes al servidor
MySQL. Puede enviar mensajes al servidor MySQL de varias maneras. El software PHP tiene
indicaciones específicas que se utilizan para enviar instrucciones al servidor MySQL.
El servidor MySQL debe ser capaz de comprender las instrucciones que le envíe. Usted se comunica
con SQL (Structured Query Language), que es un lenguaje estándar entendido por muchos RDBMS. El
servidor MySQL entiende SQL. PHP no entiende SQL, pero no lo necesita: PHP sólo establece una
conexión con el servidor MySQL y envía el mensaje de SQL a través de la conexión. El servidor MySQL
interpreta el mensaje de SQL y sigue las instrucciones. El servidor MySQL envía un mensaje de
respuesta, que indique su situación y lo que hizo (o informa de un error si no estaba en condiciones de
comprender o seguir las instrucciones).
La Comunicación con MySQL
El servidor MySQL es el gestor de bases de datos:
 Crea nuevas bases de datos.
 Conoce dónde se almacenan las bases de datos.
 Almacena y recupera información, guiado por las peticiones o consultas, que recibe.
Para hacer una solicitud que MySQL pueda entender, se debe construir una consulta SQL y enviarla al
servidor MySQL.
Construyendo consultas SQL

SQL (Structured Query Language) es el lenguaje informático que se utiliza para comunicarse con MySQL.
SQL está hecho en gran parte de palabras en inglés, reunido en cadenas de palabras que suenan
similares a las expresiones en inglés.

Ing. David Gil
La primera palabra de cada consulta es su nombre, que es una palabra de acción (un verbo) que le dice
a MySQL lo que quieres hacer. Las consultas que veremos son CREATE, DROP, ALTER, SHOW, INSERT,
LOAD, SELECT, UPDATE y SUPR. Este vocabulario básico es suficiente para crear - e interactuar con -
bases de datos en los sitios web.
El nombre de la consulta es seguido por las palabras y frases - algunas obligatorias y otras opcionales
- que le indican a MySQL cómo realizar la acción.
Éstos son algunos criterios generales a tener en cuenta al construir una consulta SQL:
 Mayúsculas: Es aconsejable escribir las instrucciones SQL en mayúsculas y tener cuidado en
los nombres de Tablas y columnas.
 Espaciado: Las palabras SQL deben estar separadas por uno o más espacios. SQL tampoco hace
caso al final de la línea.
 Comillas: Utilizar comillas (“) para las cadenas de caracteres.
Envió de consultas SQL

Cuando se construye una aplicación de web de base de datos, dos formas comunes para enviar
consultas SQL al servidor MySQL son:
• phpMyAdmin: phpMyAdmin es un software desarrollado específicamente con el fin de
gestionar bases de datos MySQL. Está escrito en PHP y se ejecuta en un navegador.
Proporciona una interfaz de usuario que simplifica en gran medida sus interacciones con
MySQL.
• Scripts PHP: El lenguaje PHP dispone de funciones desarrolladas específicamente con el
propósito de enviar consultas SQL a bases de datos MySQL y recibir información de las bases
de datos.
Construcción de una Base de Datos
Una base de datos consta de dos partes: una estructura para contener los datos y los propios datos.
En primer lugar, se crea una base de datos vacía sin estructura en absoluto, y luego se agregan tablas
a la misma.
Rara vez se crea la base de datos desde un script PHP. En general, la base de datos debe existir antes
de que la aplicación web pueda realizar sus funciones - visualización de los datos de la base de datos,
almacenamiento de datos en la base de datos, o ambos. Puede ser que una aplicación requiera la
creación de una nueva tabla para cada cliente, como por ejemplo crear una galería fotográfica o un
nuevo cuadro de información de producto para cada individuo. En este caso, la aplicación necesita
crear una nueva tabla mientras se está ejecutando. Pero es raro que una aplicación cree una base de
datos o una tabla mientras se ejecuta.
Creando una nueva base de datos
Puede crear su base de datos nueva y vacía utilizando phpMyAdmin. Después de crear una nueva base
de datos, puede agregar tablas a la misma.
Visualización de las bases de datos
Puede ver una lista de los nombres de sus bases de datos actuales en cualquier momento abriendo la
página principal de phpMyAdmin. Los nombres se muestran en el panel izquierdo de la página. La lista
incluye un número después del nombre de la base. Este número representa el número de mesas
actualmente definidos para la base de datos.
Eliminación de una base de datos
Puede eliminar una base de datos en el equipo local utilizando phpMyAdmin.

Ing. David Gil
Agregar tablas a una base de datos

Puede agregar tablas a cualquier base de datos, ya sea una nueva base de datos que acaba de crear o
una base de datos existente que ya tiene tablas y datos en ella. En la mayoría de los casos, cree las
tablas en la base de datos antes del script(s) PHP de acceso a la base de datos. Por lo tanto, en la
mayoría de los casos, se utiliza phpMyAdmin para agregar las tablas.
Cambiar la estructura de la base de datos
Puede cambiar el nombre de la tabla, agregar, eliminar o cambiar el nombre de una columna, o
cambiar el tipo de datos u otros atributos de la columna. Se puede cambiar la estructura, incluso
después de que la tabla contiene datos, siempre y cuando no cambie la definición de un campo a una
definición que es incompatible con los datos actualmente en la columna.
Manipulando Datos de la Base de Datos
Una base de datos vacía no es de ningún provecho. Una base de datos sólo es útil con respecto a la
información que ésta contiene.
Una base de datos tiene que ser capaz de recibir información para su almacenamiento y proporcionar
información a solicitud.
Es posible realizar cuatro tipos de tareas en la base de datos:
 Añadir información: Agregar una fila a una tabla.
 Actualización de la información: Cambio de información en un registro existente. Esto incluye
la adición de datos a un campo en blanco en una fila existente.
 Recuperación de la información: Consultando los datos. Esta solicitud no elimina los datos de
la base de datos.
 Remoción de información: Eliminación de datos de la base de datos.
Controlando el Acceso a los Datos
Es necesario controlar el acceso a la información en su base de datos. Usted necesita decidir quién
puede ver los datos y que se puede modificar.
MySQL proporciona un sistema de seguridad para proteger sus datos. Nadie puede acceder a los datos
en su base de datos sin una cuenta. Cada cuenta MySQL tiene las siguientes atribuciones:
 Un nombre
 Un nombre de equipo - la máquina desde la cual la cuenta puede acceder al servidor MySQL
 Una contraseña
 Un conjunto de privilegios
Para acceder a sus datos, alguien tiene que utilizar un nombre de cuenta válido y conocer la contraseña
asociada a esa cuenta. Además, esa persona debe estar conectada desde un ordenador que permite
conectarse a su base de datos a través de esa cuenta específica.
Después de que el usuario tiene acceso a la base de datos, lo que él o ella puede hacer a los datos
depende de qué privilegios se han establecido para la cuenta. Cada cuenta se permite o no se les
permite realizar una operación en su base de datos, como SELECT, DELETE, INSERT, CREATE o DROP.
Los ajustes que especifican lo que una cuenta puede hacer son privilegios, o permisos. Puede
configurar una cuenta con todos los privilegios, sin privilegios, o cualquier otra combinación.
Si un usuario intenta conectarse a MySQL y ejecutar una consulta, MySQL controla el acceso a los datos
en dos etapas:

Ing. David Gil
 Comprobación de conexión: MySQL comprueba la validez del nombre de cuenta y contraseña

y comprueba si la conexión proviene de un host que está autorizado para conectarse al
servidor MySQL utilizando la cuenta especificada. Si todo va bien, MySQL acepta la conexión.
 Comprobación de solicitudes: Después de que MySQL acepta la conexión, comprueba si la
cuenta tiene los privilegios necesarios para ejecutar la consulta especificada. Si lo hace, MySQL
ejecuta la consulta.
Configuración de cuentas MySQL
Una cuenta se identifica por el nombre de cuenta y el nombre de la computadora que permite el acceso
a MySQL utilizando esta cuenta. Usted tiene una cuenta que puede utilizar para administrar sus bases
de datos MySQL. Esta cuenta se mostrará en la página principal de phpMyAdmin. En el equipo local,
es probable que sea root@localhost. Esta es la única cuenta que usted necesita para su sitio de
desarrollo, porque nadie necesita acceder a él desde el exterior - sólo desde el ordenador.
En su cuenta de alojamiento Web, la cuenta puede ser dominio@localhost o algo parecido. Las
empresas de Web hosting utilizan diferentes convenciones de nomenclatura. Sin embargo, usted no
necesita preocuparse por el nombre de host. Su anfitrión Web maneja su cuenta. Usted puede ver la
cuenta y nombre de host en la página principal de phpMyAdmin. Si estás utilizando un sitio web de
una compañía, su compañía de personal de TI le proporciona un nombre de cuenta y nombre de host.
Es necesario crear al menos una cuenta con privilegios limitados para utilizar en su sitio Web en PHP
que acceden a la base de datos. Al crear una cuenta nueva, puede especificar una contraseña cuando
se crea la cuenta o se puede añadir una contraseña más tarde. Puede configurar los privilegios cuando
se crea la cuenta, agregar o quitar los privilegios más tarde.
Copias de respaldo de los Datos
Usted necesita tener al menos una copia de su valiosa base de datos. Los desastres son muy poco
frecuentes, pero ocurren. La computadora donde se almacena la base de datos puede estroperase y
perder sus datos, el archivo de computadora puede ser dañada, el edificio se puede quemar, y así
sucesivamente. Las copias de seguridad resguardan la base de datos contra la pérdida de estos por
desastres.
Si su sitio web está alojado en una empresa de alojamiento web o en el ordenador de la empresa, otras
personas son responsables de realizar copias de seguridad del sitio Web, incluyendo la base de datos.
Los administradores de los equipos dispondrán de procedimientos de copia de seguridad en el lugar.
Al menos, usted puede asumir que tienen estos procedimientos. Sin embargo, lo mejor es estar seguro.
Hable con personal de la empresa de alojamiento web o del departamento de IT de su compañía sobre
sus procedimientos de copia de seguridad. Asegúrese de que las copias de seguridad que le hagan
sentirse seguro sobre sus datos y que permiten el reemplazo rápido de una base de datos dañada.
Incluso si se está contento con los procedimientos de copia de seguridad en su lugar a su empresa de
alojamiento Web, usted probablemente querrá una copia de seguridad de base de datos en el equipo
local. De este modo, se está doblemente seguro de que usted tiene una copia de seguridad y acelera
el proceso de sustitución de un archivo dañado. Puede hacer copia de su base de datos tantas veces
como lo consideren necesario.
Además, si su sitio web recoge datos de los usuarios, puede instalar la copia de seguridad de su sitio
Web en su equipo local. Por lo tanto, cuando usted está desarrollando y probando en su sitio de
desarrollo local, está utilizando la base de datos real, haciendo que su prueba sea más fiable.
En general, se necesita tener dos copias de seguridad de los datos: una copia en un lugar de fácil acceso
donde puede ser rápidamente sustituido y otra copia en una ubicación física diferente de la ubicación
del sitio Web por la remota posibilidad de que el edificio se incendie. El proveedor de hosting
probablemente almacena las copias de seguridad en un equipo diferente que el equipo que aloja el
sitio Web y / o base de datos. El anfitrión de Internet también puede almacenar una copia de sus copias
de seguridad fuera del sitio.

Ing. David Gil
Restauración de Datos
Luego de haber creado una copia de seguridad de la base de datos; se puede volver a crear la base de
datos en cualquier equipo que tiene instalado MySQL desde el archivo de copia de seguridad que ha
guardado. Se puede reemplazar la base de datos o mover la base de datos a un equipo nuevo donde
no exista actualmente.
Existen muchas razones por las que se desea volver a un estado guardado de las bases de datos por
ejemplo tablas dañadas, índices incorrectos, etc. En algunos casos las tablas dañadas pueden ocasionar
que el servidor MySQL se cierre.
Puede utilizar el archivo de texto que creó cuando realizó la copia de seguridad para volver a crear la
base de datos. Sin embargo, tal como se describe anteriormente, se genera una base de datos
mediante la creación de la base de datos y a continuación, agregar tablas a la base de datos. El archivo
de copia de seguridad contiene todas las declaraciones necesarias SQL para reconstruir las tablas, pero
no contiene las instrucciones necesarias para crear la base de datos. Su base de datos debe existir
antes de poder volver a crear las tablas del archivo de copia de seguridad.
• Harris, A. (2009). Programación con PHP 6 y MySQL. Madrid, España: Anaya Multimedia.
• Pavón, J. (2007). Creación de un Portal con PHP y MsQL. Madrid, España: Ra-Ma S.A.
• Perez, C. (2997). MySQL para Windows y Linux (2 ed.). Madrid, España: Ra-Ma.
• Welling, L., Thomson, L.(2017). Desarrollo Web con PHP y MySQL (5 ed.). Madrid, España:
Anaya Multimedia.
• MySQL, https://www.mysql.com/

Ing. David Gil
Actividad 7: PHP
Introducción
PHP, un lenguaje de programación diseñado
específicamente para su uso en la Web, es una
herramienta para crear páginas Web dinámicas.
Rico en características que hacen más fácil el
diseño y programación web, PHP está en uso en
más de 20 millones de dominios y su popularidad
sigue creciendo.
PHP es un acrónimo recursivo que significa PHP
Hypertext Pre-processor (inicialmente PHP Tools,
o, Personal Home Page Tools). Fue creado
originalmente por Rasmus Lerdorf en 1994; sin
embargo, la implementación principal de PHP es
producida ahora por The PHP Group y sirve como el estándar de facto para PHP al no haber una
especificación formal. Publicado bajo la PHP License, la Free Software Foundation considera esta
licencia como software libre.
La sintaxis del lenguaje PHP es similar a la sintaxis de C. PHP es en realidad más simple que C, ya que
no utiliza algunos de los conceptos más difíciles de C. PHP tampoco incluye las capacidades de
programación de bajo nivel de C debido a que PHP está diseñado para programar sitios web y no
requiere de las capacidades requeridas por el lenguaje C.
PHP es particularmente fuerte en su capacidad para interactuar con bases de datos. Es compatible con
casi todas las bases de datos alguna conocida. PHP maneja la conexión a la base de datos y la
comunicación con ella.
Ventajas de PHP
La popularidad de PHP creció rápidamente debido a sus muchas ventajas:
 Es rápido. Debido a que es embebido en el código HTML, el tiempo de respuesta es corto.
 No tiene costo. Gracias a su licencia GPL (General Public License)
 Es fácil de usar. PHP contiene muchas características especiales y funciones necesarias para crear
páginas Web dinámicas. El lenguaje PHP está diseñado para incluirse fácilmente en un archivo
HTML.
 Puede funcionar en muchos sistemas operativos. Se ejecuta en una variedad de sistemas
operativos - Windows, Linux, Mac OS, y la mayoría de variedades de Unix.
 Está disponible en casi todos los hosts de Internet. Si usted va a publicar el sitio Web en un servidor
Web, encontrará PHP instalado en casi todos los hosts de Internet de forma gratuita.
 El soporte técnico está ampliamente disponible. Una gran base de usuarios ofrece soporte gratuito
a través de correo electrónico en las listas de discusión.
 Es seguro. El usuario no ve el código PHP.
 Está diseñado para soportar bases de datos. PHP incluye una funcionalidad diseñada para
interactuar con bases de datos específicas.
 Es personalizable. La licencia de código abierto permite a los programadores modificar el software
PHP, añadir o modificar características, según sea necesario para adaptarse a sus entornos
específicos.

Ing. David Gil
¿Cómo trabaja PHP?

PHP es un lenguaje de scripts incrustados cuando se utiliza en páginas Web. Esto significa que el código
PHP está incrustado en el código HTML. Se usa etiquetas HTML para incluir el lenguaje PHP que se
insertan en el archivo HTML - de la misma forma que se usaría otras etiquetas HTML. Puede crear y
editar páginas web que contienen PHP de la misma manera que crea y edita páginas de HTML.
El software PHP funciona con el servidor Web. El servidor Web es el software que proporciona páginas
Web para el mundo. Cuando escribe una dirección URL en su navegador Web, usted está enviando un
mensaje al servidor Web en esa dirección, pidiéndole que le envíe un archivo HTML. El servidor Web
responde enviando el archivo solicitado. Su navegador lee el archivo HTML y muestra la página Web.
También se puede pedir al servidor Web que envíe un archivo al hacer clic en un enlace en una página
Web. Además, el servidor Web procesa un archivo cuando se hace clic en un botón de la página web
que envía a un formulario.
Cuando se instala PHP, el servidor Web está configurado para esperar determinadas extensiones de
archivos para guardar instrucciones del lenguaje PHP. A menudo, la extensión es .php o .phtml, pero
cualquier extensión se puede utilizar. Cuando el servidor Web recibe una solicitud de un archivo con
la extensión designada, envía las sentencias HTML como son, pero las declaraciones de PHP son
procesadas por el software PHP antes de que se envíe al solicitante.
Cuando las sentencias del lenguaje PHP se procesan, solo la salida es enviada por el servidor Web al
explorador Web. Las instrucciones del lenguaje PHP no se incluyen en el resultado enviado al
navegador, así que el código PHP es seguro y transparente para el usuario.
PHP no está integrado con todos los servidores web, pero funciona con muchos de los más populares
servidores Web. PHP es desarrollado como un proyecto de la Apache Software Foundation - por lo
tanto, lo mejor es con Apache. PHP también funciona con Microsoft IIS / PWS, iPlanet (antes Netscape
Enterprise Server), y otros.
Adición de una sección PHP a una página HTML
PHP es un aliado para HTML, permitiéndole hacer cosas que no puede hacer por sí solo. Por ejemplo,
HTML puede mostrar páginas Web, HTML tiene características que le permiten dar formato a las
páginas Web. HTML también permite mostrar gráficos en sus páginas web y reproducir archivos de
música. Pero HTML no permite interactuar con la persona que ve la página Web.
Se utilizan etiquetas HTML para hacer el lenguaje PHP parte las declaraciones de los scripts HTML. El
archivo se nombra con una extensión .php. (El administrador PHP puede definir otras extensiones,
como .phtml o .php5, pero .php es la más común). Las instrucciones del lenguaje PHP se incluyen en
las etiquetas PHP con el siguiente formato:
<?php ?>
Sentencias PHP
La sección de PHP que se agrega a un archivo HTML se compone de una serie de sentencias PHP. Cada
sentencia PHP es una instrucción de PHP para hacer algo.
Las sentencias PHP terminan con un punto y coma (;). PHP no se da cuenta de un espacio en blanco o
el final de las líneas. Continúa leyendo una sentencia hasta que encuentra un punto y coma o la
etiqueta de fin de código, no importa cuántas líneas se expanda la sentencia.
A veces, grupos de sentencias se combinan en un bloque. Un bloque está encerrado entre llaves, { }.
Las sentencias de un bloque ejecutan juntas. Un uso común de un bloque es un bloque condicional, en
el que se ejecutan las instrucciones sólo cuando se cumplen determinadas condiciones.

Ing. David Gil
Sentencias simples
Una declaración simple es una sola instrucción seguida de un punto y coma (;). Estas son algunas de
las sentencias simples útiles que se usan en los programas de PHP:
La sentencia echo
Se utiliza la sentencia echo para producir una salida. La salida desde una sentencia echo es enviada a
el navegador de usuario, el cual maneja la salida como HTML.
Sintaxis:
echo itemsalida, itemsalida, itemsalidad, ...
Dónde:  Un itemsalida puede ser un número, una cadena o variable. Una cadena debe ir
entre comillas.
 La lista de itemsalida que sea necesario, deben ir separados por comas.
Sentencia de Asignación
Las sentencias de asignación son declaraciones que asignan valores a las variables. El nombre de la
variable está a la izquierda del signo igual y el valor que se asigna a la variable está a la derecha.
Sintaxis:
$nombrevariable = valor;
Dónde:  El valor puede ser un valor único o una combinación de valores, incluidos los
valores de las variables. Una variable puede contener números o caracteres, pero
no ambas al mismo tiempo. Por lo tanto, un valor no puede ser una combinación
de números y caracteres.
Sentencias de incremento
A menudo se utiliza una variable como un contador. Las sentencias siguientes muestran el uso de un
contador:
 $counter++;
 $counter--;
 $counter+=2;
 $counter-=3;
 $counter*=2;
 $counter/=3;
Sentencia exit
A veces desea que el programa deje de ejecutarse. La sentencia exit detiene el programa. Ninguna otra
instrucción se ejecuta después de la instrucción exit.
Sintaxis:
exit(“mensaje”);
Dónde:  mensaje, es un mensaje que se emite al salir del programa.

Ing. David Gil
Variables PHP
Las variables son los recipientes utilizados para almacenar información. Una variable tiene un nombre,
y la información se almacena en la variable. Después de que la información se almacena en una variable,
puede ser utilizada más adelante en el programa. Uno de los usos más comunes de variables es de
conservar la información que un usuario digita en un formulario.
$NombreVariable = ValorVariable;
Al nombrar una variable tener en cuenta lo siguiente:
 Todos los nombres de las variables tienen un signo de dólar ($) delante de ellas. Esto le indica
a PHP que es un nombre de variable.
 Los nombres de variable pueden tener cualquier longitud.
 Los nombres de variable pueden incluir solamente letras, números y guiones.
 Los nombres de variable deben comenzar con una letra o un subrayado. No pueden comenzar
con un número.
 Mayúsculas y minúsculas no son lo mismo.
Constantes PHP
Las constantes de PHP son similares a las variables. A las constantes se les da un nombre y un valor se
almacena en ellas. Sin embargo, las constantes son constantes, es decir, no pueden ser modificadas
por el programa. Después de establecer el valor de una constante, este sigue siendo el mismo.
Las constantes se utilizan cuando un valor es necesario en varios lugares en el programa y no cambia
durante la ejecución del programa. El valor se establece en una constante en el inicio del programa.
Mediante el uso de una constante en lugar de una variable, se asegura que el valor no sea cambiado
accidentalmente.
define(“NombreConstante”, “ValorConstante”);
Trabajar con números

PHP permite hacer operaciones aritméticas con números. En la siguiente tabla se muestra los
operadores que se pueden usar en PHP:
OPERADORES ARITMÉTICOS
Operador Descripción
+ Sumar dos números.
- Restar el segundo número del primero.
* Multiplica dos números.
/ Divide el primer número por el segundo número.
% Encontrar el residuo cuando el primer número es dividido por el
segundo número.
El orden en que se lleva a cabo las operaciones aritméticas es importante. Se puede conseguir
resultados diferentes dependiendo de qué operación se realiza en primer lugar. PHP hace la
multiplicación y la división en primer lugar, seguida de la suma y la resta. Si las operaciones tienen la
misma prioridad, PHP las realiza de izquierda a derecha.

Ing. David Gil
Se puede cambiar el orden en que se realiza el cálculo utilizando paréntesis. Las operaciones dentro
de los paréntesis se realizan primero.
Trabajar con cadena de caracteres
Una cadena de caracteres es una serie de caracteres. Los caracteres son letras, números y signos de
puntuación. Cuando un número se utiliza como un carácter, es sólo un carácter almacenado, lo mismo
que una letra. No se puede utilizar en las operaciones aritméticas.
Cuando se almacena una cadena de caracteres en una variable, le dices a PHP donde la cadena
comienza y termina utilizando comillas dobles o comillas simples.
Cadenas entre comillas simples y comillas dobles se tratan de manera diferente. Las cadenas entre
comillas simples se almacenan literalmente, con la excepción de \ ', que se almacena como un
apóstrofo. En las cadenas entre comillas dobles, variables y algunos caracteres especiales se evalúan
antes que la cadena sea almacena.
Trabajar con tiempo y fechas
Las fechas y horas pueden ser elementos importantes en una aplicación Web de base de datos. PHP
tiene la capacidad para reconocer fechas y tiempos y manejarlos de manera diferente a las cadenas de
caracteres sin formato. Las fechas y horas son almacenados por la computadora en un formato llamado
timestamp. Sin embargo, esto no es un formato en el usuario desearía ver la fecha. PHP convierte las
fechas desde su anotación en timestamp que el equipo entiende y desde un valor temporal en un
formato familiar para las personas. PHP maneja las fechas y horas utilizando las funciones integradas.
El formato de fecha y hora es Unix Timestamp, que es un número entero que es el número de segundos
desde el 1 de enero 1970, 00:00:00 GMT (Greenwich Mean Time) para el tiempo representado por la
marca de tiempo. Este formato hace que sea fácil de calcular el tiempo transcurrido entre dos fechas
- sólo se resta una fecha y hora de la otra.
La hora actual es un concepto difícil en la Web. La hora actual es la hora almacenada en el servidor
donde se está ejecutando PHP. Si está utilizando una empresa de alojamiento web, es probable que ni
siquiera sepa dónde están los servidores que su empresa de alojamiento web mantiene. Además, los
visitantes que visiten su sitio web pueden estar en cualquier parte del mundo. En consecuencia, rara
vez se desea mostrar la hora actual en su página Web. Incluso la fecha puede ser diferente si el servidor
Web y el visitante están en zonas bastante separadas de tiempo.
Si se tiene una razón para querer mostrar la hora actual en una ubicación específica, se hace mediante
la inclusión de la siguiente declaración en el script:
Puede ver qué zona horaria es actualmente su zona horaria predeterminada mediante las siguientes
sentencias:
Para dar formato a una fecha, la función que se utiliza con más frecuencia es date, que convierte una
fecha y hora en un formato que usted especifique. El formato general es:

Ing. David Gil
SÍMBOLOS DE FORMATO DE FECHA

Símbolo Significado Ejemplo
F Mes en texto, sin abreviación January
M Mes en texto, abreviado Jan
m Mes en números con ceros a la izquierda 02, 12
n Mes en números sin ceros a la izquierda 1, 12
d Día del mes; dos dígitos con ceros a la izquierda 01,14
j Día del mes sin ceros a la izquierda 3, 14
l Día de la semana en texto, sin abreviación Friday
D Día de la semana en texto, abreviado Fri
w Día de la semana en números (0 a 6) 0 (Sunday)
Y Año en cuatro dígitos 2010
y Año en dos dígitos 10
g Hora entre 0 y 12 sin ceros a la izquierda 2, 10
G Hora entre 0 y 24 sin ceros a la izquierda 2, 15
h Hora entre 0 y 12 con ceros a la izquierda 02, 10
H Hora entre 0 y 24 con ceros a la izquierda 02, 15
i Minutos 00, 59
s Segundos 00, 59
a am o pm en minúsculas am, pm
A AM o PM en mayúsculas AM, PM
Comparación de valores
PHP ofrece varias maneras de comparar valores. La siguiente tabla muestra las comparaciones que
están disponibles:
COMPARANDO VALORES
Comparación Descripción
== Son los dos valores iguales?
> Es el primer valor mayor que el segundo valor?
>= Es el primer valor mayor o igual que el segundo valor?
< Es el primer valor menor que el segundo valor?
<= Es el primer valor menor o igual que el segundo valor?
!= Son los dos valores diferentes?
<> Son los dos valores diferentes?

Ing. David Gil
Comentarios en PHP
PHP soporta tres formas de comentarios:
1. /* comentario
continua el comentario */
2. # Comentario de línea
3. // Comentario de línea
Arreglos PHP
Los arreglos o matrices son variables complejas. Una
matriz almacena un grupo de valores del mismo tipo bajo
un solo nombre de variable. La información en una matriz
se puede manejar, acceder y modifica fácilmente. Hay dos
tipos de matrices: los que se accede de acuerdo con la
posición de índice en el que reside el elemento, y las que
son de carácter asociativo, se accede por un valor clave
que lleva algún tipo de asociación con su valor
correspondiente. En la práctica, sin embargo, ambos son
manipulados de la misma manera. Las matrices también
pueden ser unidimensionales o multidimensionales.
Creación de matrices
La forma más sencilla de crear una matriz es asignar un
valor a una variable con corchetes ([ ]) al final de su
nombre.
Ejemplos:
$arrego[1] = “Trujillo”; //matriz indexada unidimensional
$arreglo = array( “Trujillo”, ”Lima”, ”Piura”); //otra forma
$lenguajes["España"] = "Español"; //matriz asociativa
$lenguajes["Brasil"] = "Portugués";
$datos[1] [4] = "ventas"; // dos dimensiones
$capitales["Perú"] ["La Libertad"] = "Trujillo"; // dos dimensiones
$calles["Perú"] ["La Libertad"]["Trujillo"] = "Bolivar"; // tres dimensiones

Ing. David Gil
Sentencias Condicionales
Una sentencia condicional ejecuta un bloque de instrucciones sólo cuando se cumplen ciertas
condiciones. Hay dos tipos de sentencias condicionales:
Sentencia if
Una sentencia if pregunta si se dan ciertas condiciones. Un bloque de instrucciones se ejecuta en
función de que se cumplan las condiciones.
Sintaxis:
if( condición ... )
{
Bloque de sentencias
}
elseif( condición ... )
{
}
else
{
}
Dónde:  condición, es una condición lógica que se evalúa a verdadero (true) o falso (false).
 Bloque de sentencias, son bloques de código que se ejecutan de acuerdo a la
evaluación de la condición
Sentencias switch
La sentencia switch comprueba el valor de una variable y ejecuta el bloque de sentencias para el valor
correspondiente de la variable.
Sintaxis:
switch ( $nombrevariable )
{
case value :
bloque de sentencias;
break;
case value :
break;
...
default:
break;
}
Dónde:  $nombrevariable, es un identificador válido.
 break, esta instrucción causa la salida inmediata de la sentencia switch.

Ing. David Gil
Sentencias Repetitivas
Las sentencias repetitivas son utilizadas con frecuencia en los programas, para configurar un bloque
de instrucciones que se repiten. A veces, el bucle se repite un número determinado de veces. Otras
veces, el bucle se repite hasta que una determinada condición existe. Hay tres tipos de bucles:
El bucle for
El más básico para los ciclos se basa en un contador. Se establece el valor inicial del contador,
establecer el valor final, y se establece cómo se incrementa el contador.
Sintaxis:
for(valorinicial; condiciónfinal; incremento)
{
Bloque de instrucciones;
}
Dónde:  valorinicial, es el valor inicial a partir del cual se empieza a contar.
 condiciónfinal, una sentencia que establece el valor final.
 Incremento, una instrucción que incrementa el contador.
El bucle while
Un bucle while continúa repitiéndose siempre y cuando cierta condición sea verdadera.
Sintaxis:
while( condicion )
{
}
Dónde:  condición, condición lógica que se evalúa a true o false.
El bucle do .. while
Un bucle do..while es similar a un bucle while. Es decir se continúa repitiendo mientras la condición
sea verdadera; pero, la condición se evalúa al final de cada bucle.
Sintaxis:
do
{
} while( condicion )
Dónde:  condición, condición lógica que se evalúa a true o false.

Ing. David Gil
Funciones
Las aplicaciones suelen realizar la misma tarea en diferentes puntos en el programa o en programas
diferentes. Se puede crear una función que contenga todas las instrucciones necesarias y utilizarla
cuando se necesite.
Sintaxis:
function nombrefuncion( )
{
return;
}
Dónde:  nombrefunción, es un identificador válido el que va ha usarse cuando se
requiera la función.
• Heurtel, O. (2016). PHP 7. Desarrollar un sitio web dinámico e interactivo. Barcelona,
España: Eni ediciones.
• Welling, L., Thomson, L.(2017). Desarrollo Web con PHP y MySQL (5 ed.). Madrid,
España: Anaya Multimedia.
• PHP, http://php.net/manual/es/intro-whatis.php

Ing. David Gil
Actividad 8: PHP y MySQL

MySQL y PHP se utilizan con frecuencia
juntos. Son a menudo llamados el dúo
dinámico. MySQL proporciona la parte de
base de datos y PHP proporciona la parte de
aplicación de una aplicación web de base de
datos.
Ventajas de la Relación
MySQL y PHP como pareja tienen varias
ventajas:
 Son gratis. Es difícil de superar esta ventaja, libre de costo.
 Están orientados a Web. Ambos fueron diseñados específicamente para su uso en sitios Web.
Ambos tienen un conjunto de características enfocadas a la creación de sitios Web dinámicos.
 Son fáciles de usar. Ambos fueron diseñados para obtener un sitio Web con rapidez.
 Son rápidos. Ambos fueron diseñados con la velocidad como un objetivo de mayor importancia.
Juntos proporcionan una de las maneras más rápidas para ofrecer páginas web dinámicas a
los usuarios.
 Se comunican bien una con otra. PHP tiene funciones integradas para comunicarse con MySQL.
¿Cómo trabajan MySQL y PHP juntos?

Como un RDBMS, MySQL puede almacenar información compleja. Como un lenguaje de script, PHP
puede realizar complicadas manipulaciones de datos, en cualquiera de los datos que tiene que
modificar antes de guardarla en la base de datos o datos que se recuperan de la base de datos y la
necesidad de modificar antes de mostrar o utilizar para otra tarea. Juntos, PHP y MySQL puede ser
usado para construir una aplicación web de base de datos sofisticada y compleja.
Funciones PHP y MySQL

Puede utilizar las funciones integradas de PHP para interactuar con MySQL. Estas funciones conectan
con el servidor MySQL, seleccionan la base de datos correcta, envían consultas SQL y realizan la
comunicación con otras bases de datos MySQL. No es necesario conocer los detalles de interactuar
con la base de datos debido a que PHP maneja todos los detalles. Usted sólo necesita saber cómo
utilizar las funciones.
A partir de PHP 5, PHP ofrece dos tipos de funciones para comunicarse con MySQL: un conjunto de
funciones (las funciones mysqli) para el uso con MySQL 4.1 o posterior y otra serie de funciones (las
funciones de mysql) para el uso con MySQL 4.0 y versiones anteriores. La mayoría de Web ofrecen
MySQL 5.0 o 5.1. Si ofrecen sólo versiones anteriores de MySQL, puede ponerse en contacto con la
gente de soporte técnico para ver cuándo van a ofrecer una versión más reciente de MySQL.
Las funciones de PHP para su uso con MySQL 5.1 tiene el siguiente formato general:

Ing. David Gil
Sintaxis para funciones mysql y mysqli

Funciones mysqli Funciones mysql
mysqli_connect ($host, $user, $passwd, $dbname) mysql_connect($host,$user,$passwd)
seguido de:
mysql_select_db($dbname)
mysqli_errno($cxn) mysql_errno() o mysql_errno($cxn)
mysqli_error($cxn) mysql_error() o mysql_error($cxn)
mysqli_fetch_array($result) mysql_fetch_array($result)
mysqli_fetch_assoc($result) mysql_fetch_assoc($result)
mysqli_fetch_row($result) mysql_fetch_row($result)
mysqli_insert_id($cxn) mysql_insert_id($cxn)
mysqli_num_rows($result) mysql_num_rows($result)
mysqli_query($cxn,$sql) mysql_query($sql) o mysql_query($sql,$cxn)
mysqli_select_db($cxn,$dbname) mysql_select_db($dbname)
mysqli_real_escape_string($cxn,$data) mysql_real_escape_string($data)
Estableciendo una conexión

El primer paso en la comunicación con su base de datos MySQL es la conexión con el servidor MySQL.
Para conectar con el servidor, lo que necesita saber es el nombre del equipo donde se encuentra la
base de datos, el nombre de su cuenta MySQL y la contraseña de su cuenta MySQL. Para abrir la
conexión, utilice la función mysqli_connect de la siguiente manera:
$cxn = mysqli_connect(“host”, “acct”, “password”, “dbname”) or die (“message”);
Donde:
• host: El nombre del equipo donde está instalado MySQL.
• acct: El nombre de cualquier cuenta válida de MySQL.
• password: La contraseña para la cuenta de MySQL especificada por acct.
• dbname: El nombre de la base de datos con la que se quiere comunicar.
• message: El mensaje enviado al navegador si la conexión falla.
La variable $cxn contiene información que identifica a la conexión. Se puede tener más de una
conexión abierta a la vez utilizando más de un nombre de variable. Una conexión permanece abierta
hasta que se cierre o hasta que termine el programa. Se cierra una conexión de la siguiente manera:
mysqli_close($nombre_conexión);
Selección de una base de datos
mysqli_select_db($nombre_conexión, “nombre_basedatos”) or die (“mensaje”);

Ing. David Gil
Obteniendo información de una base de datos

Se utiliza la consulta SELECT para obtener datos de la base de datos. Las consultas SELECT están escritas
en el lenguaje SQL.
$consulta = “SELECT * FROM tabla”;
$resultado = mysqli_query($nombreconexión,$consulta)
or die (“mensaje_error”);
Capturando y usando datos
Utilice la función mysqli_fetch_assoc o la función mysqli_fetch_row para obtener los datos de la
ubicación temporal. La función mysqli_fetch_assoc devuelve los datos en una matriz asociativa;
mysqli_fetch_row devuelve los datos en una matriz numérica. De vez en cuando, es posible que
necesite obtener los datos tanto en una matriz asociativa y numérica, lo que se puede hacer con
mysqli_fetch_array.
Colocando información en una base de datos

Su aplicación probablemente necesita almacenar los datos en su base de datos. Los datos se
almacenan mediante el envío de consultas SQL a MySQL.
Preparando los datos
Se necesita preparar los datos antes de almacenarlos en la base de datos. Preparar los datos implica:
• Colocar los datos en variables
• Asegurarse que los datos están en el formato específico para la base de datos.
• Limpieza de los datos.
• Escapar de datos.
Colocar los datos en variables
Puede almacenar los datos, enviándolos a la base de datos en una consulta SQL. Agrega los datos a la
consulta mediante la inclusión de los nombres de variable en la consulta. La mayor parte de los datos
que desea almacenar son tecleados por el usuario en un formulario.
Usar el formato correcto
Al diseñar la base de datos, se establece el tipo de datos para cada columna. Los datos que desea
almacenar deben coincidir con el tipo de datos de la columna que se quiere guardar. Si envía un
formato incorrecto de datos, MySQL almacena los datos, pero no puede almacenar el valor que se
esperaba.
Limpieza de los datos
Los usuarios pueden introducir datos en un campo de texto, ya sea accidental o maliciosa, que pueden
causar problemas para su aplicación, la base de datos, o sus usuarios. La comprobación de los datos y
aceptar sólo los caracteres que se espera de la información solicitada puede evitar muchos problemas.
Escapar de datos
Un usuario puede escribir información en el formulario que, cuando se utiliza en la consulta, la modifica
de modo que funciona de forma diferente a lo esperado. Algunos de estos daños a consultas se crean
mediante la manipulación de las comillas en la consulta. Se puede proteger contra este tipo de ataque,
llamado una SQL injection, para escapar de las comillas en los campos de formulario enviado. Escapar
de caracteres especiales, tales como comillas, significa colocar una barra invertida (\) delante del
carácter.

Ing. David Gil
• Greenspan, J., Bulger B. (2001). MySQL/PHP Database Applications. Foster City, USA:
IDG Books.
• Heurtel, O. (2016). PHP 7. Desarrollar un sitio web dinámico e interactivo. Barcelona,
España: Eni ediciones.
• Welling, L., Thomson, L.(2017). Desarrollo Web con PHP y MySQL (5 ed.). Madrid,
España: Anaya Multimedia.
• Valade, J. (2010). PHP & MySQL For Dummies (4 ed.). Indianapolis, USA: Wiley
Publishing, Inc.
• PHP, https://secure.php.net
• MySQL, https://www.mysql.com/
• Apache Friends, www.apachefriends.org
• The World Wide Wed Consortium, www.w3.org
• Joomla! Web Site Oficial, https://www.joomla.org/
• PHP, http://php.net/manual/es/intro-whatis.php

Ing. David Gil
Descripción:
 Crea, implementa y administra aplicación web organizacional utilizando correctamente un

sistema gestor de contenidos (CMS).

Ing. David Gil
Actividad 9: WordPress
Sistemas de Gestión de Contenidos (Content Management Systems).
Un sistema de gestión de contenidos (Content Management System o CMS) es un software que se
utiliza principalmente para facilitar la gestión de sitios web, ya sea en Internet o en una intranet, y por
eso también son conocidos como gestores de contenido web (Web Content Management o WCM).
Hay que tener en cuenta, sin embargo, que la aplicación de los CMS no se limita sólo a las webs.
Cuenta con una interfaz que controla una o varias bases de datos donde se aloja el contenido del sitio
web. El sistema permite manejar de manera independiente el contenido y el diseño.
James Robertson en su artículo “How to evaluate a content management system”, propone una
división de la funcionalidad de los sistemas de gestión de contenidos en cuatro categorías:
Creación de contenido
Un CMS aporta herramientas para que los creadores
sin conocimientos técnicos en páginas web puedan
concentrarse en el contenido.
Lo más habitual es proporcionar un editor de texto
WYSIWYG, en el que el usuario ve el resultado final
mientras escribe, al estilo de los editores comerciales,
pero con un rango de formatos de texto limitado. Esta limitación tiene sentido, ya que el objetivo es
que el creador pueda poner énfasis en algunos puntos, pero sin modificar mucho el estilo general del
sitio web.
Hay otras herramientas como la edición de los documentos en XML, utilización de aplicaciones
ofimáticas con las que se integra el CMS, importación de documentos existentes y editores que
permiten añadir marcas, habitualmente HTML, para indicar el formato y estructura de un documento.
Un CMS puede incorporar una o varias de estas herramientas, pero siempre tendría que proporcionar
un editor WYSIWYG por su facilidad de uso y la comodidad de acceso desde cualquier ordenador con
un navegador y acceso a Internet.
Para la creación del sitio propiamente dicho, los CMS aportan herramientas para definir la estructura,
el formato de las páginas, el aspecto visual, uso de patrones, y un sistema modular que permite incluir
funciones no previstas originalmente.
Gestión de contenido
Los documentos creados se depositan en una base de
datos central donde también se guardan el resto de
datos de la web, cómo son los datos relativos a los
documentos (versiones hechas, autor, fecha de
publicación y caducidad, etc.), datos y preferencias de
los usuarios, la estructura de la web, etc.
La estructura de la web se puede configurar con una
herramienta que, habitualmente, presenta una visión
jerárquica del sitio y permite modificaciones.
Mediante esta estructura se puede asignar un grupo a cada área, con responsables, editores, autores
y usuarios con diferentes permisos.
Eso es imprescindible para facilitar el ciclo de trabajo (workflow) con un circuito de edición que va
desde el autor hasta el responsable final de la publicación.
El CMS permite la comunicación entre los miembros del grupo y hace un seguimiento del estado de
cada paso del ciclo de trabajo.

Ing. David Gil
Publicación
Una página aprobada se publica automáticamente
cuando llega la fecha de publicación, y cuando
caduca se archiva para futuras referencias.
En su publicación se aplica el patrón definido para
toda la web o para la sección concreta donde está
situada, de forma que el resultado final es un sitio
web con un aspecto consistente en todas sus
páginas.
Esta separación entre contenido y forma permite que se pueda modificar el aspecto visual de un sitio
web sin afectar a los documentos ya creados y libera a los autores de preocuparse por el diseño final
de sus páginas.
Presentación
Un CMS puede gestionar automáticamente la
accesibilidad del sitio web, con soporte de
normas internacionales de accesibilidad como
WAI (Web Accessibility Initiative), y adaptarse
a las preferencias o necesidades de cada
usuario.
También puede proporcionar compatibilidad
con los diferentes navegadores disponibles en
todas las plataformas (Windows, Linux, Mac,
Palm, etc.) y su capacidad de internacionalización lo permite adaptarse al idioma, sistema de medidas
y cultura del visitante.
El sistema se encarga de gestionar muchos otros aspectos como son los menús de navegación o la
jerarquía de la página actual dentro del web, añadiendo enlaces de forma automática.
También gestiona todos los módulos, internos o externos, que incorpore al sistema. Así, por ejemplo,
con un módulo de noticias se presentarían las novedades aparecidas en otro web, con un módulo de
publicidad se mostraría un anuncio o mensaje animado, y con un módulo de foro se podría mostrar,
en la página principal, el título de los últimos mensajes recibidos. Todo eso con los enlaces
correspondientes y, siguiendo el patrón que los diseñadores hayan creado.
Tipos de gestores de contenidos
Los gestores de contenido se pueden clasificar según diferentes criterios:
Según el lenguaje de programación empleado:
• Active Server Pages,
• Java,
• PHP,
• ASP.NET,
• Ruby On Rails,
• Python,
• PERL.
Según la licencia:
• Código abierto,
• Software propietario.
Por su uso y funcionalidad
• Blogs: para páginas personales.

Ing. David Gil
• Foros: para compartir opiniones.

• Wikis: para el desarrollo colaborativo.
• Enseñanza electrónica: plataforma para contenidos de enseñanza en línea.
• Comercio electrónico: plataforma de gestión de usuarios, catálogo, compras y pagos.
• Publicaciones digitales.
• Difusión de contenido multimedia.
• Propósito general.
• Aplicación móvil: plataformas de gestión de aplicaciones móviles.
Otras clasificaciones según su funcionalidad diferencian entre contenidos empresariales (ECM),
contenidos web (WCM), documentos y contenidos multimedia (DMS) y contenidos para el aprendizaje
(LCMS).
Ventajas de un CMS
a) Los contenidos generalmente se guardan en una base de datos, lo que facilita la exportación,
catalogación o búsqueda.
b) El diseño normalmente está separado del contenido (la mayoría de CMS tiene colecciones gratuitas
de diseños que se pueden instalar y configurar fácilmente).
c) Es muy sencillo crear y actualizar una página Web. Algunos CMS tienen una curva de aprendizaje
un poco pronunciada al principio que se ve compensada con el tiempo.
d) El contenido es fácilmente escalable, y se puede estructurar en diferentes vistas según el contexto.
e) La mayoría de los CMS tienen módulos que incrementan las potencialidades del mismo,
permitiendo la inclusión de elementos multimedia y vinculación con otras herramientas.
f) Los CMS más conocidos incorporan editores de texto visuales (WYSIWYG) que facilitan la edición
de los textos.
g) Gestión de usuarios. Podemos crear diferentes usuarios según tipologías definidas en los
diferentes CMS. Algunos CMS permiten incluso definir qué puede hacer o no un tipo de usuario
según el contexto.
¿Cómo funciona un CMS?

 Primero tenemos que crear la base de datos dónde guardaremos los contenidos del CMS (algunas
aplicaciones no trabajan con bases de datos y guardan la información en archivos de texto).
 Normalmente, los CMS tienen un instalador que copia los archivos y la estructura principal sobre
la que podemos trabajar. En otras ocasiones, basta con copiar una carpeta.

Ing. David Gil
 Una vez instalado, tendremos un acceso como administrador. Con este acceso podemos crear los
diferentes tipos de contenidos que permita el CMS.
 La mayoría de CMS tienen directorios de temas y módulos para descargar e instalar, así como
paquetes de idioma para traducirlo a otros idiomas.
 Los temas, permiten cambiar gráficamente de apariencia un CMS, normalmente
guardando un conjunto de archivos en un directorio concreto.
 Los módulos son códigos desarrollados aparte del software principal y añaden
funcionalidades a los CMS. Hay cientos de módulos disponibles, si bien no todos los
módulos son plenamente compatibles con todas las versiones.
 Por último, los paquetes de idioma, nos facilitan la edición de contenidos al presentar la
interfaz de administración y edición en el idioma que deseemos. El castellano está en los
paquetes de idioma descargables en Wordpress, Drupal y Joomla.
 Si nuestro CMS está basado en open source, es posible que también podamos crear
nuestra propia traducción de un idioma, diseñar nuestro estilo gráfico propio o desarrollar
un módulo a medida.
 Una vez instalado el software y los módulos, adaptado el idioma y definido el estilo gráfico
ya podemos comenzar a trabajar.
¿Qué necesito saber antes de utilizar un CMS?

• La mayoría de CMS necesitan una base de datos (generalmente MySQL) y un servidor web (Apache)
que lea los archivos php. Deberías contar con un servidor de alojamiento que te facilite ambos. Si
optas por otro tipo de CMS deberías saber qué base de datos necesita y en qué lenguaje está
escrito para contratar un servicio de alojamiento adecuado.
• Un CMS no creará una web por sí sólo. Te proporciona una base para construirla, pero todos los
CMS tienen una curva de aprendizaje mayor o menor.
• Aunque la mayoría de los CMS permiten crear diferentes tipos de contenidos, según el tipo de web
que deseemos configurar, podemos encontrar CMS específicos. Si quiero crear un campus on-line,
seguramente será mejor opción usar Moodle, Dokeos o Claroline, si por el contrario busco crear
una red social, probaré Drupal, Joomla o Social Engine, y para blogs la mejor opción es Wordpress
o Movable Type.
• Normalmente los CMS tienen muchas más opciones que las que seguramente necesitamos para
nuestra web. Conviene que nos centremos en aprender aquello que vamos a necesitar.
• Aunque podemos crear un CMS, añadirle funcionalidades (módulos) y cambiarlo gráficamente
(temas), es posible que nuestra idea precise modificar la estructura de contenidos o hacer cambios
gráficos o bien desarrollar nuevas funcionalidades. Esto es factible, pero requiere de
conocimientos de programación y desarrollo web bastante avanzados.
WordPress
WordPress es una poderosa plataforma semántica de publicación, y viene con
una gran cantidad de características incorporadas, diseñadas para hacer tan
fácil, placentera y atractiva como sea posible la experiencia de publicar en
Internet. WordPress es un sistema de publicación personal distribuido
libremente, basado en estándares web, rápido, ligero y gratis; con una
configuración y características muy bien pensadas, y un núcleo
extremadamente personalizable.

Ing. David Gil
Características
Probado
WordPress impulsa más de una cuarta parte de los nuevos sitios de hoy, es el sistema de
administración de contenido (CMS) preferido por casi la mitad de los principales sitios que lo hacen
más popular en la web, y es confiable para los editores de contenido, tanto grandes como pequeños
incluyedo CNN y el NY Times. Con más de 50 millones de sitios en todo el mundo y 13 años de historia
probada, sabrá que está obteniendo el mejor software para el trabajo.
Fácil de usar
El núcleo de WordPress es una interfaz simple similar al software de edición de escritorio usado
actualmente. Sin necesidad de experiencia en codificación o conocimiento experto, la curva de
aprendizaje suele ser tan corta como escribir en la URL de su sitio e iniciar sesión. De hecho, la mayoría
de los usuarios pueden aprender lo básico sin ningún tipo de capacitación. Las interfaces son pulidas y
fáciles de usar, y son el resultado de años de refinamiento. Es el poder de Microsoft Word con la
intuición de un iPhone.
Creado para publicar

WordPress hace que compartir contenido y atraer lectores a su sitio sea muy sencillo. Ya sea
empujando contenido a redes sociales, asegurándose de que su sitio web esté en el formato óptimo
para aparecer en la parte superior de los resultados de búsqueda en el momento de publicar o de que
los visitantes puedan suscribirse a sub-feeds de contenido específicos en su lector de feeds favorito (o
incluso por correo electrónico), WordPress no es simplemente un sitio web, sino una plataforma de
publicación de contenido. Con un solo clic, tienes un poderoso megáfono para transmitir tu mensaje
al mundo.
Respaldado por el apoyo de la comunidad

WordPress cuenta con el respaldo de una vibrante comunidad de usuarios que ya han resuelto muchos
de los desafíos más difíciles para compartir información en la actualidad. La versión 4.6 de WordPress
se ha descargado más de 20 millones de veces desde su lanzamiento hace unos meses. Con una
biblioteca de más de 50,000 complementos y plugins gratuitos de código abierto que crecen cada día
y cientos de contribuidores principales en cada ciclo de publicación, la comunidad de WordPress es un
ecosistema creado en torno a la viabilidad de la plataforma y el éxito comprobado.
Multiple Sitio
WordPress se puede extender a la función Multiple sitio bajo demanda. Puede desarrollar y mantener
múltiples sitios usando una sola instalación de WordPress. Multisite es una característica de WordPress
3.0 y versiones posteriores que permite que varios sitios virtuales compartan una sola instalación de
WordPress. Cuando se activa la función de varios sitios, el sitio original de WordPress se puede
convertir para admitir una red de sitios.
El panel de administración
El panel de administración permite configurar las características del sitio web. En el escritorio (primera
pantalla que se ve tras iniciar sesión) se muestra información acerca de la actividad reciente en el sitio
web, así como avisos de actualizaciones o información relevante de la comunidad Wordpress. El menú
para navegar en el panel de administración se encuentra en la parte izquierda de la pantalla. Es un
menú de navegación intuitivo y flexible, permitiendo llegar a las funciones con pocos clics.
Administración de entradas
Las entradas son noticias que se mostrarán en orden cronológico inverso en la página de inicio de la
web. Normalmente son las que más se comentan, y se incluyen en el feed RSS de la web.

Ing. David Gil
Administración de categorías
Cada entrada se clasifica bajo una o varias categorías. Las categorías permiten la clasificación de las
noticias y páginas en grupos y subgrupos, de tal manera que ayuden al visitante en el navegación y uso
del sitio web.
Cada categoría puede tener una categoría “padre” para crear una jerarquía dentro de la estructura de
categorías.
Administración de etiquetas de entradas

Cada noticia se clasifica de manera opcional bajo una o varias etiquetas. A diferencia de las categorías,
las etiquetas no tienen jerarquía por lo que no hay relación de padres e hijos, pero al igual que las
categorías, los nombres de etiqueta deben ser únicos.
Administración de contenido multimedia

La pantalla de administración de contenido multimedia permite subir contenido multimedia para luego
ser utilizada en entradas y páginas.

Ing. David Gil
Actividad 10: Apariencia

Administración de temas
Los temas o las plantillas de Wordpress definen la apariencia que tendrá nuestra Web para los
visitantes. La instalación y configuración de los temas es una tarea fácil.
Wordpress viene con un reducido número de plantillas preinstaladas. La gran comunidad que se ha
desarrollado alrededor de Wordpress posibilita el uso de una enorme cantidad de temas gratuitos y
también se puede optar por adquirir plantillas profesionales, aunque esto dependerá del presupuesto
con el que se cuente.
Administración de widgets
Un widget es una aplicación adicional muy útil que te da acceso a funciones de uso habitual.
Por ejemplo, en el panel de la derecha de nuestro Wordpress, encontramos varios widgets como el de
búsqueda, entradas recientes etc. Los widgets, pueden cambiar en función de la plantilla que estemos
usando. El trabajo con widgets, es fácil e intuitivo, ya que sólo hay que arrastrarlos.
Administración de menús
Los menús son una de las partes más importantes de un sitio web. Los menús claros, con opciones
interesantes para los usuarios y que sean fáciles de utilizar son fundamentales para que los usuarios
permanezcan más tiempo en el sitio web y visiten las secciones que más interesen al creador del sitio
web.
La creación de menús y su mantenimiento en Wordpress es un proceso fácil sin embargo requiere ser
cuidadoso al momento de elegir los elementos a los que se accede desde el menú.

Ing. David Gil
Actividad 11: Usuarios

Administración de perfil de usuario
Dentro del menú de usuarios disponemos de una sección de “Perfil” que no es otra cosa que
información sobre nuestra cuenta de usuario, del usuario que en este momento esté accediendo al
panel de administración de WordPress.
Administración de usuarios
La gestión de usuarios es muy importante para un sitio web. Desde WordPress podemos crear y
administrar varios usuarios asignándole distintos perfiles o roles dependiendo de esto el usuario
tendrá mayores o menores atribuciones en el sitio web.
Administración de roles
Desde el desplegable perfil podemos determinar el rol de cada usuario, que se detalla a continuación:
• Suscriptor: son usuarios que pueden acceder a contenidos privados o solo para suscriptores.
Es un perfil ideal para webs donde se permita solo el acceso a los contenidos a usuarios
registrados, capacidad que se habilita también en el panel de administración.
• Colaborador: es cualquier usuario que pueda escribir nuevos artículos y noticias, y modificarlos.
Cualquier contenido nuevo no se publica directamente, sino que requiere aprobación de un
administrador. Ideal para blogs con muchos colaboradores y que requieran de un nivel mínimo
de calidad en las nuevas entradas.
• Autor: es otro perfil de colaborador, pero este puede publicar directamente sus escritos.
También puede subir archivos.
• Editor: es casi un administrador que, salvo las funciones propias del administrador
(instalaciones, modificación de plantillas, plugins, etc.) puede gestionar artículos y noticias de
cualquier otro usuario.
• Administrador: tiene acceso a todo en el sitio web y es quien recibe en su correo las
notificaciones de los eventos que se sucedan (nuevos comentarios, contacto, actualizaciones,
etc.). Es el encargado de las actualizaciones, instalación de plugins, cambio de plantillas y
configuración.

Ing. David Gil
Actividad 12: Páginas

Diferencia entre entrada y página
Una de las cosas que debemos saber sobre WordPress es la diferencia entre una Entrada o Post y una
Página, que aunque no es muy difícil puede llevarnos a confusión. Es necesario entender que, pese a
que WordPress es un CMS muy potente y extendido, originalmente fue concebido para generar Blogs,
y conserva esta característica, que nos proporciona ventajas adicionales sobre gestores más complejos
como Joomla! o Drupal.
Una Entrada o Post, es el contenido dinámico de nuestro sitio, característica propia del Blog. Puede ser
actualización o noticia, que permite ir actualizando nuestra web de forma cronológica, aunque
también podemos organizar las entradas por categorías, etiquetas o autores.
Una Página, es el contenido estático de nuestro sitio web, donde se muestra la información referente
a los servicios que se prestan u otro tipo de información útil a nuestros visitantes. Permite la creación
de apartados o áreas en nuestro sitio web. Las páginas se organizan mediante los elementos de menú.
En su instalación WordPress, integra una entrada de ejemplo “Hola Mundo” y una “Página de ejemplo”
en su menú principal.
Administración de páginas
Las entradas o noticias son objetos orientados en el tiempo. Se escriben en un tiempo específico, y ese
tiempo define su contexto. Ejemplos de noticias serían las actividades del mes que viene, boletín
mensual, etc.
Las páginas, por el contrario, se usan la mayor parte de las veces para presentar la información
atemporal sobre el sitio web. Ejemplos de páginas a incluir serían “Acerca de”, “Contacto”, “Copyright”,
etc.
Las páginas en WordPress, se caracterizan por:
• Son para el contenido que es menos dependiente del tiempo que las entradas.
• Pueden organizarse en páginas y subpáginas.
• Pueden usar diferentes plantillas de página que pueden incluir archivos de plantilla, etiquetas
de plantilla y otro código PHP.

Ing. David Gil
El panel de administración de WordPress permite la creación de nuevas páginas, la edición de páginas

existentes y la eliminación de páginas.
Al agregar una nueva página encontraremos un editor idéntico al que encontramos con las entradas,
aunque los paneles laterales tienen opciones distintas:
En el panel “Publicar” encontramos las opciones de “Estado” para situar la página como “borrador”,
“publicada” o “pendiente de revisión”. En “Visibilidad” establecemos quien puede ver la página.
Cada nueva página se añade un nuevo ítem en el menú principal de nuestra web. En el panel “Atributos
de la página” tenemos la opción de situar este ítem den la parte superior del menú o anidarlo dentro
de otro ítem existente.
Por defecto WordPress incluye la opción de “Comentarios” para todas las páginas, entre otros
parámetros que podemos configurar.
Administración de comentarios
En WordPress todas las entradas y páginas tienen la opción de ser comentadas por los visitantes al
sitio web, estos comentarios pueden ser administrados por el webmaster, realizando así un filtro de
los comentarios. Por defecto WordPress muestra los comentarios en su Escritorio al acceder a la
administración:
Los comentarios de usuarios no registrados se muestran en color amarillo, y los creados por los
usuarios del sistema se muestran con normalidad. También podemos acceder a ítem de comentarios
del menú de WordPress.
Al pasar el ratón sobre el comentario podemos administrar el mismo, con varias opciones como:
Aprobar, responder, editar, spam o enviar a la papelera.
En el caso de seleccionar spam el sistema bloqueará permanentemente al usuario que ha dejado este
comentario.

Ing. David Gil
Actividad 13: Plugins y herramientas

¿Qué son los plugins?
Los plugins son componentes de código, es decir, programas que se instalan en WordPress para
ampliar su funcionalidad estándar. Estos programas modifican al propio gestor. Se puede decir que
son partes de programas independientes con los cuales podemos completar y configurar la plataforma
a nuestra medida. Están hechos con las mismas tecnologías que WordPress, es decir, están
programados en PHP, y usan HTML, hojas de estilos CSS y JavaScript para la parte de interfaz de
usuario.
Diferencia entre temas (themes) y complementos (plugins)

 Un tema es una colección de archivos de plantilla que le permiten cambiar la apariencia de un
sitio web WordPress. Estos archivos gobiernan el layout, diseño y presentación sin afectar el
subyacente Software WordPress. Se puede cambiar un tema en cualquier momento sin
cambiando el software de WordPress o cualquiera de las características que aplicó a través de
plugins de WordPress.
 Un complemento es una colección de archivos que crea un programa o herramienta para
extender las características y el comportamiento de WordPress. Cualquier complemento
puede ser descargado desde el Directorio de complementos de WordPress para proporcionar
alguna nueva característica para el administrador o los usuarios del sitio de WordPress.
Cambiar un tema no debería afectar las características de los complementos aplicados y, de
manera similar, cambiar un complemento no debe afectar la apariencia de su sitio aplicado
por el tema elegido.
Se debe tener en cuenta al usar complementos o temas:
 Se puede querer cambiar el tema del sitio web, pero mantener la funcionalidad como esta. Si
se agregó todas las características del sitio web mediante el uso de complementos, no hay
problema. Si ajustó un tema para lograr algunas de las características (por ejemplo, el
seguimiento de estadísticas sobre los visitantes de su blog), esas características desaparecerán
cuando se cambia de tema.
 Si desea usar temas para proporcionar funciones para el sitio web, entonces solamente se
puede elegir temas que hagan lo que se tiene en mente. Si utiliza complementos para ocuparse
de las tareas del sitio, se puede seleccionar cualquier tema que se desee.
Complementos gratuitos y premium

Los complementos están disponibles de dos maneras:
 Plugin gratuito / plugin premium: obtienes un cierto conjunto de funciones gratis y
características adicionales por un precio. Muchas de las compañías de software más conocidas
siguen este modelo
 Soporte Premium: las compañías de software de código abierto se dan cuenta de que
problema con WordPress y software similar es el acceso a un buen soporte y, por lo tanto,
desarrollar programas de soporte premium para ofrecer acceso a buen soporte técnico por un
precio. Muchos desarrolladores de complementos y temas usan este modelo para beneficiar
a la comunidad. Con este modelo, muchos desarrolladores proporcionar un programa de
membresía donde el usuario paga una tarifa fija por adelantado para soporte por un lapso de
tiempo específico (por ejemplo, $ 50 por uno año de soporte, lo que requiere que renueve su
membresía para continuar obteniendo soporte por otro año, y así sucesivamente).

Ing. David Gil
Evaluar plugins
¿Cómo sabes que un plugin hace lo que se supone que debe hacer? Se puede evaluar un plugin de
varias maneras, pero, desafortunadamente, ninguno es infalible. La forma más confiable de saber si
un plugin es bueno es examinar el código fuente, pero no todos tienen ese tipo de conocimiento de
programación. Si eres un extraño a la programación hay algunos métodos simples para ayudar a
determinar si los usuarios de WordPress están usando un plugin exitosamente:
 Revise la popularidad del plugin. Cada complemento en el Directorio de Plugins de WordPress
muestra el número de descargas del complemento. El número podría no coincidir con la
cantidad de usuarios satisfechos, pero no es una mala medida aproximada.
Si las descargas son menos de mil, tenga cuidado, especialmente si el complemento ha estado
en el repositorio por mucho tiempo. Sin embargo, un complemento en el repositorio durante
un año y descargado solo 30 veces podría no ser un mal complemento; el complemento puede
ser una función de nicho que no sea popular.
 Revise cuando el plugin fue actualizado. Este número se muestra en el directorio de
complementos, también. Si el complemento no se ha actualizado en varios años, es posible
que ya no se mantenga, o el desarrollador dejó de soportarlo. Los buenos desarrolladores de
complementos deberían lanzar regularmente actualizaciones de sus complementos porque
WordPress no es una aplicación estática; siempre está cambiando. Los desarrolladores de
complementos deben actualizar sus complementos cuando se producen cambios importantes
en WordPress.
 Revise la versión del complemento. Si muestra Alpha o Beta en la versión, el plugin está siendo
probado y puede tener errores que podrían afectar su sitio; es posible que desee esperar hasta
que el complemento haya sido probado exhaustivamente y lanzado como una versión
completa.
La comunidad de WordPress no tiene un estándar para la numeración de las versiones de los
complementos, pero, en general, cuanto mayor sea el número de versión, más maduro (es
decir, probado y estable) es el complemento.
 Revise la cantidad de descargas por día. Se muestra en la pestaña Estadísticas de la página del
complemento. De nuevo, este no es un método infalible, pero el gráfico de descargas por día
puede indicar que las personas están usando plugin con algo de éxito.
 Use las calificaciones en la página del complemento. Puede usarse como una guía (parcial)
para lo que la gente piensa del plugin Si el promedio del complemento es de cinco estrellas,
pero es calificado solo por dos personas, este enfoque puede no ser de ayuda. Sin embargo, si
200 personas le dan al complemento cinco estrellas, se tiene una mejor indicación de que los
usuarios gustan del plugin.
Complementos (plugins) populares:
All One in SEO:

Con este plugin configuraremos la optimización SEO de nuestra Web. Además de configurarlo, cada
vez que introduzcamos una entrada nueva o incluso cuando subamos una foto, nos pedirá que
determinemos palabras clave, tags y metatags para cada una de ellas.
Akismet:
Gestiona y reduce el spam entrante a través de los comentarios de las entradas.
Broken Link Checker:

Este plugin monitoriza la Web en busca de links rotos. Busca por posts, páginas, blogroll y también en
fotos o imágenes. Avisa por mail o a través del tablero. Periódicamente comprueba los vínculos en los
mensajes, páginas, comentarios, campos personalizados y el blogroll. Además, permite editar todas

Ing. David Gil
las instancias de un enlace específico a la vez. Ofrece una lista de todos los vínculos publicados en su
sitio, con la posibilidad de buscar y filtrar y es altamente configurable.
Google Analitycs:
Realmente indispensable. Nada de lo que hacemos o tenemos pensado hacer tiene sentido si no
medimos los resultados. Este plugin enlaza directamente con la app de Google, en la cual deberemos
darnos de alta previamente.
Share & Follow:

Este plugin ofrece la posibilidad de enlazar con la mayoría de las Redes Sociales y de compartir
contenidos en ellas, actualmente goza de gran popularidad ya que Web y Redes están íntimamente
ligadas, sobre todo si se persigue una estrategia de social media.
Éstas son algunas de las posibilidades que nos ofrece:
• Adicción automática de los enlaces más populares a Facebook y Twitter, incluyendo los
botones Tweet/Retweet, con los contadores configurables.
• Ficha de seguimiento (Facebook / Rss / Twitter / etc.) a la parte superior / inferior / izquierda
/ derecha de la pantalla.
• Impresión, Navegador de Favoritos y botones de correo electrónico.
• Widget para gestionar las acciones de seguimiento.
• Versión abreviada para compartir el post o una página.
• Función de acceso para las etiquetas de tema para compartir.
• Iconos disponibles en tamaños de 16, 24, 32, 48, 60 px.
• Se puede mostrar como texto, icono o sólo texto.
• Los usuarios pueden cambiar todos los enlaces de texto a su antojo. Etc.
Contact Form 7:
Simple y flexible, eso es precisamente lo que hace grande a este plugin. Con él diseñaremos de manera
flexible formularios y podremos enviarlos. Además, soporta muchas características incluyendo la
presentación de AJAX, CAPTCHA, el filtrado de spam Akismet, carga de archivos, etc.
Aunque la implementación de un Formulario en nuestra Web, no obliga a la correspondiente
declaración bianual según la LOPD.
Google +1 Button:
Al igual que el anteriormente descrito Share & Follow, la reciente aparición de esta característica de
Google en ese afán de volverse más social ha propiciado que aparezca este plugin específico para ello,
aunque no es descartable que próximamente aparezca incluido en algunos de los ya explicados.
WP Touch:
¿Qué hace que WPtouch sea imprescindible? Pues es muy sencillo, transforma automáticamente su
blog de WordPress en una aplicación para móviles. Es compatible con iPhone, iPod touch, Android,
Palm Pre, Samsung y BlackBerry Storm, lo que le hace realmente potente ya que cada día el acceso
móvil gana posiciones.
El panel de administración te permite personalizar muchos aspectos de su apariencia, y que su carga
sea rápida, fácil y elegante, sin necesidad de modificar un solo bit de código o que afecten al tema de
escritorio. La visualización desde el móvil da la opción al visitante de nuestro blog a cambiar la
apariencia que desee entre clásica y móvil.
FeedBurner FeedSmith Extend:

Con este plugin lo que conseguimos es crear un feed o una fuente de donde beban lectores de noticias.
Hay suscriptores que son reacios a facilitar su email con el fin de que les enviemos información. Así
conseguimos que a través de Google, que adquirió el servicio feedburner en 2007, o a través de

Ing. David Gil
cualquier otro lector de noticias, cada vez que publiquemos una entrada nueva le pueda llegar de
inmediato al suscriptor sin tener que facilitarnos el mail.
De ahí su importancia, ya que es uno de los medios que tenemos a nuestro alcance para dar difusión
a nuestro blog. De poco serviría todo el esfuerzo si luego no lo difundimos.

Ing. David Gil
Descripción:
 Aplica técnicas y herramientas adecuadas para optimizar y posicionar la aplicación web

organizacional.

Ing. David Gil
Actividad 14: Posicionamiento Web (SEO)

¿Qué es el SEO?
Definición de SEMPO (Search Engine Marketing Professional Organization)
SEO (Search Engine Optimization) es la práctica de utilizar un rango de técnicas, incluidas la rescritura
del código html, la edición de contenidos, la navegación en el sitio, campañas de enlaces y más
acciones, con el fin de mejorar la posición de un web site en los resultados de los buscadores para unos
términos de búsqueda concretos.
Definición complementaria
De sus siglas en inglés (Search Engine Optimization), es la práctica de utilizar una serie de técnicas que
implican la optimización de la página (con los llamados factores on site) y su socialización en Internet
con otras páginas (los llamados factores off site) con la finalidad de mejorar la posición de un web site
en los resultados de los buscadores para unos términos de búsqueda concretos.
Estas técnicas, y su relevancia para mejorar el posicionamiento, son diversas y cambiantes en función
de la evolución continua de los buscadores.
Definición amplia e inclusiva
Estrategia y conjunto de prácticas destinadas a la captación y fidelización del tráfico proveniente de
los buscadores.
Algunas consideraciones
El SEO se integra dentro de la propia estrategia de negocio y comunicación de la empresa/institución.
Las buenas posiciones por sí solas no valen de nada, si no aportan nada a los objetivos de negocio. He
aquí, por tanto, la necesidad de integrar la estrategia SEO con el resto de actividades de marketing.
Diferencias entre SEO y SEM

Los resultados de los buscadores son de dos tipos:
• Resultados patrocinados o de pago: SEM (Search Engine Marketing)
En este caso los resultados se basan en un sistema de publicidad contextualizado referente a
uno o varios criterios de búsqueda. Es decir, los anunciantes deciden una serie de términos
que, cuando sean buscados por los usuarios, mostrarán sus anuncios. El orden de los
resultados depende de varios factores, entre los que se encuentra un sistema de pujas. El
anunciante sólo paga cuando se hace clic en uno de sus anuncios, motivo por el cual a este
sistema se le conoce también por sus siglas PPC (Pago Por Clic). Estos resultados están
identificados como publicidad. Por ejemplo, Google los identifica como “resultados
patrocinados”.
• Resultados orgánicos: SEO (Search Engine Optimization)
Los resultados orgánicos son generados por el buscador en función de su índice de resultados
y a un sistema propietario para asignar la relevancia de los mismos por medio de un proceso
algorítmico. En este caso no se paga nada en concepto de publicidad, y aparecer en los
primeros resultados depende de seguir una serie de técnicas que forman la disciplina SEO.
La diferencia más importante entre ambos sistemas radica en que un anunciante puede asegurarse,
de manera aproximada, el estar en los resultados del buscador con sus campañas de Pago Por Clic,
mientras que nadie puede asegurar estar en la primera posición en los resultados orgánicos, ya que
depende al 100% del algoritmo del buscador, así como de los cambios y modificaciones que se van
introduciendo en dicho algoritmo.
Por otra parte, es importante resaltar que no existe ninguna interrelación entre los resultados de los
enlaces patrocinados y los resultados orgánicos.

Ing. David Gil
Ventajas de ser visibles en buscadores

La diferencia de la visibilidad con buscadores frente a otros modelos de publicidad en Internet es que
el usuario busca de forma voluntaria un servicio, producto o información. Se asemeja a la búsqueda
de información en las páginas amarillas tradicionales. Esto significa que la búsqueda responde a una
necesidad y que, en algunos casos, puede suponer el inicio de un proceso de compra, ya sea en su fase
de información, comparación o decisión final.
Estar en el sitio y momento adecuado en función de un término de búsqueda adecuado puede
convertirse en una oportunidad clara de negocio.
El SEO permite controlar, dentro de lo incontrolable (nadie puede asegurar un posicionamiento fijo en
los buscadores), la posibilidad de aumentar las opciones de ser visible y de que se convierta en el
primer paso para reconducir búsquedas en procesos de compra, apoyados por otras disciplinas como
la analítica Web y la optimización de páginas de aterrizaje, para que, en la medida de lo posible, se
pueda capitalizar esa visibilidad.
¿Cómo funcionan los buscadores?
Para entender cómo funcionan los buscadores podemos hacer una comparación con el
funcionamiento en la publicación de artículos científicos o tesis doctorales en el ámbito de la
investigación.
La relevancia de un artículo se basa en la importancia (popularidad + especialización) del medio donde
se ha publicado, así como en las menciones que otros colegas han hecho sobre ese artículo.
Los buscadores utilizan el mismo principio: primero rastrean la Red en busca de contenidos, que en
volumen suponen miles de millones de documentos, los indexan y los clasifican para luego calcular la
popularidad por el mismo principio, pero con base en los enlaces. Es decir, el número de enlaces que
apuntan a una página y la calidad de las mismas (en función de la temática y relevancia de esas páginas).
Para el rastreo los buscadores van siguiendo los enlaces existentes y estableciendo relaciones entre
las diferentes páginas.
Estos procesos de recuperación de la información son multiformato. Es decir, se pueden aplicar a
distintos tipos de documentos como imágenes, vídeos, mapas, noticias, documentos PDFs…etc.
Los tres pilares del SEO

El trabajo SEO se centra en tres grandes áreas:
Indexabilidad
Hace referencia a la capacidad de una web de ser accedida en su totalidad y de forma apropiada por
los robots de los buscadores, permitiendo que sea almacenada en los índices de dichos buscadores.
Cuando una web se indexa correctamente existe una correspondencia entre los contenidos existentes
en la web y los almacenados por el buscador en su índice. Al número de páginas de nuestro sitio web
accesibles a los buscadores se le conoce como “número de páginas indexadas” y conviene maximizarlo
para que sea igual al número de páginas existentes en nuestro sitio web.
Los buscadores ofrecen información acerca del número de páginas que tienen almacenadas de cada
sitio web, lo que permite la comparación entre páginas existentes y páginas almacenadas en el
buscador.
Algunos de los problemas principales que se pueden detectar son:
• Tecnologías no entendidas por buscadores
Los buscadores acceden a nuestras páginas a través de navegadores propios que no son
capaces de ejecutar algunas órdenes. Así pues, y a pesar de los avances hechos los buscadores,
todavía tienen problemas para acceder a contenidos hechos con tecnología Flash o que
requieran de la ejecución de código javascript.

Ing. David Gil
• Contenidos no enlazados o muy profundos

Los buscadores acceden a los diferentes contenidos siguiendo enlaces. Si un contenido no está
enlazado o hay que seguir muchos enlaces para acceder a él, los buscadores pueden tener
problemas para acceder a dicho contenido.
• Problemas de servidor
Redirecciones inapropiadas, un tiempo muy lento de respuesta o la caída de un servidor
pueden originar problemas de indexación o pérdida de páginas indexadas.
Contenido
Una vez el buscador ha accedido e indexado nuestros contenidos, se trata de hacerlos relevantes para
determinadas búsquedas. Así pues, dichos contenidos han de contener los términos que queremos
posicionar en los lugares del documento más importantes y un número apropiado de veces.
Algunas recomendaciones a considerar son:
o Tener en cuenta el lenguaje del usuario. Muchas veces la terminología del usuario es diferente
a la utilizada internamente en la empresa/institución.
o Generar contenidos adaptados a las diferentes tipologías de búsquedas. Es complicado
optimizar una página para muchas palabras, por lo que se recomienda utilizar diferentes
páginas para captar tráfico de diferentes páginas.
o Combinar el contenido con las etiquetas HTML apropiadas para dar al documento una
jerarquía de contenidos fácilmente entendible e incluyendo los términos que más nos interese
posicionar en lugares predominantes.
Popularidad.
Hace referencia al número de veces que nuestro sitio web es enlazado, como la calidad y tipo de
sitios que nos enlazan.
Otra forma de organizar las actividades SEO es la división entre técnicas offsite y técnicas onsite.
Técnicas onsite vs Técnicas offsite
Técnicas onsite
Son aquellas mejoras que se llevan a cabo dentro del propio sitio web. Hacen referencia, por tanto, a
aspectos que controlamos plenamente, como pueden ser optimizaciones de código, procesos de
servidor y generación / edición del contenido dentro del sitio web. He aquí algunos de los aspectos
que tratan estas técnicas.
Arquitectura y Usabilidad: para asegurar la correcta indexación por parte de buscador, encontrar y
guardar en su base de datos todas las páginas; son los aspectos de indexabilidad.
Algunos ejemplos:
 Disponer de una sección “mapa web” para asegurar el fácil acceso de los buscadores a las
diferentes secciones de nuestra página.
 Configurar el archivo sitemaps, que sirve para proporcionar a los buscadores el listado de
páginas que forman nuestro sitio web.
 Generar una estructura de enlaces internos que favorezca el acceso a toda la información de
nuestra web.
 Comprobar que las tecnologías utilizadas para la creación de la web son accesibles a los
buscadores.
Optimización del Contenido: para asegurar la correcta interpretación y clasificación de los contenidos
por parte del buscador (aspectos semánticos).

Ing. David Gil
Algunos ejemplos:
 Libro de estilo: etiquetar los títulos y descripciones de cada una de las páginas en función de
su contenido, teniendo en cuenta las palabras clave más importantes.
 Localización de las palabras clave
 Densidad de las palabras clave
 Análisis de tendencias y estacionalidad de los contenidos.
 Análisis de oportunidades; contenidos muy demandados, pero con poca competencia.
Aspectos relacionados con la Infraestructura: para asegurar la configuración, conectividad y respuesta
del servidor en función de unos estándares (aspectos de optimización de la infraestructura)
Algunos ejemplos:
 Velocidad de respuesta
 Robot.txt
 Redireccionamientos
 Geolocalización de IPs…etc
Técnicas offsite
Para el posicionamiento de un sitio web existen factores offsite, localizados fuera de nuestra web.
Hacen referencia fundamentalmente al número de veces que nuestra web es enlazada, el tipo de sitios
(en temática) y los términos incluidos en dichos enlaces. Es la conocida como “popularidad” de un sitio
web.
La popularidad depende de:
 Número de enlaces
Cuanto mayor sea el número de enlaces apuntando a nuestro sitio web, mayor será la
popularidad. Es conveniente que los enlaces apunten a diferentes secciones de nuestra web y
no sólo a la home o inicio.
 Calidad de los sitios web que nos enlazan
Los enlaces de sitios más populares o de calidad contrastada tienen mayor importancia que
webs de menor popularidad. Es decir, los enlaces de webs populares, muy referenciadas y con
una antigüedad considerable, tienen más importancia que webs recientes y poco
referenciadas.
 Antigüedad de los enlaces
Los enlaces van ganando importancia con el paso del tiempo. Es decir, proporciona más
popularidad un enlace que permanece activo desde hace dos años, que un enlace que lleva
una semana.
 Tipo de contenido de los sitios web que nos enlazan
Los enlaces de sitios con contenido afín tienen más importancia que enlaces de sitios web con
poca relación a nivel de contenidos.
 Los textos de los enlaces a nuestra web
Todo enlace tiene un texto que podemos leer, conocido como “anchor text”. Los enlaces con
un determinado “anchor text” hacen las páginas más relevantes para las búsquedas con ese
texto.

Ing. David Gil
 Enlaces entendibles por los buscadores

Los enlaces han de estar hechos con tecnologías entendibles por los buscadores. Debido a la
importancia de los enlaces y el abuso que se ha hecho de ellos en sitios web donde era posible
generarlos, los buscadores crearon una etiqueta HTML conocida como “nofollow” que indica
que ese enlace no tiene valor para los buscadores.
SEO White Hat Vs SEO Black Hat

Siendo conocidos algunos aspectos que afectan al posicionamiento se ha llegado a puntos de exceso y
sobre optimización para buscadores que acaban por mostrar en buscadores páginas poco relevantes
para los usuarios en los resultados de esas búsquedas. Es por ello que los buscadores realizan labores
de mejora y con ello eliminan algunas páginas que aplican ciertas prácticas, basadas en la optimización
exclusivamente para los buscadores, pero sin beneficio para el usuario. Existe una práctica aceptada,
efectiva y legítima para lograr optimizar el tráfico de buscadores siguiendo las directrices de los
buscadores, conocido como “White Hat SEO”.
Por otro lado, existen una serie de técnicas conocidas como “Black Hat SEO” y penalizadas por los
buscadores al violar sus directrices, como por ejemplo haber pagado por enlaces o mostrar contenido
diferente a los buscadores que a los usuarios. Si bien cada vez existen técnicas más avanzadas y que
estas prácticas pueden generar resultados a corto plazo, es una estrategia muy arriesgada que acaba
en penalizaciones por parte de los buscadores que trabajan por poder ofrecer mejores resultados a
sus usuarios.

Ing. David Gil
Actividad 15: Herramientas SEO

Metodología y proceso del SEO
FASE I–Descubrimiento del Cliente
Objetivos y características del negocio
Como parte de la estrategia de marketing de la empresa, el SEO debe atender a los objetivos que ésta
tenga estipulados y seguir la misma línea para llegar al público objetivo. En tal sentido el primer paso
para definir un proyecto SEO con éxito es conocer los requerimientos del cliente y qué desea lograr
con el desarrollo del mismo. Para ello, se debería establecer una reunión introductoria en la que el
cliente pueda estipular cuáles son sus necesidades y el analista pueda conocer las características de su
negocio. En dicha reunión se debería responder como mínimo a las siguientes preguntas:
1. ¿Cuáles son los objetivos de marketing de la empresa?
2. ¿Cuál es la línea comunicativa que se sigue?
3. ¿Qué acciones de marketing online y offline está llevando a cabo o se han realizado en el
último año?
4. ¿Se trata una nueva página web o de una página web ya existente? En caso de una página ya
existente, ¿se trata de un rediseño?
5. ¿Cuáles son los principales competidores de la empresa?
6. ¿Qué se espera de aplicar una estrategia SEO? ¿Con qué métricas se desea comprobar la
eficacia de la estrategia SEO?
7. ¿Se cuenta con un equipo para el desarrollo y mantenimiento de la página web o se
subcontrata el servicio?
8. ¿Se posee un equipo o persona dedicada a la producción de textos corporativos? ¿Su
dedicación es online y también offline?
Análisis de la web
Una vez establecidos los objetivos del cliente se procede a revisar la página web para detectar
cualquier elemento en su definición y contenido que estén afectando a la efectiva indexación por parte
de los buscadores. En líneas generales lo que se analiza del sitio web está en estrecha vinculación con
los pilares fundamentales del SEO, que como hemos visto anteriormente son el aspecto técnico de la
web, los contenidos y las referencias desde otros sitios web.
Se parte por analizar los elementos técnicos, entre los que se encuentran entre otros:
 Presencia de JavaScript o Flash en exceso ya que estas tecnologías no pueden ser rastreadas
fácilmente por los buscadores.
 Errores en la programación que afecten el desempeño de la página.
 Programación de enlaces sin atributo title o con rutas relativas.
 URLs poco amigables, con una gran cantidad de parámetros o sin hacer referencia al contenido
real de la página a la que definen.
 Estructura del sitio web, características del dominio y servidor que lo aloja.
 Tiempos de carga de las principales páginas.
Con respecto al contenido se evalúa tanto la relevancia de la información que se presenta, como que
ésta siga la línea comunicacional y de los objetivos que persigue la organización. No se trata sólo de
detectar las palabras clave por las cuales realizan las búsquedas nuestros clientes, sino asociar nuestros
contenidos a dichas búsquedas de forma coherente y con una finalidad en mente.

Ing. David Gil
Finalmente, en lo que respecta a la valoración de la popularidad del sitio web se evalúan los enlaces
que están llegando a la página del cliente, no sólo atendiendo a la cantidad sino a la calidad de las
referencias, analizando factores como el PageRank del enlace, temática del sitio que apunta al del
cliente y, por tanto, grado de afinidad con lo que éste desea comunicar.
FASE II–Análisis de Palabras Clave
Con las características del cliente y su negocio en mente, se procede a hacer un análisis de los criterios
de búsqueda del sector, para lo cual se realiza un análisis de palabras clave vinculadas al área de acción
del cliente y además una investigación de las características principales de su competencia. En este
punto cabe destacar que el cliente puede tener un conjunto de competidores detectados en el ámbito
de su negocio que no necesariamente se corresponden a su competencia online.
Estudio de palabras clave
Se trata de detectar el conjunto de palabras clave que interesan al público objetivo y que además están
en consonancia con la línea comunicativa y de marketing del cliente. El proceso a grosso modo que se
sigue es:
1. Determinación del campo de acción. Obtener palabras clave candidatas y las líneas a seguir en
la definición de las palabras clave atendiendo a:
a. Objetivos del negocio.
b. Lista de palabras clave propuestas por el cliente de acuerdo a su conocimiento de
productos/servicios y líneas de comunicación de la empresa.
c. Palabras clave incluidas en campañas de PPC.
d. Palabras clave de acceso al sitio web obtenidas a partir de las herramientas de analítica
web.
e. Palabras clave sugeridas por herramientas gratuitas o propietarias.
f. Palabras clave utilizadas por la competencia.
g. Contenido del sitio web del cliente.
2. Construir un listado amplio de palabras clave atendiendo a la información recabada en el
punto 1, haciendo uso de herramientas de estimación de tráfico potencial que pueden generar
estas palabras y observando el nivel de competencia que tiene cada una.
3. Sobre ese listado comenzar a realizar revisiones con el cliente y llegar a un listado final de
optimización acorde al tamaño de la página del cliente y su capacidad de generación de nuevo
contenido.
4. Tras cerrar este listado se deben realizar revisiones periódicas atendiendo a cambios en las
tendencias de búsqueda o lanzamientos de servicios y productos que deben ser considerados
en el proceso de optimización e incluirse por tanto en el listado de palabras clave.
Análisis de competencia
Con esta actividad se pretende obtener una visión de qué hace la competencia y cómo el cliente puede
tomar partido de la situación para lograr mayor visibilidad que ésta. Se parte por determinar con las
palabras clave que serán objeto de optimización, quiénes son los principales actores online y en
conjunción con los competidores detectados por el cliente, que generalmente obedecen a su ámbito

Ing. David Gil
de negocio, extraer un listado de competidores de los que se analizará visibilidad y factores técnicos
que favorecen su posicionamiento, además de llevar a cabo un análisis benchmarking para determinar
las buenas prácticas que están aplicando y pueden extrapolarse a nuestro cliente.
FASE III–Optimización de Contenido
Análisis de contenidos actuales del sitio
Los buscadores hacen especial énfasis en el contenido del sitio a la hora de indexar las páginas.
Se comienza por hacer un análisis del contenido actual del sitio:
 Recorriendo todas las páginas y haciendo un estudio de las palabras clave que se podrían
utilizar en cada caso dependiendo de los conceptos e ideas expresadas.
 Asegurándose de que ese contenido es único. Es decir, que ese contenido no sea copiado de
otra página web. Ofrecer contenidos únicos es un criterio muy importante para el
posicionamiento de una página web.
Para cada página existe una palabra clave primaria que engloba la idea principal, y alrededor de nueve
palabras clave secundarias que guardan relación con el resto de los conceptos expresados.
Por una parte, debe serle relevante al usuario –que debe ser el actor más importante a considerar al
escribir el contenido– al tiempo que debe seguir una estrategia de redacción idónea para facilitar su
indexación por parte de los buscadores.
Teniendo en mente al usuario, el contenido debe:
 Estar escrito con claridad y coherencia, siguiendo a cabalidad las reglas gramaticales y
ortográficas del idioma y en correspondencia con la estrategia comunicacional establecida por
la empresa.
 Ser de utilidad al usuario, proporcionándole datos e información real y que le puedan resultar
beneficiosos o de interés. No se trata sólo de captar la atención del usuario en primera
instancia, sino de mantenerla. Para esto se debe ser empático y ponerse en el lugar del que
está buscando la información, y qué podría resultar interesante saber acerca del tema.
 Referirse al tema principal de la página, enlazando a contenidos relacionados en la misma web
cuando sea posible. Los enlaces dentro del mismo sitio web se conocen como netlinking
interno y son de gran importancia para mantener al usuario enganchado.
 Hacer buen uso de la estructura y el diseño del sitio, siguiendo la jerarquía lógica de la
información en la página.
 Ir en concordancia con la estrategia de palabras clave propuesta para el sitio y para la página
en específico.
Para los buscadores debe:
 Lograr de forma natural, una repetición óptima de las palabras clave que se quieren posicionar
para esa página. Aquí yace uno de los grandes retos en cuanto a generación y optimización de
contenidos se refiere, ya que queremos potenciar las palabras clave sin ir en detrimento del
contenido del sitio.
 Hacer buen uso de la estructura y el diseño del sitio, siguiendo la jerarquía lógica de la
información en la página. Típicamente, el título de la página debe ir en la etiqueta h1 y los
subtítulos en las etiquetas h2, h3 y sucesivamente dependiendo de la relevancia.
 Tratar de potenciar la estrategia de netlinking interno, haciendo referencia, cuando sea
posible, a otras páginas dentro del mismo sitio.
Todas las decisiones descritas anteriormente, deben estar apoyadas en un cuidadoso estudio del
ámbito de negocios de la compañía y los objetivos trazados al principio de las acciones SEO.

Ing. David Gil
Definición de metaetiquetas y título

Las metas son etiquetas de configuración que le dan información adicional a los buscadores sobre las
páginas. Los títulos (identificados con la metaetiqueta “title”) aparecen usualmente en la parte
superior del navegador. Lo más recomendado es que esté compuesto por la palabra clave primaria
junto con el nombre de la página. Se coloca la palabra clave primaria de primero para darle mayor
relevancia ya que generalmente el nombre de la página o empresa tiene suficiente peso gracias a la
URL.
La descripción (escrita en la metaetiqueta “description”) debe ser única para cada página y debe llamar
a la acción. Es la información que por lo general despliegan los buscadores para describir el contenido
de la página sin que el usuario tenga que acceder a ella por lo que no se recomienda que sea muy
extensa.
Otras etiquetas importantes son las que tienen que ver con la organización y jerarquía del contenido
en cada página. Las demás etiquetas se escriben dándole relevancia a los demás subtítulos de la página
en orden decreciente de importancia.
Revisión de textos
Los textos redactados por el equipo editorial del cliente son revisados para constatar que se hayan
aplicado las recomendaciones pertinentes, ofreciendo alternativas puntuales en caso de no ser posible
la aplicación de las mismas.
FASE IV–Popularidad
Determinación de situación actual
Existen diversas maneras de determinar la popularidad de un sitio web. Lo mejor es contar con alguna
herramienta de medición de tráfico, que proporcione datos exactos de las visitas que la página ha
recibido.
Existe una gran cantidad de herramientas, tanto gratuitas como de pago, con las que se pueden
obtener estadísticas de uso del sitio por parte de los usuarios. De acuerdo a la estrategia SEO acordada
con el cliente, se puede hacer un análisis para conocer qué herramienta es mejor para los propósitos
y objetivos de la estrategia.
Algunas de las herramientas más utilizadas son Google Analytics, Piwik, QuantCast, AFS Analytics, etc.
Así como la calidad y estructura del contenido de las páginas pueden hacer que un sitio posicione mejor,
la popularidad de los sitios web viene dada en buena manera por la cantidad de enlaces que otras
compañías y sitios web hagan a nuestro sitio. A esto se le conoce como netlinking externo.
Cuantos más enlaces a nuestro sitio tengamos, mayor será la importancia que le darán los buscadores.
Es importante aclarar que no todos los enlaces que hacen las demás páginas tienen el mismo peso.
Esto viene dado por la popularidad en Internet de la página que hace el enlace, siendo de más calidad
cuando la empresa o página tiene buena reputación. De hecho, una página con mala reputación puede
hacer que nuestro sitio baje su popularidad, por lo que es de suma importancia buscar enlaces de
calidad.
Google mide la popularidad de cada sitio utilizando un número llamado “PageRank” generado por
ellos mismos utilizando un algoritmo especial que analiza los enlaces que se hacen a cada sitio de
Internet y quién los hace. La puntuación más baja que puede obtenerse es 1 y la más alta 10.
El PageRank refleja nuestra visión sobre la importancia de las páginas web, considerando más de 500
millones de variables y 2 mil millones de términos. Las páginas que consideramos importantes reciben
un PageRank más alto y son más propensas a aparecer en el tope de los resultados de búsquedas.
El PageRank también considera la importancia de cada página que da un voto, ya que se considera que
los votos de ciertas páginas tienen más valor, por tanto, dándole a la página enlazada mayor valor.”

Ing. David Gil
Cuantos más sitios relevantes y de calidad creen vínculos a nuestro sitio, mejor posicionamiento
obtendrá.
Es importante verificar que el enlace no contenga el atributo “nofollow” ya que, de tenerlo, no cuenta
en la evaluación de nuestro sitio.
Estrategia de Netlinking Externo
Dependiendo de la estrategia SEO diseñada y el tipo de empresa, se pueden tomar varias acciones
para aumentar el número de enlaces apuntando nuestro sitio.
Cabe destacar que en este ámbito no hay nada definido a rajatabla y dependerá mucho de la capacidad
creativa de cada persona orientada a la industria en la que se mueve la empresa o el tema de la página,
siempre teniendo en cuenta que se quiere generar ruido y hacerla visible a la mayor cantidad de
internautas.
Típicamente,
o Envío de URL a directorios
Los directorios son portales en Internet que agrupan páginas web por contenido. Para
aparecer en ellos, se deben remitir los datos del sitio web manualmente. Muchos buscadores
se apoyan en el contenido de los directorios para indexar nuevas páginas, y, si los directorios
tienen buena reputación (de al menos 3 de PageRank), ayudan a subir la reputación de nuestro
sitio. Hay que hacer una selección cuidadosa de la categoría donde se va a introducir la web,
ya que, de no cumplir los requisitos que el directorio exige, no se agregará.
Los directorios más importantes son dmoz y Yahoo! Luego, existen muchos otros por país, por
mercado, por tema, etc.
o Optimización de notas de prensa
Siguiendo la línea comunicativa de nuestra empresa, se pueden elaborar artículos informativos
optimizados que se pueden suministrar a cadenas de prensa digital.
o Medios sociales
Es indudable la importancia que tienen en la actualidad los medios sociales para generar ruido
en Internet. Con una apropiada estrategia de medios sociales, se puede incrementar la
visibilidad de la página web en Internet y lograr, de forma natural, enlaces a nuestro sitio
generados por usuarios target, que a su vez podrán tener un efecto multiplicador de
distribución informativa.
Para ello, se puede colaborar en blogs y foros que traten temas relacionados con nuestra
industria y en donde podamos ofrecer información novedosa e interesante, que capte la
atención de nuevos usuarios.
Para que el trabajo de NetLinking sea exitoso, tiene que ser un proceso continuo y paulatino. Es una
labor mensual que ha de ser planificada durante varios meses. Aumentos bruscos del número de
enlaces externos puede tener un efecto improductivo. Los buscadores pueden no tomar en cuenta
esos enlaces a la hora de calcular de nuevo la popularidad de un sitio web.
FASE V–Seguimiento
Una vez llevadas a cabo las labores de optimización de los aspectos técnicos del sitio web, los
contenidos del mismo y, teniendo en proceso la estrategia de Netlinking externo descrita en el punto
anterior, se procede a llevar a cabo el proceso de seguimiento en el que se reporta al cliente la
evolución mes a mes de las métricas determinadas en la FASE I del proyecto. Si en dichos reportes se
observan desviaciones con respecto a los objetivos que se desean alcanzar, se procede a estudiar el
caso y proponer al cliente planes correctivos pertinentes para recuperar la línea evolutiva deseada.

Ing. David Gil
Recomendaciones de buenas prácticas en SEO

En el SEO todas las partes trabajan para presentar información relevante y de alta calidad a los usuarios,
que son los buscadores de información. Debido a la propia naturaleza de la actividad y a la personalidad
de empresas y profesionales, existen diferentes aproximaciones para conseguir resultados. Es decir,
dentro de la propia actividad normal, puede existir una predisposición a tratar mejor a los usuarios, a
los motores de búsqueda o a los clientes.
No olvidemos que el SEO es una actividad remunerada, donde una parte cobra por conseguir el rango
más alto para su cliente y por lo tanto puede tener efectos muy positivos para su actividad online. En
esta situación es fácil que ocurran conflictos de intereses. Al igual que ocurre en otras muchas
actividades, el asunto es conseguir el equilibrio entre las partes y cumplir una serie de principios
básicos, para lo cual sugerimos estos puntos de buenas prácticas para todos los agentes del sector.
En este texto, SEO se refiere tanto a la propia actividad de optimización para los motores de búsqueda,
como a los individuos y empresas que profesionalmente se dedican a tareas/prácticas de SEO.
1. En la realización de los procesos y trabajos de SEO no se dañará intencionadamente al cliente. Es
decir, no se emplearán de forma continuada ninguna tecnología o procedimiento conocidos que
usados sin la debida atención puedan resultar en la exclusión de la web del cliente de los índices
de los motores de búsqueda o directorios o hacerla inoperativa. El cumplimiento cuestionable de
los estándares debe hacerse vía el Robots Exclusion Standard.
2. Los SEO aplicarán y seguirán todas las reglas publicadas o impuestas por los motores de búsqueda
o directorios. Si, como sucede a menudo, las reglas y guías cambiaran, el SEO tomará acción
rápidamente para aplicarlas según proceda para cada cliente. Cuando estas reglas y guías no estén
claras, el SEO buscará información y esperará aprobación del motor de búsqueda correspondiente,
antes de continuar usando tecnologías o procedimientos potencialmente dañinos.
3. El consumidor/usuario no será intencionadamente engañado u ofendido por el SEO. Ningún
individuo que esté utilizando un motor de búsqueda será engañado por la información presentada
al motor de búsqueda o dañado u ofendido al llegar a la web del cliente. Esto incluye técnicas como
la utilización de “bait and switch” (presentar cebo y luego ofrecer otra información) donde la
página del cliente no contiene o no está claramente asociada a los términos de optimización o
puede resultar ofensiva para los visitantes objetivo.
4. Los trabajos de SEO se harán respetando la legislación vigente y con especial atención a los
derechos de propiedad intelectual, copyright, marcas registradas y/o de servicio y leyes
relacionadas con el spam que puedan existir a nivel nacional o internacional.
5. El contenido de la web del cliente no se representará de manera falsa. Esto incluye la práctica de
presentar diferentes versiones de páginas web a usuarios distintos, excepto cuando la información
se altera con el único propósito de cumplir las especificaciones y necesidades del navegador,
sensibilidad a factores regionales como idioma o necesidades específicas del producto. En
particular se evitarán las técnicas llamadas de cloaking vs las llamadas IP Delivery que se sí se
aceptan como lícitas. En general, todas las solicitudes de una URL específica deberán ser servidas
en idéntico html por el servidor web.
6. El trabajo SEO que se haga para un cliente será original y personalizado. No se harán copias
textuales del trabajo de otros (en vez de realizar trabajo original), sin el consentimiento previo de
todas las partes.
7. Las empresas y profesionales establecidos y reconocidos en el sector no falsearán sus propias
habilidades, educación, formación, estándares de resultados, certificaciones, afiliación a grupos
del sector, bagaje técnico o experiencia. Esto incluye declaraciones relacionadas con calendarios
(cronogramas) de proyectos, historial de resultados, recursos de la compañía (empleados,
equipamiento, productos propietarios) y lista de clientes. Las garantías estarán restringidas a los
elementos y prácticas sobre los que el SEO tiene un control razonable.

Ing. David Gil
8. Cuando exista en un conflicto de intereses entre clientes no se realizará ningún trabajo sin la
comunicación previa a todas las partes involucradas. Esto incluye la práctica de mejorar (a
propósito) a un cliente sobre otro en términos competitivos para así obtener más beneficio para
el SEO. Todos los clientes se deben tratar por igual y recibirán el mismo esfuerzo en su optimización
para los motores de búsqueda.
9. En los trabajos de SEO no se ofrecerán expectativas poco razonables al cliente, ni garantías falsas
de posicionamiento en buscadores, exceptuando el caso en que los objetivos sean requisito
indispensable para el cobro del servicio. Esto incluye la práctica de aceptar más de un número
razonable de clientes competiendo por los mismos términos e insinuando que todos estarán en
las posiciones primeras de los motores de búsqueda. También incluye la presunción de que los
resultados pueden obtenerse en periodos no razonables de tiempo, dadas las conocidas
condiciones de los motores de búsqueda, la web del cliente y la competencia.
10. Todos los SEO ofrecerán a los clientes procedimientos de resolución de conflictos tanto internos
como externos. Esto incluye la publicación en la web del SEO de su dirección y teléfono y la
inclusión de links de terceras partes para la resolución de conflictos, además de incluir en los
contratos de proyectos cláusulas de resolución de conflictos.
11. Todos los SEO protegerán la confidencialidad y anonimato de sus clientes con vistas a la
salvaguarda de la información privilegiada y de los elementos que implican recomendaciones de
apoyo para el SEO. Todo el personal será responsable de la protección de la información que no
sea de dominio público y que pueda dañar al cliente. Los SEO no incluirán la publicación de
recomendaciones y logos propietarios de clientes, notas de prensa y otros materiales colaterales
sobre el cliente sin la previa aprobación explícita por parte del cliente.
12. Todos los SEO trabajarán con sus mejores habilidades para incrementar o mantener el ranking de
sus clientes, tratando de dirigir la mayor cantidad de tráfico cualificado hacia la web del cliente.
Los clientes contratarán al SEO por unos honorarios para obtener y mantener la posición en el
motor de búsqueda. El SEO tiene la obligación de utilizar las tecnologías y metodologías permitidas
y apropiadas para incrementar o mantener el ranking de los clientes frente a los cambios de la
tecnología de los motores de búsqueda, la competencia y las necesidades de la web del cliente.

Ing. David Gil
Actividad 16: Google AdWords

Introducción a Google AdWords
Google AdWords es la plataforma de Google que se utiliza para gestionar las campañas de anuncios en
los medios que tiene disponibles. Básicamente existe dos grupos de soporte dónde aparecen los
anuncios. Por una parte, las páginas que son propiedad de Google, como su buscador, la comunidad
de vídeos de Youtube, Gmail, Google Maps, etc. Y por otra, en un gran conjunto de páginas web,
aplicaciones para móviles y contenido de vídeo denominada red de anunciantes asociados. Este
conjunto de anunciantes asociados proviene de programas como Google AdSense o los sitios de
editores de DoubleClick Ad Exchange y su número se cuenta por millones.
AdWords es una herramienta publicitaria online desarrollada por Google en el año 2.000, con el
objetivo de ofrecer la posibilidad a cualquier usuario de publicitarse de una forma patrocinada en
Internet, más concretamente, en Google. Este sistema publicitario se basa en una estrategia de pujas
entre los anunciantes. Cada uno determina la cantidad que está dispuesto a pagar y, si gana la subasta,
será mostrado. Es una herramienta que cuenta con millones de clientes en todas las partes del mundo,
y cuya intención es la de anunciarse de una manera relevante a través de los resultados de búsqueda
que ofrece Google en la SERP, para así aumentar su cartera de clientes y su visibilidad en la red. Es
junto a Google AdSense una de las mejores herramientas para conseguir sacar rentabilidad a tus
proyectos en Internet.
La filosofía de Google para la plataforma es que los anunciantes obtengan un ROI positivo con las
campañas de publicidad, por ello establece unas estrategias de puja (pago por la publicidad) que
puedan ser atractivas y rentables para el anunciante. En general, todas las campañas funcionan
mediante la estrategia de puja coste por clic (CPC), aunque existen variantes como el CPC avanzado,
coste por visionado (CPV) para vídeos. También existen otras estrategias como el coste por mil (CPM)
para campañas de display o coste por adquisición (CPA).
Además, Google AdWords establece un sistema de calidad dentro de la plataforma que se utiliza para
calcular el coste de la publicidad y la posición dónde se ubican los anuncios. Por ejemplo, es posible
que un anunciante que pague un CPC de 0.10€ tenga los anuncios en una posición mejor que otro
anunciante que pague 0.20€ de CPC debido a la calidad de los anuncios.
AdWords establece un sistema de calidad que premia a los anunciantes con mayor ranking, obteniendo
mejores posiciones de anuncio a menor precio que otros anunciantes.
Ventajas de Google AdWords

Para conseguir obtener tráfico, AdWords es una solución muy efectiva, ya que tiene ciertas ventajas
sobre otras estrategias de atracción de tráfico, como son las siguientes:
• Genera tráfico de forma inmediata
Lograr buenas posiciones en los resultados naturales para las búsquedas más rentables implica
una inversión considerable de esfuerzo y paciencia. Y, aun así, los resultados para un sitio Web
recién publicado pueden tardar en alcanzarse. Por el contrario, una campaña de Google AdWords
comienza a producir tráfico cualificado de forma inmediata. Si necesita visitas en un dominio recién
lanzado de hoy para mañana, una campaña de Google AdWords puede ser la estrategia más
recomendada para arrancar su negocio, mientras trabaja en SEO para conseguir buenas posiciones
a medio y largo plazo, y va construyendo una base de datos para desarrollar más adelante
estrategias de fidelización y venta cruzada.
• AdWords es modulable
Mientras que el posicionamiento natural es una estrategia que tiene una gran inercia (implica
tiempo tanto para conseguir buenas posiciones como para perderlas) AdWords permite, de una
forma muy flexible, modular el tráfico que deseamos generar durante un periodo muy
determinado de tiempo. En ocasiones es posible que lo que nos interese sea incrementar las visitas
durante las épocas del año en que la demanda natural de nuestros productos es menor, de forma

Ing. David Gil
que ayudemos a equilibrar el patrón estacional de la demanda. En otros casos, por ejemplo,
cuando la demanda se concreta en una época muy concreta del año, como la navideña, nos
interesará invertir para lograr así el mayor número de ventas. Los enlaces patrocinados nos
permiten, pues, invertir para complementar los pedidos durante los valles de la demanda o bien
maximizar los resultados justo cuando ésta es más fuerte.
• Accesible para casi todos los presupuestos
A pesar de que el precio promedio del coste por clic ha aumentado considerablemente en los
últimos años, sobre todo, para ciertas categorías de productos y servicios especialmente
competidos, lo cierto es que la inversión necesaria para lograr una visita de calidad en los
buscadores se mantiene, en general, en importes contenidos por debajo de un euro para muchas
categorías. Con esta estrategia, además, somos nosotros quienes marcamos una inversión máxima
diaria, una inversión máxima mensual y el coste máximo que estamos dispuestos a pagar por visita.
Controlando estos tres valores con cierto sentido común, prácticamente cualquier negocio puede
obtener tráfico rentable a través de Google AdWords.
• AdWords es inbound marketing
Aunque se está pagando por visitas, lo cierto es que dicha visita está originada por el propio interés
del usuario. Cuando la campaña se origina en los buscadores, es la propia intención de búsqueda
del usuario la que sirve para seleccionar los enlaces patrocinados relevantes que podrían ser
también resultados de su interés y que, por tanto, los buscadores muestran junto a los resultados
naturales.
• ROI fácil de medir
Una de las principales virtudes de AdWords como estrategia de atracción de tráfico es que permite
realizar un seguimiento de las visitas generadas y medir la conversión que dichas visitas nos han
generado. A partir de dicha conversión, ya sea en forma de generación de leads o, directamente,
ventas, podremos determinar su es una estrategia rentable o no para nuestro proyecto
empresarial. Si los beneficios que generaron las ventas de visitantes procedentes de pago por clic
fueron mayores que la inversión necesaria para generar dicho tráfico, entonces la estrategia es
rentable. En caso contrario, tendremos que buscar otras alternativas para atraer dicho tráfico o
concretaremos en mejorar la conversión de nuestro sitio web.
• Permite generar reconocimiento de marca
Invertir en Google AdWords y estar visibles en un número amplio de búsquedas relacionadas con
nuestro sector contribuye a generar entre nuestros clientes potenciales un cierto reconocimiento
de marca. Los usuarios tienden a identificar a las empresas que ocupan los primeros puestos en
los enlaces patrocinados de forma que encontrarnos reiteradamente en dichas posiciones
contribuirá a implantar nuestra marca entre sus conocidas. Esto incrementará gradualmente el
tráfico directo y las visitas repetidas, así como el tráfico procedente de búsquedas con marca,
donde mayor ventaja podemos extraer de posicionarnos por encima de nuestra competencia.
• Permite segmentaciones precisas
Google AdWords nos sólo posibilita graduar la inversión a lo largo del tiempo, sino que permite
segmentar de forma muy precisa a los destinatarios de nuestra publicidad y concretar esa
visibilidad sobre los productos más rentables y las ofertas más atractivas. Además, permite
concentrar nuestra inversión en áreas geográficas muy determinadas, en periodos de tiempo
precisos, así como ciertos rangos de horas y días de la semana concretos. Dado que el tráfico
generado por AdWords cuesta dinero, es fundamental segmentarlo muy bien para concentrar los
recursos en aquellas visitas que mayor rentabilidad puedan generar.
• En campañas de búsqueda sabemos exactamente qué busca el usuario
Si analizamos las búsquedas que generaron visitas en los resultados naturales de los buscadores,
comprobaremos cómo algunos visitantes llegaron a nuestro sitio Web a partir de búsquedas que
apenas guardan relación con nuestra oferta. La sinonimia y la polisemia provocan que los
buscadores puedan mostramos como resultados relevantes a usuarios cuya intención de búsqueda
poco o nada tenían que ver con nuestros contenidos. Por el contrario, en las campañas de pago
por clic, nosotros somos los que seleccionamos cuidadosamente en qué búsquedas queremos que

Ing. David Gil
se incluyan nuestros anuncios, y podemos redactarlos de una forma precisa para comunicar una
oferta muy concreta. Esto nos permite anticiparnos y preparar una página de aterrizaje (landing
page) especialmente diseñada para recibir al usuario que se interesó por dicho anuncio. El anuncio
y la página de aterrizaje trabajan como un tándem para generar una conversión que, si se hace
correctamente, debería ser superior al promedio de las visitas originadas en los resultados
naturales.
Tipos de campañas
Google AdWords cuenta con diferentes tipos de campañas, enfocadas a la consecución de distintos
objetivos. Con la evolución de la plataforma y de la publicidad en Internet, es bastante común
encontrarse con nuevos tipos de campañas pensados para obtener un tipo concreto de objetivo. A
continuación, se enumeran los distintos tipos de campañas existente actualmente.
 Campañas de búsqueda
Las campañas de búsqueda son aquellas que están directamente relacionadas con las búsquedas
que realiza el usuario en el buscador de Google. A partir de dicha búsqueda, se muestran anuncios
relacionados que enlazan con páginas web que son potencialmente interesantes para el usuario.
Este tipo de campañas suelen utilizar exclusivamente anuncios de texto. Los anuncios se pueden
mostrar en los resultados de búsqueda de Google, en Google Shopping, en Google Maps, en
Grupos o en los socios de búsqueda.
Este tipo de campañas suelen utilizarse para conseguir leads o ventas, ya que suelen dar buenos
resultados al mostrar el usuario un interés explícito mediante la búsqueda realizada.
 Campañas de display
Este tipo de campañas muestran anuncios directamente, sin que el usuario muestre intención o
interés por el producto o servicio, por lo que, a priori, tendrán menos interés para el usuario que
los anuncios mostrados por campañas de búsqueda.
Aunque este tipo de campañas se suelen utilizar con anuncios de imagen estáticos, también se
pueden utilizar anuncios de texto, rich media y de vídeo. Estos anuncios se pueden mostrar en
sitios web que muestran anuncios de Google pertinentes, Vídeos, Aplicaciones para móvil, Gmail,
YouTube, Blogger, Google Finance y Google Maps.
Este tipo de campañas están enfocadas para aumentar la visibilidad del anunciante y mejorar el
reconocimiento de la marca.
 Campañas de Shopping
Las campañas de Google Shopping están especialmente pensadas para promocionar productos de
tiendas online. Al igual que con las campañas de búsqueda, muestran los anuncios cuando el
usuario realiza alguna búsqueda relacionada.
Utiliza anuncios específicos, llamados “anuncios de ficha de producto” que se nutren de los datos
cargados mediante un feed de datos. Estos anuncios son muy completos comparados con otros
tipos de anuncios ya que, además del título y una descripción corta, muestra una imagen, el precio
y la tienda que vende el producto. Estos anuncios se pueden mostrar en sitios web que muestran
anuncios de Google Shopping (en los países en los que esté disponible), en la búsqueda de Google
y en sitios web de partners de búsqueda de Google.
Este tipo de campañas está enfocada a una estrategia de conversión de ventas, ya que reúne la
información más importante de los productos y la presenta en formato de anuncio para que el
usuario tenga suficiente información para valorar si el producto le es interesante o no.
 Campañas de vídeo
Las campañas de vídeo son campañas específicas de display que centran su soporte publicitario en
anuncios de vídeo. Como sucede con las campañas de display, los anuncios se muestran al usuario
sin que este muestre interés por el producto o servicio, aunque existen herramientas de
segmentación que permiten conocer los intereses de los usuarios para poder ofrecerle anuncios
más relevantes.
En este tipo de campañas se pueden utilizar los mismos tipos que en campañas de display, es decir,
anuncios de imagen estáticos, anuncios de texto, rich media y de vídeo. Estos anuncios pueden ser

Ing. David Gil
mostrados en resultados de búsqueda, sitios web relevantes de la red de display, sitios web que
muestran anuncios de Google, vídeos, aplicaciones, Gmail, YouTube, Blogger, Google Finance y
Google Maps.
 Anuncios de video en YouTube
Este tipo de campañas suelen utilizarse para reforzar la marca y conseguir más visibilidad. Gracias
a los anuncios de vídeo se puede dar más información que en imágenes estáticas y el impacto suele
ser mucho mayor.
 Campañas de aplicación universal
Este tipo de campañas muestran anuncios tanto por búsqueda realizadas por el usuario, como en
sitios web que tengan algún tipo de relación con la aplicación. Está pensada para facilitar la
descarga directa de la APP en el dispositivo del usuario.
Los anuncios universales de aplicaciones obtienen los datos de los anuncios de la ficha de la
aplicación en Google Play, de cualquiera de las cuatro líneas de texto proporcionadas por el usuario
en el momento de crear el anuncio y, opcionalmente, por un vídeo de YouTube. Estos anuncios se
pueden mostrar en Google Play, el buscador de Google, la red de partners de búsqueda, YouTube,
en otras aplicaciones y en las versiones para móviles de sitios web de noticias, de blogs o de otros
sitios web de Internet.
Este tipo de campañas se utiliza para conseguir promocionar una APP y que sea descargada por
los usuarios.
 Campañas de remarketing
Aunque no es un tipo de campaña sino más bien, una especialidad dentro de las campañas de
búsqueda, display y vídeo, su utilidad más que reseñable hace imprescindible hablar de ellas. Las
campañas de remarketing muestran anuncios específicos para los usuarios que han visitado una
página web. Su importancia reside en que, aplicando las estrategias oportunas, suelen dar mejores
resultados de conversión que las campañas “normales”, al impactar la publicidad en usuarios que
ya nos conocen.
Las campañas se configuran para que únicamente muestren los anuncios a un listado de usuarios.
Dicho listado se configura desde la plataforma de Google AdWords y, por ejemplo, pueden ser los
usuarios que visitan la página web anunciada.
Tanto los anuncios como las ubicaciones donde se muestran, dependen exclusivamente del tipo
de campaña, ya que, no hay que olvidar que estamos hablando de campañas de remarketing en
búsqueda, display o vídeo. Seguramente en un futuro el remarketing se pueda utilizar en todos los
tipos de campañas disponibles.

Ing. David Gil

ModuloGAW2019 PDF

Transféré par

Informations du document

Titre original

Copyright

Formats disponibles

Partager ce document

Partager ou intégrer le document

Options de partage

Avez-vous trouvé ce document utile ?

Ce contenu est-il inapproprié ?

Droits d'auteur :

Formats disponibles

ModuloGAW2019 PDF

Transféré par

Droits d'auteur :

Formats disponibles

CARRERA PROFESIONAL

Gestión y Administración Web

Mg. Ing. David Gil Meza

INSTITUTO DE EDUCACIÓN SUPERIOR

GESTIÓN Y ADMINISTRACIÓN WEB

Trujillo, marzo del 2019

Módulo 3: Gestión de Aplicaciones para Internet y Producción Multimedia

Unidad Didáctica Gestión y Administración Web

Módulo 3: Gestión de Aplicaciones para Internet y Producción Multimedia

Módulo 3: Gestión de Aplicaciones para Internet y Producción Multimedia

Actividad 1: Formulación y planeación para aplicaciones web .................................. 11

Formulación y Planeación para Ingeniería Web ....................................................................... 14

Actividad 2: Modelado de análisis para aplicaciones web ......................................... 17

El modelo de análisis para aplicaciones web ............................................................................ 17

Actividad 3: Modelado de diseño para aplicaciones web .......................................... 20

Diseño estético ....................................................................................................................... 22

Módulo 3: Gestión de Aplicaciones para Internet y Producción Multimedia

Diseño al nivel de componenetes ............................................................................................ 23

Indicador de logro 2 ......................................................................................................... 24

Actividad 4: Introducción a las Tecnologías Web ...................................................... 25

Qué son los DNS ..................................................................................................................... 26

Navegadores Web .................................................................................................................. 28

Servidores web ....................................................................................................................... 28

Actividad 5: Tecnologías front-end y back-end.......................................................... 29

Actividad 6: MySQL .................................................................................................. 38

La Comunicación con MySQL ................................................................................................... 39

Construcción de una Base de Datos ......................................................................................... 40

Módulo 3: Gestión de Aplicaciones para Internet y Producción Multimedia

Creando una nueva base de datos ............................................................................................................ 40

Actividad 7: PHP ....................................................................................................... 44

Adición de una sección PHP a una página HTML....................................................................... 45

Variables PHP ......................................................................................................................... 47

Sentencias Condicionales ........................................................................................................ 51

Sentencias Repetitivas ............................................................................................................ 52

Actividad 8: PHP y MySQL......................................................................................... 54

Módulo 3: Gestión de Aplicaciones para Internet y Producción Multimedia

Selección de una base de datos ................................................................................................................ 55

Colocando información en una base de datos .......................................................................... 56

Indicador de logro 3 ......................................................................................................... 58

Actividad 9: WordPress ............................................................................................ 59

Actividad 10: Apariencia........................................................................................... 65

Actividad 11: Usuarios .............................................................................................. 66

Actividad 12: Páginas ............................................................................................... 67

Módulo 3: Gestión de Aplicaciones para Internet y Producción Multimedia

Actividad 13: Plugins y herramientas ........................................................................ 69

Indicador de logro 4 ......................................................................................................... 73

Actividad 14: Posicionamiento Web (SEO) ................................................................ 74

Diferencias entre SEO y SEM ................................................................................................... 74

Técnicas onsite vs Técnicas offsite ........................................................................................... 76

SEO White Hat Vs SEO Black Hat.............................................................................................. 78

Actividad 15: Herramientas SEO ............................................................................... 79

Módulo 3: Gestión de Aplicaciones para Internet y Producción Multimedia

Recomendaciones de buenas prácticas en SEO ........................................................................ 84

Actividad 16: Google AdWords ................................................................................. 86

Tipos de campañas ................................................................................................................. 88

Módulo 3: Gestión de Aplicaciones para Internet y Producción Multimedia

 Elabora proyecto de desarrollo de aplicación web utilizando correctamente conceptos,

Módulo 3: Gestión de Aplicaciones para Internet y Producción Multimedia

Actividad 1: Formulación y planeación para aplicaciones web

Atributos de los Sistemas y Aplicaciones basados en Web

Módulo 3: Gestión de Aplicaciones para Internet y Producción Multimedia

Estratos de la ingeniería web

Módulo 3: Gestión de Aplicaciones para Internet y Producción Multimedia