¿Cómo Crear Páginas Web Responsive con Dreamweaver?

Con este tutorial puedes aprender lo básico para desarrollar páginas web responsive en Dreamweaver. En este tiempo es necesario desarrollar las páginas que se ajusten a las distintas pantallas de los equipos tanto móviles, tabletas y computadoras de escritorio (desktop). El diseño de páginas web responsive debe ser modular y en bloques, teniendo en cuenta el comportamiento de la página en los equipos y las distintas columnas que mejor acomoda el contenido. El desarrollo web «responsive» es un cambio total en la manera en que comienzas a desarrollar una página web.

¿Cómo Descargar Videos de YouTube?

Existen varias razones por las cuales deseamos descargar los videos de YouTube. Puede ser para luego verlo con calma, ya que no tienes mucha velocidad en tu conexión de internet. También puedes descargar el video, para tenerlo antes que lo vayan a borrar de YouTube.  En la mayoría de los casos se descarga para utilizarlo en una presentación, o dar una charla donde no hay conexión de internet y deseas tener el video local.

Aquí les presento varias alternativas de:

¿Cómo descargar videos de YouTube y guardarlo en tu computadora?

1. Utilizando el Navegador Firefox e Instalando un Plugin o Add-ons:

Existen varios plugins que puedes instalar los cuales hacer la misma función:

2. KeepVid Pro – The Ultimate Video Downloader on Your Desktop

Si no deseas descargar, puedes acceder a: http://keepvid.com el cual, te permite entrar el enlace del video y descargarlo.

  • 3.keepvid

3. YooDownload – Online Video Downloader

También puedes acceder a: http://yoodownload.com, que también te permite descargar videos desde su página y guardarlos en tu computadora.

  • 4.YooDownloader

4. ClipConverter.CC

Te permite descargar el video y convertirlo al formato que desees.  Entra a http://www.clipconverter.cc.

  • 5.ClipConverter

5. SaveFrom.net – The fastest free YouTube Downloader

Es otro sitio web que te permite colocar el enlace de YouTube y descargarlo a tu computadora sin tener que instalar nada. Entra a SaveFrom.net.

  • 6.SaveFrom

Como puedes ver existen muchas herramientas y muchas maneras para descargar los videos de YouTube para poder verlos desde tu computadora.

Espero que te haya servido de ayuda, te invito a que compartas esta página con tus amistades para que se puedan beneficiar de esta información.

¿Cómo Crear una Página Web Responsive con Bootstrap?

Un aspecto general para conocer cómo puedes crear una página web responsive con Bootstrap. Bootstrap es una plataforma «framework» de front-end, que permite desarrollar páginas web responsive. Aquí explico de manera sencilla cómo funciona y cómo puedes crear una página totalmente responsive.

Enlaces mencionados:
• getbootstrap.com
• layoutit.com
• lopezpagan.com/youtube

¿Cómo se Puede Obtener más Dinero, brindar un Mejor Servicio con Poca Inversión?

Una de las empresas que tiene un excelente modelo de negocio es McDonald’s. Una de las claves en su negocio es la innovación constante.

ESTRATEGIA DE NEGOCIO

Pregunta: ¿Cómo se puede obtener más dinero, brindar un mejor servicio, reduciendo la salida de un producto y sin tener que hacer una gran inversión? Continue reading «¿Cómo se Puede Obtener más Dinero, brindar un Mejor Servicio con Poca Inversión?»

Estrategia de Pizzería UNO para Atraer Nuevos Clientes

Pizzeria UNO o ahora llamado Uno Pizzeria & Grill pudieron ver una oportunidad para ampliar sus ofrecimientos dentro de un mismo techo.

Al principio vendían solo pizza. Ampliaron su menú, pero se aseguraron que su marca no perdiera la esencia, así que cambiaron su nombre a Pizzeria Uno and Uno Chicago Grill.

Esto le permite a los clientes tener más opciones en el menú y la marca lo comunica cambiando su nombre para reflejar sus ofrecimientos.

Es muy interesante la estrategia que se adopta para atraer nuevos clientes y hacer que los clientes actuales consuman más en el mismo lugar.

Las Fotos Comunican más que Mil Palabras

