Categories
CSS HTML Trucos Utilidades

Quitando espacios innecesarios en archivos usando Dreamweaver

Desde siempre trabajo con Dreamweaver para editar mis archivos. A veces sucede que cuando descargo un archivo vía FTP, lo que obtengo es algo como esto:

Código HTML con líneas de más

o esto:

Código PHP con líneas de más

Para quitar estos espacios podemos hacer lo siguiente (usando Dreamweaver):

Si el archivo contiene HTML o CSS:

  1. Nos vamos al menú y escogemos Comandos –> Aplicar formato de origen:

    Aplicando formato de origen

  2. Fin

Resultado:

Resultado después de aplicar el comando

Si el archivo es cualquier otro tipo de lenguaje:

  1. Abrimos el diálogo de búsqueda y reemplazo presionando Ctrl + F
  2. Chequeamos la opción “Utilizar expresión regular
  3. En el cuadro “Buscar” escribimos la siguiente expresión: [\n\r]{2,}
  4. En el cuadro “Reemplazar” escribimos: \n
  5. Click al botón “Reemp. todos”.

    Quitando espacios innecesarios en archivos usando Dreamweaver

  6. Esperamos un momento
  7. Fin

Resultado:

Resultado despúes de quitar líneas innecesarias

Como vemos los espacios desaparecieron, sin embargo a veces es bueno revisar un poco más.

Esta utilidad aunque simple y talvez conocida nos puede ahorrar algún trabajito extra. Si tienes algún otro pequeño truco, compártelo.

Categories
Artí­culos CSS CSS3 Diseño HTML Webkit

Ejemplos de Webkit CSS (II): Colores, Bordes y Fondos

Ejemplos de Webkit

Esta es la segunda parte de la entrega “Ejemplos de Webkit”, en esta oportunidad vamos a mostrar algunos ejemplos de colores, bordes y fondos.

Categories
HTML Varios

Humans.txt: somos personas, no máquinas

Una iniciativa para conocer a los creadores de un sitio web.

Humans.txt

Generalmente creamos archivos robots.txt para ser reconocidos y controlar cierta información para los buscadores. Pero ¿Por qué no poner información de los autores del sitio?

¿Qué tengo que hacer?

La iniciativa propone crear un archivo humans.txt en la raiz de nuestro sitio y añadir en <head>:

HTML:

<link type="text/plain" rel="author" href="http://domain/humans.txt" />

El contenido de este archivo de texto sería algo como esto:

CODE:

/* TEAM */
        Chief: Alex Concha
        Contact: alex [at] buayacorp.com
        From: Cusco, Perú

        Slave: Braulio Soncco
        Contact: braulio [at] buayacorp.com
        From: Cusco, Perú

/* SITE */
        Last update: 2011/01/22
        Language: Spanish
        Doctype: XHTML with CSS
        Tools: WordPress, PHP
        IDE: Various

Una excelente iniciativa que podemos adoptar.

Categories
Artí­culos CSS CSS3 Diseño HTML Webkit

Ejemplos de Webkit CSS (I)

Ejemplos de Webkit

Retomando nuestra costumbre de ayudarles con artículos de Diseño, presentamos ejemplos de como usar Webkit CSS y CSS 3, en esta entrega: Flexible Box Model, Box Sizing y Columns

Categories
Firefox Google Chrome HTML html5 Internet Explorer

Ejemplos y Demos de HTML5

Si quieres saber más sobre HTML5, te presentamos un interesante sitio en el que nos muestran ejemplos y demostraciones de esta nueva versión de HTML

Ejemplos y Demos de HTML5 tiene los ejemplos básicos del uso de HTML5 y los soportes de los navegadores más conocidos. Entre ellos Internet Explorer, Mozilla Firefox, Safari, Opera y Google Chrome.

Sólo como ejemplo muestro un bloque del cual podemos editar el texto, mostrado en ContentEditable:

HTML:

<section id="editable" contenteditable="true">
  <h2>¡Este texto se puede editar!</h2>
  <p>¿Por qué no lo intentas? Un párrafo cualquiera</p>
  <ol>
    <li>el primer ítem</li>
    <li>el segundo</li>
    <li>y el tercero</li>
  </ol>
</section>
 

Al añadir el atributo contenteditable="true" hacemos que ese bloque se pueda editar, como si estaríamos usando TinyMCE o FCKEditor. El código anterior funciona en todos los navegadores modernos.

Puedes ver el demo.

Reconozco que es el primer ejemplo de HTML5 que hago en mi vida, así que si me sirvió también te puede servir a tí :D.

Enlaces