UNIVERSIDAD TECNOLÓGICA DE QUERÉTARO

Tamaño: px
Comenzar la demostración a partir de la página:

Download "UNIVERSIDAD TECNOLÓGICA DE QUERÉTARO"

Transcripción

1 UNIVERSIDAD TECNOLÓGICA DE QUERÉTARO Nombre del proyecto: PLANEACIÓN ESTRATÉGICA Empresa: BOSS TECNOLOGÍA INFORMÁTICA Memoria que como parte de los requisitos para obtener el título de: INGENIERO EN INNOVACIÓN Y DESARROLLO EMPRESARIAL Presenta: RICARDO BORIS HERNÁNDEZ SÁNCHEZ Asesor de la UTEQ M.A. Luis Adolfo Gutiérrez Pérez Asesor de Empresa Lic. Fernando Hernández Sánchez Santiago de Querétaro, Qro. Junio del 2013

2 Resumen Este trabajo describe la planeación, desarrollo e implementación del proyecto de website comercial para BOSS Tecnología Informática, el cual consiste en una programación, redacción y diseño sin base previa del primer portal web de la empresa, como parte de un proyecto mayor que contempla una formalización de su imagen corporativa, estrategias de mercadeo y posicionamiento, cuyo objetivo principal es promover y publicar los servicios que la empresa ofrece y realiza, segmentando áreas dedicadas por el giro de los servicios y por el segmento al que se encuentran dirigidos. El desarrollo contempla la definición y redacción de contenido, diseño de interface gráfica y programación del código necesario para la estructura de la página. Finalmente el prototipo se coloca en estado beta fuera del alcance general de las redes de internet, cuya finalidad es permitir el acceso solo a un grupo tester que realice pruebas de funcionalidad, desempeño, experiencia de usuario y contenido, tras lo cual se realizaran las correcciones y recomendaciones que grupo tester hubiese solicitado. Tras la corrección y aprobación del proyecto, será decisión de los administradores de la empresa fijar la fecha de lanzamiento de sitio web para así habilitarlo para su visita abierta al público mundial. (Palabras clave: tesis, diseño, web, mercadeo) 1

3 Astract This project describes the planning, development and implementation of the commercial website for BOSS Tecnología Informática, which consists in programming, writing and design without prior basis of the first web site of the company, as part of a larger project that includes an image corporate formalization, marketing and positioning strategies, whose main objective is to promote and publicize the services that the company provides and performs, choosing dedicated areas by the line of business services and the segment to which they are directed. The development includes definition and content writing, graphic design and programming interface code to the page structure. Finally a beta prototype is placed outside of the general scope of Internet networks, which aims to allow access only to a tester team, to test the functionality, performance, user experience and content, after which, corrections and recommendations a tester team had requested will be made. After correction and the project approval, it will be up to the company managers to set the website launch date to enable the visit and opening to the public worldwide. 2

4 Dedicatorias Un hombre nunca alcanzaría su máxima grandeza ni sus más grandes logros sin antes reconocer que necesita ayuda para lograrlo, así pues dedico este trabajo a las personas cuyo apoyo fugaz o continuo aportaron lo necesario para impulsar y apoyar la culminación y acreditación de mis estudios en esta universidad. 3

5 Agradecimientos En especial agradezco a mis padres, cuyo apoyo y amor recibí de variadas maneras, a mi esposa cuya fortaleza y determinación siempre me han ayudado en los momentos de duda, a mi amigo Luis Adolfo quien me brindo su más sincero apoyo y amistad en todo momento, a mi hermano Luis Alberto quien nunca perdió la fe ni la confianza en mí, a mis hijos quienes son mi motivación genuina, a mi amiga Paola Gudiño quien demostró ser una excelente amiga y una compañera de primera, gracias. 4

6 ÍNDICE Resumen... 1 Astract... 2 Dedicatorias... 3 Agradecimientos... 4 ÍNDICE... 5 I. Introducción... 8 II. Antecedentes III. Justificación IV. Objetivos V. Alcances Definición de objetivos Definición de los contenidos Definición de la estructura de la web Definición de la navegación Definición del diseño visual Desarrollo de código Desarrollo grafico Integración Testing Reproceso Lanzamiento VI. Fundamentación teórica Elementos de contenido Uso de plantillas Uso de encabezado y pie de página Uso de tablas Presentación de elementos de navegación Selección de tipografía

7 6.1.6 Selección de color Uso de gráficos Dimensiones Teoría de las hojas de estilo Menú Formularios Lenguaje HTML <HTML> </HTML> <HEAD> </HEAD> <TITLE> </TITLE> <BASE> </BASE> <BODY> </BODY> <H1>, <H2>, <H3> <P> <BR> <!-- --> <A> <A HREF="URL">...</A> <UL> <OL> <LI> <B> <U> <I> <PRE> <HR> <BR> <TABLE> <TR> <TD> <IMG> <TEXTAREA> Creación del sitio web Definición del sitio y planificación Arquitectura Diseño Construcción

8 Mantenimiento VII. Plan de actividades VIII. Recursos materiales, humanos y financieros Recursos materiales Recursos Humanos Recursos Financieros IX. Desarrollo del proyecto Diagrama de árbol de sitio web Código CSS de hoja de estilo principal Código HTML inicial Código CSS de hoja de estilo para el slider principal Código del script de java empleado para efectuar animación Código de HTML para la sección de nosotros Código de HTML para la sección de contacto Código de PHP para la recolección, validación de información Código de HTML de la sección de servicios web Código de HTML de la sección de soluciones personales Código de HTML de la sección de soluciones empresariales X. Resultados obtenidos XI. Análisis de riesgo XII. Conclusiones XIII. Recomendaciones XIV. Referencias bibliográficas

9 I. Introducción El desarrollo de una organización o empresa exige una planeación cautelosa que visualice todos los aspectos de su macro y micro entornos, debido a esto podemos encontrar que corporaciones y empresas transnacionales realizan planes de desarrollo cautelosos y estudiados que incluyen e involucran todas las áreas de la empresa, esto es con el propósito de orientar todos los esfuerzos realizados hacia el mismo fin, fortaleciendo la estrategia general. El área critica de una empresa comercial en cuanto a penetración y presencia en el mercado es el área mercadológica, cuyas acciones impactan directamente en el posicionamiento de la marca, producto, servicios, precios y relaciones con sus clientes, y es altamente responsable del nivel de éxito comercial de que la empresa goce. Actualmente las áreas mercadológicas cuentan con múltiples herramientas y estrategias a disposición que permiten penetrar en diversos segmentos de mercado, muchas de estas herramientas suelen ser específicas y otras muy generales, aunque de acuerdo al giro de la empresa y al producto o servicio que esta ofrece, puede llegar a ser mandatorio el uso de algunos medios para lograr la colocación, penetración o permanencia en su mercado, tal es el caso de las empresas que ofrecen servicios web, tales como diseño, desarrollo, alojamiento, registro y mantenimiento de sitios web, cuyo giro y producto convierten en obligatorio el contar con un sitio propio que muestre y promocione 8

10 ejemplos, datos y pruebas del producto que se ofrece, pues es de esperarse que los individuos o empresas que requieran y busquen servicios de esta índole comiencen por buscar proveedores que cuenten con presencia en la internet. 9

11 II. Antecedentes La empresa BOSS Tecnología Informática inicio sus operaciones en Octubre del año 2009, dichas actividades fueron iniciadas únicamente por Fernando Hernández Sánchez como persona física ofreciendo servicios profesionales relativos a la Tecnología Informática, dado esto no se realizó ningún proyecto de negocios, inversión, desarrollo o crecimiento; fue en Abril del año 2012 cuando las actividades comerciales tuvieron tal auge que se decidió formalizar y consolidar la empresa. La empresa formulo un proyecto que tenía por objetivo fortalecer y consolidar la empresa como un proveedor de servicios informáticos maduro y confiable, respaldado por un grupo de trabajo formado por expertos en las áreas de servicio ofertadas, alejándose de la imagen casual e informal que la persona física transmitía. Dicho proyecto mayor se enfoca principalmente en dos objetivos principales que son: La mecanización, estandarización y división de actividades por áreas internas de trabajo, y la creación de un plan ambicioso de mercadeo que incluye la creación de una imagen corporativa, plan de mercadeo, material publicitario y división de fuerza de ventas. Dentro del segundo objetivo se advirtió que una estrategia clave para la colocación de la nueva imagen, así como la formalización publica de la empresa seria el contar con un website que sirviera tanto como carta de presentación, como herramienta de venta, además dado que BOSS Tecnología Informática 10

12 ofrece servicios web, tales como diseño profesional, Hosting y comercio electrónico entre otros, se consideró de importancia crítica contar con un website que sirviese de testigo y demostración del potencial profesional de la empresa en el área de servicios web, generando así un sub proyecto de alta importancia dentro del plan general de la empresa. 11

