Universidad Politécnica del Valle de México

Materia: Administración Empresa: La Web-@ Integrantes: Guadalupe Isidro Soriano Abigail Castro Morales Oscar Gerardo Godínez César Daniel Carbajal Acosta

N° de matricula: 1308060102 1308060222 1308060031

Cuatrimestre: 4°

1

Indice

2

INTRODUCCIÓN Este trabajo es el conjunto de lo que se fue realizado a lo largo del curso, con el fin de entender cada fase del proceso administrativo(Planeación, Organización, Dirección, Integración, Control), por medio de la simulación de la creación de una empresa, llevando cada fase como se haría en el ambiente laboral . También se integra lo que son las teorías de la calidad, y el como deben ser aplicadas en nuestra empresa, para un optimo funcionamiento de la misma. En conclusión este trabajo abarca, desde lo que es la administración y el como se debe ir aplicando a una empresa para que su crecimiento se lo mejor posible, logrando las metas en lo plazos fijados para llegar a ser una empresa de vanguardia.

3

4

OBJETIVO:

Obtener recursos monetarios, para recuperar el 100% de lo invertido en un plazo de un año y medio. MISIÓN: Elaborar paginas web, diseñando publicidad en línea, que cubra todas las necesidades del cliente, aplicando los recursos más recientes en el ramo de la programación y el diseño. VISIÓN Somos una pequeña empresa que día a día se innova, sigue creciendo y trabaja a un nivel estatal

5

FODA FUERZAS DEBILIDADES Conocimientos especializados Somos una pequeña empresa. en el diseño y programación de No tenemos las experiencia paginas web. necesaria para trabajar con macro-empresas.

OPORTUNIDADES AMENAZAS Es una necesidad cada vez Gran cantidad de competencia. mas grande para las empresas Innovación constante. anunciarse en la red.

6

POLÍTICAS

RRHH: Es responsabilidad del trabajador cumplir con el horario establecido. RRFF: Se debe llevar un control total de la entradas y salidas de los recursos financieros. RRTT: Todos los manuales y técnicas de programación son exclusivamente propiedad de la empresa. RRMM: Todo el equipo y componentes físicos que de encuentren dentro del lugar de trabajo será responsabilidad del trabajador cuidarlo y mantenerlo.

7

REGLAS RRHH: El trabajador tiene derecho a 30 min. de comida y dos días de descanso (sábado, domingo). El trabajador debe cumplir con sus obligaciones, de lo contrario, se le descontara un día de salario. RRFF: El trabajador tiene derecho a un salario base, prestaciones de ley y al pago de sus horas extras. Es obligación del trabajador y de la empresa contribuir con los impuestos ante hacienda. De lo contrario serán consignados ante la ley. RRTT: El trabajador tiene derecho a la información que se encuentre en los manuales pero tiene la obligación de cuidarlos, y recordar que son propiedad de la empresa, de no ser así será sancionado dependiendo del grado de la falta. RRMM: El trabajador tiene derecho a un lugar limpio y digno de trabajo para el desempeño de sus labores, con el equipo necesario, y es responsabilidad de este mantenerlo y en caso de algún daño deberá repararlo o reponerlo por uno de mayor o igual costo.

8

Contratación por el cliente Mantenimiento o Diseño Diseño

Mantenimiento

Decisión

Identificar corrección

Especificacion es Revisión

Hacer el diseño

Actualizar o mejorar

Datos

Decisión Multimedia

Programación

Decisión

Revisión cliente

Decisión

Si

No

Actualizar o mejorar

No Fotos

Decisión

Capturar editar

Videos

Capturar editar Revisión del cliente

Si

Contrato de espacio Decisión Subirlo

No

Si

Subirlo

Verificación

Verificación Decisión Si

Cobro

No

Decisión

No

Si

Cobro

9

Diseño de páginas Web “LA WEB- @” Balance General a enero de 2010

ACTIVO Circulante caja bancos mercancias Fijo mob y equipo equi de computo Diferido gastos de instalacion papeleria y utiles propaganda y publicidad Suma Activo =

$1,000.00 $5,000.00 $7,000.00

$5,750.00 $56,360.00

$2,200.00 $2,955.00 $1,000.00 $81,265.00

PASIVO Circualnte acrdedpres diversos gastos acum X pagar

$2,261.00 $1,500.00

Fijo impuestos acum X pagar

$5,239.00

Diferido rentas cob X antic.

$2,000.00

capital utilidad del ejercicio Suma Pasivo=

$68,265.00 $2,000.00 $81,265.00

10

Diseño de páginas Web “LA WEB- @” Estado de resultados a enero de 2010

ventas costo de ventas

$28,000.00 $5,000.00

utilidad bruta

$23,000.00

inventarios

$7,000.00

gastos de venta propaganda

$1,000.00

gastos de admon sueldos de of papeleria y utiles

$16,000.00 $2,000.00

utilidades de op intereses pagados

$2,000.00

$1,000.00

$18,000.00

$19,000.00 $4,000.00 -$2,000.00

-$2,000.00 UTILIDAD

$2,000.00

11

LISTADO DE ACTIVO FIJO computadora de escritorio laptop cañón de proyección pantalla de proyección office photo shop flash dream weaver visual basic. Net java scrip net met compaz adobe PDF brinder PDF silla de trabajo memoria USB escritorio cafetera multifuncional regulador cable UTP TOTAL

6500

L I S T A D O D E A C T I V O F I J O

13000 4500 1500 700 900 900 900 1000 1000 1000 800 800 600 90 800 150 1500 4000 60 40700

12

LISTADO DE ALMACEN

paquete de hojas

60

torre de CDS

110

manuales

250

lapiceros

30

puntillas

30

publicidad

1000

TOTAL

1480

13

14

ORGANIGRAMA

15

DESCRIPCIÒN DEL PUESTO

Puesto:

Diseñador

Reporta: Representante legal Supervisa: Programador DESCRIPCIÒN GENERAL DEL PUESTO Diseñar paginas web de acuerdo con las especificaciones del cliente

16