Hay fotografías que en sí mismas son toda una noticia o un mensaje.  Con la elección de una foto de perfil podemos comunicar nuestra identidad y controlar la primera impresión que genera nuestra fotografía.

«Una buena fotografía es aquella que comunica un hecho, alcanza el corazón, y deja al espectador como una persona cambiada tras haberla visto.» -Irving Penn

Continue reading «Las Fotos Comunican más que Mil Palabras»

¿Será Importante Saber Cómo Vender?

Una de las destrezas más necesitadas y menos enseñadas es la habilidad de cómo vender el producto correcto a la persona correcta.  La venta es una de las habilidades más necesarias en el mundo de hoy, pero es la menos enseñada y la más mal-interpretada.

Las personas que son vendedores suelen tener una mala fama, por la forma en que se acercan a las personas.  En vez de ser cazadores, los vendedores deberían ser encantadores.  Deberían poder hacer que las personas les compren, y no, venderles cosas que no tienen sentido.

¿Cómo Desarrollar la Visión y Misión de tu Negocio?

Visión: 

Según Flemitman Jack en su escrito «Negocios Exitosos» (McGraw Hill, 2000):

«el camino al cual se dirige la empresa a largo plazo y sirve de rumbo y aliciente para orientar las decisiones estratégicas de crecimiento junto a las de competitividad».

La visión es lo que aspira tu negocio, a mediano o largo plazo, es la imagen a futuro de cómo deseas que sea la empresa más adelante.   El propósito de la visión es ser el motor y la guía de la empresa para poder alcanzar lo que deseas del negocio. Continue reading «¿Cómo Desarrollar la Visión y Misión de tu Negocio?»

¿Qué es un Visionario?

Yokoi Kenji, nació en Colombia, estudió en Japón y se crió en varias partes del mundo. Este reconocido disertador, colombo-japonés, tiene una fundación que se llama Turismo con Propósito, es un hombre orgulloso de ser colombiano dándonos a conocer en sus discursos cosas como el furikosan, que significa filosofía de un samurái, las diferencias de los escritos japoneses, y resalta la diferencia entre un japonés y un chino, pero lo más importante nos abre la mente de una manera positiva. Continue reading «¿Qué es un Visionario?»

Las Mejores 45 Citas sobre Análisis de Datos

Vale la pena invertir tiempo en el análisis de los datos.

1. «El precio de la luz es menor que el costo de la oscuridad.» – Arthur C. Nielsen

Los datos son el sol, el aceite, el suelo, el nuevo todo para los negocios.

2. «Los datos! ¡Los datos! Los datos! «, gritó con impaciencia. «No puedo hacer ladrillos sin arcilla!» – Sherlock Holmes

3. «La información es el aceite del Siglo  XXI, y la analítica es el motor de combustión.» – Peter Sondergaard

4. «Los datos se están convirtiendo en la nueva materia prima de los negocios.» –Craig Mundie

5. «El producto más valioso que conozco es la información.» – Gordon Gekko , Wall Street Continue reading «Las Mejores 45 Citas sobre Análisis de Datos»

Maneras de Mejorar La Experiencia del Cliente

La atención al cliente es la base de todas las empresas de éxito. Esto ayuda a desarrollar una base de clientes leales y a establecer buenas relaciones con sus clientes.

En el mundo en que vivimos con un mercado tan competitivo, podemos ser tentados a perseguir nuevos negocios. Sin embargo, para aumentar los ingresos y la rentabilidad en tu negocio, lo mejor es centrarse en la retención de clientes y construir la lealtad del cliente. Continue reading «Maneras de Mejorar La Experiencia del Cliente»

¿Cómo Desarrollo un Sistema para Generar Dinero?

Debemos enfocarnos en desarrollar sistemas que generen dinero.  Un paso a paso de varios temas que exponen nuestro estado actual, las alternativas que existen, los vehículos financieros qué existen, qué debemos hacer, entre muchos otros temas.

Más que comenzar un negocio debemos enfocarnos en desarrollar un sistema que genere dinero. Recuerda que el esfuerzo de un ‪‎líder‬ no es duplicable, pero un sistema es duplicable.

El sistema‬ permite que cualquier persona, tenga o no habilidades, pueda desarrollar un negocio‬ siguiendo un sistema.

Papás del Milenio

