html – Digital Learning Formación online en Nuevas Tecnologías Wed, 05 Jul 2017 08:39:28 +0000 es-ES hourly 1 https://wordpress.org/?v=4.7.5 Páginas AMP: SEO para móviles /blog/paginas-amp-seo-para-moviles/ Thu, 09 Mar 2017 19:25:09 +0000 /?p=14095 Seguimos publicando novedades de la 5ª edición del curso SEO, Posicionamiento Web, que se inicia el 27 de marzo en el Campus Virtual de la Universidad de Granada.
Esta vez toca le turno a las páginas AMP (Accelerated Mobile Pages), un apartado que podemos relacionar con el SEO para móviles.

¿Qué son las páginas AMP?

Como indica la traducción literal (Páginas Móviles Aceleradas), se trata de páginas web que se muestran en dispositivos móviles más rápidamente, al estar diseñadas con unas especificaciones especiales y servirse desde una caché de Google.

La tecnología AMP se basa en el estándar abierto AMP HTML. Este formato es una variante del HTML y se visualiza en todos los navegadores modernos, tanto en Android como iOS. Daremos más detalles después.

Logo AMP

AMP HTML es un proyecto open source, donde han colaborado destacadas plataformas de Internet (Twitter, WordPress, Pinterest, Google ,…) y proveedores de contenidos online (The New York Times, Mashable, The Washington Post, El Pais…), y que ya están utilizando un número importante de Webs.

Dónde y cómo aparecen las páginas AMP

Te pueden aparecer en los resultados de Google si realizas una búsqueda con un smartphone o dispositivo móvil. En concreto, los lugares donde puede aparecer contenido AMP son:

  • Carrusel de noticias destacadas AMP
  • Otras Tarjetas o Fragmentos enriquecidos (ver recuadro abajo)
  • Lista de resultados estándar

Las Rich Cards y Rich Snippets permiten destacar una página en los SERP Google, mediante el uso de datos estructurados. como explicamos en el curso SEO. El tutor del mismo, Alfredo Hernández-Díaz, nos habla en este artículo de los Rich Snippets.

Vemos algunas capturas de pantalla para ilustrar la visualización de contenido AMP.

Presentamos primero un ejemplo de carrusel ‘top news’ AMP. Podemos ir deslizando el dedo lateralmente en la pantalla táctil para que nos muestre más resultados de ese carrusel.

SERP Google en dispositivo móvil

En la siguiente imagen vemos páginas AMP en los resultados estándar de búsqueda de Google desde un smartphone. Como en el caso anterior, se identifican por el logo:
Identificación página AMP en SERP Google

SERP con páginas AMP

En la siguiente imagen hemos accedido a una página AMP:

  • La URL en el navegador del móvil nos indica que está almacenada en la caché AMP de Google: 
    www.google.es/amp....
  • Debajo, vemos como se nos presenta la fuente de la que proviene: 
    amp.20minutos.es
  • Al pinchar en el icono ‘vínculo’ se despliega la URL de la página original: 
    www.20minutos.es/noticia....
     a la que podemos acceder desde este enlace.Página AMP

Para ver la diferencia entre una página web normal y la versión AMP, os mostramos una entrada de nuestro blog con las dos versiones respectivamente, donde puede verse que la AMP está simplificada respecto a la anterior:

Página web responsivePágina AMP

¿Cómo funcionan las páginas AMP?

Tienes una documentación muy detallada en la web del proyecto AMP, aunque de una forma básica podemos esquematizarlo de las siguiente forma:

  • Seguimos manteniendo la versión estándar HTML de nuestra Web
  • Debemos vincular las versiones HTML y AMP de cada página, incluyendo en cada una, en su sección 
    <head>
     , una etiqueta 
    <link>
      que apunte a la otra versión (o así mismas si solo existe la versión AMP).
    De esta forma Google sabe qué indexar, qué presentar en cada situación, y no considera contenido duplicado la página AMP.
  • Para dar una idea de este etiquetado, copiamos el ejemplo donde se apunta de la versión HTML a la AMP:
    <link rel="amphtml" href="https://www.example.com/url/to/amp/document.html">

De todas maneras, se puede automatizar esta tarea en muchos CMS como Drupal o Joomla mediante módulos o extensiones. Si trabajamos por ejemplo con WordPress tenemos varios, como el plugin AMP o el AMP for WP

¿Por qué las especificaciones AMP mejoran el rendimiento?

Para mejorar la carga de las páginas AMP se siguen unas directrices de diseño que buscan presentar casi instantáneamente el contenido de texto. Para los que estáis más familiarizado con el desarrollo web os vamos a mencionar algunas:

  • Se minimizan las peticiones HTTP, con utilización por ejemplo solo de estilos internos CSS (en sección <head>), carga diferida de fuentes,…
  • Las imágenes y anuncios solo se descargan si es probable que el usuario las vea, dependiendo de la posición de esos recursos en la página y el desplazamiento que haga el usuario en su navegador.
  • Igualmente para las imágenes o recursos similares se calcula con antelación las dimensiones y el espacio que van a ocupar para poder maquetar la presentación de la página aunque aún no se hayan descargado.
  • Solo se permite JavaScript asíncrono, para que los scripts no bloqueen o retrasen la carga del resto de elementos de la página. De hecho no se permite JavaScript de autor, sino que se emplean elementos AMP personalizados.