DESCRIPCIÒN ESPECIFICA DEL PUESTO 1.- Diseñar paginas web cada que el cliente lo desee 2.- Se desarrollaran de acuerdo a las especificaciones del representante siendo estas ordenadas con un folio. Al final del día se entregara una lista de avances a los representantes. 3.- Una vez diseñado se pasara el área de programación con el mismo folio designado; el proyecto debe ser entregado en forma de boceto, se deberá entregar una copia del mismo al representante legal. 4.- Después de este proceso se pasara el área de calidad para decidir si se harán cambios. 5.- finalmente se entregara el proyecto al representante junto con una lista de las horas invertidas en el 17

HTML MANUAL

18

CONTENIDOS Qué es HTML Cómo especificar efectos del texto Estructura básica de un documento HTML Estilos y efectos básicos Títulos Atributos del texto Listas Varios Enlaces y gráficos Introducción Qué es un URL Enlaces Gráficos Caracteres especiales

19

QUÉ ES HTML HTML (HyperText Markup Language) es un lenguaje muy sencillo que permite describir hipertexto, es decir, texto presentado de forma estructurada y agradable, con enlaces (hyperlinks) que conducen a otros documentos o fuentes de información relacionadas, y con inserciones multimedia (gráficos, sonido...) La descripción se basa en especificar en el texto la estructura lógica del contenido (títulos, párrafos de texto normal, enumeraciones, definiciones, citas, etc.) así como los diferentes efectos que se quieren dar (especificar los lugares del documento donde se debe poner cursiva, negrita, o un gráfico determinado) y dejar que luego la presentación final de dicho hipertexto se realice por un programa especializado (como Mosaic, o Netscape).

CÓMO ESPECIFICAR EFECTOS DEL TEXTO La mayoría de los efectos se especifican de la misma forma: rodeando el texto que se quiere marcar entre dos etiquetas o directivas (tags, en inglés), que definen el efecto o unidad lógica que se desea. Las etiquetas están formadas por determinados códigos metidos entre los signos < y >, y con la barra / cuando se trata de la segunda etiqueta de un efecto (la de cierre). Por ejemplo: <efecto> para abrir y para cerrar. Ciertas directivas sólo se ponen una vez en el lugar del texto donde queramos que aparezca el efecto concreto. Esto es lo que ocurre, por ejemplo, cuando queremos poner un gráfico, caso en el que se usa algo parecido a <poner_gráfico_aquí> (más adelante ya veremos la directiva concreta que se utiliza). A veces es necesario ofrecer datos adicionales en una directiva. Por ejemplo, cuando se define un hiperenlace hay que especificar su destino. Para ello se incluyen parámetros en la directiva inicial (la de apertura), de la siguiente forma: <efecto parametro1 parametro2 ...>. La directiva de cierre, caso de ser necesaria, queda como antes: . Más adelante en el presente documento se muestra el efecto de las directivas más usadas en la creación de un documento HTML. Para cada una de ellas, primero se muestra el texto fuente, y bajo éste, el efecto que produce.

20

ESTRUCTURA BÁSICA DE UN DOCUMENTO HTML Un documento HTML comienza con la etiqueta , y termina con . Dentro del documento (entre las etiquetas de principio y fin de html), hay dos zonas bien diferenciadas: el encabezamiento, delimitado por y , que sirve para definir diversos valores válidos en todo el documento; y el cuerpo, delimitado por y , donde reside la información del documento. La única utilidad del encabezamiento en la que nos detendremos es la directiva en minúsculas. Obsérvese que el título que encabeza este texto se ha escrito con mayúsculas, para distinguirlo del título global del documento. El cuerpo de un documento HTML contiene el texto que, con la presentación y los efectos que se decidan, se presentará ante el hiperlector. Dentro del cuerpo son aplicables todos los efectos que se van a mencionar en el resto de esta guía. Dichos efectos se especifican exclusivamente a través de directivas. Esto quiere decir que los espacios, tabulaciones y retornos de carro que se introduzcan en el fichero fuente no tienen ningún efecto a la hora de la presentación final del documento. Por ejemplo, escribiendo: Estas palabras forman una frase. producimos exactamente lo mismo que con: Estas palabras forman una frase. A la hora de la verdad lo que se ve es: Estas palabras forman una frase. En resumen, la estructura básica de un documento HTML queda de la forma siguiente: Texto del documento, menciones a gráficos, enlaces, etc.

21

ESTILOS Y EFECTOS BÁSICOS Como ya hemos dicho, la estructura lógica del texto y los diferentes efectos que se le apliquen se especifican mediante directivas. En este punto vamos a repasar algunas de las más importantes. En cada uno de los casos que veremos, primero se presenta el texto original HTML, es decir, lo que nosotros editamos, con las directivas situadas en los lugares adecuados; y después se presenta el efecto que dicho texto fuente produce una vez que se interpreta y se representa con el programa adecuado.

TÍTULOS Mediante los títulos, en sus diferentes niveles de importancia, podemos definir el esqueleto del documento, su estructura básica.

Mucha importancia

Mucha importancia

Menos importancia

Menos importancia

Mucha menos importancia

Mucha menos importancia

22

ATRIBUTOS DEL TEXTO Mediante estos atributos determinamos el estilo y el tipo de letra que tendrá la presentación del documento final. El primero en el que nos deberíamos detener es el texto normal entendiendo como tal el que no tiene ninguna característica especial. Para definir un párrafo como normal no es necesario poner ninguna etiqueta. Lo único que hay que tener en cuenta, como ya se ha dicho antes, es que al presentar el documento se hace caso omiso de los espacios, tabulaciones y retornos de carro que se encuentren en el texto fuente. Por ello cuando se quiera forzar un final de línea es necesario utilizar dos directivas especiales:

para marcar un fin de párrafo, y
para un único retorno de carro. La diferencia entre ambas es que la separación de líneas que provoca

es algo mayor que la de
, para que los párrafos se distingan bien entre sí. Las dos directivas mencionadas se sitúan en el punto en que queremos poner la separación. Por ejemplo: Este será un texto normal (párrafo 1, línea 1).
El primer párrafo estará formado por 2 líneas (párrafo 1, línea 2).

Este ya es el segundo párrafo (párrafo 2, línea 1).

