CMS, diseño web, Gestor de contenido, HazmeWeb, Uncategorized / 21 abril, 2014

Modifica la tipografía de tú web o blog con CSS

La tipografia es parte de la personalidad de nuestro sitio.
En nuestra web o blog la tipografia es importante ya que añade personalidad al sitio. No siempre nos gusta la tipografía predefinida o no va con el tema de nuestra web/blog, por lo que nos vemos en la necesidad de modificarla.

Lo normal para mantener una cierta coherencia es no usar mas de dos fuentes, para que no parezca que nos hemos salido del sitio y hay que tener en cuenta que las fuentes de fantasía con muchos giros etc en resoluciones pobres no son legibles.

Propiedades CSS de Tipografia

Mediante CSS podemos modificar por completo el aspecto de nuestra fuente:

Propiedad tipo de fuente:

FuentesCon esta propiedad definimos el tipo y la familia de la fuente. La fuente que escribimos en primer lugar es la que utiliza el navegador por defecto, en el caso de que el equipo no tenga instalada la primera utilizara la siguiente.
Con esta propiedad hay que tener en cuenta que si el equipo desde el que abrimos la web no tiene instaladas las fuentes que hemos elegido, el navegador utilizara por defecto.

font-family: Arial, Helvetica, sans-serif

Propiedad Color de la fuente:

Con esta propiedad definimos el color en el que se vera la fuente en nuestro sitio, lo podemos definir el color de las siguientes formas:
Usar colores resalta el mensaje del texto.

color: #369;
color: black;
color: #B1251E;
color: rgb(71, 98, 176);

&nbsp
&nbsp

Propiedad tamaño de la fuente:

Es la propiedad que define el tamaño de la letra, podemos definir tamaño absoluto(indica el tamaño de letra de forma absoluta mediante alguna de las siguientes palabras clave: xx-smallx-smallsmallmediumlargex-largexx-large.) y tamaño relativo (indica de forma relativa el tamaño de letra del texto mediante dos palabras clave (largersmaller) que toman como referencia el tamaño de letra del elemento padre.)
Usar colores resalta el mensaje del texto.

Los valores que la definen son:

pixel, puntos,  em y en porcentaje %:

font-size: 9px
&nbsp
&nbsp
&nbsp
&nbsp

Propiedad ancho de la fuente:

Con esta propiedad definimos el ancho que tendrá nuestro texto, lo más habitual que usamos es la normal y negrita, pero se puede afinar mucho mas el ancho con esta propiedad.
Alternativas a la negrita.Los valores que la definen son:

normal | bold | bolder | lighter | 100 | 200 | 300 | 400 | 500 | 600 | 700 | 800 | 900 | inherit

 font-weight: bold;

&nbsp
&nbsp

Propiedad variant:

Esta propiedad permite otra variación en el estilo del tipo de letra, nos permite cambiar entre mayúsculas y minúsculas.
Variant resalta textos
Los valores que la definen son:

normal | small-caps | inherit

font-variant: small-caps;

&nbsp
&nbsp

Añadir la tipografia al sitio.

Podemos añadir tipografias especiales descargando la tipografía en nuestro sitio y haciendo una llamada con un css:

@font-face{
font-family: ‘nombredemifuente’;
src: url(‘../fonts/mifuente.otf’);
}

Con este código llamamos a una fuente especifica que hemos guardado en nuestro site en una carpeta llamada fonts. Esta forma de cargar las fuentes no es muy recomendable para textos largos ya que añade un tiempo de carga extra y hay que tener en cuenta que no todos los navegadores usan la misma extensión para las fuentes, por lo que debemos hacer una carga de fuente especifica para los navegadores que más se usan.
&nbsp
&nbsp

Añadir fuentes desde Google fonos.

Mediante google fonts podemos añadir un montón de tipografías que no están en todos los equipos, el navegador llama a la fuente que esta alojada en google fonts y no es necesario que el usuario descargue la fuente en su equipo.

Para hacer esto simplemente debemos añadir unas porciones de código en nuestro sitio que nos las da google directamente desde fonts:

<link href=’http://fonts.googleapis.com/css?family=Sniglet‘ rel=’stylesheet’ type=’text/css’>

 

