Refill creativo memoria v 11

UTILIZACIÓN DE HERRAMIENTAS WEB EN UNA AGENCIA DE PUBLICIDAD “REFILL CREATIVO”

INDICE

Agradecimientos................................................................................4

Presentación......................................................................................5

Justificación.......................................................................................6

Objetivo de la memoria.....................................................................6

Objetivos específicos........................................................................6

Marco de referencia de Refill Creativo..............................................7

Desempeño profesional....................................................................8

CAPÍTULO 1......................................................................................9

WEB..................................................................................................9

Historia de la Web.......................................................................10

Herramientas Web.......................................................................11

Sitio Web, importancia competitiva..............................................12

CAPÍTULO 2...................................................................................14

REFILL CREATIVO.........................................................................14

Creación de un sitio web.............................................................15

Desarrollo web.........................................................................16

Diseño web..............................................................................18

Publicación...............................................................................19

CAPÍTULO 3...................................................................................20

Hans Habid Jaimes Aviles

2


DESARROLLANDO Y DISEÑANDO EN REFILL CREATIVO........20

Desarrollo Refill...........................................................................20

Diseño Refill.................................................................................21

Publicación y Seo Refill...............................................................21

ANEXOS..........................................................................................23

Entrevista.........................................................................................23

GLOSARIO......................................................................................27


3


Agradecimientos

Texto indefinido


4


Presentación

La presente memoria de trabajo se realizó, para que los diseñadores y programadores web, tengan en consideración el posicionamiento, la usabilidad y el diseño de un sitio de internet, a partir de lo aprendido en la agencia de publicidad “Refill Creativo”.

Se estima que el lector, está familiarizado con el término web, por lo que no se abordara a fondo los conocimientos básicos, sin embargo, se podrá guiar por el glosario, en caso de que desconozca un término usado en el proyecto, el presente NO ES UNA GUIA, pero puede tomar en cuenta lo expuesto en él.

Los sitios web se han vuelto, comunes en la publicidad de una empresa, se muestra información de la misma así como los servicios que pueden ofrecer y donde podrán contactarles, acercando aún más a los usuarios o clientes, sin embargo realizar una página de internet, tiene un proceso riguroso, avanzado y creativo, teniendo en cuenta la usabilidad, y el posicionamiento en los motores de búsqueda, para su fácil localización dentro de la web.

En la actualidad aún existen algunas páginas de internet, donde se olvida el posicionamiento en buscadores, la usabilidad, y la organización de un código HTML, el 40% de los clientes de la agencia publicitaria “Refill Creativo” acuden para una restructuración y posicionamiento de sus sitios web, por la des ventaja frente a otras páginas que ofrecen el mismo servicio, en esta memoria se analizara la forma de realizar páginas Web, dentro de la agencia.


5


Justificación

Se obtendrá la optimización en la elaboración de sitios web para el posicionamiento en los motores de búsqueda. Explicando de manera detallada el trabajo profesional durante la estadía en la agencia de publicidad “Refill Creativo”.

Objetivo de la memoria

Aumentar el conocimiento de los desarrolladores web, atreves de cómo se realizan las páginas de internet en la agencia publicitaria “Refill Creativo”, abarcando el posicionamiento y adaptándose a las necesidades del cliente, así como su diseño y organización del código HTML.

Objetivos específicos

Identificar las consideraciones que se deben tener en cuenta en la realización de un sitio web.

Analizar la utilización de las hojas de estilo (ccs) en el diseño de una página web.


6


Marco de referencia de Refill Creativo

Refill Creativo agencia publicitaria aplicada a web, localizada en: Camelias #5 Izcalli Cuauhtemoc 1A sección Metepec, México con números telefónicos 01 800 433 3071, (722) 212 36 49 y su página web: http://refillcreativo.com.mx/.

Como principal objetivo de la empresa, es guiar a los emprendedores que deseen tener un éxito dentro del mundo empresarial, mediante una estrategia publicitaria que incluye entre muchas cosas el desarrollo de sitio web, posicionándolo en los motores de búsqueda como, primera página.

