Cómo tener éxito en la Web

Muchos piensan que, por el sólo hecho de estar en internet, su empresa tendrá más éxito. Y esto no es así. Para que una empresa pueda prosperar de la mano de Internet se deben dedicar mucho tiempo y recursos.

Una Web no deja de ser una herramienta, como un martillo, unas tenazas o un destornillador. ¿Qué ocurre si compramos un martillo y nos sentamos a mirar que pasa? no ocurrirá nada, si no se dan martillazos no ocurrirá nada. Lo mismo pasa con las Web, muchas empresas las contratan y esperan impacientes a que lleguen miles de clientes deseosos de comprar. La creación de una Web es sólo el primer paso, después hay que trabajar el posicionamiento, mantener unos contenidos de calidad, estudiar las Webs de la competencia, así como todas aquellas acciones que nos permitan llegar a nuestros objetivos.

Sigamos con el simil de las herramientas. Cuando una persona desea adquirir un vehículo para su empresa, busca en el mercado aquel que cumpla con sus necesidades: capacidad, consumo, velocidad, etc. ¿Ocurre lo mismo cuando quieren adquirir una Web? No siempre. Y esto es un problema, ya que si no se tiene claro lo que se necesita, lo más normal es que no se alcancen los objetivos previstos.

A modo de simil, he mostrado alguno de los problemas por los que muchas empresas fracasan en su intento de dar el salto a la WEB, pero hay más. Algunos de ellos son:

• Falta de profesionalidad. Muchas personas de baja cualificación se dedican al diseño y desarrollo de aplicaciones Web. Muchas empresas, buscando precios económicos, dejan la imagen de su empresa en manos de personas poco profesionales. Si un cliente potencial accede a una Web con fallos, lo más normal es que recele de la calidad de los productos que se ofrecen, y se vaya.
• Productos y/o servicios de baja calidad. Si los productos y/o servicios que se ofrecen no son competitivos, lo más normal es que una buena aplicación sirva de poco.

Es importante destacar que una Web de mala calidad puede perjudicar seriamente la imagen de una empresa. Hoy en día, clientes, proveedores, demandantes de empleo, etc., antes de contactar con una empresa intentan buscar alguna referencia en Internet. Si la imagen de la empresa no es la que esperaban,quizas nuncan contanten con ella. Recuerde:

Internet puede hacer grande a una empresa pequeña, pero también puede hacer pequeña a una empresa grande.

Hemos hablado sobre las principales causas del fracaso de una Web y de sus posibles consecuencias. Ahora daremos algunas claves para tener éxito en la Web:


Ofertar productos y/o servicios competitivos

Esto es lo principal. Si no se ofrecen productos y/o servicios competitivos todo lo demás no importa. En ningún ámbito la competencia es tan brutal como en Internet. Si un cliente accede a una Web y no encuentra lo que busca en pocos segundo se irá, la competencia está a un sólo clic.

Contar con un equipo multidisciplinar

 En el desarrollo de una Web suelen intervenir programadores y diseñadores gráficos. Estos dos perfiles son suficientes para crear una Web de calidad. Pero Web debe vender, de nada sirve una aplicación expectacular si no tiene la capacidad de captar y estimular a los clientes. Por ello, es fundamental la participación de una persona con conocimientos de marketing. Además, el propio cliente debe participar activamente en el desarrollo, porque es el que mejor conoce sus productos y el entorno donde se mueve su empresa.


Ser pacientes

A menos que se lance una campaña fuerte de promoción, los resultados pueden tardar meses en llegar. No por ello, hay que dejar de trabajar el contenido, la promoción y el posicionamiento. No hay nada que de peor imagen que un contenido desactualizado.

Función para obtener Id de video youtube(fácil)

En esta entrada comentaré una sencilla función para obtener el ID de un video de youtube a partir de su URL.

Herramientas y tecnologías utilizadas:

• ASP.NET 3.5
• VB.NET

Descripción de la función ObtenerIdYoutube

Esta es una sencilla función que devuelve el identificador de un video youtube a partir de su URL. Si la URL no es válida, o es incorrecta, devuelve una cadena vacía.