Este será un texto normal (párrafo 1, línea 1). El primer párrafo estará formado por 2 líneas (párrafo 1, línea 2). Este ya es el segundo párrafo (párrafo 2, línea 1). Por supuesto, estas dos etiquetas se puede aplicar donde queramos, no sólo en el texto normal. El texto preformateado (etiqueta <pre>) se aplica cuando queremos que en la presentación final del documento se respeten los espacios y retornos de carro que hayamos puesto en el texto fuente. Además se utilizará un tipo de letra de espaciado fijo, parecido al de una máquina de escribir, más pequeño que el del texto normal. Este estilo de texto puede ser adecuado, por ejemplo, para una tabla numérica sencilla: <pre>Texto preformateado---------------------| 1 | 2 | 3 | 4 || 5 | 6 | 7 | 8 || 9 | 10 | 11 | 12 |---------------------Texto preformateado---------------------| 1 | 2 | 3 | 4 || 5 | 6 | 7 | 8 || 9 | 10 | 11 | 12 |--------------------Para hacer una cita textual dentro de nuestro documento, se puede utilizar la directiva

:

Muchos años después, frente al pelotón de fusilamiento,el coronel Aureliano Buendía había de recordar aquella tarde remotaen que su padre lo llevó a conocer el hielo.
(Gabriel García Márquez, Cien años de soledad)

Muchos años después, frente al pelotón de fusilamiento, el coronel Aureliano Buendía había de recordar aquella tarde remota en que su padre lo llevó a conocer el hielo. (Gabriel García Márquez, Cien años de soledad) Las direcciones de correo electrónico se suelen marcar con esta directiva:

Dirección: [email protected]

Dirección: [email protected] Se pueden dar también los atributos más tradicionales: negrita y cursiva: Esto en negrita y esto en cursiva Esto en negrita y esto en cursiva Se puede utilizar un tipo de letra similar al de una máquina de escribir: Máquina de escribir Máquina de escribir Para centrar texto (o, en general, cualquier cosa: un gráfico, por ejemplo) se usa la directiva : Verde que te quiero verde Verde que te quiero verde

23

LISTAS Las listas se definen de forma muy sencilla: se dice dónde empieza la lista, dónde empieza cada punto y dónde acaba la lista. Las etiquetas que se utilicen en cada caso deben aparecer al principio de línea, o al menos sin texto por delante (sólo espacios o tabulaciones). Podemos recurrir a tres tipos distintos de listas, cada una con una presentación diferente: no numeradas, numeradas y listas de definiciones (glosarios). Las listas se pueden anidar, es decir, en el lugar donde debería ir uno de los términos de la lista se pone una nueva lista, que por supuesto no tiene porqué ser del mismo tipo. Esto es una lista no numerada:

• Tomates
• Zanahorias
• Puerros

•Tomates •Zanahorias •Puerros Esto una lista numerada:

1. Miguel Induráin
2. Tony Rominger
3. Eugeni Berzin

12.Miguel Induráin 13.Tony Rominger 14.Eugeni Berzin Un glosario está formado por una serie de parejas de término (marcado con

al principio de línea) y definición (con

). Por ejemplo, podríamos crear un pequeño diccionario con los términos perro, gato y pescadilla, de la siguiente manera:

Perro (n. masc.)

Animal de cuatro patas que ladra.

Gato (n. masc.)

Animal de cuatro patas que maúlla y se lleva muy mal con el perro.

Pescadilla (n. fem.)

Animal que vive en el mar y está recubierto de escamas.

Perro (n. masc.) Animal de cuatro patas que ladra. Gato (n. masc.) Animal de cuatro patas que maúlla y se lleva muy mal con el perro. Pescadilla (n. fem.) Animal que vive en el mar y está recubierto de escamas.

24

VARIOS La directiva

---

sitúa en el documento una línea horizontal de separación. En este documento, por ejemplo, se han utilizado líneas horizontales para separar las diferentes secciones:

---

Para poner un comentario en un documento HTML, es decir, una aclaración que no aparece en la presentación final del documento, se encierra el texto que formará el comentario entre los símbolos . Por ejemplo, un caso típico podría ser: ENLACES Y GRÁFICOS Además de los muchos estilos y capacidades de presentación que nos ofrece HTML para estructurar el documento en sí, disponemos de varias directivas que nos permiten definir relaciones entre diferentes documentos y estructurar todo un conjunto de documentos para crear una unidad lógica. La facilidad para definir este tipo de enlaces es una de las razones de la potencia y versatilidad de HTML. Por la similitud de tratamiento que tienen los enlaces y los gráficos, tocaremos también en esta sección cómo pueden incluirse estos últimos en un documento. Los enlaces en HTML se expresan rodeando con la directiva el objeto (que puede ser un fragmento de texto o un gráfico) que vaya a servir como anclaje para el enlace. Por ejemplo, si marcamos con un gráfico, cuando en el documento final se pulse con el ratón sobre dicho gráfico saltaremos al objeto referenciado en el enlace: otro documento, un vídeo musical, o un servidor de información meteorológica.

25