diseño web, HazmeWeb, seo, Uncategorized / 16 abril, 2014

Tu Dominio, tu nombre online

Hazmeweb te ayuda a elegir tu dominio

¿Que es el dominio?

El dominio es el nombre que elegimos para representar la IP en la que esta alojado nuestro sitio web. Traduce la IP (Internet Procol) a DNS (Domain name service).

Para entendernos mejor es como en la agenda del móvil cuando asociamos un nombre con un numero de teléfono.

Los dominios son unicos y están representados por dos partes:

  • el nombre que asociamos a nuestro sitio web (Hazmeweb)
  • y el tipo de organización (.es; .com; .net; etc)

el dominio te define, hazmeweb te ayuda a elegirlo

Resalta Tu Marca

El dominio no deja de ser tu marca personal en la red, por lo que es conveniente elegirlo bien siguiendo unas pautas:

Lo Que Haces:

Intenta que tu dominio defina lo que haces, a lo que se dedica tu empresa o el tema de tu blog.

¿Ya tienes un nombre?

Si eres una empresa o profesional y ya tienes un nombre comercial registrado. En el caso de que no lo puedas registrar, usa tu nombre con algo que defina tu actividad. Para blog o webs de profesionales no es muy recomendable usar nombres propios ya que al ser muy comunes en las búsquedas, arrojaran muchos resultados.

Partiendo de Cero tu dominio:

Si no tienes nombre todavía, lo mejor es que elijas uno teniendo en cuenta estas cuestiones básicas:

1. Fácil de recordar.
2. Lo más intuitivo posible y fácil de escribir.
3. Que transmita fuerza.
4. Que sea  una representación lo más precisa posible  de tu actividad.

Simplicidad:

Cuanto mas simple sea más fácil  es de recordar

La Terminación:

Hazmeweb te ayuda a elegir la mejor terminación para tu dominioLa tendencia natural es  buscar siempre el .com por que es la terminación que más sitios aloja.  Pero esta no es siempre la mejor. Las terminaciones se crearon para definir el tipo de organización que estaba detrás de el dominio (.com era comercial; .org Organización; etc) y para definir la nacionalidad (.es; .ru; .uk; .fr etc)

Realmente ya no se usan  con esa finalidad, y en la actualidad hay infinidad de terminaciones. Si tu sitio web es de ámbito local y quieres  que tus visitas, en principio, sean locales, te recomiendo el de nacionalidad (.es); ya que los buscadores te ubicaran mas en el idioma y la nacionalidad de la persona que busca.

El futuro de tu empresa

Cuando hagas  la elección del dominio no utilices nombres que estén de moda en ese momento, ya que  en poco tiempo estarán desfasados y la ayuda que te daran en un principio se convertirá más tarde  en lastre.

Prueba y Error

Prueba el dominio con tus amigos y familiares a ver que reacción obtienes, el precio del dominio no es demasiado elevado, por lo que puedes quedarte varias terminaciones y utilizar la que mas te guste, el resto las puedes enlazar a tu domino como landing pages.

Fácil

CMS, diseño web, Gestor de contenido, HazmeWeb, Uncategorized / 10 abril, 2014

WordPress o Joomla

To be or not to be… WordPress o Jommla

wordpress-and-joomla

diseñoprevio_wireframeCuando te pones manos a la obra con un proyecto web, creo que lo mejor es que lo primero hagas un wireframe con el aspecto que quieres que tenga tu web. Después listar las funcionalidades que requieres de tu web.

Con esta información ya nos resultara mas fácil decantarnos por uno u otro gestor de contenido.

Joomla

plantilla de joomla Es un CMS no demasiado dificil de gestionar, pero su principal virtud es su principal complicación: Modularidad.

Joomla esta hecho mediante una estructura de capas en las que puedes ir insertando módulos y en cada modulo puedes insertar lo que necesites. Esta característica nos da la posibilidad de insertar “fácilmente” en cada pagina lo que queramos.

Casi todas las plantillas disponen de una especie de mapa con la estructura en la que puedes colocar los módulos, esto lo hace muy flexible pero a la vez lo complica un poco ya que si utilizas varias plantillas tienes que estar continuamente mirando.

