INTRODUCION

La Junta de accin comunal es una entidad que se define segn los estatutos
como una organizacin cvica, social y comunitaria de gestin social, sin animo
de lucro, de naturaleza solidaria, con personera jurdica y patrimonio propio,
integrada voluntariamente por los residentes de un lugar que anan esfuerzos y
recursos para procurar el desarrollo integral, sostenible y sustentable con
fundamento en el ejercicio de la democracia participativa. Es decir es un
entorno social que posee unas caractersticas y problemticas propias. Una de
las situaciones que se esta viviendo en la actualidad, es la proliferacin de la
tecnologa, es decir teniendo una visin futurista podemos afirmar que con el
tiempo cada una de nuestras actividades estarn sujetas a los procesos
informticos y recursos que promueven un desarrollo sostenible, con base a
esta situacin, se ha querido promover dentro del entorno del sector III del
barrio Villa Rosa, este proyecto que involucra la tecnificacin de todos los
procesos concernientes a la Junta de accin comunal de esta zona.

Lo que se desea es plasmar la factibilidad de incrementar la recuperacin de la
confianza de esta comunidad en los lderes de la zona, as como tambin
promover el desarrollo, mediante la implantacin de una pgina web, en la cual
se busca impulsar la educacin, los valores y la tolerancia, adems de todos
los procesos informativos que le permitan a los usuarios del sector tener un
mayor acceso a los datos que le permiten hacer su participacin ciudadana.
Esta informacin es sobre proyectos por realizar, noticias de la comunidad,
informacin sobre los estatutos y manipular los datos de afiliacin y registro
mediante medios virtuales que permitan realizar un proceso ordenado de
acceso a la informacin.

Para desarrollar este entorno web la cual es la versin uno, realizamos un
censo de inscripcin de las familias y el aprobamiento de esto, dndoles a
conocer la importancia de someternos a un entorno tecnolgico para el
desarrollo de la comunidad.



















OBJETIVOS
Desarrollar una pagina web para la junta de accin comunal del barrio
Villa Rosa.

OBJETIVOS ESPECIFICOS
Realizar el diseo de la pgina web.
Recopilar toda la informacin requerida para la pgina web.
Elaborar el diseo visual de la pgina.
Realizar la programacin necesaria que permita optimizar la navegacin



DIAGNOSTICO
No existe medio fsico que permita a los afiliados de la Junta tener un acceso
rpido y oportuno a las informaciones y actividades que se estn presentando
en la zona y a nivel general, tampoco hay copias de seguridad que acrediten el
mantenimiento de los datos en caso de prdida. Adems con la proliferacin de
los medios informticos (navegacin web, redes sociales, etc), es de gran
importancia tener un medio de navegacin web que apoye al entorno educativo
que permita a los usuarios crecer en los valores, la tolerancia y el saber.

PROBLEMAS
La base de datos que actualmente se tiene en la junta se encuentra hecha por
medios manuales, no hay un procesamiento digital que agilice clculos, y
mejore procesos de acceso a la base de datos, que permita tener una relacin
mas clara transparente de todos los procesos.

PROPUESTA
Desarrollar un entorno web para la junta de accin comunal, por medio de la
cual se dar a conocer a toda la poblacin la visin, la misin, quienes son
los socios conforman la junta de accin comunal, que proyectos se estn
implementando, cursos y dems informacin importante para toda la
comunidad.



JUSTIFICACION
El propsito del entorno web es optimizar todos los procesos realizados en la
Junta de accin comunal, el legado de los procesos a menudo fragmentados se
encuentran a un nivel no optimo para su manipulacin, un sitio web responde a
un entorno integrado a los cambios y de apoyo en la entrega de la estrategia de
accin social. La gestin eficaz y la explotacin de la informacin a travs de la
web es un factor clave para el xito del desarrollo de la comunidad, y un medio
indispensable para lograr una ventaja competitiva, pues da confiabilidad,
transparencia y orden a los procedimientos. Este entorno web responde a esta
necesidad, proporcionando un marco estratgico para la evolucin del sistema
en respuesta a las necesidades constantemente cambiantes del entorno social
tecnologico.
Las ventajas que se derivan de este proyecto puede aportar importantes
beneficios a la comunidad, incluyendo:
Una operacin de procesos de registros y manejo de informacin ms
eficiente.
- Aumento de la portabilidad de las aplicaciones
- Mejora de la interoperabilidad y el fcil sistema y gestin de la red
- Mejora de la capacidad para hacer frente a importantes problemas, como la
seguridad
- Ms fcil de actualizacin e intercambio de los componentes del sistema
Mejor retorno sobre la inversin existente, la reduccin del riesgo para
la inversin futura:
- Reduccin de la complejidad en la infraestructura.
- Mximo rendimiento de la inversin en la infraestructura existente
- Reduccin del riesgo global de la nueva inversin.
Ms rpido, ms sencillo y ms barato los procedimientos:
- Decisiones de compra son ms sencillas, ya que la informacin que rige la
contratacin est fcilmente disponible en un plan coherente.
- El proceso de adquisicin es ms rpido, lo que maximiza la velocidad de la
contratacin y la flexibilidad sin sacrificar la coherencia arquitectnica.
Factibilidad de realizacin
Se puede realizar el proyecto debido a que la poblacin que conforma la
junta esta comprendida por tres manzanas del barrio sector III, por su
tamao es posible realizar una recopilacin de informacin fcilmente,
adems los costos para la realizacin se acomodan al tamao del proyecto,
como lo muestra las tablas 1 y 2.
TABLA 1: recursos y costos de ejecucin:
Materiales Justificacin Valor
Papelera
(Fotocopias, Lapiceros y
CDs)
Papelera para realizacin de las
encuestas y algunas herramientas de
trabajo (Fotocopias, lapiceros, tablas
de escritura, etc.).
$60.000.oo
Comunicaciones. Todo lo relacionado con libros, medios
de comunicacin (internet, celular,
telefona, etc)
$50.000.oo
Transporte. Para la movilizacin a los lugares de
investigacin pertenecientes al
proyecto.
$40.800.oo
Dominio y hosting Costos del alojamiento web $2500.000.o
o
Servicios profesionales
(Asesorias)
honorarios $80.000.oo
TOTAL $480.000.oo