QUÉ ES UN URL Para especificar de manera uniforme el objeto al que apunta nuestro enlace, se utiliza una forma estandarizada que se denomina URL (Uniform Resource Locator, es decir, Localizador Uniforme de Recursos ). Un URL está formado de la siguiente manera: esquema://maquina/ruta (en realidad, como se verá dentro de un momento, la barra / puede considerarse parte de la ruta). El esquema es un nombre que identifica el tipo de servicio que va a proporcionarse en el destino del enlace. La razón de esta aparente complicación es que el WW W pretende unificar el acceso a servicios de información que previamente eran incompatibles entre sí, como ftp, gopher o telnet. El esquema más utilizado es http, correspondiente al propio WW W (es decir, que cualquier referencia a un documento HTML debería comenzar con http://). Otros esquemas muy frecuentes son ftp, telnet, gopher o wais. La máquina y la ruta sirven para localizar el objeto al que apunta nuestro enlace. La máquina es la identificación del servidor en el cual está situado el objeto al que apunta el enlace. Puede ser simplemente el nombre de un ordenador (como www.etsit.upm.es) o también un nombre y un puerto (por ejemplo www.etsit.upm.es:8000). La ruta es el nombre del fichero que contiene el documento en concreto, incluyendo el nombre del subdirectorio en el que se encuentra. Los diferentes nombres que constituyan la ruta completa al archivo se deben separar con la barra / (inclinada hacia la derecha), tal y como se hace en el sistema operativo UNIX (y al revés que en MS-DOS). La razón de este convenio es precisamente que la mayor parte de los servidores de WWW que hay en Internet son ordenadores basados en UNIX, debido a la gran superioridad tecnológica de este sistema sobre MS-DOS. Esto se nota también en que por lo general los nombres de los ficheros no tienen muchas limitaciones: pueden ser casi tan largos como queramos, contener varios puntos, etc. Por ejemplo, el nombre de cierto fichero situado en un servidor podría ser /info/documentos/ciencia/fisica/relatividad.html. Debemos tener en cuenta que en UNIX las mayúsculas y las minúsculas son distintas en los nombres de los ficheros: no es igual FICHERO que fichero. Conviene que nos detengamos momentáneamente en la estructuración habitual de los ficheros en un servidor de WW W. Para empezar, siempre hay una página de bienvenida (home page) que podría compararse con la portada de un periódico o revista: si no sabemos exactamente qué es lo que buscamos, o no sabemos dónde encontrarlo, la portada es lo primero que vemos. Para acceder a la home page de cualquier servidor de WWW, basta con escribir una barra en el lugar de la ruta (es decir, reclamamos al servidor el directorio raíz). Por ejemplo, para acceder a la página de bienvenida de la ETSIT, hay que dirigirse a http://www.etsit.upm.es/, y para ir a la de la NASA habría que contactar con http://www.nasa.gov/. El resto de la información que se puede encontrar en un servidor de WWW se distribuye a partir de ese directorio raíz en distintos subdirectorios y archivos. Un convenio muy habitual relativo al nombre de los ficheros es hacer que los archivos que contengan documentos HTML terminen en .html.

26

ENLACES Con lo que ya hemos dicho, podemos abordar sin problemas el asunto que originalmente nos ocupaba: cómo se introducen enlaces en un documento HTML. Para definir un enlace es necesario marcar con la directiva el objeto del cual va a partir dicho enlace. Dicha directiva debe incluir el parámetro href="URL" para especificar el destino del enlace. Es decir, que antes del objeto elegido debemos abrir con , y después cerrar con . Por ejemplo, si queremos que el texto pulse aquí para visitar la NASA nos conduzca a la home page de la NASA, debemos escribir en nuestro texto HTML: Pulse aquí para visitar a la NASA Lo cual producirá el resultado: Por lo general no nos preocupa irnos tan lejos, sino sencillamente enlazar con otro documento que se encuentra en el mismo servidor, puede que incluso que en el mismo subdirectorio. En este caso no es necesario escribir el camino completo al destino del enlace, sino que basta con dar la mínima información imprescindible. El programa que se use para leer el documento final suele ser lo bastante listo como para deducir el resto. Es decir, que si desde cierto documento queremos enlazar con otro que se encuentra en el mismo subdirectorio, basta con poner su nombre: pulse aquí. O si se encuentra en otro subdirectorio del mismo servidor, es suficiente con poner pulse aquí. También pueden utilizarse rutas relativas: cosa.

27

GRÁFICOS Para incluir un gráfico en un documento HTML se utiliza la directiva . En dicha directiva debe incluirse un parámetro src="URL", con el cual indicamos dónde está el fichero con el gráfico concreto que queremos para nuestro documento. Esto pone a nuestra disposición una gran flexibilidad, ya que podemos complementar el contenido de nuestro documento tanto con gráficos que se encuentren disponibles en nuestro servidor de WW W como con una foto situada en un servidor de la NASA o del Ministerio de Cultura, por ejemplo, sin que el lector final tenga por qué apreciar ninguna diferencia. Existe alguna limitación respecto a los formatos gráficos que los programas lectores de HTML puede interpretar sin problemas. El formato fundamental es el GIF, que cualquier programa con capacidades gráficas debería poder mostrar directamente en nuestro texto (Mosaic y Netscape pueden hacerlo). Si utilizamos otro formato diferente, lo más probable es que cuando un lector esté accediendo al documento, el programa no comprenda ese formato y se tenga que solicitar la ayuda de otro programa, con lo cual al final el gráfico no se insertará en el lugar estratégico de nuestro documento, sino que aparecerá en otra ventana diferente. Hay un parámetro optativo de la directiva que sirve para proponer un texto alternativo a un gráfico. Este texto aparecerá cuando se esté usando para leer el HTML un programa sin capacidades gráficas (por ejemplo Lynx, que sólo trabaja con texto). Se trata de alt="texto". Conviene utilizarlo cuando los gráficos sirven como origen a hiperenlaces, porque si no los programas sin capacidades gráficas no podrían mostrar los enlaces que nosostros queremos. Como ocurría antes con los enlaces, por lo general no es necesario escribir el URL completo, sino que basta con dar la mínima información. Por ejemplo, para colocar en este punto del documento un monigote que está en el mismo subdirectorio que este manual, en el fichero monigote.gif, escribiremos:

Lo que se traduce en:

Como se ve, hemos especificado el texto alternativo "MONIGOTE", con lo cual una persona que no dispusiera del programa adecuado hubiera visto algo parecido a [MONIGOTE] en lugar del dibujo. Podemos también incluir un dibujo que esté en otro lugar especificando un URL completo, por ejemplo:

Y además podemos hacer que un gráfico sea un enlace, utilizando la directiva . En este caso no debemos olvidar utilizar la opción alt="texto" para que todos los usuarios puedan seguir el enlace:

28