¿Cómo es el AMP HTML?

Como hemos comentado antes es una variante de HTML. Puedes consultar en github la especificación de las etiquetas AMP HTML. De forma resumida podemos decir que:

  • Permite utilizar la mayoría de las etiquetas HTML5: <html> <body> <head> <p> <div>…
  • Prohíbe algunas, sobre todo relacionadas con recursos externos: <object> <embed> …
  • Tiene una versión equivalente para otras, principalmente asociadas a objetos multimedia: <amp-img> <amp-video> <amp-audio>…

Para los más curiosos, copiamos el ejemplo más simple (un ‘Hello World’) en formato HTML AMP de la web del proyecto:

<!doctype html>
<html ⚡>
 <head>
   <meta charset="utf-8">
   <link rel="canonical" href="hello-world.html">
   <meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
   <style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
   <script async src="https://cdn.ampproject.org/v0.js"></script>
 </head>
 <body>Hello World!</body>
</html>

Además del AMP HTML debemos considerar la biblioteca AMP JS que implementa todas las prácticas recomendadas AMP para garantizar la velocidad de presentación de dichas páginas.

Como hemos indicado antes, una de las optimizaciones que realiza es convertir todo el JavaScript en asíncrono, para evitar que éste bloquee la carga de la página.

¿Qué es el Google AMP Cache?

Es un CDN que ha implementado Google para entregar todos los documentos AMP válidos. Captura las páginas AMP HTML almacenándolas en caché para luego poder entregarlas (el documento, los archivos de JS e imágenes) usando HTTP 2.0 , todo desde un mismo origen, logrando mayor eficiencia.

Validador de páginas AMP

Las páginas AMP han de estar validadas para ser servidas sin errores desde la caché de Google. Tienes varias opciones para comprobar esa validación, tecleando el código en un validador AMP interactivo o comprobándolo en un validador AMP online introduciendo la URL de la página

Estado de la implementación de páginas AMP

El proyecto AMP se anunció por Google en 2015, y se ha ido adoptado por un número significativo de Webs desde 2016 hasta ahora (la web del proyecto indica más de 1.500 millones de páginas AMP publicadas)

Ha habido algunas quejas de usuarios en foros de soporte Google. Quieren seguir accediendo directamente a las páginas originales, por tener más funcionalidades que las cacheadas y porque las velocidades instantáneas que se ‘prometían’ no parecen cumplirse siempre (piden una opción en el buscador que permita deshabilitar las AMP si el usuario lo desea). También es cierto que muchos errores o retrasos que se experimentan pueden deberse a implementaciones incorrectas de AMP HTML no bien validadas.

En cualquier caso, las webs que están utilizándolas, manifiestan por lo general una mejora considerable de velocidad (llegando hasta un 85% de mayor rapidez) con incremento significativo del tráfico que reciben desde Google.

Si como parece, Google sigue apostando por las páginas AMP, es algo muy a tener en cuenta en SEO si queremos que nuestra Web compita en los SERP que se muestran en smartphones, tablets y otros dispositivos móviles. Como ocurrió con la ‘exigencia’ de un diseño adaptado a esos dispositivos, Google lo plantea ahora para la velocidad de descarga.

]]> Curso Diseño y Programación Web (17ª edición) /blog/curso-diseno-y-programacion-web-edicion-17/ Mon, 23 Jan 2017 14:08:04 +0000 /?p=13870 Una Web es un medio de comunicación muy eficaz para dar a conocer nuestra empresa, negocio o proyecto personal. Nos permite una difusión sin limitaciones horarias o geográficas y al estar basada en tecnologías estándares abiertas y gratuitas, es accesible para todos, sin dependencias de ningún tipo.

Un sitio Web nos facilita la comunicación online en una amplia variedad de formas con nuestros usuarios , colaboradores o clientes, a la vez que transmite de nosotros o de nuestra organización una imagen actualizada y profesional.

Conocer el proceso de creación y publicación de páginas webs es una competencia básica si estamos involucrados en la publicación de información, el marketing de contenidos, el comercio electrónico o la prestación de servicios online en general.

El próximo 13 de marzo iniciamos la 17ª edición del curso online Diseño y Programación de Páginas Web. Con el podrás dominar los lenguajes básicos de la Web, HTML y CSS, y tener una primer contacto con la programación con JavaScript. También conocerás con qué herramientas puedes trabajar, cuáles son las buenas prácticas para crear sitios webs, o cómo puedes publicarlos en Internet.  

Ya puedes matricularte en este curso que organizamos con el Cevug y la Fundación UGR-Empresa y. Si además eres estudiante de la Universidad de Granada, puedes obtener créditos de libre configuración y ECTS (consulta la página de inscripción del Cevug donde se va actualizando esta información).

 

]]> Curso SEO, Posicionamiento Web en Buscadores (5ª edición) /blog/curso-seo-posicionamiento-web-buscadores-edicion-5/ Tue, 17 Jan 2017 11:10:16 +0000 /?p=13831 Si te interesa la Web, la Redes Sociales o el Marketing Digital debes aprender SEO. Saber posicionar tu información en los resultados de Google es fundamental para llegar a tus usuarios y clientes.