TABLA 2: cronologa del proyecto.
Actividades Marzo Abril Mayo Junio
Preliminares:
Recoleccin de informacin, herramientas a utilizar e
informacin a publicar.

Estructurando la informacin:
Diseo de la estructura web, la apariencia y
programacin web requerida.

Aplicacin de tcnicas: Correcciones de Diseo y
programacin web (depurando errores).

Resultados: Interpretacin y anlisis de resultados.
Realizacion de los informes: Discusin y reporte de
resultados.

Sustentacin


MARCO TEORICO

Para disear una pagina web, ya sea para un negocio, una parte acadmica o
simplemente de utilizacin estratgica para facilitar procesos de actividades de
unas organizaciones, como en nuestro caso la Junta de accin comunal, nos
lleva a en marcarnos en una definicin formal de pgina web y algunos
aspectos importantes tericos.
Pginas web.
Una pgina web es el nombre de un documento o informacin electrnica
adaptada para la World Wide Web y que puede ser accedida mediante un
navegador para mostrarse en un monitor de computadora o dispositivo mvil.
Esta informacin se encuentra generalmente en formato HTML o XHTML, y
puede proporcionar navegacin a otras pginas web mediante enlaces de
hipertexto. Las pginas web frecuentemente incluyen otros recursos como
hojas de estilo en cascada, guiones (scripts) e imgenes digitales, entre otros.
Lenguaje HTML, siglas de HyperText Markup Language (lenguaje de
marcado de hipertexto), hace referencia al lenguaje de marcado predominante
para la elaboracin de pginas web que se utiliza para describir la estructura y
el contenido en forma de texto, as como para complementar el texto con
objetos tales como imgenes. El HTML se escribe en forma de etiquetas,
rodeadas por corchetes angulares (<,>). HTML tambin puede describir, hasta
un cierto punto, la apariencia de un documento, y puede incluir un script (por
ejemplo JavaScript), el cual puede afectar el comportamiento de navegadores
web y otros procesadores de HTML.
1

Concepto y estructura de un sitio web
Bsicamente un sitio web es una carpeta almacenada en un Servidor Web.
Dentro de esta carpeta se pueden localizar diferentes tipos de archivos
conocidos como pginas web, entre estos tenemos: pginas ASP, pginas
HTML, imgenes, animaciones, scripts, bases de datos, etc.
Se entiende por estructura de un sitio Web a la manera en que se almacenan
lgicamente los archivos dentro de este (carpetas y subcarpetas) y la manera
en que se vinculan entre s estos archivos a travs de los Enlaces (acceso a
otras pginas o Web). En la figura siguiente, se muestra la forma como se
pueden enlazar diferentes pginas conservando una estructura organizada. Es
decir, dentro del conjunto de archivos de pginas Web del Sitio existe una
pgina especial denominada Pgina de Inicio (Home, Default, ndex, etc.) que
es aquella que se visualiza en el navegador despus de colocar una direccin
URL dentro de la barra de direcciones del Navegador; esta pgina contendr
los hipervnculos o enlaces necesarios para acceder a los dems archivos que
componen el Sitio.

El Formato de un Sito Web
Todos los Sitio Web poseen una apariencia caracterstica; distintos tipos de
letras (fuentes), colores, imgenes, maneras de representar los hipervnculos,
etc. Podra decirse entonces que el formato del Sitio es la apariencia esttica
en que se presentan las diferentes pginas que lo componen ante cualquier
navegante que lo recorre.