Private Function ObtenerIdYoutube(ByVal strURL As String) As String

   

    'La URL debe contener al menos 42 caracteres.

    If strURL.Length >= 42 Then

        

        Dim idVideo As String

        'Quitamos espacios en blanco al principio y al final.

        strURL = Trim(strURL)

       

        'Comprobamos el inicio de la cadena.

        'Debe comenzar por: http://www.youtube.com/watch?v.

        Dim posicion As Integer

        posicion = InStr(strURL, "http://www.youtube.com/watch?v=")

           

         'Si encontramos la cadena seguimos.

        If posicion = 1 Then

           'Eliminamos todo lo que está antes del ID.

           idVideo = Replace(strURL, "http://www.youtube.com/watch?v=", "")

           'Quitamos todo lo que está después.

           idVideo = idVideo.Substring(0, 11)

          

           'Comprobamos que el valor concuerda.   

           If idVideo <> "" Then

               If idVideo.Length = 11 Then

                   Return idVideo

               Else

                   'Debe tener 11 caracteres

                   Return ""

               End If

            Else

               'no puede estar vacío

               Return ""

            End If

        Else

            'No comienza por

            Return ""

        End If

    Else

        'Una cadena demesiado pequeña para ser válida

        Return ""

    End If

End Function

Formularios: validar email, fecha, URL, etc...

Validación de Email

Para validar emails en formularios utilizaremos el control "regularexpressionvalidator". Este control verifica si la entrada cumple con el patrón especificado en la expresión regular de la propiedad "validationexpression".

En el ejemplo vemos un control de tipo texto(txt_Email) que tiene asociado un control de validación(rev_EmailCorrecto).

<asp:TextBox ID="txt_Email"  runat="server"></asp:TextBox>

<regularexpressionvalidator controltovalidate="txt_Email" errormessage="El correo electrónico no es correcto." id= "rev_EmailCorrecto" runat="server" 
validationexpression="\w+([-+.']\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*">
</regularexpressionvalidator>

Validación de fechas

En este caso, para validar fechas utilizaremos el control CompareValidator. Para ello, asociamos este validador con el control de tipo texto (txt_Fecha). Después, configuramos la propiedad Operator con el valor DataTypeCheck. Con esto, lo que conseguimos es configurar el validador para que funcione como un comparador de tipos. Por último, configuramos la propiedad Type con el valor Date para que el validador valide fechas.

<asp:TextBox ID="txt_Fecha" runat="server" > </asp:TextBox>

<asp:CompareValidator ID="cvt_Fecha" runat="server" ControlToValidate="txt_Fecha" ErrorMessage="Formato fecha no válido. dd-mm-aaaa" Operator="DataTypeCheck" Type="Date" ></asp:CompareValidator>

¿Qué son las Master Pages? ASP.NET (Fácil)

Normalmente, todas páginas Web de un sitio tienen partes en común, como la cabecera, el menú o el pié. Eso significa que hay fragmentos de código que se repite en cada estas páginas. Esto implica que para realizar cualquier cambio hay que retocar todas las páginas del sitio. Así que toda modificación se convierte en tediosa y delicada, y una fuente inagotable de errores.

En todas las tecnologías de desarrollo podemos encontrar mecanismos para evitar el problema de la repetición de código; algunas sencillas, como los includes de PHP y otras más sofisticadas, como Tiles o las Master page (Página principal, en Español) de ASP.NET. En esta entrada explicaremos qué son las Master Page y cómo utilizarlas.

Una Master Page o Página principal es como una plantilla que contiene todos los elementos comunes en un grupo de páginas. Supongamos que tenemos que desarrollar una aplicación donde se muestran los productos y servicios de una empresa. La aplicación Web estará compuesta por una página para productos y otra para servicios. Las dos páginas tienen en común la cabecerá, el pié, el menú horizontal, y parte del menú Vertical. Pues bien, todos estos elementos se colocarán en la página principal, en la que se dejarán huecos para las partes específicas de las páginas de productos y servicios.

Una vez que tenemos la Página principal, creamos las páginas de productos y servicios que sólo contrendrán el contenido espécifico. Cuando un cliente solicita, por ejemplo, la página de productos, .NET se encarga de fusionar la Página Principal con la de productos y se la entrega al cliente.

Ya hemos visto el funcionamiento de paginas principales. A continuación veremos un ejemplo práctico de su uso.

Paso 1: Crear un nuevo sitio Web.

Para ello abrimos Visual Studio 2008 y pulsamos sobre crear Sitio Web. Le damos un nombre y pulsamos aceptar

Paso 2: Crear página principal

Hacemos click con el botón derecho sobre el explorador de soluciones y selecionamos la opción Agregar nuevo elemento.... Elegimos la opción de página principal, le damos un nombre, y pulsamos agregar.

Si le hechamos un vistazo al código de la página principal, comprobaremos que no es más que código HTML con dos controles ASP.NET(ContentPlaceHolder) que sirven para especificar los huecos. Por defecto, al crear una página principal se crean dos huecos, uno en la sección head y otro en el body.