El SEO no está reservado a Webmasters. Aplicar sus técnicas está a tu alcance si te interesa la publicación de contenidos, el comercio electrónico o la comunicación Web. Conócelas para mejorar tu visibilidad en Internet.

Si quieres formarte tienes ahora una gran oportunidad: del 27 de marzo al 16 de junio impartiremos la 5ª edición del curso online SEO, Posicionamiento Web en Buscadores. En él cubrimos todos los aspectos del SEO, y está diseñado para que sea cual sea tu perfil profesional, puedas sacarle partido.
Cartel curso SEO

Tutor, contenidos e inscripciones

En esta edición contamos con una novedad importante: Alfredo Hernández-Díaz será el tutor del curso. Alfredo tiene una amplia y exitosa trayectoria como consultor y docente en las áreas de SEO, Social Media y Marketing Digital. Su experiencia profesional en todos estos campos serán una aportación muy valiosa para los alumnos del curso.

Para conocer más sobre los contenidos, consulta la información que detallamos en la página del curso. Seguimos actualizándolos en cada edición para tener en cuenta la evolución de Google y las nuevas tendencias, como la irrupción de los smartphones y las implicaciones de la Web móvil o las Apps en el SEO.

Este curso lo organizamos con el Cevug y la Fundación UGR-Empresa y la matricula está ya abierta para todos. Si además eres estudiante de la Universidad de Granada, puedes obtener créditos de libre configuración y ECTS (consulta la página de inscripción del Cevug donde se va actualizando esta información).

 

]]> Nuevas ediciones de los cursos Community Manager, SEO y Diseño Web (2016-2017) /blog/nuevas-ediciones-de-los-cursos-community-manager-seo-y-diseno-web-2016-2017/ /blog/nuevas-ediciones-de-los-cursos-community-manager-seo-y-diseno-web-2016-2017/#comments Wed, 07 Sep 2016 10:10:55 +0000 /?p=13606 Con el próximo inicio del curso académico ya tenemos aquí las nuevas ediciones de los cursos Community Manager, SEO-Posicionamiento Web y Diseño-Programación Web que impartimos en la plataforma de teleformación del Cevug y organizamos con esa entidad y la Fundación UGR-Empresa.

Aquí os presentamos los carteles anunciadores (pinchar en las imágenes para ampliar):

cartel curso Diseño y Programación Web Cartel curso SEO Cartel curso Community Manager

Ya está abierto el plazo de matrícula para todas estas ediciones, que se desarrollarán en las siguientes fechas:

Como siempre hacemos, recordaros que estos cursos los puede realizar cualquier persona interesada en crear o gestionar canales de Comunicación en Internet (Webs, Redes Sociales, Blogs). Si además eres estudiante de la Universidad de Granada, consulta los créditos de libre configuración y ECTS reconocidos en cada Facultad para cada uno de estos cursos (esta información se va actualizando en las páginas de información de la web del Cevug que os hemos enlazado antes).

Si quieres saber la opinión de los alumnos de las ediciones anteriores, puedes consultar este post donde publicamos el resultado de las encuestas de cada curso.

]]> /blog/nuevas-ediciones-de-los-cursos-community-manager-seo-y-diseno-web-2016-2017/feed/ 2 Cursos Community Manager, SEO y Diseño Web: nuevas ediciones 2016 /blog/cursos-community-manager-seo-y-diseno-web-nuevas-ediciones-2016/ /blog/cursos-community-manager-seo-y-diseno-web-nuevas-ediciones-2016/#comments Mon, 01 Feb 2016 12:14:41 +0000 /?p=10957 Se ha abierto el plazo de matriculación de los cursos Community Manager, SEO y Diseño Web que impartimos en la plataforma de teleformación del Cevug y organizamos con la Fundación UGR-Empresa.

Curso Diseño y Programación Web edición 15ª Curso SEO edición 4ª Curso Community Manager edición 6ª

Las fechas de estas nuevas ediciones (ver nota), que recordamos, están abiertas para todos (no es necesario ser alumno de la Universidad de Granada), son:

Actualización fechas inicio: debido al reciente reconocimiento de créditos ECTS en varios Grados de la UGR, se aplaza el inicio de las ediciones de SEO y Diseño-Programación Web al 4 de Abril.

El curso de Community Manager comienza el 14 de Marzo, pero se permitirá la matriculación durante ese mes (se ha modificado ligeramente su planificación para facilitar la incorporación de nuevos alumnos en ese periodo).

La finalización de todos los cursos se mantiene en la misma fecha que ya tenían programada.

Te recomendamos esta formación si estás interesado en crear o gestionar canales de Comunicación en Internet (Blogs, Webs, Redes Sociales), bien a nivel personal o trabajando para un proyecto o empresa.