CARACTERES ESPECIALES Durante todo este manual hemos hecho una pequeña trampa a la hora de explicar las directivas y poner ejemplos, para facilitar la comprensión de las ideas fundamentales sobre HTML. Dicha trampa ha consistido en ocultar ciertas exigencias de HTML respecto al uso de caracteres especiales, denominación que, para nuestra desgracia como hispanohablantes, incluye a las vocales acentuadas y a la letra eñe. Existen también ciertas limitaciones relativas al uso de ciertos símbolos que significan algo en HTML, como el de menor que (<) o el signo inglés de and (llamado ampersand: &). Trataremos primero el caso más sencillo. Existe una razón evidente que impide que podamos escribir ciertos símbolos directamente en un texto HTML, como por ejemplo el <: dichos símbolos tienen un significado en HTML, y es necesario diferenciar claramente cuándo poseen ese significado y cuándo queremos que aparezcan literalmente en el documento final. Por ejemplo, como ya sabemos, < indica el comienzo de una directiva, y, por ello, si queremos que aparezca en el texto como tal tendremos que dar un rodeo escribiendo algo que no de lugar a confusión, en este caso <. Los símbolos afectados por esta limitación, y la forma de escribirlos, se detallan a continuación: •

< (Menor que): <

•

> (Mayor que): >

•

& (símbolo de and, o ampersand): &

•

" (comillas dobles): "

Es decir, que para escribir <"> en nuestro texto HTML original debemos poner <">. El otro caso especial se da cuando en un texto HTML se quiere escribir una eñe, por ejemplo. Existen dos formas de hacerlo. La primera, que es a la que obliga el estándar de HTML, consiste en utilizar entidades, es decir, palabrejas como las que antes se presentaron para escribir ciertos símbolos. Las entidades comienzan siempre con el símbolo &, y terminan con un punto y coma (;). Entre medias va un identificador del carácter que queremos que se escriba. Las entidades necesarias en nuestro idioma son:

29

•

á: á

•

é: é

•

í: í

•

ó: ó

•

ú: ú

•

Á: Á

•

É: É

•

Í: Í

•

Ó: Ó

•

Ú: Ú

•

ü: ü

•

Ü: Ü

•

ñ: ñ

•

Ñ: Ñ

•

¿: ¿

•

¡: ¡

Como puede verse, las vocales acentuadas se identifican añadiendo el sufijo acute a la vocal sin acentuar (puesto que se trata de un acento agudo). Para la u con diéresis y la eñe se usan uml tras una u y tilde detrás una ene, respectivamente. La equivalencia de los signos de abrir interrogación y exclamación es algo más oscura: a falta de una denominación más evidente, tenemos que usar el valor numérico de dichos caracteres en el código estándar latin1 (ISO-8859-1). Esto se puede hacer con cualquier otro carácter del código latin1, que es el código de caracteres básico en HTML, escribiendo &#numero;.

La segunda manera, que sin duda es más cómoda, consiste en no preocuparse por esta limitación y escribir literalmente los caracteres afectados. A pesar de que este método suele funcionar en las conexiones WW W directas (porque el protocolo HTTP, que transporta el HTML por los vericuetos de Internet, requiere un canal de 8 bits), no tiene por qué funcionar bien cuando los documentos HTML se envían por correo electrónico, por ejemplo. Por tanto, y a pesar de los inconvenientes, es absolutamente recomendable respetar la norma especificada en HTML.

30

En cualquier caso, no resulta muy complicado escribir un programa que traduzca todas las apariciones de los caracteres especiales por sus correspondientes entidades HTML, o viceversa. Con un programa así, uno puede escribir los documentos sin preocuparse por estos problemas, y luego traducir a HTML correcto. Volviendo al reconocimiento de culpa que antes de hizo por haber ocultado estos detallitos, debemos decir que muchos de los ejemplos que antes se pusieron no eran totalmente correctos. Por ejemplo, cuando se escribió:

Animal de cuatro patas que maúlla y se lleva muy mal con el perro. En realidad debería haberse puesto:

Animal de cuatro patas que maúlla y se lleva muy mal con el perro. Y en lugar de: Pulse aquí para visitar a la NASA Debería haberse escrito: Pulse aquí para visitar a la NASA

31

La Web-@ Se solicita diseñador web Edad: 21 en adelante Sexo: Indistinto Escolaridad: Licenciatura en diseño grafico comunicación o afín Sin necesidad de experiencia. Conocimientos indispensables en: Dreamwever Illustrator Flash Photoshop Html Actionscript Ingles mínimo: 70% leído Características: Creatividad Muy organizado Acostumbrado a trabajar por objetivos Con amplio sentido de la responsabilidad Trabajar en equipo Ofrecemos: Sueldo 70 por hora Excelente ambiente de trabajo Lugar de trabajo: Calle Canosas Lote 13 Casa1 segunda planta Los Héroes Coacalco Interesados comunicarse: al 58693344 con el Ing. César Daniel Carbajal Acosta ó mandar su curriculum el correo [email protected]

32

REQUERIMIENTOS DEL PUESTO Puesto: diseñador RRHH Nivel académico: profesional en diseña grafico y web Edad: 20 – 40 años Experiencia: 6 meses Sexo: indistinto Horario disponible Documentación: Identificación oficial Curriculum Curp

33

RRMM Silla de trabajo $600 Escritorio $800 PC $7000 Total $8400 RRTT Experiencia con distintos programas de diseño y tecnicas innovadoras. Manual de Dreamweaver Manual de Ilustrador Manual de Flash Manual de Photoshop Manual de HTML Manual de Fireworks Manual de ActionScript ( deseable actionscript 3) RRFF Salario: $ 70 por hora + 25% de prestación + costo de RRMM

34

35

36

EXAMEN DE CONOCIMIENTOS

1.- Describa los pasos para realizar una imagen animada.

2.- Describa como agregar sonidos a una página Web

3.- Como mejorar una pagina Web existente 4.- Describe los pasos para subir el diseño de la pagina a la Web

5.- Anote el software de diseño que usted maneja.

6.- Cuales son de los principales comandos para los siguientes programas:

37

EXAMEN DE CONOCIMIENTOS