Tipos de Sitio Web
Los sitios Web pueden clasificarse de diferentes formas. Cada tipo de sitio
tiene unas caractersticas y limitaciones propias. Una buena organizacin es
vital para conseguir los objetivos del Sitio. A continuacin se muestra diferentes
maneras de clasificar los sitios Web:
Por su audiencia:
Pblicos: Es un WebSite normal, una pgina dirigida al pblico general, sin
restricciones de acceso en principio.
Extranet: Son Sitios limitados por el tipo de usuarios que pueden acceder, por
ejemplo los proveedores de una empresa determinada, o los clientes.
Intranet: Son sitios cuyo acceso est restringido a una empresa u
organizacin, normalmente funcionan dentro de redes privadas, aunque no
siempre es as.
Por su dinamismo: aqu encontramos sitios interactivos y sitios
estticos:
Sitios Interactivos: El usuario puede influir sobre el contenido del sitio que
variar en funcin de cada usuario y de los objetivos de ste. Normalmente, las
pginas se generan cuando el usuario las solicita, personalizando la
informacin que se le ofrece.
Sitios estticos: Los usuarios no pueden modificar o aadir nada al sitio, de
cuyos contenidos se encargan exclusivamente sus diseadores.

Por su apertura: Estructuras abiertas, cerradas y semi-cerradas:
Estructura abierta: Todos los documentos disponen de su direccin y los
usuarios pueden acceder a cualquier punto del WebSite.
Estructura cerrada: Limita el acceso a unos pocos puntos de entrada (incluso
a uno slo). Un ejemplo sera un sitio que requiere un registro previo para
entrar, el usuario siempre tendra que pasar primero por el registro antes de
poder acceder al resto de la pgina.
Estructura semi-cerrada: A medio camino entre ambas, obliga a los usuarios
a acceder por unos puntos especficos, como por ejemplo slo la pgina
principal y las pginas de entrada a las secciones ms importantes.
Por su profundidad:
Basada en el nmero de enlaces que hay que pulsar para llegar al contenido.
En general los usuarios prefieren sitios poco profundos. Una buena regla a
seguir es que el usuario no tenga que pulsar ms de 3 enlaces para encontrar
lo que busca.
Por sus objetivos:
Comerciales: Estn creados para promocionar los negocios de una empresa.
Su finalidad es econmica. Su audiencia puede estar formada por clientes
(actuales y potenciales), inversores (actuales y potenciales), empleados
(actuales y potenciales) e incluso la competencia y los medios de
comunicacin. Podemos a su vez dividirlas en Corporativas (Informan sobre la
empresa) y Promocionales (promocionan productos).

Informativos: Su finalidad principal es distribuir informacin. La audiencia de
este tipo de sitios depende del tipo de informacin que distribuyen.

Ocio: Aunque normalmente son sitios con una finalidad econmica, son un
caso especial. No son sitios fciles de crear ni de mantener y a veces siguen
reglas propias; puesto que a veces es ms importante sorprender al usuario
con innovaciones que mantener la consistencia y la estructura.

Navegacin: Su finalidad es ayudar al usuario a encontrar lo que busca en
Internet. Dentro de este grupo se sitan los llamados portales, que intentan
abarcar prcticamente todo dentro del propio sitio.

Artsticos: Son un medio de expresin artstica de su creador o creadores.
Este tipo de sitios suele saltarse todas las convenciones y las nicas normas a
aplicar son las que el propio artista o artistas deseen.

DISEO DE SITIOS WEB BAJO ASISTENTES.
Existe una gran variedad de asistentes de diseo de sitios web en el cual se
puede realizar una pagina web, sin tener que tocar ni una sola parte de cdigo,
eso no es campo de este proyecto, el proyecto se encuentra basado en la
herramienta mas fuerte en el mercado web y es Dreamweaver la cual
hablaremos a continuacin.

DREAMWEAVER
Es la herramienta de diseo de pginas web ms avanzada, tal como se ha
afirmado en muchos medios. Aunque sea un experto programador de HTML el
usuario que lo maneje, siempre se encontrarn en este programa razones para
utilizarlo, sobre todo en lo que a productividad se refiere.
Cumple perfectamente el objetivo de disear pginas con aspecto profesional,
y soporta gran cantidad de tecnologas, adems muy fciles de usar:
Hojas de estilo y capas (CSS)
Javascript para crear efectos e interactividades
Insercin de archivos multimedia.
PHP
XML

Adems es un programa que se puede actualizar con componentes, que
fabrica tanto Macromedia como otras compaas, para realizar otras acciones
ms avanzadas.
En resumen, el programa es realmente satisfactorio, incluso el cdigo generado
es de buena calidad. El nico problema consiste en que al ser tan avanzado,
puede resultar un poco difcil su manejo para personas menos experimentadas
en el diseo de webs.
Volver al comienzo

Estructura de un documento HTML