13 III. Justificación El desarrollo de un sitio web para BOSS Tecnología Informática es de alta importancia debido a su giro comercial, deberá ser una plataforma publica que además de ofrecer información sobre la empresa a manera de carta de presentación, deberá de proveer el soporte necesario para impulsar las labores comerciales de venta, esto es mostrando dicho sitio web como ejemplo del trabajo que se realiza en la empresa, tal como una compañía inmobiliaria presta especial atención al diseño del inmueble en el que opera. Una encuesta silenciosa mediante análisis de tráfico y trazado de IP realizada en Junio del 2012 por BOSS Tecnología Informática revelo que aproximadamente el 78% de las visitas al dominio eran realizadas por prospectos del área comercial (ver grafica 1) y tomando solo este grupo de visitantes se descubrió que solo el 12% de estos contactos prosiguieron a etapas maduras del proceso de prospección (ver grafica 2), se asume entonces que el restante 88% de los prospectos que realizaron una visita al dominio de la empresa en búsqueda de una página web no obtuvieron el refuerzo necesario para continuar con el proceso, sino que posiblemente todo lo contrario (ver grafica 3 y tabla 1). 12

14 Visitas al dominio 22% 78% Prospectos Otros visitantes Grafica 1, Porcentaje de visitas por prospectos. Seguimiento de proceso de prospección 12% 88% Continuaron Abandonaron Grafica 2, Porcentaje de abandono de proceso de prospección. 13

15 Observación de trafico en dominio 9% 22% 69% Otros visitantes Abandonan Continuan Grafica 3, Porcentajes absolutos relativos al proceso de prospección. Muestra total Visitantes aleatorios Visitantes que abandonan proceso Visitantes que continuan proceso Porcentaje 100% 22% 69% 9% Numero de visitantes Tabla 1, Porcentajes ejemplificados con una población de 1000 visitantes. 14

16 IV. Objetivos Los objetivos del proyecto de desarrollo de sitio web son el acceder al porcentaje de usuarios que visitan el dominio de la empresa buscando un sitio web pero que al no encontrarlo abandonan el proceso de prospección, así como atraer el porcentaje de visitantes aleatorios y acceder a nuevas oportunidades de venta, esto es un incremento del 767% en la retención de prospectos comerciales y un incremento adicional del 244% de oportunidades de venta de usuarios aleatorios. 15

17 V. Alcances El proyecto de desarrollo del sitio web para BOSS Tecnología Informática parte del diseño corporativo ya realizado por la empresa, incluyendo definiciones de visión, misión, identidad, logo, productos y precios. El proyecto de desarrollo del sitio web para BOSS Tecnología Informática no incluirá el desarrollo de material gráfico para publicidad impresa, televisiva o de correo electrónico, tampoco incluye un portal de comercio electrónico de venta directa, esto debido a la naturaleza de los servicios y productos ofertados. El desarrollo de dicho proyecto transcurrirá a través de las siguientes etapas contempladas para su realización: 5.1 Definición de objetivos Se trata entre otras cosas de la definición de audiencia, se debe establecer el posible público de la web teniendo en cuenta varios factores, como la capacidad técnica del usuario, su capacidad física (sitios accesibles) y su ubicación geográfica (sitios locales, regionales, nacionales o de alcance mundial). (Tiempo estimado: 1 día) 16

18 5.2 Definición de los contenidos Una vez definidos los objetivos y la audiencia se debe estudiar el contenido que se incorporará al sitio. Luego se procederá a filtrarlo y agruparlo de manera consistente para presentarlo al usuario. (Tiempo estimado: 5 días) 5.3 Definición de la estructura de la web La estructura de la web es la diagramación del menú y el formato que tendrán las páginas web. Se define así el esqueleto de la web utilizando módulos para dividir cada sección y ordenarlas en base a su importancia. (Tiempo estimado: 1 día) 5.4 Definición de la navegación El sistema de navegación es el que permite al usuario acceder a las diferentes páginas del sitio web. Es necesario lograr un diseño web claro y una navegación sencilla que guíe al usuario por el sitio y que sea una guía de lo que va a encontrar. (Tiempo estimado: 2 días) 17

19 5.5 Definición del diseño visual El diseño web visual comprende la parte estética de la página web. Se realiza tomando en cuenta la identidad corporativa de la empresa, sus colores, logotipos, etc. Se presenta en esta etapa uno o varios bocetos del diseño web que mostrarán una versión cercana a la final. (Tiempo estimado: 5 días) 5.6 Desarrollo de código El desarrollo de código incluye toda la programación relativa al motor de funcionamiento y estructura del sitio web, incluyendo códigos en html, css, javascript y php, que deberá ser realizado en paralelo al Desarrollo grafico de los elementos del sitio web. (Tiempo estimado: 15 días) 5.7 Desarrollo grafico El desarrollo grafico consiste en el diseño de todos los elementos visuales que serán incluidos en la estructura y contenido del sitio web, tales como fotografías, iconos, imágenes, fondo, botones, banners, menú, logotipo y cualquiera que fuere la imagen que se requiriese. (Tiempo estimado: 10 días) 18

20 5.8 Integración Esta etapa funde y pule el desarrollo de código y el desarrollo grafico en uno solo, realizando las primeras interacciones y pruebas del aspecto del sitio web, es también la etapa en la que se comienza a requerir reprocesos en control de calidad. (Tiempo estimado: 15 días) 5.9 Testing Tras finalizar la integración del código y el diseño gráfico, el resultado es colocado a disposición de un grupo de sujetos de prueba con la intención de realizar pruebas de funcionalidad, desempeño, experiencia de usuario y contenido. (Tiempo estimado: 1 día) 5.10 Reproceso Esta etapa representa un ciclo continuo junto con la etapa de Testing, pues el grupo de sujetos de prueba tras reportar hallazgos, fallas y recomendaciones, accionara actividades de reproceso en código y diseño gráfico hasta lograr el visto bueno del grupo de pruebas. (Tiempo estimado: 2 días) 19

21 5.11 Lanzamiento Es la etapa final, en la que el sitio web ha sido revisado y es colocado al alcance del público global en la red mundial. (Tiempo estimado: 1 día) VI. Fundamentación teórica 6.1 Elementos de contenido Se debe cuidar el estilo del diseño un sitio web, de manera que el resultado quede homogéneo. Esto facilitará la navegación del usuario y dará personalidad al conjunto. Una composición homogénea se logra a través de un color de fondo, un fondo gráfico, uso de tamaño, color y tipo de letra, gráficos, iconos, etc. La composición debe guiar al usuario visualmente. Distinguir en un principio las áreas de Información, navegación principal, secundaria, local, etc. El contraste es importante y nos ayuda a mantener módulos de información y a facilitar la lectura Uso de plantillas. Usar una misma plantilla no quiere decir que la página sea aburrida, al contrario utilizar la misma plantilla mantiene una página consistente, limpia y ordenada. 20

22 6.1.2 Uso de encabezado y pie de página. Los encabezados deben de presentar la identidad gráfica del sitio y el pie de página presenta por lo general el origen del sitio y ligas acerca del sitio: información legal, derechos de autor, año de producción, contacto, etc Uso de tablas. El uso de tablas es sumamente importante. No solo sirven para presentar datos de forma tabular, o como las conocemos fuera del contexto de Web, sino porque nos ayudan a crear espacios editoriales Presentación de elementos de navegación. Gran parte del éxito de una buena navegación se debe a la estructura del sitio en general; como decidimos agrupar nuestro contenido, bajo que secciones, etc., pero la otra parte se la debemos a una clara presentación y localización de elementos de navegación Selección de tipografía. La selección y uso de tipografía es quizá el elemento más difícil dentro del proceso de diseño. La tipografía asume un doble papel tanto como comunicador visual y como verbal. La tipografía nos ayuda a distinguir visualmente grupos de texto y de esta manera ayuda al usuario a predecir qué tipo de información 21

23 encontrara en ciertas áreas de la página. Lo que hacemos al diseñar páginas Web es básicamente pintar el texto, no solo aplicando color al texto sino al combinarlo con otros bloques de texto y con el fondo de la página. El ojo viajara de bloque en bloque a lo largo de la página y es gracias a estos bloques tipográficos que podemos alcanzar una buena jerarquía de información Selección de color. Ya se mencionó anteriormente, que el balance de color puede ayudar a nuestros usuarios a navegar con mayor facilidad nuestra página al delimitar áreas y al agrupar diferente tipo de información. Cuando se habla de contraste no necesariamente quiere decir que haya contraste entre un claro y un oscuro. Al contrario, el contraste debe de ser muy sutil, muchas veces se logra entre variaciones de un mismo color, hay sitios que son monocromáticos en su totalidad o sitios que usan diferentes porcentajes y variaciones de color en varias secciones, eso es suficiente para facilitar la lectura y layout de la página Uso de gráficos. La trampa número uno en el diseño de Web: pensar que las gráficas harán de nuestra página una página bien diseñada, atractiva e interesante. El uso excesivo de imágenes resulta en una página muy poco funcional y que lo primero que provoca es ahuyentar a nuestros usuarios. Por un lado si las gráficas no han sido correctamente optimizadas para Web, serán muy pesadas 22