1.- Describa los pasos para realizar una imagen animada. 1) Seleccionar las imágenes que queremos que incluya el GIF (al menos dos). 2) Si no están en formato GIF (BMP, JPEG, etc.), convertirlas a formato GIF y Reducir su tamaño, si es necesario. 3) Usar un programa de creación de imágenes GIF para transformar estas imágenes que hemos seleccionado en una única imagen GIF animada. 2.- Describa como agregar sonidos a una página Web Existen varias formas de insertar sonidos ya que los formatos son variados Un ejemplo en HTML seria: <EMBED>: Este comando delimita un cuadro que permite la inserción de objetos directamente en la página HTML. Los objetos incluidos son manejados por aplicaciones externas a la página, algunas aplicaciones adicionales: WebFX, Paper Software para ver dos mundos VRML (Virtual Reality Modeling Language), Addobe Acrobat para documentos PDF,y macromedia directo para multimedia, en nuestro caso, nos referiremos a aplicaciones de audio exclusivamente. Atributos SCR. Localización del archivo ALIGN. Alinea el objeto en la página (top, middle, bottom, baseline) HEIGHT. Altura del objeto WIDTH. Ancho del objeto Autostart. Permite decidir la ejecución automática o manual. Ejemplo de uso del formato del comando: <EMBED SRC="BLUES.MID" height="60" width="144" autostart="true" > 3.- Como mejorar una pagina Web existente Se debe de identificar cual es el problema o opción a aplicar o mejorar Pensar SIEMPRE desde el punto de vista del usuario. Quizá tú crees que tu página principal tiene un diseño muy atractivo, pero cuando el usuario cae en ella esta tarda mucho en cargar (si tarda más de 15 segundos estás acabado), o hay excesiva publicidad, o se le abren ventanas emergentes, o no encuentra bien clasificada y ordenada la información. Es muy importante hacer que tu Web sea accesible desde todos los buscadores, pero más importante es que los que hayan visitado por primera vez tu página piensen en volver a hacerlo otro día.

38

4.- Describe los pasos para subir el diseño de la pagina a la Web Ya diseñada la pagina se debe elegir un hosting y registrar un dominio Lo siguiente es descargar un programa FTP para subir archivos. Abrimos el SmartFTP y donde dice “Address” (“Servidor” si esta en español) ponemos la dirección FTP que nos proporciono nuestro hosting, en “Login” (“Usuario” en español) ponemos nuestro nombre de usuario que nos da el hosting para acceder vía FTP y en “Password” (“Contraseña” en Español) ingresamos la contraseña proporcionada, una vez hecho esto damos un clic a “Connect” (“Conectar” si esta en Español) o presionamos ENTER. Si todo fue bien veremos una varias carpetas, una de ella debe ser “public_html” o “htdocs”, ahí es donde deberemos subir todos los archivos de nuestra página Web. Como pueden observar, hay dos ventanas donde se ven carpetas (izquierda y derecha), en la ventana izquierda están las carpetas de nuestra computadora y en la derecha las de nuestro sitio web. En la ventana izquierda debemos navegar hasta la carpeta donde tenemos nuestro sitio y seleccionar todos los archivos, una vez que tengamos TODOS los archivos de nuestra página seleccionados deberemos arrastrarlos dentro de la carpeta “public_html” o “htdocs” según el caso. Si llegaste hasta este punto significa que ya tenes tu página web en el servidor y ya podes acceder a ella desde el navegador Web. 5.- Anote el software de diseño que usted maneja. Adobe photoshop, java, flash, Dreamweaver, Corel Ventura, photo impact, GIMP shop, canvas, Zoner draw. 6.- Cuales son de los principales comandos para los siguientes programas: JAVA: main(),paint(),repaint(),update(),import java.awt.*;import java.awt.event.*; DREAMWEAVER: (Size), (Format), (Font Combination), (Left, Center, Right), (Text Color) HTML:

to

---

<iframe>

<map> <menu>

39

40

41

42

43

44

45

46

47

48

INTEGRACION DE RECURSOS FINANCIEROS APORTACIONES DE LOS SOCIOS

$68,265.00

54%

VENTAS

$28,000.00

22%

PROVEDORES

$30,600.00

24%

$126,865.00

100%

TOTAL

49

50

COMUNICACIÓN Es un proceso a través del cual se transmite y se recibe información en un grupo social. Es la manera en que las personas se relacionan entre sí y conjugan sus esfuerzos. La comunicación puede ser entendida como la función indispensable de las personas y de las organizaciones mediante la cual la organización o el organismo se relaciona consigo mismo y su ambiente y relaciona sus partes y sus procesos internos uno con otro. Esta puede ser oral, escrita o por medio de señales o dispositivos. ELEMENTOS DEL PROCESO DECOMUNICACIÓN.

Idea

Codificación

Transmisión

Recepción

Decodificación

Acción

Retroalimentación

51

El primer paso: Es la IDEA del emisor, esto se refiere al contenido de lo que quiere decir en el mensaje que desea transmitir. En el segundo paso: Es la CODIFICACIÓN, el emisor organiza sus ideas en una serie de símbolos, diseñados para comunicarse con los receptores deseados. Elige palabras o frases adecuadas que pueden ser comprendidas por el receptor y también elige el medio apropiado que deba emplear (platica, memorando, conferencia, entre otros). El tercer paso: Es la TRANSMISIÓN del mensaje codificado por los canales seleccionados (palabras, escritos, símbolos). En el cuarto paso: El RECEPTOR entra en el proceso. Se sintoniza para recibir el mensaje; si el receptor no funciona, el mensaje se pierde. En el quinto paso: DECODIFICACIÓN se cambian las palabras por ideas, las cuales pueden no estar de acuerdo con lo que el emisor codifico originalmente, debido a la diferencia en percepciones entre este y el receptor en cuanto a la semántica o significado de las palabras. En el sexto paso: El receptor ACTÚA o responde. Puede archivar la información, pedir que se amplié o emprender cualquier otra opción. Puede no haber certeza de que la comunicación haya tenido lugar a menos que exista cierto tipo de RETROALIMENTACIÓN para el emisor en la forma de un acuse de recibo del mensaje.

52