Muchos papás del milenio entraron en el mercado de trabajo a la altura de la recesión, están sintiendo la carga a fin de mes.

Estudios realizados muestran que:

El 58% de los papás del Milenio relatan algún grado de preocupación por poner comida en la mesa de la familia.

¿Cómo podemos manejar estas preocupaciones reales que existen en estas personas? Continue reading «Papás del Milenio»

Es Tiempo de Construir Nuevos Caminos

Para tener resultados diferentes, hay que hacer cosas diferentes.

¿Pero sabes cuántos años lleva una persona haciendo lo mismo y no ha hecho cosas diferentes?

Para una persona hacer cosas diferentes, debe cambiar su manera de pensar. Y para cambiar su manera de pensar necesita estar expuesto a una información distinta.

¿Pero sabes cuántos años lleva una persona escuchando la misma información? Continue reading «Es Tiempo de Construir Nuevos Caminos»

¿Por Qué se Debe Codificar el Diseño Antes de Enviar una Campaña de E-Mail Marketing?

¿Por Qué Se Debe Codificar En Arte De Email Antes De Enviarla Una Campaña De E-Mail Marketing?

Las compañías suelen ignorar el efecto tiene una campaña de envío de correo electrónico (E-mail Marketing). Lo primero, es tener un objetivo. Luego, debes desarrollar un plan que detalle, lo que se desea alcanzar, a través de una campaña de E-mail Marketing. Es entonces, que desarrollas una estrategia para lograr conseguir lo que has planificado, y por último, viene la ejecución de dicha estrategia.

En este caso, teniendo en mente, que has trabajado un plan con una estrategia, viene el momento de la ejecución. Decides hacer el arte o diseño gráfico que se vea muy bonito, atractivo y que comunique el mensaje deseado. Envías el arte o diseño a la persona o compañía que va hacer el envío (quien tiene una base de datos que llega directo a tu mercado meta). Continue reading «¿Por Qué se Debe Codificar el Diseño Antes de Enviar una Campaña de E-Mail Marketing?»

¿Cómo Generar una Idea de Negocio?

Muchas personas se me han acercado a decirme tengo una idea.  Comienzan a contarme su idea y luego me dicen: “Quiero hacer un app”.  Es entonces que comienzo a hacerles unas preguntas básicas y encuentro que no tienen ni idea de lo que conlleva generar una idea y desarrollarla.

El tener una idea no es suficiente.  Es necesario, tomar esa idea y llevarla a través de un proceso a ver si vale la pena el esfuerzo que hay que poner para generar una idea y producirla.

Por esta razón, decidí escribir este artículo que te puede dar un poco de luz a lo que debes hacer al momento de generar una idea y desarrollarla. Continue reading «¿Cómo Generar una Idea de Negocio?»

Programación Web: Código HTML Básico

Aprende a crear una página web utilizando HTML básico. Este video va dirigido a principiantes y personas que están comenzando en el campo de la programación web.

¡Aún tengo dificultad de mantenerme en 5 minutos, pero ahí vamos!

