Sección: A
Jornada: Isemed
Fecha de entrega:20/07/2018
ÍNDICE
Introducción……………………………………………………………………… (1)
Conclusiones………………………………………………………………… (12-13)
Recomendaciones…………………………………………………………… (14)
Anexos………………………………………………………………………… (15-16)
Bibliografía……………………………………………………………………… (17)
INTRODUCCIÓN
Hoy en día todos tenemos una web en nuestras empresas y quien no tenga una
web estará pensando en crear su propia página web para su negocio. Por esta
razón es por la que el mercado del desarrollo web está en alza y por la que hay
tantos profesionales que se dedican a esta profesión.
1
OBJETIVOS ESPECÍFICOS
2
OBJETIVOS GENERALES
3
MARCO TEORICO
Para crear una empresa online y hacerla visible de una forma rápida y sencilla,
se deben seguir los consejos, recursos y herramientas para diseño web que se
van a explicar a continuación. En muchas ocasiones, se necesita echar mano de
recursos tanto de diseño como de desarrollo web, ya que el nivel de
conocimiento de diseño o código no es el más adecuado para ponerse a
programar desde cero. Incluso, es más, en muchísimas ocasiones, existen casos
de emprendedores que han abierto su negocio con páginas web creadas a partir
de estos recursos y sin tener conocimiento alguno de desarrollo web, por lo que
se proponen dar el paso de crear una línea de negocio con las apps móviles y
vuelven a utilizar este tipo de recursos que se pueden encontrar en la Red.
Por un lado, existen las herramientas esenciales, que son aquellas que van a
ayudar a crear la plataforma web (en código puro y duro o con un CMS) sobre la
que se va a construir el negocio. Sin la existencia de dicha plataforma no se
podrá crear el negocio online y, obviamente, el resto de recursos no tendrá
utilidad alguna. De ahí que se hayan denominado como esenciales o básicas.
4
De cara a embellecer esta plataforma, se necesitará una serie de recursos para
mejorar el diseño web y, por consiguiente, facilitar a la plataforma un aspecto
con cierto atractivo y que consiga atraer de manera visual a los usuarios. La
imagen que perciban los usuarios cuando visiten la página debe ser lo más
ajustada posible a lo que se desea mostrar, ya que esta será la tarjeta de visita
online del negocio.
Por último, si se desea tener presencia en las App Sores de los distintos
dispositivos móviles, habrá que utilizar una serie de herramientas que permitan
transformar o crear el negocio en app y funcionen correctamente para los
distintos dispositivos que se pueden encontrar en el mercado. O, por lo menos,
para los más utilizados.
5
Es más, la gran mayoría de plantillas que se pueden encontrar en Témplate es
'responsiva', es decir, que los usuarios que visiten la página a través de su móvil
verán la página web adaptada a las dimensiones de dicho dispositivo.
Otra opción sería utilizar aplicaciones gratuitas que proporcionan los servidores
de hosting. Al tener que contratar un hosting en el que alojar la web, se pueden
utilizar las herramientas que ellos mismos proporcionan para crear una web en
varios pasos y con distintos diseños a elegir y fáciles de mantener. Esta opción
es rápida y sencilla, pero es importante saber que, si se cambia de hosting, se
perderá la web y habrá que comenzar de nuevo en otro hosting.
La opción más avanzada sería utilizar un CMS gratuito del tipo de WordPress,
Joomla o Drupal; o, si el negocio está enfocado a ser una tienda virtual,
PrestaShop o Magento. Todas las plataformas anteriormente nombradas son
gratuitas y su instalación es relativamente fácil en el servidor, aunque requieren
de conocimientos web, ya que, para su correcto funcionamiento, hay que activar
módulos y plantillas. Tanto los módulos como las plantillas para este tipo de CMS
son gratuitas, pero, si se necesita algo más personalizado o con mayor nivel de
profesionalización, existen recursos de pago que se acoplen a las necesidades
del negocio.
Si finalmente uno se decanta por esta opción, que es una de las más completas
y controladas, hay que tener en cuenta que la instalación de módulos, plantillas
y plugins no se debe realizar de manera indiscriminada. Cada vez que se instala
cualquiera de estos recursos se están añadiendo líneas de código al sistema y,
por tanto, se puede ralentizar la carga de la página.
Es por eso que se recomienda siempre mantener el código lo más limpio que se
pueda. En este caso, si se instalan únicamente aquellos recursos que vayan a
estar activos en el panel, eso permitirá la optimización de la carga de la página
y, finalmente, la velocidad de carga será sensiblemente menor.
6
Como pequeño apunte, hay que indicar que se destaca la velocidad de carga
frente a otros factores que pueden afectar al SEO de la página, puesto que es
uno de los factores sobre los que se puede tener control sin apenas poseer
conocimiento. Siempre hay que cuidar, en la medida de lo posible, aquellos
aspectos que puedan ayudar a posicionar el negocio en las primeras páginas del
ranking de los distintos buscadores, entre los que se encuentran el archiconocido
Google, ¡¡¡¡¡¡Yahoo!!!!!!!, Bing y Yandex (este último cada vez se está integrando
más en el mercado, ya que el mercado ruso está cada vez más en expansión).
Herramientas de diseño web para hacer más atractiva la experiencia del usuario
Mockup Web
Como primer paso, es necesario tener una idea acerca de cómo se desea que
sea el logo con el que se identifique el negocio o la marca. Si todavía no está
creado el logo y no se poseen conocimientos para diseñar uno con calidad, se
aconseja la utilización de Squarespace Logo y se podrá crear el logo en dos
pasos. Primero se coloca el texto que irá en el logo (la marca o el nombre de la
empresa o, incluso, un breve slogan) y después se adjunta una imagen sencilla,
pero que identifique perfectamente a la empresa o actividad comercial. Si, por el
contrario, no existe una idea formada de lo que se desea como logo, se puede
utilizar la herramienta de diseño de logos gratuita Withoomph, que solicita que
se escriban unas cuantas palabras clave que identifiquen el negocio para poder
mostrar varios diseños sugeridos por la misma aplicación. Aunque la idea es fácil
y permite modificar algunos diseños mostrados, se puede correr el riesgo de
seleccionar un logo que otra persona también haya solicitado a la aplicación
(aunque la probabilidad de que ocurra esta opción es mínima).
7
Respecto a la decoración de los productos, artículos y demás contenidos, se
necesitarán unos pequeños bancos de imágenes (en este caso, gratuitos), que
faciliten imágenes con un diseño muy cuidado y harán aún más atractivo el
contenido. Para ello, se pueden visitar páginas como:
Pixabay: hay multitud de imágenes gratuitas y solo hay que citar a la fuente. La
gran mayoría de los recursos fotográficos proviene de usuarios de habla inglesa,
por lo que, si la búsqueda se realiza en dicho idioma, se conseguirá una
respuesta mejor.
Desarrollo Web
8
A diferencia de las anteriores, la herramienta para crear apps móviles UppSite
no solo permite crear una app del negocio para los tres sistemas operativos
principales (Android, Apple y Windows Phone) de los dispositivos móviles y
distribuirla en las dos grandes tiendas (App Store (Apple) y Google Play
(Android)), sino que también la distribuye en su propia tienda online.
Mockflow es una herramienta esencial para crear una plataforma para Android o
iPhone sin necesidad de tener conocimientos de programación o diseño.
Además, a diferencia del resto de herramientas que hasta el momento se han
detallado, esta posee un sistema 'drag and drop' por el que se puede construir la
plataforma simplemente arrastrando los recursos de un lado a otro de la pantalla.
Es muy intuitiva y fácil de utilizar.
9
Chrome Developer Tools
Con las DevTools puedes editar el DOM (HTML)/CSS en tiempo real, depurar
JavaScript paso a paso y añadir una terminal. Con esta herramienta puedes
aprender mucho acerca de cómo un navegador hace su trabajo realmente, lo
que te permite tomar por completo el control de tu aplicación. Además de su sitio,
puedes visitar su canal de Youtube donde conseguirás información muy valiosa
que seguro sabrás apreciar. También puedes unirte a su comunidad en Google
Grunt
Una vez instalado, Grunt es fácil de usar y cuando aprendas todo su potencial
seguramente no dejaras de usarlo regularmente. En su sitio hay una guía de
primeros pasos y una serie de documentación que te ayudara a conocerlo. Si
quieres revisar su código y colaborar con el proyecto puedes visitar su perfil de
GitHub o unirte a su comunidad en Twitter.
10
Libérela
Se puede descargar para las distintas plataformas desde su sitio. Si quieres dar
un vistazo a su código y hacer contribuciones puedes visitar su perfil de GitHub.
También puedes seguirlos en Twitter.
Mocha
Mocha puede ser instalado con npm. Para más información puedes visitar su
Wiki o unirte a su grupo de Google. Si deseas ver su código fuente puede visitar
su perfil en GitHub.
11
CONCLUSIONES
12
En el momento de implementar la solución propuesta en el presente informe,
además de una labor de desarrollo de software se realizó una actividad de
investigación de tecnologías de desarrollo Web que permitió descubrir una gran
variedad de funcionalidades que pueden ser implementadas contando con la
base conceptual desarrollada en este trabajo de grado.
Funcionalidades tan innovadoras como:
• El hecho de poder elaborar estrategias de negocio que conozcan las
preferencias de los clientes al momento de visitar un sitio determinado.
• Catálogos dinámicos de productos actualizados remotamente vía Web para
aplicaciones de escritorio sin necesidad de hacer una modificación costosa, tanto
en tiempo como en implementaciones, de los archivos fuentes.
13
RECOMENDACIONES
14
ANEXOS
15
16
BIBLIOGRAFÍA
17