En Refill Creativo tienen su propia ideología para hacer las cosas, le llaman “Refilers”, en el cual se crean proyectos los cuales mediante un pizarrón se escriben los objetivos y metas, el equipo trabaja mediante un método de “focusroom”, en cual se trabajaba por 79 minutos enfocándose en sus tareas, seguido de 20 minutos de descanso, la empresa cuenta con una sala de juegos para que su equipo pueda descansar y continuar su trabajo de manera eficaz.

“Refill creativo surge con un sueño, el crear una agencia que brindara resultados efectivos más de una vez, por eso el “Refill”, que se enfocará directamente en el compromiso de


7

http://refillcreativo.com.mx/


hacer crecer el negocio de nuestros clientes y que nos divirtamos mucho en cumplir sus metas.”

Francisco Cazares Gómez Tagle- Director creativo

Desempeño profesional

Una página de internet es creada con varios lenguajes de programación HTML, CSS, php y MySql ,1 a la persona que tenga conocimiento sobre esto y lo practique se les conoce como desarrolladores web o diseñadores web2, el autor de esta memoria realizo en la agencia publicitara “Refill Creativo” el cargo de desarrollador web, con sus conocimientos previos aprendidos durante su carrera universitaria “animación y arte digital”.

Se encargó de la programación de páginas web, utilizando los lenguajes mencionados con anterioridad, que abarca las primeras partes del diseño, la colocación en los buscadores (SEO) y el orden del código HTML, para tener una optimización del sitio a desarrollar.


8

http://www.comocreartuweb.com/curso-de-html.html

http://www.comocreartuweb.com/curso-php-y-msql.html



1. http://www.comocreartuweb.com 2. http://www.basekit.com.mx/basekiteca/diferencias-entre-un-desarrollador-y-un-

disenador-web

CÁPITULO 1

CAPÍTULO 1

WEB


9

http://www.basekit.com.mx/basekiteca/diferencias-entre-un-desarrollador-y-un-disenador-web

http://www.basekit.com.mx/basekiteca/diferencias-entre-un-desarrollador-y-un-disenador-web

http://www.comocreartuweb.com/


(I)

La Red o la web, es un amplio mar de conocimientos e información de diferentes usuarios, ya sea de paga o de libre uso, el termino es usado para nombrar al internet en general, la palabra puede dar mención también para los sitios web, páginas web y servidores web, su significado del término en ingles da mención a una Red, telaraña o malla. (3)

Una página Web es el conjunto de archivos multimedia como videos, imágenes audio con o sin texto escritos sobre un documento HTML, a un grupo de páginas web que suelen formar parte de un dominio o subdominio de internet se le conoce como sitio Web, dentro del sitio las paginas se redirecciones entre sí mediante los vínculos.(4)


10


Historia de la Web

La Web que conocemos hoy en día es el resultado de la colaboración de varios ingenieros como son Tim Berners-Lee, que en el año de 1980 que retomo el proyecto de Ted Nelson con su propuesta de hipertexto, una idea que sugería intercambio de hipertextos mediante la utilización de máquinas, tras varios esfuerzos del británico Tim Berners-Lee(5) se publicó el primer hipertexto con el nombre de HTML Tags (Etiquetas HTML) en 1991 siendo este la primer página de lo que sería hoy en día el internet, posterior mente el HTML fue creciendo y aumentando sus posibilidades de agregar más que solo texto, se buscó una estatización con lo cual tendría una segunda versión en 1998 HTML 2(6), con el paso de los años y la globalización el HTML 5 se convertiría en la versión definitiva del estándar se publicó en octubre de 2014(7), te permite la utilización de animación, archivos, imágenes, sonidos, videos, siendo esta la última versión y de la cual se hablara en este documento.

Herramientas Web

El desarrollo de un sitio web, parte de la utilización de un grupo de herramientas y software, las páginas web están escritas en un código HTML, como se había explicado anteriormente, dentro de los software que están disponibles para realizar este tipo de tareas el más relevante es el ADOBE Dreamweaver, el editor de textos es una extensión para realizar las tareas web, donde se utilizan diversas herramientas como las creadas por Google Inc(8), que pueden ser utilizadas dentro de nuestro sitio web, un ejemplo


11


es Google maps, para la localización de un lugar que se desea que el usuario conozca.