Puedes ver una presentación resumida de estos cursos en nuestro post sobre las últimas ediciones, o bien en la página web de cada curso (pincha en los enlaces de la lista anterior) con información detallada de los mismos y acceso a la inscripción online.

Actualización (18/03/16): Créditos ECTS reconocidos 

Estos son los créditos ECTS que se han reconocido hasta la fecha, a estas 3 ediciones, en las siguientes Facultades de la Universidad de Granada:

  • Facultad de Derecho: CM (6 ECTS), SEO (5 ECTS), DPPW (4 ECTS)
  • Facultad de Ciencias de la Educación: CM (6 ECTS), SEO (5 ECTS), DPPW (4 ECTS)
  • Facultad de Ciencias de la Salud: CM (6 ECTS), SEO (4 ECTS), DPPW (4 ECTS)
  • Grado Ingeniería Informática: CM (6 ECTS), SEO (5 ECTS), DPPW (2 ECTS)
  • Grado Ingeniería de Tecnología de Telecomunicación: CM (2 ECTS), SEO (2 ECTS), DPPW (1,5 ECTS)
  • Facultad de Ciencias del Trabajo: DPPW (3 ECTS), SEO (2 ECTS), CM (2 ECTS)
  • Facultad de Farmacia: CM (0,5 ECTS), SEO (0,4 ECTS), DPPW (0,3 ECTS)
  • Grado en Relaciones laborales y Recursos Humanos: CM (2 ECTS), SEO (2 ECTS), DPPW (3 ECTS)

Campus de Melilla:

  • Facultad de Ciencias Sociales del Campus de Melilla: SEO (4 ECTS)
  • Facultad de Educación y Humanidades del Campus de Melilla: CM (2 ECTS), SEO (2 ECTS), DPPW (2 ECTS)
  • Facultad de Enfermería del Campus de Melilla: CM (2 ECTS), SEO (2 ECTS), DPPW (2 ECTS)
Abreviaturas:
CM: Community Manager, Gestión de Medios Sociales, ed 6ª
SEO: SEO, Posicionamiento Web en Buscadores, ed 4ª
DPPW: Diseño y Programación Páginas Web, ed 16ª
]]> /blog/cursos-community-manager-seo-y-diseno-web-nuevas-ediciones-2016/feed/ 1 Aprender lenguajes de la Web (editor online HTML-Javascript) /blog/aprender-lenguajes-web-editor-online-html-javascript/ Wed, 30 Sep 2015 15:01:13 +0000 /?p=10214 En nuestro curso de Diseño y Programación de Páginas Web, del que pronto impartiremos la 14ª edición, explicamos el lenguaje de marcado HTML y el de estilos CSS y presentamos a un nivel básico el lenguaje de programación Javascript .

Siempre hemos querido abrir el curso al mayor número de alumnos, incluyendo a usuarios que saben desenvolverse en Internet, pero no tienen ninguna experiencia en programación.

Para estos alumnos suele ser sencillo trabajar con HTML y CSS, pero a veces encuentran dificultades para dar los primeros pasos con Javascript. ¿Por qué?

Cartel curso Diseño de páginas web edición 14Las particularidades de publicar en un medio como la Web, hacen que la creación de páginas con HTML y CSS difiera en ciertos aspectos -por ejemplo, la separación de contenido y presentación- de la elaboración de documentos con un procesador de textos. A pesar de ello, tienen otras muchas similitudes para un usuario habituado a estos programas.

En cambio, Javascript es un lenguaje de programación y podemos necesitar una ayuda extra si no estamos familiarizados con los conceptos básicos de la programación. Por ello, hemos preparando una introducción a la Programación con Javascript. Además de complemento para este curso, estará también pronto disponible para usuarios de nuestra Web.

En su elaboración hemos tratado de evitar un error habitual en este tipo de contenidos: dar cosas por sabidas. Es fácil caer en el uso de términos técnicos que no se han presentado o explicar conceptos basándose en otros que aún desconoce el alumno. Esperamos haberlo conseguido, aunque estaremos atentos a los comentarios para adaptar lo mejor posible esta intro a este perfil de alumnos.

Editor online de código

Un elemento que hemos incluido en esta introducción es el uso de un editor online de código (HTML y Javascript). Nos permite presentar ejemplos que pueden comprobar y modificar de forma interactiva sin salir de la página donde se presentan los contenidos. Buscamos la sencillez e inmediatez en estos primeros pasos, y con este editor online visualizan allí mismo el resultado y les facilita el “prueba y error” tan necesario para entender estos nuevos conceptos y ganar confianza.

Presentamos aquí un ejemplo de este editor. Para utilizarlo:

  • En el primer cuadro, podemos escribir etiquetas HTML e incluir código Javascript entre las etiquetas <script>…..</script>.
  • En el segundo cuadro, tras dar al botón ‘Ver resultado‘ que se encuentra debajo, aparecerá el resultado que presenta el navegador.

Si quieres probarlo y no sabes nada de Javascript, debajo del editor te incluimos un ejemplo muy simple para que puedas copiarlo:

Puedes copiar el código de abajo. Pégalo en el primer cuadro y pincha en ‘Ver resultado’.
Prueba a modificarlo, por ejemplo, para que el nombre salga al final de la frase o para que solicite e imprima la edad en vez del nombre.