BARRERAS DE LA COMUNICACIÓN Para lograr nuestro propósito de comunicarnos, necesitamos sistemas de comunicación eficaces, cualquier comunicación desvirtuada origina confusiones o errores que disminuyen el rendimiento del grupo y van en detrimento del logro de nuestros objetivos. En la comunicación intervienen múltiples interacciones que abarcan desde conversaciones informales hasta sistemas de información más complicados. Durante el proceso de comunicación pueden presentarse ciertos obstáculos que la dificultan y que es necesario detectar para evitarlos y lograr una comunicación eficiente; a dichos obstáculos se les denomina como barreras de comunicación y se clasifican en: •SEMANTICAS.- Es la parte de la lingüística que se encarga de estudiar el significado de las palabras; muchas de ellas tienen oficialmente varios significados. El emisor puede emplear las palabras con determinados significados, pero el receptor, por diversos factores, puede interpretarlas de manera distinta o no entenderlas, lo cual influye en una deformación o deficiencia del mensaje. •BARRERAS FISICAS.- son las circunstancias que se presentan no en las personas, sino en el medio ambiente y que impiden una buena comunicación: ruidos, iluminación, distancia, falla o deficiencia de los medios que se utilizan para transmitir un mensaje: teléfono, micrófono, grabadora, televisión, entre otros. •FISIOLOGICAS.- son las deficiencias que se encuentran en las personas, ya sea del emisor (voz débil, pronunciación defectuosa) o del receptor (sordera, problemas visuales, entre otros.) Son factores frecuentes que entorpecen o deforman la comunicación.

53

•PSICOLOGICAS.- Representan la situación psicológica particular del emisor o receptor de la información, ocasionada a veces por agrado o rechazo hacia el receptor o emisor, según sea el caso, o incluso al mensaje que se comunica; la deficiencia o deformación puede deberse también a estados emocionales (temor, odio, tristeza, alegría) o a prejuicios para aprobar o desaprobar lo que se le dice, no lea lo que está escrito, no entienda o no crea lo que oye o lee. Alto estatus, Poder para emplear o despedir, sarcasmo, actitud despótica, críticas, apariencia física imponente. •ADMINISTRATIVO.- Las barreras pueden ser por la falta de planeación, supuestos no aclarados, distorsiones semánticas, expresión deficiente, pérdida en la transmisión y mala retención, escuchar mal y evaluación prematura, comunicación impersonal, desconfianza, amenaza y temor; periodo insuficiente para ajustarse al cambio; o sobrecarga de información.

NIVELES DE COMUNICACIÓN Hay quienes manejan niveles de comunicación como la: •a). FORMAL.- Es la que se da en un ámbito impersonal y debido a las relaciones de trabajo en las que no interviene el afecto o la simpatía. •b). INFORMAL.- Se da de manera personal y puede ser resultado de alguna afinidad (de edades, de caracteres, de estudios, entre otros). No intervienen en ella las relaciones de trabajo. •c). VERTICAL.-Es la que se da de manera ascendente (de jefes o directivos a subordinados, debe de ser recíproca para que tenga fluidez dentro de la organización). •d). HORIZONTAL.- Es la que se da a nivel departamental al mismo nivel.

54

TIPOS DE COMUNICACIÓN •Comunicación intrapersonal : Son las imágenes mentales como instrumento al servicio del pensamiento de cada individuo. •Comunicación interpersonal: Es la capacidad humana de utilizar sonidos articulados como medio de comunicación y convivencia. Se considera el lenguaje como algo central en la organización de la vida social. La comunicación no verbal también muestra como el lenguaje del cuerpo es básico para el funcionamiento armónico de la interacción social (la simpatía y el afecto se expresan en general de este modo). •Comunicación de grupo: Es la que se da entre diferentes tipos de seres humanos al interrelacionarse con uno u otro propósito. •Comunicación masiva: Es la dirigida hacia un gran número de receptores y la cual busca comunicar algo de interés general. Recientemente se ha dado un interés creciente por el discurso. •Comunicación intermedia: Es la que existe entre los individuos de un mismo status, por ejemplo: secretarias de una oficina, empleados de un mismo nivel, vecinos.

55

Diseño de páginas Web “LA WEB- @” Estado de resultados a enero de 2010

ventas costo de ventas

$28,000.00 $5,000.00

utilidad bruta

$23,000.00

inventarios

$7,000.00

gastos de venta propaganda

$1,000.00

gastos de admon sueldos de of papeleria y utiles

$16,000.00 $2,000.00

utilidades de op intereses pagados

$2,000.00

$1,000.00

$18,000.00

$19,000.00 $4,000.00 -$2,000.00

-$2,000.00 UTILIDAD

$2,000.00

56

Diseño de páginas Web “LA WEB- @” Balance General a enero de 2010

ACTIVO Circulante caja bancos mercancias Fijo mob y equipo equi de computo Diferido gastos de instalacion papeleria y utiles propaganda y publicidad Suma Activo =

$1,000.00 $5,000.00 $7,000.00

$5,750.00 $56,360.00

$2,200.00 $2,955.00 $1,000.00 $81,265.00

PASIVO Circualnte acrdedpres diversos gastos acum X pagar

$2,261.00 $1,500.00

Fijo impuestos acum X pagar

$5,239.00

Diferido rentas cob X antic.

$2,000.00

capital utilidad del ejercicio Suma Pasivo=

$68,265.00 $2,000.00 $81,265.00

57

prueba del acido activo corrienteinventario pasivo corriente

13000-7000 3761

1.59

Mide si estamos aptos para pedir un préstamo El índice de esta formula es de 1.5 lo que quiere decir Que por cada peso tenemos 1.5 de respaldo. Pero aquí podemos apreciar que si se cumple la regla. margen bruto de utilidad ventas-costo de lo vendido ventas

28000-5000 28000

0.82

Mide que es redituable nuestro producto Los gastos no debes ser mayores que nuestras ventas Aquí vemos que esta por debajo del uno lo cual es optimo

58

razón de endeudamiento pasivo total activo total

13000 81265

0.15

Mide que tan endeudados estamos, el índice Debe de estar debajo del uno índice de solvencia activo circulante pasivo circulante

13000 3761

3.4

Mide el efectivo o lo que rápidamente puede Ser convertido en efectivo debe ser mas de uno, Por que eso quiere decir que tenemos mas de lo que Tenemos que pagar riesgo en moneda extranjera pasivo en moneda extranjera pasivo total

0 81265

0

Mide las deudas que tenemos en moneda extranjera Se recomienda que se menor a uno . 59

60

Autor

Contexto

Teoría

Características

Aplicación

CROSBY

1926 Wheeling Virginia, Trabajo en Crosley, Martin Marietta e ITT