La utilización de las herramientas web cambian constantemente, por lo general son un complemento de tu sito, incluso en sitios que buscan sitios, esto para aumentar el nivel del SEO y tener más posibilidades de ser encontrado de tu publico dentro de los motores de búsqueda más relevantes como son Google y Yahoo! Para poder llevar a cabo una correcta utilización de las herramientas web, se recomienda que primero se asegure de no abusar de estas por que pueden hacer que el tiempo de cargado de una computadora con una velocidad de internet baja sea lento y provoque al usuario a abandonar la página eh intentar buscar información que necesite en otra, se debe tener en cuenta que las herramientas web pueden variar y tendrá paginas o sitos que se adapten sus necesidades (9).

Sitio Web, importancia competitiva

Actualmente la mayoría de las empresas tienen presencia en la web, debido a sus ventajas competitivas contra otras empresas, dentro de las ventajas encontraras la posibilidad de llegar a cualquier cliente del mundo, lo único que necesitan es saber la dirección URL que se te proporciona al adquirir un domino web, al tener al alcance tu idea, negocio o estudio, millones de usuarios en el mundo podrán compararte, analizarte y comprarte o venderte (10).


12


(II)

Dentro de los mercados potenciales de una empresa se podrá localizar en la web, teniendo en cuenta el uso del internet en la actualidad ha aumentado su utilización y sigue en crecimiento (11), también se debe tener en cuenta que una ventaja más es los bajos costos de publicidad y en personal (12) ya que la información de su empresa se coloca en su sito para que pueda ser localizado. Para ser encontrado dentro de la red más fácil se necesita un buen posicionamiento para los motores de búsqueda y es ahí donde hablamos del SEO, mientras más grande se posicionamiento más posibilidad de ser encontrado y contactado por algún cliente del mundo.


13


3 http://lema.rae.es/dpd/?key=web 4 http://definicion.de/web/ 5 http://www.hipertexto.info/documentos/h_www.htm 6 http://librosweb.es/libro/xhtml/capitulo_1/breve_historia_de_html.html 7 http://www.osnews.com/story/28003/HTML_5_Finalized 8 http://www.google.com/about/ 9 https://juandomingofarnos.wordpress.com/2011/02/28/100-herramientas-de-la-web-2-0-para-el-aula/ 10 http://www.newwweb.com.mx/sitios-web-para-pequenas-empresas 11 http://www.cisco.com/web/ES/about/press/2012/2012-05-30-internet-sera-cuatro-veces-mas-grande-en-2016--informe-vini-de-cisco.html 12 http://www.prointernacional.com/es/de-interes-informacion-de-utilidad/30-la-importancia-de-tener-un-sitio-web.html

CAPÍTULO 2


14

http://www.prointernacional.com/es/de-interes-informacion-de-utilidad/30-la-importancia-de-tener-un-sitio-web.html

http://www.prointernacional.com/es/de-interes-informacion-de-utilidad/30-la-importancia-de-tener-un-sitio-web.html

http://www.cisco.com/web/ES/about/press/2012/2012-05-30-internet-sera-cuatro-veces-mas-grande-en-2016--informe-vini-de-cisco.html

http://www.cisco.com/web/ES/about/press/2012/2012-05-30-internet-sera-cuatro-veces-mas-grande-en-2016--informe-vini-de-cisco.html

http://www.newwweb.com.mx/sitios-web-para-pequenas-empresas

https://juandomingofarnos.wordpress.com/2011/02/28/100-herramientas-de-la-web-2-0-para-el-aula/

https://juandomingofarnos.wordpress.com/2011/02/28/100-herramientas-de-la-web-2-0-para-el-aula/

http://www.google.com/about/

http://www.osnews.com/story/28003/HTML_5_Finalized

http://librosweb.es/libro/xhtml/capitulo_1/breve_historia_de_html.html

http://www.hipertexto.info/documentos/h_www.htm

http://definicion.de/web/

http://lema.rae.es/dpd/?key=web


CAPÍTULO 2

REFILL CREATIVO

(III)