<h2>Primera prueba con el editor online</h2>
<p style="color:#777">Vamos a ejecutar un sencillo script que nos pedirá nuestro nombre y nos mostrará un mensaje de bienvenida a continuación:</p> 

<script>
var nombre = prompt("¿Cómo te llamas?","usuario anónimo")
document.write("¡Hola " + nombre + ", este es el resultado de tu primer script!")
</script>

Nota: para facilitar el copia-pega del código sitúa el ratón sobre él y te aparecerá una linea arriba. Pincha el icono ‘Copy’ según mostramos en la imagen de abajo. Te seleccionará automáticamente todo el texto que ya puedes copiar como es habitual con Ctrl+C ó la opción el menú contextual del ratón.

Copiar código desde el visor

Imagen: icono ‘copy’ que nos facilita el copia-pega del código

]]> Cursos Community Manager, SEO y Diseño Web con la Fundación UGR Empresa /blog/cursos-community-manager-seo-y-diseno-web-con-la-fundacion-ugr-empresa/ /blog/cursos-community-manager-seo-y-diseno-web-con-la-fundacion-ugr-empresa/#comments Tue, 11 Aug 2015 07:53:49 +0000 /?p=9694 A la vuelta de verano comienza el nuevo curso académico y con él, nuevas ediciones de nuestros cursos online de Community Manager, SEO y Diseño Web que organizamos con la Fundación General UGR-Empresa, y que impartimos en la plataforma virtual del Cevug (Centro de Enseñanzas Virtuales de la Universidad de Granada).

Las inscripciones a estos cursos ya están abierta para todos, y no requieren ningún requisito especial de titulación o conocimientos previos, salvo estar familiarizado con Internet y la navegación y uso de aplicaciones en la Web.

Las nuevas ediciones y sus fechas de celebración son:

Te aconsejamos cualquiera de estos cursos si:

  • No conoces, pero estás interesado en alguna de estas áreas y quieres empezar a formarte en ella.
  • Ya sabes algo, pero de forma dispersa con algunas lagunas y quieres completar tu conocimiento con una visión más sistemática y sólida
  • Dominas alguno de estos temas, pero apenas sabes de los otros que están muy interrelacionadas.

El conocimiento de estas tres áreas, Gestión de Medios Sociales, Posicionamiento Web y Creación de Sitios Web / Blogs, es fundamental para poder desarrollar una estrategia de comunicación y captación de usuarios y clientes en la Web. Aunque nuestro objetivo sea especializarnos en una de ellas, obtener competencias básicas en estas tres líneas, nos dará una visión más global, y una preparación más profesional para desempeñar esa labor.

Os presentamos brevemente cada curso, información que podéis ampliar en los enlaces que os hemos incluido antes:

Curso de Diseño y Programación Web (14ª edición)

Cartel curso Diseño de páginas web edición 14Con este curso aprenderás a crear páginas web, desde cero. Conocerás en detalle los lenguajes HTML y CSS, muy fáciles de aprender aunque no tengas formación técnica. El dominio de estos lenguajes te van a permitir diseñar tus propias webs, modificar y adaptar páginas ya creadas o tener mayor control sobre tu blog.

En curso está basado en la última versión del estándar oficial, la HTML5 , aunque revisamos también las versiones anteriores muy utilizadas aún.

Aunque en el curso tratamos Javascript a un nivel básico, algunos alumnos de ediciones anteriores, sin ninguna experiencia en programación, nos han comentado que tenían cierta dificultad en esos módulos. Para facilitar ese aprendizaje, incluiremos una introducción a la programación donde se explicaran los conceptos más básicos, de forma detallada, con un lenguaje sencillo y utilizando ejemplos interactivos.

Curso de Community Manager, Gestión de Medios Sociales (5ª edición)

Cartel curso Community Manager edición 5ª

Casi todos tenemos ya perfiles personales en redes sociales.

Las empresas han comprendido la importancia de estar presentes en las redes y plataformas sociales para interaccionar con sus clientes y usuarios, pero son muchas las diferencias de uso respecto a esos perfiles personales.

Una organización que se lance a usar los social media sin una estrategia ni objetivos concretos, posiblemente esté desperdiciando recursos sin obtener resultados. Incluso puede volverse en su contra y tener un impacto negativo en su imagen si se hace una mala gestión de la comunicación.

En este curso analizamos todos esos aspectos:  la Web 2.0, la redes y medios sociales más populares, cómo pueden utilizarlas las empresas y las mejores prácticas recomendadas, cómo gestionar una crisis, cómo definir un plan y qué tipo de objetivos y acciones podemos plantear, de qué forma y con qué herramientas podemos medir los resultados alcanzados.

Como en anteriores ediciones, fomentaremos el debate y la participación de los alumnos, a través de los foros, actividades en grupo y las redes sociales Facebook y Twitter del curso.

Curso de SEO, Posicionamiento de Páginas Web en Buscadores (3ª edición)