Las "tags" que describen la estructura general de un documento y dan una
informacin sencilla sobre l son: <HTML> <HEAD> <TITLE> <BODY>. Estas
tags no afectan a la apariencia del documento y solo interpretan y filtran los
archivos HTML
<HTML>: Limitan el documento e indica que se encuentra escrito en este
lenguaje.
<HEAD>: Especifica el prlogo del resto del archivo. Son pocas las "tags" que
van dentro de ella, destacando la del titulo
<TITLE> que ser utilizado por los marcadores del navegador e identificar el
contenido de la pgina. Solo puede haber un ttulo por documento,
preferiblemente corto aunque significativo, y no caben otras tags dentro de l.
En head no hay que colocar nada del texto del documento.
<BODY>: Encierra el cuerpo principal del documento, el contenido.
<HTML>
<HEAD>
<TITLE>Pagina Ejemplo</TITLE>
</HEAD>
<BODY>
Cuerpo del documento...
</BODY>
</HTML>

Estructura de los prrafos

<H1>, <H2>, <H3> son etiquetas de ttulos. Le dan al texto el formato
predefinido para cada nivel de ttulo. Se pueden definir seis niveles de ttulos.

<P>: Prrafos. En principio, sin entrar en detalles de alineacin u otras
caractersticas, digamos que se definen por las tags <P>.....</P>. Esta tag, en
un principio, se dise para saltar de prrafo por lo que puede ir sola "<P>" al
final de un texto indicando que a continuacin se quiere una lnea en blanco, lo
recomendable es abrir y cerrarla.

<BR>: Salto de lnea. Esta etiqueta sirve para realizar un salto de linea, puede
poner tantas como desee y realizar un salto de lnea por cada una de ellas.
Estilos de texto
Estas etiquetas permiten dar formato resaltado a partes del texto, estos son
algunos ejemplos, hay muchos ms, y la forma en que se representan
dependern de cada navegador:


<B>Texto en negrita</B>.
<I>Texto en italica</I>
<U>Texto subrayado</U>

Se ver en el navegador:
Texto en negrita.
Texto en italica.
Texto subrayado

<!-- -->: Comentarios. Sirve para colocar textos de comentario que nunca se
mostrarn a travs del navegador y que le servirn para recordatorios en
futuras revisiones del documento.

<HTML>
<HEAD>
<TITLE>Pagina ejemplo</TITLE>
</HEAD>
<BODY>
<H1>Mi primera pgina</H1>

<!-- Este comentario no sera
mostrado por el navegador -->

<P>Esta es un pgina con titulo, que tiene tambin un prrafo y unos
cuantos saltos de lnea.</P>
Uno<br> Dos<br> Tres<br>
</BODY>

Tablas en HTML

Las tablas surgieron con la versin HTML 3.0. Las tablas permiten representar
y ordenar cualquier elemento en filas y columnas de modo de poder resumir
grandes cantidades de informacin de una manera que puede representarse
rpida y fcilmente.

Las tablas se definen fila a fila, celda a celda, comenzando desde la celda
superior izquierda. Las columnas se calcularn automticamente segn las
celdas que hay en cada fila.

Cada fila de la tabla se indica mediante las tags <tr>.....</tr>. Las tags <th> y
<td> con sus correspondientes tags de cierre, indican para indicar las filas
individuales dentro de cada fila. Las tags <th>.....</th> indican que se trata de
celdas que sirven como encabezado de tabla y suelen visualizarse en negrita.
Las tags <td>.....</td> indican que se trata de celdas comunes
2
.
Las etiquetas que identifican a una tabla son las siguientes:
<Table></table> Define dnde comienza y termina la tabla.
<table width="XX"> Determina la anchura de la tabla. Puede darse en pxeles o
En porcentaje de la pgina.

<table height="XX> Determina la altura de la tabla en pxeles.
<table border="X"> Establece el grosor en pxeles del borde de la tabla.
<table cellspacing="X"> Define el espacio en pxeles entre las celdas.
<table cellpadding="X"> Define el espacio en pxeles entre el borde y el texto.
<tr><tr> Determina cada una de las filas de la tabla.
<td></td> Determina cada una de las columnas dentro de las filas.
<th></th> Determina una celda normal, con texto centrado y resaltado.



Ejemplo:
<table width="100%" height="200" border="1" cellspacing="3" cellpadding="5">
<tr>
<td> primera columna de la fila 1</td>
<td> segunda columna de la fila 1</td>
<td> tercera columna de la fila 1</td>
</tr>
<tr>
<td> primera columna de la fila 2</td>
<td> segunda columna de la fila 2</td>
<td> tercera columna de la fila 2</td>
</tr>
</table>
Formularios HTML

Los formularios permiten, desde dentro de una presentacin web, ingresar
informacin al visitante. Una vez introducidos los valores en los campos
habilitados, sern enviados a una URL (normalmente un cgi, php) donde se
procesar toda esta informacin.

La declaracin de formulario se delimita por las tags <form>.....</form> y dentro
de ellas se recogern todas las variables de entrada. A la tag de apertura
<form> le acompaarn estos atributos:

action="" Entre comillas se indica el programa que va a tratar las variables
enviadas con el formulario, un CGI, php, asp, o, simplemente "mailto" que
enviar los datos al programa cliente de correo.
Method="" Indica el mtodo de transferencia de las variables. Post, si se enva
a travs del STDIO. Get, si se enva a travs de la URL.


<HTML>
<HEAD>
<TITLE>Formulario ejemplo</TITLE>
</HEAD>
<BODY>

<H1>Formularios</H1>
<FORM ACTION="mailto:mimail@miweb.com" METHOD="POST">
<INPUT TYPE="text" NAME="nombre"><BR>
<INPUT TYPE="submit">
<INPUT TYPE="Reset">
</FORM>

</BODY>
</HTML>

En este ejemplo el formulario abrir el programa de correo predeterminado
para enviar un mensaje, si quisieras procesar estos datos internamente en el
servidor, la accin de destino debe ser el nombre del "script" que se har cargo
del trabajo. Por ejemplo <FORM ACTION="mi_proceso.php"
METHOD="POST"> Busc ms informacin sobre como se procesan los datos
provenientes de un formulario en la ayuda de php.

Tcnicas para accesibilidad web en HTML
WCAG ("Web Content Accessibility Guidelines") consiste en 14 pautas que
proporcionan soluciones de diseo y que utilizan como ejemplo situaciones
comunes en las que el diseo de una pgina puede producir problemas de
acceso a la informacin a ciertas personas con diferentes tipos y niveles de
discapacidad. Las Pautas contienen adems una serie de puntos de
verificacin que ayudan a detectar posibles errores.

Cada punto de verificacin est asignado a uno de los tres niveles de prioridad
establecidos por las pautas.


Prioridad 1: son aquellos puntos que un desarrollador Web tiene que cumplir
ya que, de otra manera, ciertos grupos de usuarios no podran acceder a la
informacin del sitio Web.
Prioridad 2: son aquellos puntos que un desarrollador Web debera cumplir ya
que, si no fuese as, sera muy difcil acceder a la informacin para ciertos
grupos de usuarios.
Prioridad 3: son aquellos puntos que un desarrollador Web debera cumplir ya
que, de otra forma, algunos usuarios experimentaran ciertas dificultades para
acceder a la informacin.
En funcin a estos puntos de verificacin se establecen los niveles de
conformidad:
Nivel de Conformidad A: todos los puntos de verificacin de prioridad 1 se
satisfacen.
Nivel de Conformidad Doble A: todos los puntos de verificacin de prioridad 1
y 2 se satisfacen.
Nivel de Conformidad Triple A: todos los puntos de verificacin de prioridad 1,
2 y 3 se satisfacen.
Lenguaje PHP
PHP es un acrnimo recursivo que significa PHP Hypertext Pre-processor es
un lenguaje de programacin interpretado (Lenguaje de alto rendimiento),
diseado originalmente para la creacin de pginas web dinmicas. Se usa
principalmente para la interpretacin del lado del servidor (server-side scripting)
pero actualmente puede ser utilizado desde una interfaz de lnea de comandos
o en la creacin de otros tipos de programas incluyendo aplicaciones con
interfaz grfica usando las bibliotecas Qt o GTK+.
3
Cmo fluye la mayora de la informacin a travs del internet en una
pgina dinmica
Una pgina dinmica implica la interaccin entre el usuario y un script
desarrollado en un lenguaje que permita el dinamismo, es decir, que permita la
interaccin entre el usuario y un Servidor Web y un Servidor de Base de Datos
(en caso de existir uno). Es decir, que el usuario haga una peticin al servidor
Web, ste se comunica con el servidor de base de datos, extrae la informacin
de la base de datos y presenta la informacin en la pantalla del usuario.


Lo que podemos hacer con PHP
Lo que se puede hacer con PHP es bsicamente cualquier cosa que se pueda
hacer con un script CGI, es decir, trabajo con formularios, como su
procesamiento y manejo dinmico; generar pginas con contenido dinmico
(de nuevo, el contenido dinmico es el que le permite a la pgina la interaccin
con el usuario); mandar o recibir cookies, etc.
Una caracterstica de PHP, es la capacidad de trabajar con una gran cantidad
de bases de datos, lo cual lo hace un programa verdaderamente potente,
siendo que, por ejemplo, si lo "juntamos" con MySQL (un Gestor de Bases de
Datos con licencia GNU), nuestros recursos salen literalmente "GRATIS"
Estructura de un archivo PHP
Un archivo PHP esta compuesto por dos etiquetas que forman el cuerpo del
archivo que inicia con la etiqueta <?php y termina con la etiqueta ?>, lo que va
dentro de estas dos etiquetas es e cuerpo de PHP, donde pueden ir variables
de control, alfanumricas, etc.
Las variables son datos, a los que podemos manipular basados en un nombre:
el nombre de la variable, sin necesidad de hacer referencia al tipo de dato al
que la variable hace referencia. En PHP, cada variable debe comenzar con el
signo de dlar ($) ms el nombre de la variable de la manera siguiente:
$nombre.
PHP tambin se puede trabajar con cdigo HTML, donde se puede mezclar
con este o simplemente trabajar un archivo con extensin .php y luego hacer el
llamado de este en el cdigo html, a continuacin una muestra de lo que se
trata de describir aqu:
Este cdigo es un ejemplo de como podra ir el cdigo php indexado en el
cdigo html.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title> Ejemplo basico PHP</title>
</head>
<body>
<?php
echo 'Hola amigos';
?>
</body>
</html>