Refill Creativo, es un agencia publicitaria ubicada en Camelias #5 Izcalli Cuauhtemoc 1A sección Metepec, México con números telefónicos 01 800 433 3071, (722) 212 36 49. Fundada por Francisco Cazares Gómez Tagle (Diseñador gráfico) y Luis Jesús Gómez Tagle (Ingeniero) en el año 2006, registrada inicialmente como Refill Creativo y continúa con el mismo nombre, empezó siendo una agencia de publicidad general (logotipos, viniles, etc.), posteriormente comenzó a expandirse al desarrollo web, los resultados eran favorecedores, la demanda aumento para Refill Creativo y con ello la contratación de más personal,


15


actualmente la agencia está enfocada al desarrollo web, teniendo un amplia experiencia en la optimización de los sitios y el posicionamiento de los motores de búsqueda.

En la agencia Refill Creativo, los equipos de trabajo se dividen en 2;

Diseño web Desarrollo web

Creación de un sitio web

La creación de una página de internet consta de varios pasos; el desarrollo, el diseño y la publicación, se estima que haya una persona encargada de cada una de estas tareas, pero también puede realizarlo todo una sola persona, el desarrollo y el diseño se hacen al mismo tiempo, la publicación se recomienda al final, ahora bien se dará una explicación en este capítulo de cada uno de las 3 tareas a realizar para, que tenga un conocimiento previo, para que cuando se expongan las ideas aprendidas en la agencia publicitaria “Refill Creativo” se tenga noción de expuesto ahí, pero como se había mencionado en el prefacio (pag2), esto no es una guía por lo que se omitirán detalles.

Desarrollo web


16


El desarrollador es la persona encargada de aquello que no se ve en la web2, el código, que por lo general está compuesto por HTML, Php entre otros dependiendo las funciones de la página a realizar, para ello necesita un editor de texto, y un visualizador o navegador, en donde se escribirá el código y se visualizara en el navegador la página realizada en el editor de texto, existen programas especializado en para la creación del código HTML y demás lenguajes a utilizar, como el Dreamweaver CS6 de la familia ADOBE, nos enfocaremos en el por qué es el programa que proporciono la agencia, para la realización de sitios web, durante el proceso del desarrollo se tiene que tener en cuenta diversos factores, como la organización del código y las hojas de estilo (ccs), el SEO o el posicionamiento en los motores de búsqueda como GOOGLE de la página que se realiza y termina con publicación, todo lo que realice en esta parte, si está correctamente escrito (el código), pasara a la parte de visualización que es donde se verá el diseño que tiene y lo que las personas vemos a la hora de abrir una página web con un navegador web como: Firefox, Google Chrome, Internet Explorer, Opera, Safari, entre otros4.

Dentro de la agencia Refill Creativo los desarrolladores web, utilizan el programa para la creación de sitos ADOBE Dreamweaver CS6 ellos son los que realizan lo que no se ve en la pantalla del usuario y reciben los materiales visuales de sus compañeros de diseño web, un desarrollador es el encargado de crear la página, subir imágenes y textos a la página, actualizar el interface de la página y publicación de un página de internet.

Una página de internet se realiza mediante un lenguaje de programación llamado HTML y sus derivados como PHP, etc. Los desarrolladores de Refill Creativo primero reciben, un layuot de


17


cómo se va a ver la página, después los gráficos y textos a utilizar, y finalmente comienzan con la escritura del código HTML, durante el proceso de la escritura del código se pueden cambiar gráficos y textos, incluso terminando la publicación, a este hecho se le domina actualización de interface de la página web del cliente.

(IV)

Teniendo también a cargo el posicionamiento de los motores de búsqueda, lo cual abarca desde la escritura del código HTML y después de la publicitación en registrar los sitios a los buscadores como Google y entre otros.

Diseño web


18


El equipo de Diseño Web de Refill Creativo, planifica; se analiza el cliente, su historia, su mercado y sus competidores, para que se le pueda definir una imagen de acurdo a su necesidades posteriormente se diseña la imagen empresarial del cliente en caso de requerir una, por último se elabora el contenido de la página web, se debe tener en cuenta la navegabilidad, interactividad, usabilidad del sitio y la interacción de medios como el audio, texto, imagen, enlaces(links) y video para un buen diseño del sitio web5.

(V)