Cartel curso SEO edición 3ªQue nuestras páginas Web tenga visibilidad, apareciendo de forma destacada en las búsquedas en Google es fundamental para conseguir visitas e interacción en nuestro Sitio Web o Blog. No es un objetivo fácil de conseguir,  pero sí podemos influir en que sea posible gracias al SEO.

El SEO es un conjunto de técnicas y buenas prácticas que optimizan nuestra Web para ser mejor clasificada por los buscadores. Abarcan muchos factores, desde cómo diseñamos su estructura y páginas, su contenido y la forma en que publicamos, cómo integrar a nuestras redes sociales o conseguir enlaces de calidad. 

En este curso revisamos todos esos factores SEO, cómo implementarlos y qué herramientas y servicios nos pueden ayudar en esta labor.

Matrículas, Diplomas y convalidación de créditos.

Matrícula abierta para cualquier persona con interés por estas temáticas.

Al completar con éxito uno de los curso, se recibirá un Diploma acreditativo firmado por las Entidades Organizadoras.

Además, para los alumnos de todos los Grados ofertados por la Universidad de Granada se reconocen créditos ECTS  así como créditos de libre configuración en numerosas facultades de la misma.

Imágenes: carteles diseñados por FGUGREM

 

]]> /blog/cursos-community-manager-seo-y-diseno-web-con-la-fundacion-ugr-empresa/feed/ 1 Curso Diseño y Programación Web: HTML, CSS y Javascript (12ª edic.) /blog/curso-diseno-programacion-web-html-css-javascript-edicion-12/ Sun, 09 Feb 2014 14:24:29 +0000 /?p=8293 Si quieres aprender HTML y CSS para poder crear páginas Web ya puedes matricularte en la 12ª edición de nuestro Curso de Diseño y Programación de Páginas Web

HTML es el lenguaje de marcas que nos permite estructurar el contenido de una página web mediante etiquetas de texto. CSS es el lenguaje de estilos que facilita configurar la presentación de dichas páginas. Son fáciles de aprender y te van a ser de gran utilidad no solo para crear páginas desde cero, sino para poder editar con mucho mayor control un post en tu Blog, una página creada con WordPress o el CMS que utilices, un diseño de un emailing o una página en Facebook por ejemplo.

En esta formación, online y muy práctica, verás ampliamente cómo utilizar estos dos lenguajes según las mejores prácticas y darás tus primeros pasos con Javascript, el lenguaje de programación estándar de los navegadores. Conocerás los fundamentos básicos para crear y utilizar scripts (guiones) que son pequeños programas que proporcionarán interactividad a tus páginas web. Hay miles de estos scripts disponibles libremente en la Web, así que esta introducción te abrirá muchas posibilidades para hacer páginas más avanzadas aprovechando este potencial.

Además, conocerás cómo publicar tu sitio web en Internet subiendo tus páginas a un servicio de Alojamiento Web.

CDPPW_ed12Este curso lo organizamos con la Fundación general UGR-Empresa y el Centro de Enseñanzas Virtuales de la UGR (CEVUG) y lo impartimos en su Campus online del 3 de Marzo al 30 de Mayo de 2014.
La inscripción está abierta para todos, y si eres estudiante de la Universidad de Granada  se reconocen créditos ECTS y de libre configuración en esta Universidad.

El plazo de inscripción acaba el 26 de Febrero, así que date prisa para reservar tu plaza!

 

]]> Crear una web, ¿por dónde empiezo? (I) /blog/crear-una-web-por-donde-empiezo/ /blog/crear-una-web-por-donde-empiezo/#comments Sun, 21 Apr 2013 11:51:17 +0000 /?p=7137 Hay personas con poca experiencia en programación, que nos preguntan por dónde empezar, qué deben aprender para poder crear ellos mismos páginas web.

En nuestra respuesta tratamos de orientarles según sus conocimientos técnicos y objetivos. Algunos solo quieren crear un sitio web personal o para su negocio para presentar información con texto, imágenes, videos o presentaciones. Otros en cambio, desean desarrollar aplicaciones web interactivas de una cierta complejidad.

En este primer artículo nos centraremos en el objetivo más básico. Para ello,  existen muchas soluciones que permiten publicar ese tipo de información en formato web sin necesidad de instalar nada ni aprender ningún lenguaje informático específico. Vamos a ver algunas de las más utilizadas:

Página en Redes Sociales

La opción más básica de publicación en la Web pasa posiblemente por darte de alta un perfil en algunas de las redes sociales más populares e incorporar allí tu información personal. Además, te ofrecen la posibilidad de crear una página específica para tu empresa, cómo se explican por ejemplo en estos enlaces de Facebook o Linkedin.

Con esta opción no tenemos un dominio propio y según la red, pueden estar bastantes limitadas las posibilidades que tenemos, pero si somos una empresa y queremos iteractuar con los clientes y obtener nuevos contactos, debemos estar en aquellas que frecuentan nuestros usuarios. Hoy en día es un complemento necesario a nuestra propia web y debe plantearse con una estrategia integral tal como analizamos en nuestro curso de Community Manager

Servicios de alojamiento: Blogs y Webs