“Cero Defectos”

Las 6 C de Crosby Compresión, Competencia, Compromiso, Comunicación, Corrección, Continuidad. La 3T :Tiempo, Talento; Tesoro

En nuestra empresa se aplicara esta teoría teniendo en cuenta que con nuestros clientes debemos tener la compresión, sobreponernos a la competencia, cumplir con nuestros compromisos, teniendo buena comunicación, continuidad, haciéndolo correctamente dentro y fuera de la empresa para tener un buen nivel de calidad.

61

Autor

Contexto

Teoría

Características

Aplicación

JURAN

Braila, Rumania 1904 Trabajó de consultor y expositor, y en Western Electronic

“Trilogía de Calidad”

Tiene tres tipos de acciones Control de calidad, Mejora de Nivel, Planeación de Calidad.

Control de calidad: Se pretende que nuestro trabajo tenga la debida calidad . Mejora de nivel: Es la mejora día a día, de nuestro trabajo para alcanzar la excelencia. Planeación de calidad: Crear estándares para que nuestro trabajo sea del mismo nivel.

62

Autor

Contexto

Teoría

Características

Aplicación

DEMING

1900 Siux City E.U.A Estudio en la universidad de Wyoming trabajó en el departamento de agricultura de Washington

“14 puntos para la gestión de calidad”

Mejora la constancia, adoptando una nueva filosofía de educación; instituyendo capacitaciones de trabajo en equipo para mejorar los sistemas de producción y servicio. No depender de las inspección masiva y derribar las barreras en el trabajo y de forma personal.

Mejorar la organización desde un nivel filosófico, así como mejorar aptitudes de nuestros empleados por medio de capacitaciones; por lo tanto se aumentara la calidad ofrecida por nuestra empresa.

63

Autor

Contexto

Teoría

Características

Aplicación

Corporation XEROX

1979

“Benchmar king”

Su propósito general es crear corporaciones del desempeño usando mecanismos de incentivos al comportamiento eficiente y hacer publicidad de los resultados de las comparaciones.

Con esta teoría se pretende ser continuos en nuestro desempeño ya que en nuestro alrededor hay mucha competencia en el mercado laboral.

64

Autor

Contexto

Teoría

Características

Aplicación

MICHEL HAMMER

Establece dos argumentos controles: Argumento proaccion, Argumento pro-visión.

“Reingeniería ”

Conceptos :Fundamental , Radical, espectacular, proceso, espectaculares, de valor agregado, tiempo de respuesta, requisitos y costos. 1.- Mejora espectaculares 2.- Admón. de valor agregado, 3.- Mejora tiempo de respuesta. 4.Simplificar requisitos, 5.Disminuir costos.

Se aplicara en caso de que nuestra organización requiera ajustes en su estructura, para estar a la vanguardia.

65

Autor

Contexto

Teoría

Características

Aplicación

La calidad se orienta a desarrollar la capital intelectual de la empresa.

“Rearquitectura ”

Hacer un reingeniería de la mente de los administradores y romper las estructuras. Buscando formas para llegar con el cliente, cambiar los rasgos de trasmisión del paradigma de la revolución industrial y le la revolución de conocimientos

En nuestra empresa se aplicara esta teoría en caso de que allá problemas de organización entre las estructuras físicas de los diferentes puestos.

66

Autor

Contexto

Teoría

Características

Aplicación

KAISEN

Originado en Japón Las 5s son uno de los 3 pilares en el enfoque de sentido común y bajo costo hacia el mejor rendimiento.

Las 5 s

Organizar es un sistema enfocado a la mejora continua, ya que arregla orden junto a la limpieza, lo cual otorga la calidad y poder clasificar a un nivel estandarizado Seiron (Clasificar) Seiton (Organizar) Seiso (Limpieza) Seike (Estandarizar) Shitsoke (Disciplina)

Esta teoría se aplicara para realizar el trabajo con mayor calidad y rapidez, se empezara por clasificar el trabajo por prioridad, después organizar a los trabajadores para que no se pierda el tiempo, cada trabajador tendrá la obligación de tener su lugar en orden para agilizar el trabajo . Todos los trabajos se entregaran en el mimo formato. Jefe y trabajador se trataran con el debido respeto, para no perder la disciplina.

67

Nombre

Diagrama Causa-Efecto

Ejemplo

Características

Aplicación

Muestra las interrelaciones entre un efecto y su posible causa de forma ordenada, clara, precisa y de un solo golpe. Muestra posibles interrelaciones entre un efecto causa permitiendo una mejor compresión del fenómeno a estudio.

Esta herramienta será utilizada para poder tener soluciones en caso de que no allá una buena comunicación o relación dentro de la empresa.

68

Nombre Diagrama de Dispersión

Ejemplo

Características

Aplicación

Muestra la posibilidad de la existencia de correlaciones entre dos variables de un vistazo. Simplifica el análisis de situaciones numéricas complejas

Se usara el diagrama de dispersión para ver como ha ido evolucionando la empresa en base a la cantidad de ventas dentro de un tiempo determinado

69

Nombre

Diagrama de flujo

Ejemplo

Características

Aplicación

Capacidad de comunicación. Permite la puesta en común de conocimientos individuales sobre un proceso y facilita la mejor compresión global del mismo.

Se usara para ver los errores en nuestro proceso, identificarlos y buscar una solución.

70

Nombre Diagrama de pareto.

Ejemplo

Características

Aplicación

Priorización. Identifica los elementos que mas peso o importancia tienen dentro de un grupo. Enfoca y dirige el esfuerzo de los componentes del grupo de trabajo hacia un objetivo prioritario común.

Se usara para identificar soluciones a los problemas de mayor importancia y enfocarnos a modificar y mejorar nuestra estructura.

71

Nombre Histograma

Ejemplo

Características Síntesis Permite resumir grandes cantidades de datos Análisis Permite el análisis de los datos evidenciando esquemas de comportamiento y pautas de variación que son difíciles de captar en una tabla numérica. Permite comunicar información de forma clara y sencilla sobre situaciones complejas.

Esta herramienta nos sirve para mejorar, ya que el Histograma nos permite ver cambios de comportamiento en todos nuestros recursos.

72