Cuando se termina la imagen empresarial y el layuot de sito, se es entregado a los desarrolladores que son los encargados de realizar la programación correspondiente a la creación del sitio web, dentro de la agencia, el equipo de trabajo a veces puede realizar ambas tareas el diseño y el desarrollo, para eso necesita un conocimiento previo a ambas disciplinas (diseño gráfico y programación HTML).

Publicación


19


Finalmente para el funcionamiento de un sito se tiene la publicación, a cargo de los desarrolladores web, se debe realizar una serie de tareas previas a la publicación, las cuales son; la compra del dominio y el host, revisar el código fuente para asegurarse que no se olviden errores, a veces esta parte puede ser de las más laboriosas, al terminar con las tareas previas pasa la publicación que se hace mediante el mismo programa utilizado para la programación de código fuente de la página de internet, que le sitio este en línea y lo pueda vista cualquier persona en el mundo no quiere significar que ya está optimizado para los buscadores típicos como Google, para esto se debe de realizar una serie de tareas durante la creación del código y después de la publicación, a esto se le conoce como SEO (search engine optimization)6, tareas de las cuales se explicara posteriormente en los siguientes capítulos.

13 http://es.wikipedia.org/wiki/Desarrollo_web

14 http://riojaweb.es/historia-web-1992-con-algo-menos-de-50-webs/

15 http://www.imaginanet.com/consejos-de-diseno-web.html#popup:1040

16 Fernando Maciá Domene (2011), Técnicas avanzadas de posicionamiento en buscadores-, Anaya Multimedia.

CAPÍTULO 3


20

http://www.imaginanet.com/consejos-de-diseno-web.html#popup:1040

http://riojaweb.es/historia-web-1992-con-algo-menos-de-50-webs/

http://es.wikipedia.org/wiki/Desarrollo_web


CAPÍTULO 3

DESARROLLANDO Y DISEÑANDO EN REFILL CREATIVO

El trabajo realizado por la agencia, comienza con el análisis de una empresa que ha solicitado sus servicios a Refill Creativo ya sea de web o de toda una campaña pub listaría, sin embargo nos enfocaremos únicamente en web como se había mencionado con anterioridad, dentro de los proyectos realizados durante la estancia de 6 meses, el autor se encontrara involucrado en (numero) de los cuales (n) los realizara con apoyo y (n) serán llevados a cabo por él únicamente, el sub capitulado de este capítulo será divido en 3 donde se explicara el desarrollo de los proyectos, el diseño en otro subcapítulo y por último la publicación y la colocación en buscadores dentro de un subcapítulo.

Desarrollo Refill

Esta parte esta aun indefinida se explicara Dentro de este, como se llevo a cabo la realización de cada uno de los proyectos que se trabajaron dentro del periodo de los 6 meses de trabajo


21


Diseño Refill

A pesar que en este capitulo al igual que el anterior no tengo nada definiod estoy indeciso de cual colocar primero si el desarrollo o el diseño ya que en el diseño se analiza lo relacionado con la empresa de la cual se va trabajar como sus competencias colores y que pagina podría quedar con esta acoplándose a su presupuesto antes de comenzar con el desarrollo pero, el diseño de una página web se entiende como el resultado, o lo que se desea lograr.

Publicación y Seo Refill

En este ultimo apartado hablare de cómo se publica los sitios y como se dan de alta en lso buscadores para aumetar su SEO o nivel de busqeuda con los proyectos que se llevaron acabo, a pesar que esto se realiza durante el desarrollo del sitio, y aquí neuvamente otra duda ….


22



23


ANEXOS

ANEXOS

Entrevista

El día 27 de Febrero de 2015 se realizó una entrevista al Fundador y Director creativo Francisco Cazares Gómez Tagle de la agencia publicitaria Refill Creativo, con motivo de conocer un poco de la historia y sus intereses de la misma, esto son los resultados obtenidos:

¿Qué es Refill Creativo?

La agencia de publicidad con mayores casos de éxito en Toluca y MetepecRefill Creativo somos la primera agencia de publicidad aplicada en web.Somos expertos en aumentar las de ventas de nuestros clientes.

¿Cómo surge?

Refill creativo surge con un sueño, el crear una agencia que brindara resultados efectivos más de una vez, por eso el Refill, que se enfocará directamente en el compromiso de hacer crecer el


24