La siguiente posibilidad, muy utilizada, es dar de alta un blog en servicios como WordPress.com o Blogger y convertirlo en tu web, con la facilidad que te ofrecen sus gestores de contenidos para publicar información.

WordPress.com da muchas posibilidades de configuración, empezando por más de 200 themes (temas o plantillas de estilo) que te permiten tener un web con un diseño muy atractivo y funcional, pero en la opción gratuita no tienes dominio propio y pueden llegar a incluirte publicidad sin que tengas control sobre ella. No obstante ofrecen paquetes de pago que te permiten hacer un upgrade y obtener funcionalidades avanzadas y resolver esas cuestiones si te son importantes.

Otra posibilidad es crear tu sitio web con servicios gratuitos que ofrecen un sistema de plantillas predefinidas y un interfaz gráfico que permite configurarlas y personalizarlas según tus necesidades y publicarlas bajo un subdominio suyo, como son Webnode, Bligoo, Site123 o Google Sites. En este último servicio puedes tener además tu dominio propio de primer nivel y asignar esa URL a tu sitio Google, con lo que tendrías dirección propia con un hosting gratuito. Se puede montar una web ‘decente’ en poco tiempo, pero si tienes conocimientos, con un poco más de esfuerzo puedes crear sitios bastantes interesantes ya que puedes acceder al código fuente de las páginas. De hecho hay compañías de diseño web que se especializan en este entorno. No llega a las posibilidades que ofrece WordPress.com, con su enorme comunidad de desarrolladores y gran cantidad de themes o plugins pero es una solución gratuita sin publicidad.

 

Web en Google Sites

Web creada en Google Sites

 

También te proporcionan este tipo de herramienta muchos servicios de hosting (alojamiento web) que te incluyen además dominio propio de nivel superior (.es, .com…). Si no quieres invertir mucho al inicio, quizás puedas encontrar algunas ofertas gratuitas o a precios muy bajos (menos de 1 €/mes) con regalo de dominio, como en 1&1 o One.com, aunque las ofertas varían mucho y pueden haber cambiado y suelen estar limitadas al primer año solo.

Estos web ‘prefabricados’ pueden tener funcionalidades como un blog, formularios de contacto y otras varias que funcionan de manera integrada. No obstante, si necesitamos tener un sistema de blog avanzado como WordPress.org  o una Tienda Virtual para comercio electrónico como Prestashop o Zen Cart por citar algunas, es probable que nuestro servicio de hosting nos proporcione una herramienta para instalar este tipo de aplicaciones automáticamente como Simple Scripts, Fantástico o Softacolous.

De hecho, una opción muy usual es generar íntegramente nuestra Web con estos CMS (gestores de contenido), destacando especialmente WordPress, el más usado a nivel mundial. Este software libre y gratuito es fácil de operar y nos ayuda a crear webs con funcionalidades avanzadas y una presentación profesional. Si quieres animarte a probarlo, con nuestros contenidos y curso “Aprende a crear sitios web con WordPress” sabrás desarrollar y publicar tu propia web, personal o profesional (y si los costes son muy importantes para tí, te mostramos cómo hacerlo utilizando solo servicios y herramientas gratuitas). Eso sí, para sacar todo el partido a este CMS, es conveniente estar familiarizados con HTML y CSS para tener un mayor control en el diseño de las páginas. Y si además conocemos algo de JavaScript y PHP, ese control en el diseño y la gestión del sitio será aún mayor.

Para aquellos que todo este tipo de soluciones y conceptos les resultan nuevos y necesitan una introducción para entenderlos mejor, diseñamos nuestro curso de Alojamiento Web-Publicación en Internet . En él, los alumnos practican y aprenden a elegir la solución que más le puede interesar al mismo tiempo que descubren sus funcionalidades y comprenden los términos básicos (DNS, TLD, subdominio, CPanel, FTP, instalador aplicaciones…) que aún siendo sencillos, pueden hacer que una persona que no esté familiarizado con ellos se pierda antes de empezar.

Aprender HTML y CSS

Pero aún teniendo todas estas opciones, en muchos casos fáciles de poner en marcha y gratuitas, aconsejamos que aprendas al menos dos lenguajes básicos para la Web: HTML y CSS. ¿Por qué? Pues por varias razones que te exponemos a continuación:

  • Las posibilidades que te dan un interfaz gráfico y unas plantillas acaban teniendo limitaciones. Si conoces estos lenguajes y te permiten acceder al código, puedes ajustar y personalizar mucho mejor, según tu gusto y necesidades. (Ojo! los CMS que hemos citados generan la mayor parte del HTML con PHP, por lo que necesitarías saber de este último como veremos en artículos posteriores).
  • HTML es un lenguaje de marcado con etiquetas y CSS son reglas de estilos de presentación, es decir, no son lenguajes de programación. Nuestra experiencia después de enseñar HTML y CSS a numerosos alumnos con conocimientos a nivel de usuario informático es que los entienden con fácilidad y son capaces de utilizarlos enseguida. Si no sabes nada de ellos, aquí te ofrecemos una Guía de introducción a HTML y CSS para hacerte una idea.
  • El aprendizaje de estos lenguajes te amplia tu visión a la hora de crear contenidos y distribuirlos en diferentes formatos. Aprendes a tratar de forma diferenciada el contenido de su presentación, a estructurar semánticamente la información, y en definitiva a ver las diferencias entre el diseño y la publicación enfocada a medios impresos respecto a la Web, con diversidad de dispositivos, pantallas, navegadores o aplicaciones donde se puede llegar a visualizar el contenido que has creado.
  • El conocer estos lenguajes te abre la puerta para crear tus propias páginas web sin depender de ningún entorno o sistema. Puede que muchos no entiendan esa necesidad existiendo servicios cómo los que hemos presentado, pero puede haber varias razones para ello, cómo el querer tener el control total sobre lo que creas o realizarlo como ejercicio de aprendizaje para ir adquiriendo una base sólida de conocimientos en el campo del diseño y programación web.