Nota: Me disculpo por el audio, pero creo que se entiende el mensaje bastante bien.

  1. HTML Las siglas significan (HyperText Markup Language)  o (Lenguaje Enmarcado de HiperTexto).  Ésta describe el contenido y la estructura de la información en una página web.

  2. Etiqueta (Tags)
    <p
    class=“paragraph”>Este es un párrafo</p> <p – es el inicio de la etiqueta </p> – es el final de la etiqueta Este es un párrafo – será el texto que se mostrará en el navegador class – es un atributo dentro de la etiqueta <p> parragraph – es el valor o nombre de la clase*El atributo class puede tener más de una clase separada por espacio.  Ej. paragraph1 paragraph2 paragraph3

  3. Plantilla Básica de HTML
    <html> <head>
    <title>Título de la Página</title>
    </head>
    <body> Aquí va el contenido de la página.
    </body>
    </html>

  4. Encabezado Este incluye 6 niveles. <h1> H1 </h1> <h2> H2 </h2> <h3> H3 </h3> <h4> H4 </h4> <h5> H5 </h5> <h6> H6 </h6>

  5. Párrafo <p> Párrafo </p>

  6. Espacios en blanco (Whitespace)
    Estos no son tomados en cuenta en el código sólo le asigna 1 espacio. <p> Este        es    un
    párrafo</p>

  7. Lista sin enumerar (Unnumbered List): <ul> </ul> – Lista sin enumerar <li> </li> – Cada artículo de la lista (list item)Ejemplo:  <ul> <li> Artículo 1 </li>
    <li> Artículo 2 </li> </ul>

  8. Lista ordenada (Ordered List):
    <ol> </ol>
     Lista ordenada <li> </li> – Cada artículo de la lista (list item), funciona igual en ambos. Ejemplo: <ol> <li> Artículo 1 </li>
    <li> Artículo 2 </li> </ol>

  9. Línea horizontal (Horizontal Line): <hr /> crea una línea horizontal para dividir cada sección.

  10. Salto de Línea Forzado (Line Break): <br /> – te lleva a la próxima línea.

  11. Elementos de escritura o fraseo: <em> Énfasis (emphasis) </em> o <i> itálico (italic) </i> <b> Negrillas (bold) </b> o <strong> Negrillas (bold) </strong>

  12. Enlaces (link):
    <a
    href=“http://google.com> Enlace a Google </a>

  13. Imagen: (image): <img /> – Es para mostrar las imágenes y necesita el atributo src con el valor de la ruta donde está la imagen.Ejemplo: <img src=“http://lopezpagan.com/assets/img/logo-blue.png/>


Otras etiquetas:

NombreEtiqueta inicialEtiqueta finalDescripción
a<a></a>Origen o destino del vínculo
abbr<abbr></abbr>Abreviatura (p.ej.:WWW, HTTP, etc.)
acronym<acronym></acronym>
address<address></address>Información sobre el autor
applet<applet></applet>Applet Java
area<area>ProhibidoÁrea de un mapa de imágenes en el lado del cliente
b<b></b>Estilo de texto en negrita
base<base>ProhibidoURI base del documento
basefont<basefont>ProhibidoTamaño base de fuente
bdo<bdo></bdo>Anular algoritmo BiDi I18N
big<big></big>Estilo de texto grande
blockquote<blockquote></blockquote>Cita larga
bodyOpcionalOpcionalCuerpo del documento
br<br>ProhibidoSalto de línea forzado
button<button></button>Botón
caption<caption></caption>Título de tabla
center<center></center>Forma abreviada de DIV align=center
cite<cite></cite>Cita
code<code></code>Fragmento de código de computadora
col<col>ProhibidoColumna de una tabla
colgroup<colgroup>OpcionalGrupo de columnas de una tabla
dd<dd>OpcionalDescripción de una definición
del<del></del>Texto borrado
dfn<dfn></dfn>Definición
dir<dir></dir>Lista tipo directorio
div<div></div>Contenedor genérico de idioma/estilo
dl<dl></dl>Lista de definiciones
dt<dt>OpcionalTérmino definido
em<em></em>Énfasis
fieldset<fieldset></fieldset>Grupo de controles de un formulario
font<font></font>Cambio local de la fuente
form<form></form>Formulario interactivo
frame<frame>ProhibidoSubventana
frameset<frameset></frameset>Subdivisión en ventanas
h1<h1></h1>Encabezado
h2<h2></h2>Encabezado
h3<h3></h3>Encabezado
h4<h4></h4>Encabezado
h5<h5></h5>Encabezado
h6<h6></h6>Encabezado
headOpcionalOpcionalCabecera del documento
hr<hr>ProhibidoSeparador horizontal
htmlOpcionalOpcionalElemento raiz del documento
i<i></i>Estilo de texto en itálica
iframe<iframe></iframe>Subventana en línea
img<img>ProhibidoImagen incluida
input<input>ProhibidoControl de formulario
ins<ins></ins>Texto insertado
isindex<isindex>ProhibidoEntrada de texto en una sola línea con indicador
kbd<kbd></kbd>Texto que debe introducir el usuario
label<label></label>Texto del rótulo de un campo de formulario
legend<legend></legend>Leyenda de un grupo de campos
li<li>OpcionalObjeto de lista
link<link>ProhibidoUn vínculo independiente del medio
map<map></map>Mapa de imágenes en el lado del cliente
menu<menu></menu>Lista tipo menú
meta<meta>ProhibidoMetainformación genérica
noframes<noframes></noframes>Contenedor de contenidos alternativos para la representación no basada en marcos
noscript<noscript></noscript>Contenedor de contenidos alternativos para la representación no basada en scripts
object<object></object>Objeto incluido genérico
ol<ol></ol>Lista ordenada
optgroup<optgroup></optgroup>Grupo de opciones
option<option>OpcionalOpción seleccionable
p<p>OpcionalPárrafo
param<param>ProhibidoValor de propiedad con nombre
pre<pre></pre>Texto preformateado
q<q></q>Cita corta en línea
s<s></s>Estilo de texto tachado
samp<samp></samp>Ejemplo de salida de programas, scripts, etc.
script<script></script>Sentencias de script
select<select></select>Selector de opciones
small<small></small>Estilo de texto pequeño
span<span></span>Contenedor genérico de idioma/estilo
strike<strike></strike>Estilo de texto tachado
strong<strong></strong>Énfasis fuerte
style<style></style>Información de estilo
sub<sub></sub>Subíndice
sup<sup></sup>Superíndice
table<table></table>
tbodyOpcionalOpcionalCuerpo de tabla
td<td>OpcionalCelda de datos de una tabla
textarea<textarea></textarea>Campo de texto multilínea
tfoot<tfoot>OpcionalPie de tabla
th<th>OpcionalCelda de encabezado de tabla
thead<thead>OpcionalCabecera de tabla
title<title></title>Título del documento
tr<tr>OpcionalFila de una tabla
tt<tt></tt>Estilo de texto de teletipo o monoespacio
u<u></u>Estilo de texto subrayado
ul<ul></ul>Lista no ordenada
var<var></var>Variable o argumento de un programa