negocio de nuestros clientes y que nos divirtamos mucho en cumplir nuestras sus metas.

Háblanos de la forma de trabajar

En Refill Creativo tenemos nuestro propia ideología para hacer las cosas, les llamamos Refilers creamos proyectos en los cuales fijamos metas e invertimos 100% de nuestra capacidad hasta lograr resultados increíbles que se repitan varias veces.

En Refill Creativo creemos en 3 pilares

Compromiso: En Refill Creativo somos creemos que cumplir nuestras promesas es fundamental para nosotros.

Honestidad: En Refill Creativo tenemos la convicción de siempre actuar con transparencia y compromiso con lo que hablamos y hacemos.

Empatía: En Refill Creativo nos ponemos en los zapatos de nuestros clientes para alcanzar sus objetivos.

¿Qué servicios ofrecen?

Publicidad

Acercamos a tus próximos clientes, aumentando la probabilidad de ventasAlcanza más y mejores clientes.

Web


25


Medición para mejores resultadosNuevas tecnologías para mejorar tu empresaFacilita las compras a tus clientesMedimos, probamos, analizamos y alcanzamos Vende por internet a usuarios que les encanta tu producto

DiseñoImagina tu empresa que sabes que es buena mostrándose como una gran marca internacional.Con diseño de identidad corporativa es posibleCuidamos hasta el último detalleDespreocúpate somos expertosMejoramos el prestigio de tu marcaCreamos marcas confiables

¿Cuáles son sus métodos de trabajo?

Proceso CreativoEn Refill Creativo desarrollamos nuestro proceso creativo, es un juego que lo llamamos Dr.R del cual desarrollamos todas las ideas innovadoras, creativas y locas para explicar el mundo, los productos o servicios de nuestros clientes de manera nunca antes pensada. ¿Cómo lo hacemos? Es muy divertido, planteamos el problema y comenzamos a responder cada vez de una manera diferente buscamos encontrar siempre más de 3 respuestas al mismo problema.

Focusroom

En Refill Creativo tenemos procesos únicos para trabajar uno de ellos es focusroom dónde durante 79 minutos quien está en el proceso se concentra sin ninguna distracción, solo enfocado en el


26


proyecto a desarrollar. Después de ello descansa 20 minutos seguidos.

Tester

En Refill Creativo queremos reducir los riesgos de invertir en publicidad por lo que testeamos lo que desarrollamos con diferentes usuarios meta antes de hacer el lanzamiento. Esto nos ha brindado grandes resultados con nuestros clientes.


27


GLOSARIO

GLOSARIOHTML: (en inglés: HyperText Markup Language) lenguaje de marcas de hipertexto, hace referencia al lenguaje de marcado para la elaboración de páginas web.

CSS: (en inglés: cascading style sheets) es un lenguaje usado para definir y crear la presentación de un documento estructurado escrito en HTML.

Php: es un lenguaje de programación de uso general de código del lado del servidor originalmente diseñado para el desarrollo web de contenido dinámico.

MySql: es un sistema de gestión de bases de datos relacional, multihilo y multiusuario con más de seis millones de instalaciones.

SEO: (en inglés: search engine optimization) El posicionamiento en buscadores u optimización en motores de búsqueda es el proceso de mejorar la visibilidad de un sitio web en los resultados orgánicos de los diferentes buscadores.

Navegabilidad: es la facilidad con la que un usuario puede desplazarse por todas las páginas que componen un sitio web

Interactividad: es similar al nivel de respuesta, y se estudia como un proceso de comunicación en el que cada mensaje se relaciona con el previo, y con la relación entre éste y los precedentes.


28




Usabilidad: se refiere a la facilidad con que las personas pueden utilizar una herramienta particular

Layuot: (en inglés: Layout) Un vista previa de cómo se verá una página web.

Dominio: Un dominio de Internet es una red de identificación asociada a un grupo de dispositivos o equipos conectados a la red Internet, el cómo te llamaras o te encontraran, por lo general empieza con www.

Host: El alojamiento web (en inglés: web hosting) es el servicio que provee a los usuarios de Internet un sistema para poder almacenar información, imágenes, vídeo, o cualquier contenido accesible vía web.


29

Documents

Refill creativo memoria v 11