Paso 3: Crear estructura del sitio

Ahora modificaremos la página principal para crear una estructura similar a la que vimos en la primera imagen. Además, de los dos huecos que aparecen en dicha imagen, mantendremos la que se crea por defecto en el HEAD, ya que siempre nos puede venir bien.

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">

    <title>Página sin título</title>
   
    <!--Elementos de cabecera comunes -->   
    <asp:ContentPlaceHolder id="head" runat="server">
          <!--Elementos de cabecera específicos -->    </asp:ContentPlaceHolder>
</head>
<body>
    <form id="form1" runat="server">
    <div id="contenedor">
       
         <div id="cabecera">
        
            <!-- Cabecera -->           
         </div>
         <div id="menuHorizontal">
            <!-- Menu Horizontal -->  
         </div>
        
         <div id="cuerpo">
              <div id="menuVertical">

                     <!-- Parte común del Menu Vertical -->

                  <asp:ContentPlaceHolder ID="hueco1" runat="server">
                  <!-- Parte específica del Menu Vertical-->                 </asp:ContentPlaceHolder>

              </div>
              <div id="contenido">
                    <asp:ContentPlaceHolder id="hueco2" runat="server">
                    
                    <!-- Contenido específico-->                  
                    </asp:ContentPlaceHolder>
              </div>
               
         </div>
        
         <div id="pie">
             <!-- pie -->       
         </div>

    </div>
    </form>
</body>
</html> 

Paso 4: Creamos las páginas de contenido

Volvemos a hacer click con el botón derecho sobre el explorador de soluciones y selecionamos la opción Agregar nuevo elemento.... Elegimos la opción de Web Forms, le ponemos productos.aspx de nombre, marcamos la opción seleccionar la página principal.

En la siguiente pantalla seleccionamos la pagina principal que queremos asociar a la página productos.aspx y aceptamos.

Si analizamos el código de la página productos.aspx vemos que sólo contiene 3 controles ContentPlaceHolder, uno por cada hueco que creamos en la Página principal.
<%@ Page Language="VB" MasterPageFile="~/PaginaPrincipal.master" AutoEventWireup="false" CodeFile="productos.aspx.vb" Inherits="productos" title="Página sin título" %>

<asp:Content ID="Content1" ContentPlaceHolderID="head" Runat="Server">
      <!-- Elementos de cabecera específico de productos -->
</asp:Content>

<asp:Content ID="Content2" ContentPlaceHolderID="hueco1" Runat="Server">
      <!-- Elementos de menú vertical específicos de productos -->
</asp:Content>

<asp:Content ID="Content3" ContentPlaceHolderID="hueco2" Runat="Server">
     <!-- Contenido especifico de productos -->
</asp:Content>

La creación de la página servicios.aspx es análoga a la creación de la página productos.

Con esto ya tendríamos creada la estructura de nuestro sitio Web.... Ya podemos comenzar a programar¡¡

Envio de Email con ASP.NET (Fácil)

En esta entrada explicaré, a través de un ejemplo, lo sencillo que es el envío  de emails con formato HTML a través de ASP.NET. El ejemplo utilizado es el típico formulario "Contactar" disponible en muchas web. Además, se ha añadido una segunda parte que trata los ficheros adjuntos.

Herramientas y tecnologías utilizadas:

• Visual Studio 2008
• ASP.NET 3.5
• VB.NET
• HTML

Parte 1 - Envío del email

Paso 1: Creación del formulario.

Insertaremos dos TextBox, uno para el asunto y otro para el contenido, este último de tipo multilínea(textarea). Además utilizaremos dos controles de tipo label para mostrar el nombre de los campos.  También es necesario un control de tipo Button para poder enviar el Email.

<div class="formEmail">


     <asp:Literal ID="ltl_resultado" runat="server"></asp:Literal>
    
     <asp:Label ID="lbl_asunto" runat="server" Text="Asunto:"></asp:Label>
     <asp:TextBox ID="txt_asunto" runat="server"></asp:TextBox>

     <asp:Label ID="lbl_mensaje"  runat="server" Text="Mensaje:"></asp:Label>
     <asp:TextBox ID="txt_mensaje" TextMode="MultiLine" runat="server"></asp:TextBox>

     <asp:Button ID="btn_enviar" runat="server" Text="enviar" />

</div>

Paso 2: Cuenta de correo