Editando HTML

HTML: el lenguaje para crear páginas web

 

Si te convencen estos argumentos, puedes empezar con lo más sencillo, una simple página creada con un editor online como Thimble de Mozilla que permite publicación instantánea.

Si quieres avanzar e iniciar la creación de tu sitio, te aconsejamos que te instales en tu equipo un editor especializado para este tipo de tareas. Hay decenas de ellos, con un gran rango de funcionalidades. Opciones interesantes, de código abierto y gratuitas son Geany (Linux) y Notepad++  (Windows), si quieres editar el código directamente (muchísimo más potente que el simple Notepad, con el que no tiene nada que ver) o KompoZer si quieres tener también funcionalidades WYSIWYG (edición en modo gráfico), aunque sin versiones nuevas desde hace tiempo. En cualquier caso busca entre las numerosas alternativas, prueba y elige el que más te guste.

Aunque te hayas formado en los fundamentos y buenas prácticas del diseño web (estándares, accesibilidad,…)  crear una web desde cero es complicado si no se tiene experiencia. Una opción que te ahorraría tiempo y te ayudará a crear mejores sitios es basarte en diseños-plantillas con licencias abiertas, que puedes descargar gratuitamente de sitios como  Open Source Web Design o Open Designs . Por un lado aprenderás del trabajo de personas con más conocimiento en este campo, estudiando y personalizando su código HTML y CSS, y además, si no tienes experiencia en el diseño gráfico y de interfaces, conseguirás una presentación más accesible y profesional.

El diseño de una web, como concepto integral, es un aspecto que muchas veces descuidamos (la adecuada selección de colores, tipografías, división en secciones, navegación y distribución de la información…) y es fundamental para que nuestra web no solo sea atractiva, sino cómoda y fácil de visitar. Además, una buena accesibilidad y cumplir los estándares nos ayudará en lo que conocemos como SEO, es decir, la optimización en buscadores. Hay más aspectos implicados, y no vamos a hablar de ello ahora, pero sí que los factores on-page relativos al diseño de las páginas los debemos tener en cuenta desde el inicio de nuestro desarrollo.

Para más avanzados…

Si adquieres más experiencia en el diseño web puedes utilizar los tan de moda ‘front-end frameworks‘ , como Bootsptrap de Twitter o HTMLKick Start que facilitan un desarrollo rápido, utilizando las mejores prácticas, diseño adaptativo y otras características muy interesantes, aunque creemos que deberías estar familiarizado con el lenguaje de programación Javascript, que sería el siguiente paso a dar en tu aprendizaje.

Esta es una primera contestación, pero la iremos ampliando en nuevos artículos, donde hablaremos de las posibilidades del nuevo HTML5 con el citado Javascript (y librerias como jQuery), de lenguajes que se ejecutan en el servidor web y que permiten el desarrollo de sitios dinámicos y aplicaciones web como PHP o Pyhton utilizando bases de datos, y de otra serie de herramientas, entornos y conceptos que quizás hayas oído nombrar pero no tengas claro qué son o para qué se utilizan.

]]> /blog/crear-una-web-por-donde-empiezo/feed/ 3 Introducción a HTML y CSS /blog/introduccion-a-html-y-css/ Tue, 07 Dec 2010 12:10:41 +0000 /blog/?p=348 Para aquellos que se inician en estos lenguajes, o no tienen claro del todo cuál es su papel en la creación de páginas web y la interrelación entre ellos, hemos preparado este documento que puedes visualizar aquí mismo. No se trata de un curso sobre HTML y CSS (que ya cubrimos en esta otra formación), sino de una Guía rápida de referencia, donde hemos tratado de explicar en qué consisten básicamente HTML y CSS,  mostrar sus características y elementos principales y presentar de forma resumida las diferentes etiquetas y propiedades de dichos lenguajes.

Este documento, lo hemos incluido como Anexo, dentro de nuestro nuevo Curso sobre el editor de páginas web KompoZer y está disponible en varios servicios de publicación como Slideshare, Scribd o Issuu. Aquí hemos incluido el visor de uno de ellos, que te permite distintos formatos de lectura, visualizarlo en pantalla completa (opción fullscreen) o acceder al sitio para dejar comentarios, imprimirlo o descargarlo.

Esperamos que os pueda ser de utilidad.

Introducción a HTML y CSS

]]>