Puede hacer el llamado del archivo como sigue en un formulario:
<form name="formulario" id="formulario" method="post" action="afiliarse.php">

Para los comentarios se puede utilizar:
1. /* varias
2. lineas */
3.
4. // una linea
5.
6. # una linea
Aunque no es una caracterstica integrada en el lenguaje, para
comentarios de documentacin se suele utilizar PHPDoc, el
equivalente al JavaDoc de Java en PHP.
1. /**
2. * Ejemplo de documentacin de una funcin
3. * @param int $foo un entero cualquiera
4. */

En la actualidad existen muchas libreras que ayudan al funcionamiento de este
tipo de archivos, como el PHPMailer, SENDMail, etc en las cuales estn
basados en cdigo abierto y que son estructuras que sirven para realizar
procesos como envios de correos electrnicos, comunicacin con las bases de
datos, en si todo el dinamismo de interaccin usuario servidor.
PHP Y MySQL
La mejor forma de utilizar MySQL desde PHP es mediante la interfaz
orientada a objetos de la extensin mysqli. Si no estamos seguros de si
vamos a tener que cambiar de base de datos tambin podemos utilizar la
extensin PDO (PHP Data Objects), una capa de abstraccin incluida por
defecto desde PHP 5.1
Primero creamos el objeto correspondiente con new mysqli($host, $usuario,
$password, $bbdd)
1. $mysqli = new mysqli("localhost", "root", "mipassword", "mibbdd");
Una vez hecho esto podemos comprobar si ha habido algn error mediante
la propiedad connect_error. Este propiedad contiene una cadena describiendo
el error que se ha producido, o una cadena vaca si no hubo ningn error.
1. if (mysqli_connect_errno())
2. exit("Se produjo un error: ", mysqli_connect_error());
Una vez abierta la conexin podemos comenzar a realizar consultas utilizando
el mtodo
query. Este devuelve true si se llev a cabo la consulta correctamente.
1. if ($mysqli->query("CREATE TABLE Personas(id int, nombre
varchar(30))")) {
2. echo "Tabla personas creada";
3. } else {
4. echo "Error al crear la tabla personas";
5. }
En las consultas que modifican tuplas el nmero de tuplas afectadas se
almacena en la propiedad affected_rows
1. $mysqli->query("UPDATE Empleados SET prima=2000 WHERE ventas
> 5000");
2. echo "Primas modificadas: ", $mysqli-
>affected_rows; Para recorrer las tuplas devueltas por
un SELECT haramos algo as
1. if ($resultado = $mysqli->query("SELECT * FROM Empleados")) {
2. while($empleado = $resultado->fetch_object()) {
3. printf("%s %s<br/>", $empleado->Nombre, $empleado->Apellidos);
4. }
5. }
Al finalizar se debe cerrar la conexin utilizando el mtodo close()
1. $mysqli->close()

Lenguaje CSS
El nombre hojas de estilo en cascada viene del ingls Cascading Style Sheets,
del que toma sus siglas. CSS es un lenguaje usado para definir la presentacin
de un documento estructurado escrito en HTML o XML (y por extensin en
XHTML). El W3C (World Wide Web Consortium) es el encargado de formular la
especificacin de las hojas de estilo que servirn de estndar para los agentes
de usuario o navegadores. Es decir es el cdigo que se encarga de decirle al
navegador cual es la apariencia de la pagina web.
Formas de usar CSS
Para dar formato a un documento HTML, puede emplearse CSS de tres formas
distintas:
1. Mediante CSS introducido por el autor del HTML
Un estilo en lnea (inline) es un mtodo para insertar el lenguaje de
estilo de pgina directamente dentro de una etiqueta HTML. Esta
manera de proceder no es totalmente adecuada. El incrustar la
descripcin del formateo dentro del documento de la pgina Web, a nivel
de cdigo, se convierte en una manera larga, tediosa y poco elegante de
resolver el problema de la programacin de la pgina. Este modo de
trabajo se podra usar de manera ocasional si se pretende aplicar un
formateo con prisa, al vuelo. No es todo lo claro o estructurado que
debera ser, pero funciona.
Dado que los clientes de correo electrnico no soportan las hojas de
estilos externas, y que no existen estndares que los fabricantes de
clientes de correo respeten para utilizar CSS en este contexto, la
solucin ms recomendable para maquetar correos electrnicos, es
utilizar CSS dentro de los propios elementos (inline).
Una hoja de estilo interna, que es una hoja de estilo que est
incrustada dentro de un documento HTML, dentro del elemento <head>,
marcada por la etiqueta <style>. De esta manera se obtiene el beneficio
de separar la informacin del estilo del cdigo HTML propiamente dicho.
Se puede optar por copiar la hoja de estilo incrustada de una pgina a
otra (esta posibilidad es difcil de ejecutar si se desea para guardar las
copias sincronizadas). En general, la nica vez que se usa una hoja de
estilo interna, es cuando se quiere proporcionar alguna caracterstica a
una pgina Web en un simple fichero, por ejemplo, si se est enviando
algo a la pgina Web.
Una hoja de estilo externa, es una hoja de estilo que est almacenada
en un archivo diferente al archivo donde se almacena el cdigo HTML de
la pgina Web. Esta es la manera de programar ms potente, porque
separa completamente las reglas de formateo para la pgina HTML de la
estructura bsica de la pgina.
2. Estilos CSS introducidos por el usuario que ve el documento, mediante
un archivo CSS especificado mediante las configuraciones del
navegador, y que sobre-escribe los estilos definidos por el autor en una,
o varias pginas web.
3. Los estilos marcados "por defecto" por los user agent, para diferentes
elementos de un documento HTML, como por ejemplo, los enlaces.
4

Una nota importante, es que la herramienta DREAMWEAVER genera este
cdigo cuando se esta trabajando en modo de diseador, lo importante aqu es
como se dijo anteriormente es crear un archivo con extensin .css, con el
principal objetivo de evitar cdigo repetitivo.














CONCLUSIONES










Bibliografia y cibergrafia.
1. http://www.ri5.com.ar/ayuda03.php
2. Programacion Web Avanzada, Manuales Users, 42, Autor: Marcelo
Ruiz, Edicin: ilustrada, Editor Mp Ediciones Corporation, 2002, ISBN:
9875261157, 9789875261150.
3. http://es.wikipedia.org/wiki/PHP.
4. http://es.wikipedia.org/wiki/Hojas_de_estilo_en_cascada
5. http://www.aulaclic.es/dreamweaver-cs5/index.htm
6. http://es.wikipedia.org/wiki/PHP
7. PHP y MySQL: Tecnologa para el desarrollo de aplicaciones web. Autor
: ngel Cobo,Editor: Ediciones Daz de Santos, 2005, ISBN:
8479787066, 9788479787066
8. CSS 2.1: Adopte las hojas de estilo para dominar los estndares de la
Web Recursos informticos, Autor: Christophe Aubry, Editor: Ediciones
ENI, 2009, ISBN: 2746044994, 9782746044999
9. HTML: Creacin de pginas Web Guas prcticas, Autor: Alonso
lvarez Garca, Edicin 6, Editor: Anaya Multimedia, 1996, ISBN:
8476148585, 9788476148587.
10. HTML: diseo y creacin de pginas Web Navegar en Internet, Autor:
Ramn Soria Momparler, Edicin 2, Editor: Alfaomega, 1998, ISBN:
9701503422, 9789701503423.














ANEXOS
















MANUAL DE USUARIO
SITIO WEB THE BROTHERS PROFESSIONAL SOUND




CACERES CARVAJAL JHON ALEXANDER
CACERES CARVAJAL JONATAN JAVIER
CARVAJAL DIAZ ROBERT JOAN
QUINTERO VERGEL JHON BREINER






CORPORACION INTERAMERICANA DE EDUCACION SUPERIOR
BUCARAMANGA
2012

NDICE




Introduccin...1

ndex...2

Estructura del sitio web...3

Banner...4

Botones..5

Cuerpo de pgina.....6

Pie de pgina.7

Men De Inicio.8

Consultar Por Servicios .9

Consultar Por Msica 10

Consultar Por Tutoriales 11


Consultar Por Galera.....12

Formulario De Contacto.13

























1. INTRODUCCION





El manual de usuario es un documento que tiene como objetivo dar apoyo
al usuario final sobre las caractersticas principales que poseen cada
mdulo o proceso del sitio Web Junta de Accin Comunal. Como se
podr ver en el contenido, la pagina web se encuentra dividida en 10
secciones que garantizan la transmisin eficaz de la informacin a la
comunidad, entre la cuales podrn ver la pagina principal, la seccin de
contctenos, preguntas frecuentes, noticias, misin, visin, galera y
proyectos y programas.













2. INDEX O PAGINA PRINCIPAL


El ndex ser la primera pgina que encontrara el usuario cuando ingrese a
nuestro sitio web.




3. ESTRUCTURA DEL SITIO WEB



1. BANNER O SLIDER: En el podremos encontrar el logo de la junta
y algunas imgenes mas con frases que caracterizan al sector.


2. BOTONES O HIPERVINCULOS: Los botones son un diseo
sencillo en html, se encuentran de color verde, que significa
1
2
3
4
5
esperanza, los cuales nos llevaran a diferentes partes del sitio web y
donde encontraremos en cada pgina con diferente contenido.


3. CUERPO: En el cuerpo veremos todo el contenido segn el modulo
en el que nos encontremos.

4. PIE: En el encontraremos la informacin necesaria para conocer el
responsable del diseo y sus polticas de uso.

5. BOTONES SLIDER: En esa zona encontraremos los botones de
control de reproduccin del banner o slider.

4. BANNER O CABEZA








1. Botones de cambio de imagen.
2. Imgenes caractersticas del sector.
3. Botones de reproducir, pausa, anterior y siguiente imagen.

2
3
5. BOTONES









1. Al dar clic en el botn de Principal nos mostrara los datos ms novedosos
acerca de las leyes e informacin que le conciernen al sector.
2. Al dar clic en el botn de contacto nos mostrara un formato en el cual el
usuario puede contactar a la parte administrativa de la Junta de Accin
Comunal.
3. Al dar clic en el botn de preguntas frecuentes mostrara la seccin donde se
responden a las preguntas mas comunes hechas en la comunidad.
4. Al dar clic en el botn de Noticias mostrara las noticias mas importantes
para el sector, con toda la informacin necesaria de las actividades y eventos.
5. Al dar clic en el botn de Misin mostrara el propsito de la actual Junta de
Accin Comunal.
6. Al dar clic en el botn de Visin mostrara como se espera que sea la actual
Junta de Accin Comunal en un futuro.
7. Al dar clic en el botn de galera mostrara las fotografas de los eventos que
realice la actual Junta de Accin Comunal y de las preocupaciones que hay en
el sector.
8. Al dar clic en el botn de Proyectos y programas mostrara los proyectos que
se encuentran en proceso en el sector.

1 2 3 4
5
6 7 8
6. CUERPO DE PGINA


En esta parte del sitio web, se pretende colocar toda la informacin o
contenido necesario segn el modulo en el que nos encontremos.
En ella pueden ir contenidos como:
- Texto
- Imgenes
- Publicidad
7. PIE DE PGINA

Esta parte del sitio web tiene como objetivo, dar la informacin necesaria
para conocer el responsable del diseo y sus polticas de uso.Est dividido
en tres partes:
- Derechos reservados
- Politicas de privacidad
- Terminos de uso.
- HTML
- CSS.
8. MENU PRINCIPAL



En el men principal podremos encontrar todas las novedades acerca de
los eventos realizados por la Junta y algunas definiciones y leyes bsicas,
como las imgenes de cada una de sus eventos.




9. CONSULTAR POR CONTACTENOS

El mdulo de contactos est dividido de la siguiente manera:
- Informacin del Presidente de la Junta
- Formulario para usuario interesado
- Botn de enviar
- Botn de borrar

Si el usuario desea contactar directamente con el presidente de la Junta lo
puede hacer por medio del nmero celular o por otra parte llenando el
formulario al cual se ingresaran los siguientes datos:
- NOMBRE: nombre de la persona interesada en contactar directamente al
gerente.

- E-MAIL: direccin de correo electrnico que sirve al gerente para dar
respuesta al cliente que tenga alguna inquietud acerca de lo que desea.

- TELEFONO: telefono de la persona interesada en contactar directamente
al gerente.
- MENSAJE: mensaje del usuario para resolver sus problemas dudas o
inconvenientes.

10. CONSULTAR PREGUNTAS FRECUENTES


Seccin donde se responden a las preguntas mas comunes hechas en la
comunidad.






11. CONSULTAR POR NOTICIAS


En el mdulo de Noticias el usuario interesado podr ver las noticias mas
importantes para el sector, con toda la informacin necesaria de las
actividades y eventos.


12. CONSULTAR POR MISION Y VISION


En esta pagina los usuarios podrn encontrar toda la informacin hacer de
la Misin y visin de la actual Junta de Accin Comunal.





13. CONSULTA DE GALERIA






En el mdulo de galera el usuario podr encontrar todas las imgenes
tomadas en un lbum interactivo y de fcil uso ; para ver una foto en
tamao real , solo basta con ir al lbum miniatura y pararse encima de la
imagen que deseamos ver y darle clic , automticamente la imagen tomara
su tamao real.
Botones de la galera
1. Botones de Alejar, Acercar, sin escala en orden de arriba abajo
respectivamente.
2. Descripcin de la imagen.
3. Botn pausa, es para detener la reproduccin del paso de imagenes.
4. Botones de atrs y siguiente imagen.
5. Thumbails o fotos miniaturas para elegir y poner en pantalla al hacer clic.
6. Barra de deslizamiento de los Thumbails.
7. Imagen en tamao real.
8. Boton poner pantalla completa o cerrar pantalla completa.
1
2
3
4
5
6
7
8
14. CONSULTA DE PROGRAMAS Y PROYECTOS