Para poder enviar emails a través de ASP.NET necesitamos una cuenta de correo electrónico. Normalmente, cuando contratamos un servicio de hosting se suelen inculir un determinado número de cuentas de correo. Por lo tanto, si no dispone de una cuenta de correo, el segundo paso es crearla.

Además de la cuenta de correo necesitará saber cúal es el servidor de correo saliente. Este dato se puede consultar en el panel de control del hosting. En el ejemplo utilizaremos el siguiente servidor SMTP: smtp.prueba.es.

La cuenta de correo que utilizaremos será admin@prueba.es cuyas credenciales son usu y pass.

Paso 3: Programación del evento click del contrl btn_enviar.

A continuación se muestra el código que deberá insertar en el evento click del botón enviar.

Protected Sub btn_enviar_Click(ByVal sender As Object, ByVal e As System.EventArgs) Handles btn_enviar.Click

     'booERROR nos servirá para saber si el envío se realizó si problemas

     Dim booERROR As Boolean = True
     'Creamos una instancia de la clase System.Net.Mail.MailMessage que será la encargada de gestionar el envío

     Dim correo As New System.Net.Mail.MailMessage

     Dim Msg As String
     Msg = "<body>" & _
     "<p>Mensaje enviado desde el formulario Contactar</p>" & _
     "<p>" & Me.txt_mensaje.Text & "</p>"
     correo.From = New System.Net.Mail.MailAddress(admin@prueba.es)
     'Especificamos el destinatario.

     correo.To.Add(direccion@destinatario.com)

     correo.Subject = txt_asunto.Text
     correo.IsBodyHtml = True
     correo.Priority = System.Net.Mail.MailPriority.Normal
     correo.Body = Msg


     'Configurar el host y las credenciales

     Dim smtp As New System.Net.Mail.SmtpClient

     smtp.Host = "smtp.prueba.es"
     smtp.Credentials = New System.Net.NetworkCredential("usu", "pass")

     'Si se produce un error booERROR pasará a valer False.
    
     Try
         smtp.Send(correo)
     Catch ex As Exception
         booERROR = False
     End Try
     'Informamos al usuario del resultado

     If booERROR Then
         ltl_resultado.Visible = True
         ltl_resultado.Text = "<p class=""EmailOk"">El mensaje ha sido enviado correctamente"
     Else
         ltl_resultado.Visible = True
         ltl_resultado.Text = "<p class=""EmailKo"">El mensaje no se ha enviado correctamente"
     End If
End Sub

Parte 2 - Envío de fichero adjunto

Si quisieramos enviar ficheros adjuntos al mensaje, deberemos modificar el código siguiendo los siguientes pasos:

Paso 1 Modificar el código del formulario

Agregar el control fileupload para cargar el fichero y un botón para adjuntar al email. Además incluiremos un control de tipo lista para mostrar un listado con los ficheros adjuntados.

<asp:FileUpload ID="fud_adjuntarArchivo" runat="server" />
<asp:Button ID="btn_adjuntar" runat="server" Text="Adjuntar" />

 <asp:BulletedList ID="bll_ListadoFicherosAdjuntos" runat="server">

 </asp:BulletedList>

Paso 2 Almacenar el fichero

Programar el evento click del botón btn_adjuntar.

Protected Sub btn_adjuntar_Click(ByVal sender As Object, ByVal e As System.EventArgs) Handles btn_subir.Click


     If (fud_adjuntarArchivo.HasFile) Then


          Dim fileName As String = Server.HtmlEncode(fud_adjuntarArchivo.FileName)         
          Dim Ruta As String        
          Ruta = "~/ficherosAdjuntos/" & fileName

          'Agregamos el fichero a la lista -------------------------------


          ElementoLista.Text = fileName
          ElementoLista.Value = Ruta
          bll_listadoFicherosAdjuntos.Items.Add(ElementoLista)         
          Dim ElementoLista As New ListItem()         
          '----------------------------------------------------------------

          Me.fud_adjuntarArchivo.SaveAs(Server.MapPath(Ruta))

       End If
 
End Sub     

Paso 3: Modificar el evento enviar

For Each ItemAdjunto As ListItem In bll_listadoFicherosAdjuntos.Items
     correo.Attachments.Add(New System.Net.Mail.Attachment(Server.MapPath(ItemAdjunto.Value)))
Next


Este código se colocará justo después de crear el objero "correo". Es decir:

Dim correo As New System.Net.Mail.MailMessage

For Each ItemAdjunto As ListItem In bll_listadoFicherosAdjuntos.Items
correo.Attachments.Add(New System.Net.Mail.Attachment(Server.MapPath(ItemAdjunto.Value)))
Next