Para mi la ventaja fundamental es si quieres montar un sitio en varios idiomas sin salirte de tu URL principal ya que puedes montar la web en varios idiomas sin tener que montar varias veces la web, solo cambiando los menús.

Otra ventaja que le veo es que puedes utilizar varias plantillas en el mismo site.

Pero como dije antes sus virtudes se transforman en defectos, su modularidad hace de joomla un tanto tedioso a la hora de configurarlo, la posibilidad de configuración de atribuciones para los usuarios resulta muy pesada, debe ser en sitios en los que se necesiten perfiles muy diferenciados donde realmente sea rentable configurarlos.

En cuanto a la instalación, no es muy diferente de la de wordpress, pesa mas y la modularidad le resta un poco de velocidad de carga.

En cuanto a la personalización, es un pelin más complicado añadir tus estilos propios y tienes que saber manejarte con CSS si o si si quieres que te quede bien. A nivel visual tiene plantillas con estéticas de buen nivel, pero exista un paso por detrás de wordpress en este aspecto.

Después de montado para hacer cambios resulta bastante pesado, puedes colocar banner de una manera muy estratégica, pero no resulta ni rápido ni comodo.

En definitiva te recomiendo Joomla si necesitas una web en varios idiomas con muchos baner y funciones axiliares, y si el blog no será la parte fundamental de tu web.

 

WordPress

wordpress temaSi lo que prima en tu proyecto es diseño y poder insertar contenido de una manera sencilla, wordpress es tu CMS.

Es mas facil de instalar y es mas facil encontrar un diseño que se adapte a lo que quieres lograr con tu web. Existen miles de plantillas y pluguin para conseguir cualquier funcionalidad. Es un CMS bastante liviano en cuanto a su carga.

si no abusamos de los plugin es muy ágil de funcionamiento y es relativamente fácil crear temas hijos con los que modificar y personalizar los estilos.

Este gestor nació a partir de un blog, por lo que como editor de post posiblemente sea el mejor.

La parte back o de gestion esmuy amigable y practica, una vez montado el proyecto, resulta rápido y comido realizar cambios.

Los perfiles de usuario están muy vinculados con el blog, no con la parte estática.

En la parte de funcionlidades dependes casi por completo de los pluguin, que hay para casi todo, pero si quieres afinar u poco más la funcionalidad tienes que manejarte con PHP.

En principio para una web con un buen diseño HTML5 y CSS3 es la mejor opción,  quizá su estructura simple es la mayor ventaja. La desventaja es que la personalización individual de las paginas estáticas es mas complicada con wordpress que con joomla pero con todo y eso yo me decanto por esta opción casi para cualquier proyecto.

A dia de hoy es una herramienta fantástica para poner en marcha un proyecto web.

 

Existen otros gestores de contenido, el siguiente mas popular es Drupal, es muy potente y para funcionalidad es una muy bina herramienta, pero es necesario tener un nivel de conocimiento bastante alto para manejarse bien con el.

diseño web, HazmeWeb, Uncategorized / 9 abril, 2014

Elegir el mejor sistema para empezar en internet con Blog, web o ecomerce

Que es lo que quiero que haga mi web?

Fácil

Cuando nos decidimos a montar y publicar un proyecto web, tenemos que decidir un tema, una vez hemos decidido el tema al que vamos a tratar en  nuestro sitio, el siguiente paso es saber el tipo de web que queremos o a que la vamos a dedicar.

Hoy dia casi todos los sitios tienden a aunar las características de todos los tipos. En un mismo sitio tenemos una web corporativa en la mostramos lo que hacemos y como lo hacemos, un blog en el que compartimos contenidos de útilidad e incluso un ecomerce, pero debemos pensar realmente cual será la función principal de nuestro sitio ya que de ello depende la tecnología que utilizaremos.

 

Tecnología en función de lo que Queremos hacer con nuestra web

El Blog:

blogEn principio casi todo el mundo comienza por un blog en el que compartir contenidos. Es la opción más fácil,  más barata y en muchos casos la mas efectiva si lo que queremos es dar a conocer nuestras habilidades o compartir contenidos con afines.