Herramienta Para Manejar Gifs Animados

Gifs Media Uploader

Puedes utilizar este proyecto para crear tu sitio para manejar gifs.

La página index.php mostrará todos los gifs que han sido subidos a tu página.

La página media.php mostrará la imagen seleccionada con los campos llenos.

  • El campo de imagen muestra la ruta del gif.

  • El campo de la página muestra la ruta de la página media.php y la imagen gif seleccionada.

  • El campo download puedes descargar la imagen a tu computadora.

Si deseas subir un gif animado, deberás hacer Log In.  Los accesos están en el código.

  • Email: admin@domain.com

  • Password: admin

Una vez tengas acceso, serás redireccionado a la página anterior.

Ahora verás una opción en el menú llamada Upload que te llevará a la página para subir las imágenes. Busca el archivo y presiona el botón de Upload.

Luego de que la foto suba, serás redireccionado a la página de media.php con la imagen subida.

La página _process.php es donde todo el proceso es realizado.

La página de login.php y logoff.php crean una crean y destruyen la variable de sesión para que tengas acceso a uploader.php y _process.php

La plataforma que se utilizó para hacer el html + css se encuentra en getBootstrap.com. El lenguaje de servidor es PHP 5.4 o mayor.


 

Puedes descargar el código desde: https://github.com/lopezpagan/Gifs-Media-Uploader

¿Cómo Funcionan los Formularios? HTML y PHP

Existen dos maneras de enviar los valores de un formulario.

  • Utilizando el método POST
  • Utilizando el método GET
<form method="POST"></form> <form method="GET"></form>

Se define de esta manera:

  • Si no tienes el atributo method en el formulario, entonces GET viene por defecto.
  • Si utilizas GET, encontrarás que cuando haces un envío se escriben los parámetros en la barra de direcciones de tu navegador.
  • Si utilizas POST, no verás ningun parámetro adicional en tu navegador.

Cuando envías el formulario, dependiendo de cuál método utilices, entonces decides qué método debes utilizar para capturar los datos en el código de PHP.

Si envías el formulario utilizando el método de GET, en PHP capturas los datos utilizando  $_GET.  Si envías el formulario utilizando el método POST, en PHP debes utilizar $_POST.

<?php 
 echo( $_GET['nombre'] ); 
 echo( $_POST['nombre'] ); 
?>

Si envías un campo llamado «nombre» desde el formulario con el método GET, entonces deberás capturar los datos utilizado $_GET[‘nombre’].

<form method="GET"><input id="nombre" name="nombre" type="text" /></form>