24 y tardarán mucho en visualizarse en el navegador. Otro gran problema es que las imágenes llegan a saturar el layout de nuestra página muy fácilmente Dimensiones. El diseño de Web implica una serie de limitaciones. Dada la naturaleza del medio, nuestras páginas deben de funcionar en diferentes plataformas y con distintas dimensiones de pantalla. Debemos mantenernos al corriente de estadísticas del usuario. La siguiente página proporciona estadísticas de uso de sistemas operativos, navegador, resolución, etc. De acuerdo a este sitio, actualmente la mayor parte de usuarios usa una resolución de pantalla de 1024 x 768 y en segundo lugar sigue la resolución de 800x600. Antes de empezar el diseño y la producción de un sitio de Web, debemos definir con nuestro equipo de trabajo que formato seguiremos. El siguiente sitio proporciona una plantilla de navegador (Browser Grid: en donde podemos ver las áreas "seguras" dentro de cada una de las dimensiones de pantalla. Quiere decir que si por ejemplo decidimos hacer una página para una resolución de 800x600 entonces debemos trabajar con unas dimensiones reales de 760x420, este es el espacio visible, la diferencia en los números se debe al espacio utilizado por botones de navegación que requiere el navegador y nuestro propio sistema operativo. 23

25 6.2 Teoría de las hojas de estilo Los estilos CSS (hoja de estilo en cascada) son un lenguaje para definir el formato de nuestra página web, como colores, bordes, formato de letra, alineaciones, márgenes etc. Se recomienda separar los estilos en un archivo externo, este archivo se guarda con la extensión.css Si se desea incluir un css a nuestra página web se tiene que agregar al inicio de la página web, dentro del <head></head>, por ejemplo: <link href= menus.css rel= stylesheet type= text/css /> Ejemplo de estilos: body { font-family: 'Lucida Sans Unicode', sans-serif; /*Tipo de letra*/ font-size: 14px; background-color: #FFFFFF; text-align: justify; width: 900px; 24

26 6.2.1 Menú. Básicamente el menú es un conjunto de enlaces a las distintas partes de nuestro sitio. La estructura más común para hacer un menú es con una lista (<ul></ul>). Por lo tanto, cada elemento del menú es un elemento de la lista <li></li>. El elemento contendrá normalmente un enlace (<a href= "></a>) a una página del sitio. Ejemplo: <u1> <li><a href="inicio.html">inicio</a></li> <li><a href="integrantes.html">integrantes</a></li> <li><a href="discografia.html">discografia</a></li> <li><a href="formulario.html">contacto</a></li> </ul> Formularios. Un formulario es un elemento que permite recoger datos introducidos por el usuario. Se utilizan para conocer las opiniones, dudas, para registrarse en alguna página o para introducir pedidos a través de la red, se insertan a través de las etiquetas <form> y </form> 25

27 Elementos de un formulario: Áreas de texto <textarea> Permiten a los usuarios insertar varias líneas de texto. Suelen utilizarse para que incluyan comentarios. ejemplo: <textarea name= ejemploarea cols= 30 rows= 3 >Escribe el texto que quieras</textarea> Elementos de entrada <input> Para insertar un elemento de entrada como texto, contraseña, botón, casillas de verificacion es necesario incluir la etiqueta <input>. Ejemplo: <input name= campo type= password value= password size= 20 maxle ngth= 15 > Campos de selección <select> Se utilizan para insertar menús y listas desplegables. Para insertar uno de estos es necesario insertar las etiquetas <select> y </select>. Ejemplo para insertar: habría que escribir en HTML: <select name="mascota"> <option selected>--- Elige animal ---</option> <option>perro</option> <option>gato</option> </select> 26

28 6.2.3 Lenguaje HTML. El HTML (Hyper Text Markup Language ó lenguaje de marcación de hipertexto), es un lenguaje de programación, cuando alguien abre su navegador y ve una página, no está viendo el código HTML directamente, sino el navegador interpreta el código y lo despliega en la pantalla. Una buena noticia es que los navegadores cada vez están más estandarizados y es más factible que el diseño de la página sea permanente, independientemente del navegador utilizado por el usuario. Para tener una vaga idea del HTML es necesario conocer un poco sobre gramática y sintaxis. El código HTML está compuesto por banderas (tags) las cuales contienen los atributos y valores de esos atributos, existen bastantes banderas que se pueden incorporar en una página web, las banderas están definidas por los siguientes signos <> como podrá ver a continuación. Se puede escribir el código directamente en cualquier editor de texto; sin embargo, actualmente existen muchos editores de html como Dreamweaver, los cuales facilitan y agilizan el diseño de las páginas. Una de las grandes ventajas del html, es que puede añadírsele audio, animaciones, video, scripts, etc. Por lo tanto la página puede ser completamente interactiva. La mayor parte de las etiquetas basicas no son imprescindibles para poder mostrar información en nuestra página, de hecho, un fichero de texto sin ninguna etiqueta puede ser visualizado con el explorador. Pero sí es 27

29 conveniente que nos ajustemos a las normas HTML, para tener una página correctamente definida. Además, en un futuro, algunas etiquetas que ahora son meros formalismos, serán indispensables para que los navegadores puedan manejar nuestras páginas de manera eficiente. Este es el formato básico de un documento html: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2 //EN"> <HTML> <HEAD>... </HEAD> <BODY>... </BODY> </HTML> Un documento html se divide en tres secciones principales, indicadas por las etiquetas: <HTML>, <HEAD>, <BODY>. La primera abarca todo el documento html. El head le agrega elementos de interactividad, asi como programación no visible para los usuarios. El body representa todos los elementos visibles de nuestro documento. 28

30 Cada sección de la página está limitada por una etiqueta < > en el inicio y una etiqueta </ > al final de cada instrucción. Por lo que siempre observaremos dos etiquetas de cada sección. Ejemplo: <HTML> <HEAD> <TITLE>Ejemplo 1</TITLE> </HEAD> <BODY> Hola mundo </BODY> </HTML> EL W3C (World Wide Web Consortium: encargado de la creación de los Standard webs, define que los ficheros HTML, XML, XHTML deben tener una declaración de tipo DOCTYPE que debe hacer referencia a una de las tres definiciones del tipo de documento que existen. Esta declaración debe ser la primera línea de nuestro documento y es necesaria para decirle al navegador qué versión de HTML es la que se usa en la página. Si no se hace, el navegador procesara la página en modo Quirks (modo de compatibilidad) pudiendo no interpretar correctamente el código de la página. 29

31 La DTD (definición del tipo de documento) es la estructura reglamentaria, es decir, los elementos y atributos que están disponibles para cada tipo de documento. Para HTML 4.01 (las versiones anteriores no son recomendables debido a que no son del todo compatibles con las Hojas de Estilo). El HTML 4 transitorio incluye todos los elementos y cualidades de HTML 4 Strict pero agrega cualidades presentational, elementos desaprobados o elementos obsoletos. Se llama Transitional porque está pensado como transición hacia HTML 4 estricto. El modo de definirla es: <!DOCTYPE HTML PUBLIC \"-//W3C//DTD HTML 4.01 Transitional//EN\" \"http://www.w3.org/tr/html4/loose.dtd\"> El HTML 4.01 Frameset es una variante de HTML 4 transitorio para los documentos que utilizan Frames (marcos). El modo de definirla es: <!DOCTYPE HTML PUBLIC \"-//W3C//DTD HTML 4.01 Frameset//EN\" \"http://www.w3.org/tr/html4/frameset.dtd\"> 30

32 Si declaramos este DTD el navegador pasará a actuar cumplimiento de los estándares (Standards compílanse). Esto implicara que solo puedan usarse las etiquetas de HTML Este es el modo recomendado por el W3C, ya que es compatible con el CSS y puede ser interpretado correctamente por todos los navegadores, haciendo mucho más fácil el paso de nuestros documentos al XHTML que muy posiblemente tienda a sustituir al HTML en los próximos años. El modo de definirla es: <!DOCTYPE HTML PUBLIC \"-//W3C//DTD HTML 4.01//EN\" \"http://www.w3.org/tr/html4/strict.dtd\"> Si queremos saber si nuestra página cumple con el DTD definido podemos hacerlo desde <HTML> </HTML> FUNCIÓN: Esta etiqueta, no tiene otra función que indicar el comienzo y el final de los documentos web. Por tanto, es la primera (si no se especifica la etiqueta DOCTYPE) y la última etiqueta de una página web. Dentro de ella, estarán contenidos tanto el encabezamiento como el cuerpo del documento. Puede ser omitida sin que haya ningún problema en la interpretación de nuestra página. 31

33 6.2.5 <HEAD> </HEAD> FUNCIÓN: Define la zona de cabecera de las páginas. Entre sus límites, se incluyen etiquetas que dan información sobre nuestra página <TITLE> </TITLE> FUNCIÓN: Da título a la página. Este título es el que aparece en la parte superior de la ventana y el que se muestra al minimizar dicha ventana (en la mayoría de los navegadores). Entre sus límites, sólo se admiten caracteres de texto; no podremos incluir ningún otro elemento del lenguaje, ni tampoco etiquetas de estilo de fuente. Cualquier etiqueta que escribamos dentro del título, será mostrada como si fuera parte del texto. Los títulos son etiquetas de cabecera, por lo tanto, sólo tienen sentido dentro de las etiquetas <HEAD> y </HEAD> <BASE> </BASE> Podemos utilizar esta etiqueta, para especificar los puntos de partida para nuestros enlaces (HREF) y las ventanas de destino por defecto cuando usamos marcos (TARGET). Sólo puede incluirse en la cabecera de las páginas (<HEAD> </HEAD>). 32

34 ATRIBUTOS: NOMBRE Efecto / Valores que acepta HREF Determina un origen base para referencias a otras páginas. Un URL o parte de él. TARGET Asigna un marco de destino para las referencias de nuestra página. Nombre de marco (frame) <BODY> </BODY> Encierra el contenido visible del documento. Toda la programación que se encuentre encerrada entre estas etiquetas aparecera visiblemente en la página de internet <H1>, <H2>, <H3> Titulares. Sirven para dividir el texto en secciones. Se pueden definir seis niveles de titulares, el texto que deseamos que sea un titular se pone entre las etiquetas <H1> Titular </H1>. Se definen mediante las etiquetas <H1>...</H1> hasta <H6>...</H6> <P> Párrafos. En principio, sin entrar en detalles de alineación u otras características, digamos que se definen por las etiquetas <P>...<P>. Esta 33

Para iniciarnos en el estudio de este curso necesitamos estar familiarizados con ciertos conceptos generales, entre ellos:

Para iniciarnos en el estudio de este curso necesitamos estar familiarizados con ciertos conceptos generales, entre ellos: Conceptos básicos de la internet y la web Para iniciarnos en el estudio de este curso necesitamos estar familiarizados con ciertos conceptos generales, entre ellos: Internet: Red mundial de computadoras

Más detalles

DESCRIPCIÓN ESPECÍFICA NÚCLEO: COMERCIO Y SERVICIOS SUBSECTOR: INFORMÁTICA

DESCRIPCIÓN ESPECÍFICA NÚCLEO: COMERCIO Y SERVICIOS SUBSECTOR: INFORMÁTICA DESCRIPCIÓN ESPECÍFICA NÚCLEO: COMERCIO Y SERVICIOS SUBSECTOR: INFORMÁTICA Nombre del Módulo: DISEÑO DE PAGINAS WEB CON HTML Código: CSTI0085 total: 3 Horas Objetivo General: Construir páginas Web en base

Más detalles

Etiquetas Básicas (Estructura HTML) Etiquetas Atributos Valores Descripción. Formato de Presentación Etiquetas Atributos Valores Descripción

Etiquetas Básicas (Estructura HTML) Etiquetas Atributos Valores Descripción. Formato de Presentación Etiquetas Atributos Valores Descripción Etiquetas Básicas (Estructura HTML) Inicio y final del documento html text link alink vlink topmargin (IE) leftmargin (IE) marginheight margin

Más detalles

Apuntes básicos de HTML I.E.S. Pintor José María Fernández

Apuntes básicos de HTML I.E.S. Pintor José María Fernández Manual Básico de HTML Este manual lo he realizado con la intención de servir como primer contacto con el lenguaje HTML (Hyper Text Markup Language), que es el que se utiliza para la creación de páginas

Más detalles

DESCRIPCIÓN ESPECÍFICA NÚCLEO: COMERCIO Y SERVICIOS SUBSECTOR: INFORMÁTICA

DESCRIPCIÓN ESPECÍFICA NÚCLEO: COMERCIO Y SERVICIOS SUBSECTOR: INFORMÁTICA DESCRIPCIÓN ESPECÍFICA NÚCLEO: COMERCIO Y SERVICIOS SUBSECTOR: INFORMÁTICA Nombre del Módulo: DISEÑO DE PAGINAS WEB CON HTML Código: CSTI0085 total: 63 Horas Objetivo General: Construir páginas Web a partir

Más detalles

Taller de Paginas Web

Taller de Paginas Web Taller de Paginas Web Las páginas web son documentos de texto que se comparten en la red. La mecánica es la siguiente : Un ordenador de usuario, que llamarermos cliente, hace una petición a una direccion

Más detalles

CONCEPTOS BÁSICOS PARA EL DISEÑO DE PAGINAS WEB

CONCEPTOS BÁSICOS PARA EL DISEÑO DE PAGINAS WEB COLEGIO AGUSTINIANO CIUDAD SALITRE AREA DE TECNOLOGÍA E INFORMATICA GUIA DE APOYO PRIMER BIMESTRE GRADO UNDECIMO CONCEPTOS BÁSICOS PARA EL DISEÑO DE PAGINAS WEB UNIDAD TEMÁTICA: INICIANDO CON HTML Y DREAMWEAVER

Más detalles

CREACION DE PÁGINAS WEB

CREACION DE PÁGINAS WEB PRESENTA: CREACION DE PÁGINAS WEB OBJETIVO Conocer la aplicación de los paquetes mas utilizados para la implementación t diseño de una pagina Web. DIRIGIDO A: Estudiantes de informática, Ofimática y Personas

Más detalles

MANUAL DE REFERENCIA DE PROGRAMACIÓN HTML

MANUAL DE REFERENCIA DE PROGRAMACIÓN HTML MANUAL DE REFERENCIA DE PROGRAMACIÓN HTML HTML (HyperText Markup Language) es un lenguaje muy sencillo que permite describir hipertexto, es decir, texto presentado de forma estructurada y agradable, con

Más detalles

Objetivos. El alumno conocerá los elementos indispensables para crear una página web. 1. Crear una página web básica utilizando html.

Objetivos. El alumno conocerá los elementos indispensables para crear una página web. 1. Crear una página web básica utilizando html. Objetivos El alumno conocerá los elementos indispensables para crear una página web. Al final de esta práctica el alumno podrá: 1. Crear una página web básica utilizando html. Introducción El lenguaje

Más detalles

Curso básico de creación de páginas web

Curso básico de creación de páginas web Curso básico de creación de páginas web Programa de formación docente UAM 2005-2006 Miguel Sevilla Callejo Abril 2006 Departamento de Geografía Universidad Autónoma de Madrid Objetivos Desarrollar las

Más detalles

Introducción: páginas web y navegadores

Introducción: páginas web y navegadores IB14 Informática Aplicada a la Construcción Creación de páginas web con HTML Introducción: páginas web y navegadores Una página web, pese a la gran cantidad de colores, imágenes e información que puede

Más detalles

UNIDAD 4: NOCIONES BÁSICAS DE DISEÑO WEB (MAQUETACIÓN HTML) CURSO ELABORACIÓN DE CONTENIDOS FORMATIVOS Plan de Formación Edukanda

UNIDAD 4: NOCIONES BÁSICAS DE DISEÑO WEB (MAQUETACIÓN HTML) CURSO ELABORACIÓN DE CONTENIDOS FORMATIVOS Plan de Formación Edukanda UNIDAD 4: NOCIONES BÁSICAS DE DISEÑO WEB (MAQUETACIÓN HTML) CURSO ELABORACIÓN DE CONTENIDOS FORMATIVOS Plan de Formación Edukanda 1 Índice 1. Introducción... 3 2. Objetivos... 4 3. El lenguaje HTML...

Más detalles

PHP y MySQL. Aplicaciones Web: HTML II (tercera parte) Autor: Johnny Zulca Mamani

PHP y MySQL. Aplicaciones Web: HTML II (tercera parte) Autor: Johnny Zulca Mamani PHP y MySQL. Aplicaciones Web: HTML II (tercera parte) Autor: Johnny Zulca Mamani 1 Presentación del curso Programación de aplicaciones Web con PHP y MySQL. Ahora continuaremos con el estudio de las páginas

Más detalles

Unidad II: Lenguaje de marcado

Unidad II: Lenguaje de marcado Unidad II: Lenguaje de marcado 2.1 Introducción Un lenguaje de marcado o lenguaje de marcas es una forma de codificar un documento que, junto con el texto, incorpora etiquetas o marcas que contienen información

Más detalles

SERVICE DEFINITION MANUAL DEL ADMINISTRADOR

SERVICE DEFINITION MANUAL DEL ADMINISTRADOR SERVICE DEFINITION MANUAL DEL ADMINISTRADOR Versión de producto: 1.5 Última revisión: 11-11-2008 2008 Carabela Consulting, S.L. Este documento contiene información confidencial. Página 1 de 18 ÍNDICE 1.

Más detalles

Abril 2005. Jordi Llonch jordi@laigu.net. Basado en los cursos de: http://www.webestilo.com/html/ http://www.webestilo.com/css/

Abril 2005. Jordi Llonch jordi@laigu.net. Basado en los cursos de: http://www.webestilo.com/html/ http://www.webestilo.com/css/ Abril 2005 Jordi Llonch jordi@laigu.net Basado en los cursos de: http://www.webestilo.com/html/ http://www.webestilo.com/css/ http://creativecommons.org/licenses/by-sa/2.0/ 2 Conceptos básicos World Wide

Más detalles

Curso Diseño Web con Software libre, VNU

Curso Diseño Web con Software libre, VNU 1. - QUE ES VNU? NVU (se pronuncia N-view, por "new view") es un editor de páginas web libre y gratuito desarrollado bajo la modalidad Open Source, o sea que cualquiera está autorizado para bajarlo sin

Más detalles

HTML. HyperText Markup Language (Lenguaje de Marcas de Hipertexto)

HTML. HyperText Markup Language (Lenguaje de Marcas de Hipertexto) HTML HyperText Markup Language (Lenguaje de Marcas de Hipertexto) Introducción Un lenguaje de marcas es una forma de codificar junto con el texto, incorporando etiquetas que contienen información adicional

Más detalles

HTML y XHTML. Desarrollo de Aplicaciones Web Departamento Informática y Sistemas Universidad de Murcia Curso 2013/2014

HTML y XHTML. Desarrollo de Aplicaciones Web Departamento Informática y Sistemas Universidad de Murcia Curso 2013/2014 HTML y XHTML Desarrollo de Aplicaciones Web Departamento Informática y Sistemas Universidad de Murcia Curso 2013/2014 Etiquetas Contenido de una página web: Contenido (información). Instrucciones de estructura

Más detalles

Prólogo 3. Convenciones Tipográficas... 3 Sugerencias... 4. Introducción 5. Familiarizándose con el interfaz de SiteBuilder 6

Prólogo 3. Convenciones Tipográficas... 3 Sugerencias... 4. Introducción 5. Familiarizándose con el interfaz de SiteBuilder 6 Parallels Panel Contenidos Prólogo 3 Convenciones Tipográficas... 3 Sugerencias... 4 Introducción 5 Familiarizándose con el interfaz de SiteBuilder 6 Creación de un sitio web 8 Edición de un sitio web

Más detalles

5.- Crear páginas web con Nvu

5.- Crear páginas web con Nvu 5.- Crear páginas web con Nvu Nvu permite crear y publicar páginas web sin necesidad de tener conocimientos de HTML y de una forma tan sencilla como utilizar un procesador de textos. La barra de herramientas

Más detalles

UNIDAD I HOJA ELECTRÓNICA DE CÁLCULO

UNIDAD I HOJA ELECTRÓNICA DE CÁLCULO UNIDAD I HOJA ELECTRÓNICA DE CÁLCULO COMPETENCIA PARTICULAR: Utiliza herramientas de la hoja electrónica de cálculo para el procesamiento de la información en su ámbito académico, social y laboral. PRACTICA

Más detalles

Prof. Luis Miguel Oliveros - Computación 3er Año

Prof. Luis Miguel Oliveros - Computación 3er Año NVU / KompoZer NVU es un editor de páginas web libre y gratuito desarrollado bajo la modalidad Open Source. Esta alternativa gratuita trae nuevas herramientas para facilitar el trabajo, convirtiéndola

Más detalles

HTML HTML HTML. Diseño de Sitios Web. Qué es HTML?

HTML HTML HTML. Diseño de Sitios Web. Qué es HTML? Diseño de Sitios Web 5 (I) Qué es? Es un lenguaje descriptivo con el cual se describe la estructura del texto y todos los elementos que se muestran en la página. Es el método más usado para publicar documentos

Más detalles

TEMA 9 CREACIÓN DE PÁGINAS WEB

TEMA 9 CREACIÓN DE PÁGINAS WEB TEMA 9 CREACIÓN DE PÁGINAS WEB OBJETIVOS Conocer las páginas web y sus elementos. Insertar tablas, capas, enlaces en las páginas web. Crear páginas web con NVU. Crear un sitio web. Configurar un sitio

Más detalles

CREACIÓN DE PÁGINAS WEB CON NVU

CREACIÓN DE PÁGINAS WEB CON NVU CREACIÓN DE PÁGINAS WEB CON NVU 1. Introducción... 1 2. Instalación... 2 3. Antes de comenzar una página web... 2 4. Editar páginas web con NVU... 5 5. Definir el diseño de nuestro sitio... 6 5.1. Plantillas...

Más detalles

Diseño Web. Sitio Web Conjunto de páginas web relacionadas entre sí.

Diseño Web. Sitio Web Conjunto de páginas web relacionadas entre sí. Internet Es una red de redes de ordenadores, que intercambian información basándose en el protocolo TCP/IP. Existen diversas formas de acceder a Internet: Correo electrónico, FTP, Videoconferencia, y la

Más detalles

UNIDAD 4 HIPERENLACES

UNIDAD 4 HIPERENLACES UNIDAD 4 HIPERENLACES OBJETIVO El alumno será capaz de crear, modificar y probar hipervínculos personalizados en un documento de Dreamweaver. TEMARIO 4.1 CONCEPTO Y TIPOS DE ENLACES 4.2 PERSONALIZAR NUEVOS

Más detalles

ELABORADO POR: BRENDA PATRICIA GONZALEZ MANRIQUEZ

ELABORADO POR: BRENDA PATRICIA GONZALEZ MANRIQUEZ CECYTEM PLANTEL NICOLAS ROMERO II Manual para crear páginas web en HTML GRUPO: 301 ELABORADO POR: BRENDA PATRICIA GONZALEZ MANRIQUEZ HTML (HyperText Markup Language - Lenguaje de Marca de Hipertextos)

Más detalles

Tema 5: La red de redes: Internet

Tema 5: La red de redes: Internet Tema 5: La red de redes: Internet > Qué es Internet? Todo el mundo habla de Internet: se hace referencia en clase, en revistas de moda, entre amigos... Acceder a una página web, hablar con los amigos a

Más detalles

Cursito 27: Curso de HTML Parte 3

Cursito 27: Curso de HTML Parte 3 Por Roxana Bassi rox@roxanabassi.com.ar / http://www.roxanabassi.com.ar Publicado en la sección los cuadernos de Internet World en la revista Internet World Latinoamérica en el período 1995-1999 Cursito

Más detalles

Antes de comenzar un sitio. Empezar un sitio web

Antes de comenzar un sitio. Empezar un sitio web Antes de comenzar un sitio Es muy recomendable realizar la siguiente actividad, de evaluación de páginas web, para tener ideas y recursos. http://www.uamvirtual.es/mod/assignment/view.php?id=3228 Empezar

Más detalles

Nociones basicas de HTML

Nociones basicas de HTML Nociones basicas de HTML Para comprender lo que veremos mas adelante es necesario tener conocimientos basicos de informatica e Internet en entorno Windows. Para hacer los ejercicios basta con un Navegador

Más detalles

DISEÑO Y DESARROLLO WEB CON HTML 5, CSS Y DREAMWEAVER CS4 OBRA COMPLETA 2 VOLÚMENES

DISEÑO Y DESARROLLO WEB CON HTML 5, CSS Y DREAMWEAVER CS4 OBRA COMPLETA 2 VOLÚMENES DISEÑO Y DESARROLLO WEB CON HTML 5, CSS Y DREAMWEAVER CS4 OBRA COMPLETA 2 VOLÚMENES Objetivos Dotar al interesado de conocimientos teóricos y prácticos para poder desarrollar un sitio Web con HTML y aplicar

Más detalles

DESCRIPCIÓN ESPECÍFICA.

DESCRIPCIÓN ESPECÍFICA. DESCRIPCIÓN ESPECÍFICA. Nombre del Módulo: DISEÑO DE SITIOS WEB. Código: CSTI0031 Horas certificables: 62 Objetivo General: Diseñar sitios web que implementen características intuitivas y visuales Objetivos

Más detalles

INTRODUCCIÓN AL WEB. Pag. 1 de 10

INTRODUCCIÓN AL WEB. Pag. 1 de 10 INTRODUCCIÓN AL WEB La World Wide Web o simplemente WWW o Web es uno de los métodos más importantes de comunicación que existe en Internet. Consiste en un sistema de información basado en Hipertexto (texto

Más detalles

Nueva Web de los SCTs http://www.sct.uniovi.es MANUAL DEL USUARIO

Nueva Web de los SCTs http://www.sct.uniovi.es MANUAL DEL USUARIO Nueva Web de los SCTs http://www.sct.uniovi.es MANUAL DEL USUARIO 1 ÍNDICE DE CONTENIDOS 1 Acceso a la edición de contenidos...3 1.1 Noticias...3 1.2 Utilización del editor de contenidos...6 1. Formato...6

Más detalles

El módulo de texto plano es un sencillo editor. Al seleccionarlo en la caja de módulos, el área central adoptará al siguiente aspecto:

El módulo de texto plano es un sencillo editor. Al seleccionarlo en la caja de módulos, el área central adoptará al siguiente aspecto: Plantilla de texto plano El módulo de texto plano es un sencillo editor. Al seleccionarlo en la caja de módulos, el área central adoptará al siguiente aspecto: Título: Es el título que aparecerá identificando

Más detalles

Laboratorio 6. Creación de sitios Web - Dreamweaver

Laboratorio 6. Creación de sitios Web - Dreamweaver UNIVERSIDAD CARLOS III DE MADRID. ESCUELA DE TURISMO. Informática aplicada al sector turístico Laboratorio 6. Creación de sitios Web - Dreamweaver El objetivo de este laboratorio es aprender a crear sitios

Más detalles

PLAN DE SESIÓN. 1.1 Determina la estructura del sitio web con base en las necesidades del usuario

PLAN DE SESIÓN. 1.1 Determina la estructura del sitio web con base en las necesidades del usuario DATOS GENERALES: Nombre del Módulo: Diseño y elaboración de páginas web Sesión No. 1 Duración 2 horas 1.1 Determina la estructura del sitio web con base en las necesidades del usuario Estructura y compara

Más detalles

HTML INDICE: 1 Internet 2 Conceptos básicos 3 Estructura de un documento HTML 4 Dar formato a un documento 5 Listas 6 Imágenes

HTML INDICE: 1 Internet 2 Conceptos básicos 3 Estructura de un documento HTML 4 Dar formato a un documento 5 Listas 6 Imágenes HTML INDICE: 1 Internet 1.1 Qué es Internet 1.2 Los comienzos de Internet 1.3 Aplicaciones que nos ofrece Internet 1.4 Qué es WWW 1.5 Servicios que nos ofrece WWW 1.6 Cuestionario: Internet 2 Conceptos

Más detalles

Tema 3. Conceptos Básicos de HTML. ETSI ICAI! Departamento de Sistemas Informáticos! Rafael Palacios Hielscher! Cristina Puente Águeda!

Tema 3. Conceptos Básicos de HTML. ETSI ICAI! Departamento de Sistemas Informáticos! Rafael Palacios Hielscher! Cristina Puente Águeda! Tema 3. Conceptos Básicos de HTML ETSI ICAI! Departamento de Sistemas Informáticos! Rafael Palacios Hielscher! Cristina Puente Águeda! Lenguajes de descripción! Grupo de lenguajes que describen cómo representar

Más detalles

PROGRAMA: Diseño y desarrollo Web con HTML 5,

PROGRAMA: Diseño y desarrollo Web con HTML 5, PROGRAMA: Diseño y desarrollo Web con HTML 5, CSS y Dreamweaver CS 4 Objetivos: Diseño y desarrollo Web con HTML 5 y CSS Dotar al alumno de conocimientos teóricos y prácticos para poder desarrollar un

Más detalles

14.1 Configuración de las propiedades del documento

14.1 Configuración de las propiedades del documento Capítulo 14 Publicación 14.1 Configuración de las propiedades del documento V amos a abrir la película natura.fla guardada en la carpeta Curso Flash/ejemplos. No es necesario guardar los cambios producidos

Más detalles

GUÍA Nro. 1 TECNOLOGÍA DE INTERNET. TIII PIII

GUÍA Nro. 1 TECNOLOGÍA DE INTERNET. TIII PIII GUÍA Nro. 1 TECNOLOGÍA DE INTERNET. TIII PIII GUIA DISPONIBLE EN: http://preparadorivan.blogspot.com/ - http://preparadormssi.50webs.com/inicio.html La World Wide Web o la Web, es una de las múltiples

Más detalles

56h DREAMWEAVER 8 OBJETIVOS DEL CURSO. ÍNDICE 1 Conociendo Macromedia Dreamweaver. 2 Creación de sitios y páginas Web

56h DREAMWEAVER 8 OBJETIVOS DEL CURSO. ÍNDICE 1 Conociendo Macromedia Dreamweaver. 2 Creación de sitios y páginas Web 56h DREAMWEAVER 8 OBJETIVOS DEL CURSO Dreamweaver es el programa líder en la edición profesional de páginas Web. Es el software más utilizado para la creación y mantenimiento de páginas Web por los principales

Más detalles

PROGRAMA FORMATIVO. Diseño y desarrollo web con HTML 5, CSS y Dreamweaver CS4 - Obra completa - 2 volúmenes

PROGRAMA FORMATIVO. Diseño y desarrollo web con HTML 5, CSS y Dreamweaver CS4 - Obra completa - 2 volúmenes PROGRAMA FORMATIVO Diseño y desarrollo web con HTML 5, CSS y Dreamweaver CS4 - Obra completa - 2 volúmenes Sector: Desarrollo Web Multimedia Modalidad: Distancia Duración: Objetivos: Código: 4356 Dotar

Más detalles

Diseño y desarrollo Web con HTML 5, CSS y Dreamweaver CS 4

Diseño y desarrollo Web con HTML 5, CSS y Dreamweaver CS 4 Diseño y desarrollo Web con HTML 5, CSS y Dreamweaver CS 4 Modalidad: Distancia, On-Line Duración: 154 horas Objetivos: Diseño y desarrollo Web con HTML 5 y CSS Dotar al alumno de conocimientos teóricos

Más detalles

Diseño de páginas web 2011

Diseño de páginas web 2011 Diseño de páginas web 2011 Al finalizar el curso, el alumno será capaz de planificar y diseñar correctamente desde sencillas páginas web hasta completos sitios web. Para ello, se le proporciona primero

Más detalles

Curso XHTML/HTML/HTML5. Curso XHTML/HTML/HTML5

Curso XHTML/HTML/HTML5. Curso XHTML/HTML/HTML5 Curso XHTML/HTML/HTML5 Curso XHTML/HTML/HTML5 Página Web del curso Pagina del curso www.bbsoftpy.net/cursohtml2013 Repaso Clase Anterior Curso XHTML/HTML/HTML5-2013 Listas Curso XHTML/HTML/HTML5-2013 Listas

Más detalles

Powerpoint es un programa incluido en la suite de Microsoft Office, que nos ofrece la posibilidad de crear presentaciones profesionales.

Powerpoint es un programa incluido en la suite de Microsoft Office, que nos ofrece la posibilidad de crear presentaciones profesionales. Qué es Powerpoint 2010? Powerpoint es un programa incluido en la suite de Microsoft Office, que nos ofrece la posibilidad de crear presentaciones profesionales. El entorno de trabajo En la siguiente imagen

Más detalles

(Objetivo) Curso de Informática Básica. Word 2003. Índice. Word 2003. Conceptos Básicos. Uso avanzado de Word. Universidad Rey Juan Carlos

(Objetivo) Curso de Informática Básica. Word 2003. Índice. Word 2003. Conceptos Básicos. Uso avanzado de Word. Universidad Rey Juan Carlos Universidad Rey Juan Carlos Estefanía Martín Liliana P. Santacruz Laboratorio de Tecnologías de la Información en la Educación 2 Objetivo Entender los conceptos procesador de texto y sistema de tratamiento

Más detalles

Nos identificamos con nuestro nombre de usuario y la contraseña y llegamos a esta página

Nos identificamos con nuestro nombre de usuario y la contraseña y llegamos a esta página ADMINISTRACIÓN DEL SITIO WEB Todos los jefes de Departamento, coordinadores de proyectos y directivos del Centro somos administradores de la página web. Cada uno tendrá la responsabilidad de administrar

Más detalles

Plantilla de texto plano

Plantilla de texto plano Plantilla de texto plano Esta es la plantilla seleccionada por defecto al crear una nueva página. Título: Es el título que aparecerá identificando a la página, así como en la cabecera del documento en

Más detalles

Índice de contenidos:

Índice de contenidos: Tutorial de wik.is Wik.is es el servicio en línea de Deki Wiki de Mindtouch: http://wiki.opengarden.org/deki_wiki Índice de contenidos: Registro para tener nuestro wiki... 2 Primeros cambios que debemos

Más detalles

INDICE Capitulo 1. Internet y la Web Capitulo 2. Páginas Web Capitulo 3. Introducción al Lenguaje HTML Capitulo 4. Imágenes

INDICE Capitulo 1. Internet y la Web Capitulo 2. Páginas Web Capitulo 3. Introducción al Lenguaje HTML Capitulo 4. Imágenes INDICE Antes de comenzar XIII Capitulo 1. Internet y la Web 1 Internet 3 Protocolos de Internet 4 El hipertexto y la Web 4 Funcionamiento de la Web 8 Cliente Web 8 Servidor Web 8 Transferencia de la pagina

Más detalles

Manual de Administrador de Entidades

Manual de Administrador de Entidades Manual de Administrador de Entidades Tabla de contenido 1 INTRODUCCIÓN... 1 2 CREAR ENTIDADES... 2 3 RELACIÓN CON USUARIOS Y SALAS... 6 4 NOTICIAS... 8 5 ENCUESTA... 9 6 DOCUMENTOS... 11 7 EVENTO... 12

Más detalles

ADMINISTRACIÓN MI PRIMER ARTÍCULO (Parte I) (Última revisión: domingo, 15 de febrero de 2009)

ADMINISTRACIÓN MI PRIMER ARTÍCULO (Parte I) (Última revisión: domingo, 15 de febrero de 2009) JOOMLA! ADMINISTRACIÓN MI PRIMER ARTÍCULO () (Última revisión: domingo, 15 de febrero de 2009) Cuando nos introducimos en el mundo de las páginas Web nuestro objetivo fundamental es poder comunicarnos

Más detalles

Guía de Uso Ndstudio - Editor (CMS) Net Design Studio. Guía de Uso Manual Gestor CMS. Ndstudio-Editor (CMS) Versión Administrador -1-

Guía de Uso Ndstudio - Editor (CMS) Net Design Studio. Guía de Uso Manual Gestor CMS. Ndstudio-Editor (CMS) Versión Administrador -1- Net Design Studio Guía de Uso Manual Gestor CMS Ndstudio-Editor (CMS) Versión Administrador -1- Índice de contenidos 1 Introducción 2 Acceso 2.1 Entrar en el CMS 3 Módulo Gestor de Contenidos 3.1 Cómo

Más detalles

Capítulo 1 Documentos HTML5

Capítulo 1 Documentos HTML5 Capítulo 1 Documentos HTML5 1.1 Componentes básicos HTML5 provee básicamente tres características: estructura, estilo y funcionalidad. Nunca fue declarado oficialmente pero, incluso cuando algunas APIs

Más detalles

C APÍTULO 1 Gestión de documentos

C APÍTULO 1 Gestión de documentos C APÍTULO 1 Gestión de documentos En este capítulo encontrará unas sencillas indicaciones para cocripción somera del entorno de trabajo de Word, así como una referencia rápida a las funciones de las teclas

Más detalles

TEMA 2 WINDOWS XP Lección 3 PROGRAMA WORDPAD

TEMA 2 WINDOWS XP Lección 3 PROGRAMA WORDPAD TEMA 2 WINDOWS XP Lección 3 PROGRAMA WORDPAD 1) TRATAMIENTO DE TEXTOS Uno de los programas accesorios más útiles entre los que vienen con Windows XP es WordPad: un tratamiento de textos pequeño, pero potente,

Más detalles

ACCIÓN FORMATIVA FINANCIADA POR EL SERVICIO PÚBLICO DE EMPLEO ESTATAL

ACCIÓN FORMATIVA FINANCIADA POR EL SERVICIO PÚBLICO DE EMPLEO ESTATAL MF0491_3: PROGRAMACIÓN WEB EN EL ENTORNO CLIENTE. (IFCD0210: DESARROLLO DE APLICACIONES CON TECNOLOGÍAS WEB) 180 HORAS PRESENCIALES Nº DE EXPEDIENTE: FC/2013/0064 ACCION 141 GRUPO 1 ACCIÓN FORMATIVA FINANCIADA

Más detalles

Insertar o crear tablas. Insertar una tabla. Crear una tabla. Usar plantillas de tabla. Utilizar el menú Tabla. Utilizar el comando Insertar tabla

Insertar o crear tablas. Insertar una tabla. Crear una tabla. Usar plantillas de tabla. Utilizar el menú Tabla. Utilizar el comando Insertar tabla Insertar o crear tablas Insertar una tabla En Microsoft Office Word 2007 se puede insertar una tabla eligiendo un diseño entre varias tablas con formato previo (rellenas con datos de ejemplo) o seleccionando

Más detalles

HTML Guía de trabajo para 3º ESO

HTML Guía de trabajo para 3º ESO HTML Guía de trabajo para 3º ESO Página 2 Índice 1. Qué es HTML?... 3 2. Cómo son las páginas Web?... 3 3. Qué es un sitio Web?... 3 4. Práctica 1. Crear un sitio web local... 4 5. Primera página HTML...

Más detalles

Creación de páginas Web FrontPage

Creación de páginas Web FrontPage Creación de páginas Web FrontPage 1.- Introducción Las páginas web están basadas en lo que se llama el hipertexto. En el hipertexto no hace falta seguir el documento de forma lineal, sino que se establecen

Más detalles

UF1302 Creación de páginas web con lenguajes de marcas

UF1302 Creación de páginas web con lenguajes de marcas UF1302 Creación de páginas web con lenguajes de marcas TEMA 1. Los lenguajes de marcas TEMA 2. Imágenes y elementos multimedia TEMA 3. Técnicas de accesibilidad y usabilidad TEMA 4. Herramientas de edición

Más detalles

TEMA 2. CREAR SITIOS WEB USANDO. Tecnologías de la Información 1ºBachillerato IES Zurbarán (Badajoz)

TEMA 2. CREAR SITIOS WEB USANDO. Tecnologías de la Información 1ºBachillerato IES Zurbarán (Badajoz) TEMA 2. CREAR SITIOS WEB USANDO CÓDIGO HTML Tecnologías de la Información 1ºBachillerato IES Zurbarán (Badajoz) Sesión 10 Tablas Introducción Las tablas son posiblemente la manera más clara de organizar

Más detalles

Guia para el principiante

Guia para el principiante Guia para el principiante Este documento asume que usted sabe como publicar en WWW. Lenguaje HTML El lenguaje HTML es el usuado actualmente para escribir textos hypermediales en el Web. El siguiente texto,

Más detalles

1. Tutorial Página Personal... 2

1. Tutorial Página Personal... 2 Índice 1. Tutorial Página Personal... 2 1.1. Introducción... 2 1.2. Tutorial de edición de páginas web con Kompozer... 2 1.2.1. Descarga del programa... 2 1.2.2. Edición de la página web... 4 1.3. Como

Más detalles

Manual de Administrador

Manual de Administrador Servicio Manual de Administrador Web 2.0 Servicio Web 2.0 Presentación Diseño Web Inicial Diseño Personalizado Control Contenidos Registro de Dominio Hosting en Servidor Correos Electrónicos Con Redes

Más detalles

Dreamweaver CS5 Full. 01. Conociendo Adobe Dreamweaver CS5. 02. Creación de sitios y páginas Web

Dreamweaver CS5 Full. 01. Conociendo Adobe Dreamweaver CS5. 02. Creación de sitios y páginas Web 01. Conociendo Adobe Dreamweaver CS5 01.1. Introducción a Adobe Dreamweaver 01.2. Novedades de Dreamweaver CS5 01.3. Requerimientos técnicos 01.4. Editar páginas Web 01.5. Cómo tener una página en Internet

Más detalles

UNIDAD 2 CONFIGURACIÓN DE UN SITIO LOCAL

UNIDAD 2 CONFIGURACIÓN DE UN SITIO LOCAL UNIDAD 2 CONFIGURACIÓN DE UN SITIO LOCAL OBJETIVO El alumno aprenderá a configurar un servidor local para realizar diferentes pruebas de la página hasta publicar el sitio web en Internet. TEMARIO 2.1 INTRODUCCIÓN

Más detalles

JOOMLA! ADMINISTRACIÓN MI PRIMER ARTÍCULO (Parte I) (Última revisión: miércoles, 2 de marzo de 2011)

JOOMLA! ADMINISTRACIÓN MI PRIMER ARTÍCULO (Parte I) (Última revisión: miércoles, 2 de marzo de 2011) JOOMLA! ADMINISTRACIÓN MI PRIMER ARTÍCULO () (Última revisión: miércoles, 2 de marzo de 2011) Cuando nos introducimos en el mundo de las páginas Web nuestro objetivo fundamental es poder comunicarnos con

Más detalles

GUÍA DE APRENDIZAJE COMPUTACIÓN BÁSICA II COMPETENCIA GENERAL

GUÍA DE APRENDIZAJE COMPUTACIÓN BÁSICA II COMPETENCIA GENERAL GUÍA DE APRENDIZAJE COMPUTACIÓN BÁSICA II COMPETENCIA GENERAL Maneja herramientas informáticas vigentes que le permiten administrar y difundir información diversa en un contexto social, académico y laboral

Más detalles

proyecto atarraya Pequeño Manual de Publicación en SPIP

proyecto atarraya Pequeño Manual de Publicación en SPIP proyecto atarraya...internet con compromiso social Pequeño Manual de Publicación en SPIP Qué es SPIP? Técnicamente SPIP es un sistema de manejo de contenidos para sitios web, es decir un mecanismo que

Más detalles

TUTORIAL PARA CREAR LA WEB DEL DEPARTAMENTO

TUTORIAL PARA CREAR LA WEB DEL DEPARTAMENTO TUTORIAL PARA CREAR LA WEB DEL DEPARTAMENTO Este tutorial muestra los pasos a seguir para que un departamento organice su espacio web en la intranet (red interna) del Instituto. Se trata de que al acceder

Más detalles

ETIQUETAS HTML 5 Diseño de Sitios Web TUW

ETIQUETAS HTML 5 Diseño de Sitios Web TUW Etiqueta Descripción Define un comentario nueva nueva nueva nueva

Más detalles

Para acceder al Panel de control de JOOMLA 1.5 se disponen de dos medios:

Para acceder al Panel de control de JOOMLA 1.5 se disponen de dos medios: 2 ACCESO Para acceder al Panel de control de JOOMLA 1.5 se disponen de dos medios: Forma directa: Hay que introducir la dirección del portal al que se quiere acceder concretamente. De esta manera se entrará

Más detalles

Gestión Documental ERP

Gestión Documental ERP N. Documento Revisión Nº: 1.0 Fecha: 30/03/11 Introducción 1 Configuración de la Gestión Documental ERP 2 Funcionamiento de la Gestión Documental ERP 6 ÍNDICE Introducción El programa Ahora permite una

Más detalles

CÓMO CREAR UNA WEBQUEST Paso a Paso

CÓMO CREAR UNA WEBQUEST Paso a Paso CÓMO CREAR UNA WEBQUEST Paso a Paso 1.- Lo primero que tenemos que hacer es acceder a la página del instituto usando Mozilla (no usar el navegador Firefox que puede dar problemas) URL: www.ieseltablero.org

Más detalles

EXPERIENCIAS EDUCATIVAS. CREAR UN PORTAL EDUCATIVO CON JOOMLA

EXPERIENCIAS EDUCATIVAS. CREAR UN PORTAL EDUCATIVO CON JOOMLA EXPERIENCIAS EDUCATIVAS. CREAR UN PORTAL EDUCATIVO CON JOOMLA AUTORÍA PEDRO J. MORENO GARCÍA TEMÁTICA TIC ETAPA ESO, BACHILLERATO,FP Resumen Con Joomla podemos crear en pocas horas un completo portal para

Más detalles

manual formación web básica Ozongo Ozongo c/nicolás Copérnico 8, bajo 46980 Paterna (Valencia) 900 828 358 soporte@ozongo.com

manual formación web básica Ozongo Ozongo c/nicolás Copérnico 8, bajo 46980 Paterna (Valencia) 900 828 358 soporte@ozongo.com manual formación web básica Ozongo ÍNDICE Manual formación web básica Ozongo 1. ADMINISTRACIÓN 1.1. Secciones y portada 1.2. Menú 1.3. Diseño 1.4. Configuración de estadísticas 1.5. Estadísticas 2. CORPORATIVO

Más detalles

Internet Explorer 5.0

Internet Explorer 5.0 Internet Explorer 5.0 Trucos para la suite de comunicaciones de Microsoft 1 Actualizaciones Es importante tener siempre actualizado el navegador, sea cual sea la versión que se emplee, por lo que conviene

Más detalles

Curso POWERPOINT 97. Introducción

Curso POWERPOINT 97. Introducción Curso POWERPOINT 97 Introducción El curso PowerPoint 97 está destinado a aquellos alumnos que necesiten crear presentaciones que informen de la evolución de un proyecto. PowerPoint es un programa de edición

Más detalles

Indexhibit 2 Tareas comunes

Indexhibit 2 Tareas comunes Indexhibit 2 Tareas comunes Oscar Ciutat oscarciutat.com/code Cómo entrar en el área de administración de Indexhibit? 1. Ir a www.direccion.com/ndxzstudio/, sustituyendo www.direccion.com por la dirección

Más detalles

Ministerio de Educación. Base de datos en la Enseñanza. Open Office. Módulo 3: Edición de formularios

Ministerio de Educación. Base de datos en la Enseñanza. Open Office. Módulo 3: Edición de formularios Ministerio de Educación Base de datos en la Enseñanza. Open Office Módulo 3: Edición de formularios Instituto de Tecnologías Educativas 2011 Edición de formularios Una vez creado el formulario nos pueden

Más detalles

Website Taurus. Administrador de contenidos Manual de Usuario

Website Taurus. Administrador de contenidos Manual de Usuario e s t r a t e g i a c r e a t i v i d a d t e c n o l o g í a Website Taurus Administrador de contenidos Manual de Usuario INDICE 1 Ingreso al sistema... 3 2 Interfaz del Sistema... 5 2.1 Estándar de la

Más detalles

Herramientas Informáticas para la Documentación Práctica 1. Introducción al navegador Netscape

Herramientas Informáticas para la Documentación Práctica 1. Introducción al navegador Netscape Herramientas Informáticas para la Documentación Práctica 1. Introducción al navegador Netscape Introducción y objetivos De modo muy resumido Internet es una red que interconecta redes de ordenadores. Conectándose

Más detalles

METODOLOGÍA DE DESARROLLO DE CONTENIDOS WEB ACCESIBLES ÍNDICE DE CONTENIDO

METODOLOGÍA DE DESARROLLO DE CONTENIDOS WEB ACCESIBLES ÍNDICE DE CONTENIDO ÍNDICE DE CONTENIDO Metodología de desarrollo de contenidos web accesibles...1 Estándares de accesibilidad de la UE...2 Desglose por roles...2 Creación de contenidos...2 Diseño...3 Programación...4 Anexo

Más detalles

Manual de gestión de contenidos web en entorno Drupal. Versión sitio maestro para servicios 1.0

Manual de gestión de contenidos web en entorno Drupal. Versión sitio maestro para servicios 1.0 Manual de gestión de contenidos web en entorno Drupal Versión sitio maestro para servicios 1.0 Contenido Gestión de contenidos... 5 Crear contenidos... 5 Tipos de contenido... 5 Página básica o basic

Más detalles

Lenguaje HTML y páginas web. Alex Sánchez

Lenguaje HTML y páginas web. Alex Sánchez Lenguaje HTML y páginas web Alex Sánchez Introducción: La web y las páginas web Componentes de la web Como funciona la web? Como es la comunicación en la web El acceso a la Web suele basarse en un un explorador

Más detalles

Configuración de un sitio local

Configuración de un sitio local Configuración de un sitio local Un sitio web es un conjunto de archivos y carpetas, relacionados entre sí, con un diseño similar o un objetivo común. Es necesario diseñar y planificar el sitio web antes

Más detalles

PROGRAMA FORMATIVO MACROMEDIA STUDIO 8

PROGRAMA FORMATIVO MACROMEDIA STUDIO 8 PROGRAMA FORMATIVO MACROMEDIA STUDIO 8 www.bmformacion.es info@bmformacion.es Objetivos Se estudia la suite Macromedia Studio 8, que está formada por un conjunto de aplicaciones utilizadas por diseñadores

Más detalles

Anexo I: Detalles sobre Diseño WEB y Diseño Interactivo

Anexo I: Detalles sobre Diseño WEB y Diseño Interactivo Anexo I: Detalles sobre Diseño WEB y Diseño Interactivo Anexo I: Detalles sobre Diseño WEB y Diseño Interactivo... 1 1. Los ejes alrededor de un diseño interactivo... 2 2. Los problemas de Adobe Flash...

Más detalles

Herramientas para crear páginas.

Herramientas para crear páginas. Herramientas para crear páginas. Herramientas para la creación de páginas Web. Como hemos visto resulta sencillo pero engorroso escribir directamente en HTML. Por ello es más sencillo utilizar un editor

Más detalles

Índice. HTML HyperText Markup Language. Conceptos básicos. Qué es HTML? Diseño de servicios Web HTML 1

Índice. HTML HyperText Markup Language. Conceptos básicos. Qué es HTML? Diseño de servicios Web HTML 1 Índice HTML HyperText Markup Language Conceptos básicos Historia y evolución de HTML XHTML vs. HTML HTML dinámico Hojas de estilo (CSS) DOM Diseño de servicios Web 2 DATSI Qué es HTML? Lenguaje de publicación

Más detalles

Algunos de los botones ofrecen las funcionalidades básicas para el trabajo con ficheros propias de cualquier programa editor.

Algunos de los botones ofrecen las funcionalidades básicas para el trabajo con ficheros propias de cualquier programa editor. Curso de creación de documentos Web Servicio de Comunicaciones Uso del Netscape Composer para la creación de documentos HTML 1.- Creación de un documento. El Netscape Communicator incluye un programa,

Más detalles