Si lo que necesitamos es simplemente un blog,  Bloguer y WordPress son las plataformas más utilizadas por su facilidad de edición no necesitamos saber nada de código para empezar con nuestro blog. Las dos son gratuitas, es como abrir una cuenta en de correo electrónico.

WordPress.com:

Si lo que estas pensando es en probar, aprender y si te va bien lanzarte a algo mayor te recomiendo que empieces por aquí. La edición es muy parecida a la de la aplicación de wordpress.org. Trasladar lo que tengas aquí a un wordpres en un servicio de hosting propio es fácil y todo el aprendizaje te servirá.

Las desventaja fundamental es que todas las características que lo convierten en una buena herramienta son de pago, plugins, dominio propio etc.

No se puede analizar el trafico con analitycs ni se puede monetizar… y te ponen anuncios con los que subsiste wordpress.com.

Bloguer:

Ofrece algunas características que wordpress no, se puede analizar y monetizar. Tiene un panel de edición en el que puedes customizar tu blog sin escribir código y si sabes escribirlo te permite meter partes para una personalización mayor. Te permite hasta 20 paginas estáticas.

La mayor desventaja para mi es si tu proyecto va muy bien y quieres implementar funcionalidad propias es muy complicado y a la hora de migrar a hosting propio no tiene un hermano mayor potente como es el caso de wordpress.

Cualquiera de las dos es una buena opción para empezar con un proyecto, pero si la cosa funciona, no hay que esperar a que la cosa se complique para migrar a un site propio donde no estemos limitados.

 

La WEb:

empresa

En esencia no es muy diferente a un Blog, hoy día todo se construye usando la misma tecnología, la diferencia fundamental es lo que queremos mostrar. En una web hay mas partes estáticas en las que vamos a mostrar un contenido que va a permanecer mas tiempo en ella.

Si tenemos una empresa queremos contar a nuestros visitantes quienes somos, donde estamos, cual es la actividad de nuestra empresa etc este contenido es más estático, y aunque lo iremos actualizado, no es contenido dinámico como las entradas de un blog.

En la web incorporaremos un blog en la que podemos contar las novedades de la empresa y generar también contenido.

Hoy dia como decía usamos loas mismas tecnologías para crear una web que un blog, usamos gestores de contenido (conocidos por sus siglas en ingles CMS). Los gestores de contenido son muy prácticos ya que la estructura básica ya esta creada y solo hay que ir custodiando a nuestro gusto las capas y los estilos. Los más populares a día de hoy son Drupal, Joomla y WordPress. Son todos de código abierto, por lo que son gratuitos. En esencia los tres hacen lo mismo y de una manera muy similar. Los tres funcionan mediante partes mas estáticas, paginas, y partes mas dinámicas, entradas. Sus puntos fuertes son dos:

Casi cualquier funcionalidad que se nos ocurra ya esta programada mediante un plugin, que son fragmentos de código específicos para hacer una cosa concreta.

Son altamente personalizables, puedes cambiar los estilos incluso las capas para customizarlos a tu gusto.

Por no hacer demasiado pesado este articulo voy a dejar para otro definir un poco más cada uno de ellos, a día de hoy el 19% de las webs que hay en internet están notadas con wordpress, quizá sea por su facilidad de uso y por lo bien que se lleva con google. Yo es el que uso habitualmente casí para todo, salvo que el proyecto necesite unas características muy especificas.

La tienda online o ecomerce:

tiendaonline

Las tiendas online o ecomerces son los proyectos más complicados de montar bien de las webs, principalmente porque tienen muchas bases de datos con muchas interconexiones y requieren varios niveles de acceso.

Los sistemas que mas se están utilizando para montar tiendas online a día de hoy son Prestashop y Magento, son CMS específicos para comercio electrónico. Hay para escribir un libro sobre cada uno de ellos e iré profundizando más en el tema.

Prestashop:

Si ya tienes un manejo digamos a nivel usuario y quieres dar el paso a un ecomerce, tu herramienta es Prestashop, es fácil de instalar, prácticamente igual que wordpress. No necesita unos requisitos demasiado específicos de hosting (antes de lanzarnos a comprar, mirar las especificaciones de software… para no llevarnos sorpresas desagradables.) Es relativamente fácil montar una tienda con Prestashop, las complicaciones mayores las tiene la gestión de pedidos etc.

 

Magento: 

Es una herramienta muy potente y muy segura, pero es bastante divicil de instalar, es muy software muy pesado y los archivos tb por lo que consume muchos recursos del servidor, no nos vale cualquier hosting. En definitiva no es una herramienta tan amateur como prestashop.

Si tu tienda necesita una herramienta muy potente y segura Magento es la tuya, pero no te vuelvas loco intentando hacerla funcionar… La ayuda profesional no es tan cara y a la larga nos evita quebraderos de cabeza.

 

diseño web, HazmeWeb, Uncategorized / 24 marzo, 2014

Diseño web, Tu web como tú quieres.

web-designComo decimos siempre, tu web no es para tí, te tiene que gustar, pero tienes que pensarla para el publico al que la diriges. Antes de plantearte como sera el diseño web, analiza bien el sector al que te vas a dirigir, examina otras web similares y toma nota de lo que te gusta y de lo que no te gusta.

 

Inclusión de SEO en el diseño.

seo_azulHacer un análisis previo del sector y sus palabras clave mediante las herramientas que google nos ofrece nos aportara datos acerca de cuales son las palabras claves para nuestro proyecto.
La inclusion de parámetros SEO en el diseño de su web te ofrece beneficios como:

Velocidad de indexado: El tiempo que pasa entre la publicación de un nuevo contenido y su aparición en Google disminuye considerablemente.

Mejorar el posicionamiento para las categorías: El sitio se vuelve más relevante, permitiendo que mejoren las posiciones de las categorías.

Reduce los gastos de las campañas SEM:Si la página gana mediante SEO algunas categorías por las que se esté pagando por clic en la publicidad (SEM, Search Engine Marketing), no necesita continuar pagando por ellas, pudiendo reducir ese gasto o invertirlo en dar a conocer otros productos, lo que mejora el ROI de la campaña.

Incremento de las posibilidades de venta:La consecuencia instantánea de obtener más visitas en la web es el incremento de  las opciones de venta (leeds) con el consecuente incremento de ingresos de todo tipo.

 

Psicologia del color.

psicologia_de_color

La elección de los colores es muy importante en  el diseño web ya que determinados colores los asociamos con acciones diferentes:

El rojo llama a la acción, por lo que sera bueno utilizarlo en zonas donde queremos que el usuario haga clicks.

El azul es un color sedante, por lo que es bueno usarlo en zonas donde queremos que el usuario se quede algún tiempo.

La psicologia del color tb debes analizarla en función de tu proyecto en concreto, no es lo mejor utilizar nuestros colores favoritos ya que pueden no ser los más idóneos para la actividad que propone nuestro sitio web.

 

Usabilidad de la web.

usabilidad-webAlgo fundamental es conseguir que usar tu web sea lo mas sencillo posible:

Procura que para conseguir cualquier acción no sean necesarios demasiados click.

Que el usuario sepa siempre donde esta y sea posible volver al inicio en un click.

Sigue todas las pautas que tu proyecto te lo permita y piensa siempre como usuario de la web.

Tecnologia web.

A la hora de elegir la tecnología que vamos a utilizar en el diseño y desarrollo de la web debes tener en cuenta que es lo que requieres de tu web, si es un ecomerce, si es una web corporativa, si es un blog. Para cada tipología existe una tecnología más adecuada. Después ten en cuenta cual es el diseño que quieres ya que has tecnologías que se adaptan mejor que otras a determinados diseños.

Si has elegido hosting, antes de lanzarte a comprar una plantilla mira primero que tecnologías y versiones soporta tu alojamiento ya que te puedes encontrar con incompatibilidades  que te hagan tirar dinero.

 

En conclusion , prepara una lista en la que vayas chequeando los hitos a tener en cuenta y acuérdate siempre de ver desde tu proyecto desde el punto de vista del usuario mas que de el diseñador.

