• 13 junio, 2017

    ESTUDIO DEL CANAL DE YOUTUBE

    ¿Por qué es necesario optimizar los vídeos de Youtube?

    YouTube pertenece a Google y les da prioridad frente a otros canales de videos como Vímeo o Dailymotion. Las opciones que tendremos para mejorar el posicionamiento SEO del canal YouTube serán más limitadas que las que tendremos a la hora de posicionar un post. Generalmente los videos cuentan con bastante menos texto dificultando así la labor.

    El estudio de un canal de YouTube se realiza entre otras cosas para mejorar el posicionamiento de la web, conseguir mayor visibilidad de la marca y conseguir, al mismo tiempo, enlaces nuevos para la web.

    Para saber qué optimizar y cómo hacerlo primero debemos saber de dónde partimos.

    Información general del canal

     

    • Descripción del canal

    La descripción deberá ser más extensa y con mayor información sobre la empresa, detallando el tipo de actividad, cuando se inició, qué tipo de construcciones se hacen específicamente, …

    Podemos tomar como referencia la cuenta de Facebook, pero sin copiarla para no caer en los duplicados de contenidos. Google premia la originalidad, el contenido propio y único.

    La descripción actual parece más un slogan que se podría utilizar al final o al principio de los videos, que propiamente una descripción.

    Al igual que se pone una descripción del canal, es importante poner las palabras claves por las que se define nuestra empresa. Para ello, deberemos ir al apartado de Opciones avanzadas.

    Una vez en el apartado de Opciones Avanzadas podremos cambiar las palabras claves y la ubicación que nuestro canal tiene.

    Lo que se debe ver es algo así:

     

    • Email de contacto y redes sociales

    Es muy importante tener un email de contacto que pertenezca a la empresa, que se encuentre en uso y que, por supuesto, esté bien escrito.

    Las redes sociales que se encuentran linkadas a la cuenta de YouTube puede ser una nueva forma de llevar nuevos usuarios a nuestras cuentas sociales pudiendo aumentar la visibilidad de las redes y de la propia página.

    Google + tiene 300 millones de usuarios y aunque no sea tan popular como otras redes sociales es importante tenerla optimizada, puesto que, pertenece a Google.

    Información de los videos y distribución

     

    • Especificaciones técnicas

    Los videos de YouTube suelen usar una resolución de  1280 × 720 pixeles. Se recomienda usar Full HD (resolución 1980 × 1080 pixeles) porque es la favorita del robot de Google y es la que premia frente a otras resoluciones.

    ¿Cuál es la diferencia entre reproducción y visualización?

    • Las reproducciones: El número oficial de veces que se han visto nuestros canales o videos. Estas se empiezan a contar a partir de 5 segundos de vídeo. Y cada 30 minutos se vuelve a contar una nueva reproducción, aunque sea el mismo video el que se reproduzca.

     

    • Las visualizaciones: Se entiende como una métrica que refleja un interés real por ver el video, por parte del usuario, y no una estimación de cuántas personas han acabado viendo tu vídeo por error o sin saberlo.

     

    • Especificaciones SEO para los videos de YouTube

     

    Los puntos más importantes de optimización SEO en YouTube tiene que ver con las metaetiquetas: el título, la descripción y las palabras claves que se incluyen en los videos.

    Además, es esencial que los contenidos de los videos vayan orientados hacia nuestro público, así como que, lo que se muestre sea un contenido original y propio.

    Otro factor importante es la posibilidad de crear listas de reproducción o playlist. Estas listas de reproducción te permitirán agrupar tus vídeos en función de un tema. La funcionalidad es interesante, ya que las playlists también aparecen en los resultados de YouTube, con lo cual ocupas un mayor espacio en Youtube. Además, permite maximizar las vistas de todos los vídeos de la serie.

     

    Anexo

    Factores SEO a tener en cuenta para el contenido de los videos de Youtube.

    Lo ideal es que tus vídeos sean cortos. El nivel de atención baja después de los 120 segundos, es decir, después de los 2 minutos.

     

    1. Lo ideal para el contenido de Youtube sería hacer un vídeo “evergreen”, es decir, un contenido que sea atemporal. Esto no es siempre factible, por tanto, podemos catalogar nuestros videos y hacer distintas líneas de comunicación. De este modo, ayudaremos a generar comunidad.

     

    1. Para finalizar es muy importante que el vídeo tenga una llamada  a la acción del tipo:
    • Visita mi blog.
    • Comenta en este vídeo.
    • Comparte en Twitter.
    • Etc.

    La gente no hace nada si no se lo ruegas. Todos tenemos poco tiempo hoy en día. Si tienes algo que pedir, pídelo y mejor si lo que les pides se puede completar en menos de 10 segundos. 10 segundos de atención valen mucho para un usuario con mucha prisa.

     

    ESTUDIO DEL CANAL DE YOUTUBE
    5 (100%) 1 vote
  • 10 octubre, 2014

    Actualizacion de Navegador

    Actualizacion de Navegador

    Actualizacion de Navegador
    Valora esta pagina
  • 10 octubre, 2014

    Recortar Imágenes

    Recortar Imágenes

    Lo primero que vamos hacer es dirigirnos al editor haga clic aqui.

    Después seleccionamos la opción "Abrir una imagen desde el ordenador"

    A continuación vamos hacer la imagen más pequeña, para eso nos dirigimos a la barra de herramientas de arriba y seleccionamos "Imagen" y luego "Tamaño de imagen" y especificamos el ancho o altura que queremos y le damos a “Ok”.

    Después  si queremos seleccionar una zona para recortarla  nos vamos a las herramientas que se encuentran en la parte izquierda y seleccionamos la herramienta de recortar. Luego para recortar la imagen con unas medidas seleccionamos en “Restricción: Tamaño por salida” y metemos los valores que queremos recortar en la imagen.

    Para finalizar la opción de recorte le damos a “Intro” en nuestro teclado o le damos doble clic encima de lo que hemos seleccionado.

    Ya por ultimo  vamos a guardar la imagen nos dirigimos a la barra de herramientas superior “Archivo”  à Guardar… 

    Ahora  escogemos donde queremos guardarlo en nuestro caso es “Mi PC” lo guardamos con un nombre y el formato  ponemos “png” y le damos a “Ok”

     

    Recortar Imágenes
    Valora esta pagina
  • 10 octubre, 2014

    CURSO DE HTML5

    CURSO DE HTML5

    curso-html5

     

    En este pequeño curso de HTML5 contaremos algunas de las mejoras de esta versión, sus new tags, tml tools,css3, Canvas, Edge, etc.

    Hoy en día solo se oye la palabra HTML y 5, buscando y buscando por la parece que HTML5 va a ser una revolución para todos los desarrolladores.

    Efectivamente HTML5 era un gran cambio y  creo que HTML5 va a traer multitud de cosas buenas, y la principal de todas es la desaparición paulatina de los navegadores antiguos, principalmente de IE6. Y la posibilidad de hacer animaciones sin necesidad de Flash.

    Pero nos va a ofrecer mucho más, la caída del flash, el fin de los div, el fin de las cookies como las conocemos, más posibilidades multimedia, más semántica a nuestros contenidos.

    NEW TAGS: CONCEPTOS BASICOS  DE HTML5

    La idea de HTML5 es la de presentar una serie de nuevas ‘ new tags’ en el lenguaje de marcas que se centran principalmente en el dibujo, la animación/multimedia para HTML5 asimilándolo ligeramente a Flash.

    Marcado semántico y diseño de página

    Los elementos semánticos describen su significado o propósito claramente al navegador y al desarrollador. Por ejemplo la etiqueta <div>.

    La etiqueta <div> define una división o una sección de un documento HTML, pero no nos dice nada acerca de su contenido, los desarrolladores si utilizan identificadores pero los navegadores no lo reconocen.


    < div id ="header">


    En HTML5 hay nuevos elementos semánticos  o new tags enriquecidos que transmiten el propósito del elemento a ambos desarrolladores y navegadores.


    < header >


    Aquí están algunos de los nuevos elementos semánticos o new tags en HTML5:


    • Footer

    • Figcaption y figure: especifican una figura en mi contenido como por ejemplo una imagen, gráfico, foto.

    • header: Los Headers y footers resultan claros.

    • hgroup: agrupo a mis encabezados h1 , h2, h3, h4..

    • mark: El elemento mark me permitió resaltar o marcar el texto importante.

    • Nav: Entonces la etiqueta nav crea una barra de menú o navegación.

    • Section y article: Puede utilizar sections y articles para agrupar su contenido.

    • Time

    • Aside: Por último, el elemento aside puede ser usado para contenido secundario, por ejemplo, una barra lateral de enlaces relacionados.

    new-tags-html5

    Este es un ejemplo sencillo de código que utiliza estos elementos con un poco de css3:


    <section>


    Este es el segundo artículo. Estos artículos pueden ser secciones del blog, etc.


    </section>


    </article>


    </section>


    <aside>


    <section>


    <h1>Links</h1>


    <ul>


    <li><a href="#">Link 1</a></li>


    <li><a href="#">Link 2</a></li>


    <li><a href="#">Link 3</a></li>


    </ul>


    </section>


    <figure>


    <img width="85" height="85"


    src=”https://www.guellcom.com/wp-content/uploads/JennMar.jpg&”


    alt="Jennifer Marsman" />


    <figcaption>Jennifer Marsman</figcaption>


    </figure>


    </aside>


    <footer>Footer – Copyright 2011</footer>


    </body>


    </html>

     

    CANVAS: Dibujo en HTML5

    Otro elemento novedoso en HTML5 es la etiqueta o new tags <canvas> y código de Javascript como por ejemplo se utiliza en Flash, mediante el cual podrás dibujar en pantalla.

    Dentro de Canvas puedes ilustrar formas complejas y llenar esas formas con colores o se pueden colocar las imágenes en el lienzo y aplicar efectos sobre las imágenes.

    Entre <canvas> y </canvas>, se puede especificar un texto para mostrar en los navegadores que no soportan el elemento canvas.


    1.           <!DOCTYPE HTML>


    2.            


    3.           <html>


    4.            


    5.           <body>


    6.            


    7.               <canvas id="myCanvas">Your browser does not support the canvas tag.</canvas>


    8.            


    9.               <script type="text/javascript">


    10.        


    11.        


    12.        


    13.               var canvas = document.getElementById('myCanvas');


    14.        


    15.               var ctx = canvas.getContext('2d');


    16.        


    17.        


    18.        


    19.               // Draw blue rectangle


    20.        


    21.               ctx.fillStyle = '#0065BD';


    22.        


    23.               ctx.fillRect(0, 0, 125, 75);


    24.        


    25.        


    26.        


    27.               // Draw white X


    28.        


    29.               ctx.beginPath();


    30.        


    31.               ctx.lineWidth = "15";


    32.        


    33.               ctx.strokeStyle = "white";


    34.        


    35.               ctx.moveTo(0, 0);


    36.        


    37.               ctx.lineTo(125, 75);


    38.        


    39.               ctx.moveTo(125, 0);


    40.        


    41.               ctx.lineTo(0, 75);


    42.        


    43.               ctx.stroke();


    44.        


    45.        


    46.        


    47.           </script>


    48.        


    49.       </body>


    50.        


    51.       </html>


     

    1.      Creo el lienzo y le doy una ID. Si el navegador no soporta CANVAS saldrá un mensaje de error.

    2.      Secuencia de comandos. Debe usar JavaScript para dibujar y representar gráficos sobre ella.

    En primer lugar llamo al ID del Canvas.

    Después especifico " 2d" para la elaboración y manipulación de la gráfica.

    3.      A continuación, dibujo el rectángulo azul.

    Uso fillStyle para especificar el color azul.

    Uso fillRect para dibujar el rectángulo, indico tamaño y posición.especificando el tamaño y la posición.

    Ejemplo: fillRect(0, 0, 125, 75)

    En la esquina superior izquierda dibuja un rectángulo con ancho=125 alto=75 píxeles.

    4.      Dibujar la X blanca sobre la bandera.

    Primero solicito beginPath para iniciar el proceso pintar en una ruta.

    Especifico lineWidth (ancho de línea) de 15 píxeles

    StrokeStyle de "blanco" para trazar la ruta del color blanco.

    MoveTo para trazar  la ruta utilizando. Mueve el cursor sin trazar una línea

    LineTo A para trazar  la ruta utilizando. Dibuja una línea mientras se desplaza

    Por último, el método stroke hace que estos trazos se vean.

    canvas-html5

     

    Soporte de Audio y Video

    Una de las grandes características que es nueva en HTML5 es la capacidad de reproducción de audio y videos.

    El soporte para audio y video se implementó de manera brillante, donde no existe la posibilidad de tratar diferentes formatos de archivo.

    Por último, cualquier texto entre las etiquetas de apertura y cierre (como <audio> and </audio>) aparecerá en los navegadores que no soporten el elemento de audio o video.

    1.           <audio controls="controls">
    2.            
    3.               <source src="laughter.mp3" type="audio/mp3" />
    4.            
    5.               <source src="laughter.ogg" type="audio/ogg" />
    6.            
    7.               Su navegador no soporta el elemento de audio.
    8.            
    9.           </audio>

    Con este código, el navegador intentará primero reproducir el archivo laughter.mp3. Si no tiene los códecs adecuados para reproducirlo, intentará a continuació reproducir el archivo laughter.ogg. Si el elemento de audio no es reconocido por el navegador en absoluto, mostrará el texto "Su navegador no soporta el elemento audio" en donde debió estar el control audio.

     

    Video

    Veamos ahora el elemento <video> element.

    1.           <video width="320" height="240" controls="controls">
    2.            
    3.               <source src="movie.ogg" type="video/ogg" />
    4.            
    5.               <source src="movie.mp4" type="video/mp4" />
    6.            
    7.               <source src="movie.webm" type="video/webm" />
    8.            
    9.               Your browser does not support the video tag.
    10.        
    11.       </video>
    

     

    Al igual que el audio, el video tiene un atributo controls.

    PASOS A SEGUIR:

    1.      Creo el lienzo y le doy una ID. Si el navegador no soporta CANVAS saldrá un mensaje de error.

    2.      Secuencia de comandos. Debe usar JavaScript para dibujar y representar gráficos sobre ella.

    En primer lugar llamo al ID del Canvas.

    Después especifico " 2d" para la elaboración y manipulación de la gráfica.

    3.      A continuación, dibujo el rectángulo azul.

    Uso fillStyle para especificar el color azul.

    Uso fillRect para dibujar el rectángulo, indico tamaño y posición.especificando el tamaño y la posición.

    Ejemplo: fillRect(0, 0, 125, 75)

    En la esquina superior izquierda dibuja un rectángulo con ancho=125 alto=75 píxeles.

    4.      Dibujar la X blanca sobre la bandera.

    Primero solicito beginPath para iniciar el proceso pintar en una ruta.

    Especifico lineWidth (ancho de línea) de 15 píxeles

    StrokeStyle de "blanco" para trazar la ruta del color blanco.

    MoveTo para trazar  la ruta utilizando. Mueve el cursor sin trazar una línea

    LineTo A para trazar  la ruta utilizando. Dibuja una línea mientras se desplaza

    Por último, el método stroke hace que estos trazos se vean.

     

    Soporte de Audio HTML5

    Una de las grandes características que es nueva en HTML5 es la capacidad de reproducción de audio y videos.

    El soporte para audio y video se implementó de manera brillante, donde no existe la posibilidad de tratar diferentes formatos de archivo.

    Por último, cualquier texto entre las etiquetas de apertura y cierre (como <audio> and </audio>) aparecerá en los navegadores que no soporten el elemento de audio o video.

    1.           <audio controls="controls">
    2.            
    3.               <source src="laughter.mp3" type="audio/mp3" />
    4.            
    5.               <source src="laughter.ogg" type="audio/ogg" />
    6.            
    7.               Su navegador no soporta el elemento de audio.
    8.            
    9.           </audio>

    Con este código, el navegador intentará primero reproducir el archivo laughter.mp3. Si no tiene los códecs adecuados para reproducirlo, intentará a continuació reproducir el archivo laughter.ogg. Si el elemento de audio no es reconocido por el navegador en absoluto, mostrará el texto "Su navegador no soporta el elemento audio" en donde debió estar el control audio.

     

    Soporte de Video HTML5

    Veamos ahora el elemento <video> element.

    1.           <video width="320" height="240" controls="controls">
    2.            
    3.               <source src="movie.ogg" type="video/ogg" />
    4.            
    5.               <source src="movie.mp4" type="video/mp4" />
    6.            
    7.               <source src="movie.webm" type="video/webm" />
    8.            
    9.               Your browser does not support the video tag.
    10.        
    11.       </video>

    Al igual que el audio, el video tiene un atributo controls.


    Otros atributos divertidos en el elemento de video incluyen:




    Atributo


    Valores Posibles


    Descripción


    audio


    Muted


    Establece el estado predeterminado del audio (actualmente, "silenciado" es la única opción)


    autoplay


    autoplay


    Se inicia la reproducción de video tan pronto como esté listo


    controls


    controls


    Muestra los controles de reproducción de video en la página


    height


    (valor en píxeles)


    Establece la altura del reproductor de vídeo


    loop


    Loop


    Hace que el audio se repita cada vez que termina


    poster


    (algún URL)


    Especifica la dirección URL de una imagen para representar el vídeo cuando no se dispone de datos de vídeo


    preload


    auto, metadata, none


    Determina si se debe cargar el video cuando se carga la página. El valor auto cargará el video, metadata cargará sólo metadatos asociados con el archivo de video, y none evitará la precarga del video. (Este atributo será ignorado si la reproducción automática está especificada)


    src


    (algún URL)


    Especifica la dirección URL del archivo de video a reproducir


    width


    (valor en píxeles)


    Establece el ancho del reproductor de vídeo

     

    HTML5 and CSS3: Animacion

    El CSS le permiten transformar (mover) los estilos en la pantalla con la animación entre los dos estados de estilo.

    Esto se puede hacer tan simple como cambiar el estilo de algo en la pantalla, de un estado de cursor del mouse o al hacer clic.

    http://www.the-art-of-web.com/css/css-animation/

    La necesidad de herramientas tools y el cumplimiento de las normas

    Desde Adobe aún ven el HTML5 como parte de su plan de trabajo para la liberación de Adobe Edge, una nueva herramienta para ayudar a los desarrolladores a crear animaciones basadas HTML5.

    CMS para plantillas HTML5

    IMCreator

    CURSO DE HTML5
    Valora esta pagina
  • 10 octubre, 2014

    Reducir MB de una imagen

    Reducir MB de una imagen

    Un dia mas el equipo tecnico de Guellcom ofrece un manual de cómo reducir los MB de una imagen para que ocupe menos espacio y sea mas rapida de cargar en la web.

    1º. Abriremos el programa online para poder reducir  los MB de las imágenes. http://pixlr.com/editor/

    2º. Después seleccionamos la opción "Abrir una imagen desde el ordenador".

    3º Nos vamos a la barra de herramientas y seleccionamos “Archivo" y despues "Guardar"

    4º. Por ultimo seleccionamos el formato con el que queremos guardar en este caso elegimos JPEG y donde pone calidad bajamos la calidad aproximadamente a un 70 o 60.

    Para fijarnos el tamaño aproximadamente que ocuparía nos fijamos en el tercer recuadro rojo que esta al lado del “OK” y finalmente le damos a OK.

    Reducir MB de una imagen
    Valora esta pagina
  • 8 octubre, 2014

    Manual limpiar Virus en Windows

    Software Necesario.

    Para limpiar Windows será necesario descargar e instalar estos programas:

    Si ya se dispone de antivirus, se puede utilizar ese, si se opta por descargar este y ya se tiene instalado otro, se debe desinstalar el anterior.

    • Programa AntiSpyware: También existen multitud de estos programas para esto. Nosotros trabajaremos con MBAM también en su versión gratuita. Se puede descargar desde https://www.malwarebytes.org/.

    Una vez descargados e instalados ambos programas, los abriremos y actualizaremos ambos.

    Reinicio en Modo Seguro.

    Ya con nuestros programas bien actualizados, procedemos a reiniciar Windows en modo seguro SIN funciones de red. Para ello reiniciamos normalmente y antes de que salga ninguna pantalla de Windows, es decir, mientras la pantalla está en negro, presionamos F8 hasta que salga un menú. Con las flechas del teclado seleccionaremos la opción iniciar en modo seguro sin funciones de red.

    Eliminación de MalWare.

    Una vez haya arrancado nuestro sistema operativo procederemos a la limpieza del PC. Para ello basta con abrir primero AVG (o el antivirus que se tenga) y presionamos sobre analizar el equipo, debemos hacer un análisis en profundidad y del disco duro completo. Este proceso tardará un tiempo.

    Cuando el antivirus haya terminado, abrimos el programa MBAM y volvemos a analizar el equipo.

    Tras pasar estos programas lo más probable es que el virus haya sido eliminado.

    Si el virus persiste recomiendo formatear el ordenador.

    Manual limpiar Virus en Windows
    Valora esta pagina
Volver