Si ves es bastante sencillo.

Si envías el formulario con el campo de nombre con el método POST, pues utiliza $_POST[‘nombre’].

<form method="POST"><input id="nombre" name="nombre" type="text" /></form>

 

Una vez entiendes esto lo puedes hacer.

 

Existe otro arreglo que se utiliza para recoger los valores del formulario. No importa si utilizas el método POST o GET, lo leerá igual. Este es un método inseguro, por eso no se suele utilizar.

Se llama $_REQUEST.

<?php 
 echo( $_REQUEST['nombre'] ); 
?>



Esto es un adicional a lo discutido en el video:

Como has visto el utilizar el método GET envía los parámetros por la barra de direcciones de url, entonces te habrás dado cuenta que pudieras enviar a través de la url los parámetros que desees a una página php que recoja estos parámetros con la funcionalidad de $_GET.

http://localhost/form/form.php?nombre=TONY&apellidos=LOPEZ

Esta url tiene 2 parámetros.  Estos parámetros se separan o conectan con los símbolos ? y &.  El símbolo de se utiliza solo al comienzo, una sola vez, para el primer parámetro.  El símbolo de & se utiliza para el resto de los parámetros.

http://localhost/form/form.php (si no aparece el nombre de una página, entonces por defecto la página es index.php)
 ?nombre=TONY
 &apellidos=LOPEZ

En el código de PHP puedes utilizar el método de $_GET o $_REQUEST para recoger todo lo que está en la barra de direcciones de url.

Puedes colocar este url en un enlace sin tener que utilizar un formulario.

<a href="localhost/form/form.php?nombre=TONY&apellidos=LOPEZ">Enlace</a>

Luego puedes recoger los parámetros en PHP de esta manera:

<?php 
 echo( $_GET['nombre'] ); 
 echo( $_POST['nombre'] ); 
?>

 


 

Estoy seguro que esto les será muy útil en el momento de crear un formulario y capturar los datos.  

El video dura un poco más de 5 minutos, pero podemos entender que fue el primero de esta serie.

¡Hasta la próxima!

El Principio del Servicio

“Hasta que no te valores a ti mismo, no valorarás tu tiempo. Y hasta que no valores tu tiempo, no harás nada con él.” -MScott Peck

“La mayor tragedia en la vida, no es morir, sino vivir una vida sin propósito.” -Myles Monroe

Servicio es un conjunto de elementos intangibles, acciones, interacciones personales y actitudes que diseñamos para satisfacer las necesidades de los demás. Continue reading «El Principio del Servicio»

¿Qué es el Marketing de Atracción?

El Mercadeo o Marketing de atracción consiste en conseguir que las personas, que ya están buscando lo que tú ofreces, te encuentren fácilmente.

De la misma manera que ves esta imagen y te ocasiona una sensación y un deseo de poder acercarte y probarlo, así debemos ser, que las personas se sientan atraídas hacia nosotros.

marketing de atraccion


El proceso es el siguiente:

Atraer extraños y visitantes -> Convertir pedidos (leads) -> Cerrar clientes -> Deleitar a promotores


El Marketing de Atracción permite que tengas un sistema en el que el cliente potencial te busque y te encuentre, en lugar de tú estar saliendo activamente a buscar a tu cliente.  Atraes tus prospectos con soluciones en las cuales hay valor añadido.  Eso captura su atención, despierta su interés y su deseo.

Estas son algunas estrategias que puedes utilizar para lograr tu objetivo de atraer personas.

  • Participar en los Foros

  • Crear podcast

  • Sesiones de preguntas y respuestas

  • Mostrar los datos con infográficos

  • Utilizar las Redes Sociales

  • Enviar Emails con información relevante

  • Crear videos online

  • Hacer un Blog

  • Desarrollar Webinars

  • Tu imagen física (vestimenta)

  • Tu imagen virtual

  • Lugares que frecuentas

  • Material para compartir

  • Enlaces y videos para compartir (negocio, salud y bienestar, el producto, la educación)

  • Muestras, brochures, libreta o pizarra para one on one

  • Lo que hablas, lo que escribes y lo que compartes debe ser de calidad, resolver un problema o añadir algo positivo a la gente

  • Entre muchas otras.