Logo

 

diseño web, HazmeWeb, Uncategorized / 20 marzo, 2014

Empezar con tu web, proyecto online.

Antes de empezar a pensar en tu web

 

Idea
 

Partiendo de tu idea tienes que tener claro a quien vas a dirigir esta idea, intenta saber como sera el usuario o cliente de tu proyecto, tu proyecto no es para ti, es para este usuario o cliente. Cuando tengas esto claro, ponte a buscar toda la información que puedas acerca de proyectos similares que serán tu competencia. Hoy es muy difícil encontrar un proyecto que no exista, pero la innovación no solo debe estar en la idea, esta también en la manera de llevarla a cabo, en la manera de gestionarla y en la manera de relacionar tu proyecto con tu usuario/cliente.

Previo a empezar con el proyecto web, el dominio y el Hosting.

Dedicar un poco de tiempo al nombre que vamos a usar para nuestro proyecto online sera buenos para elegirlo bien. Es importante que el nombre defina tanto la empresa como la actividad a la que vas a dedicar tu proyecto. Intenta que tu nombre sea lo menos común posible, ya que cuanto menos conocido sea más fácil resultara que los buscadores te encuentren por tu nombre. Este nombre sera el dominio de tu web una vez lo reserves.

Dominio

Tu web debe estar alojado en un servidor, esta parte es el Hosting que es muy importante ya que será el que aloje tu pagina y en gran medida hará que funcione mejor o peor. A la hora de elegirlo ten en cuenta la cantidad de trafico que soporta, así como la velocidad del mismo. También las tecnologías que soporta y que las versiones sean compatibles con las tuyas.

No te dejes llevar por las ofertas, ya que las más agresivas están condicionadas por limitaciones de espacio y trafico…

 

A quien te vas a dirigir…

Es fundamental que tengas en cuenta que tu web, a los usuarios a los que te diriges, tu proyecto no es para ti, es para ellos. Busca la forma de enfocarlo de manera que sea lo más atractivo posible para tu publico y a la vez que muy fácil navegar por ella.

La psicologia del color es un criterio muy a tener en cuenta, así como el diseño del  SEO desde el principio ya que esto te ayudara a que tu web se posicione bien desde el principio.

 

 

 

 

El presupuesto…

En este apartado tienes que tener muy claros los recursos económicos de los que dispones para el proyecto. Tienes que repartir tu dinero en las siguientes partidas:

Dominio; quizá la parte más económica, varia en función del tipo que uses (.com; .es; .net; etc) su precio varia en función del registrador tb.

Hosting, no elijas el mas economico como te decía anteriormente.

Recursos de imagen y video: Destina una parte de tu presupuesto para elegir unas buenas fotos, si eres bueno con la cámara y los editores fotográficos el recurso no serán € sera tiempo.

Diseño: Quiza sea la mayor de las partidas de tu presupuestosi lo haces tu mismo, el recurso sera el tiempo… un buen diseño incluyendo una buena programación lleva mucho tiempo. Hay muchos CMS en los que no resulta dificil introducir tu contenido, en estos casos la adaptación es lo mas complicado.

Si no tienes ni idea de informática o de gestión de este tipo de software te recomiendo que cuentes con nosotros para ponerlo en marcha y dediques tu tiempo a investigar tu mercado.

Es mas facil y barato de lo que crees.

Difusion: Junto con el diseño, son las partes mas importantes de tu proyecto. Puedes tener la mejor pagina del mundo y la más bonita, pero si no la difundes como es debido quedara en el cajón de las webs olvidadas.

 

 Los Horarios y el Tiempo…

Es muy importante que te marques unas metas, unos objetivos que sean difíciles pero que se puedan cumplir. Dosifica tus esfuerzos ya que si le dedicas todo tu tiempo llegara un momento en el que te sentirás desfondado y perderas la fuerza e ilusión que tu proyecto requiere para tener éxito…

El descanso es fundamental para mantener las ideas frescas que tu proyecto necesita.

Y como decía Maximo Gladiator: “Fuerza y Honor

 

 

Logo Hazmeweb.

Hazmeweb, Es más fácil de lo que crees…