Aplicando formato al HTML para mejorar el diseño

Apple Podcasts | Google Podcasts | Spotify | Pandora | RSS

Hoy vamos a ver cómo podemos aprovecharnos de la inteligencia artificial.

Básicamente es lo que hacía Michael en todos los capítulos.

En los 80 era ciencia ficción, y hoy en día es una realidad.

¿No me crees?

Desde hace un par de años puedo decirle a mi reloj inteligente «Kitt, te necesito» y me responde: «Tranquilo Michael, voy de camino»

Aún me falta tener un Tesla y que en España sea legal la función de «convocar», pero todo llegará…

De momento sirve para sacarles una sonrisa a los amigos.

Hagamos un resumen para los de la generación Z:

Knight Industries Two Thousand (Industrias Caballero 2000 SL) era una especie de ONG creadora de una inteligencia artificial súper potente y la habían metido en un Pontiac Firebird con Google Maps en tiempo real, conducción autónoma total, internet, videollamadas, propulsores, armas, blindaje y varios sistema de defensa.

Por eso estaba ambientada en EEUU.

Con ese nombre, en España, habría sido una empresa de reformas, de las del montón.

Michael Knight era su conductor y se encargaba de luchar contra el mal.

Y siempre lo hacía con la ayuda de Kitt.

Ojo, aquí hay valor:

Sin ayuda de esa inteligencia artificial, un único hombre nunca habría podido hacer todo lo que hacía Michael.

Gracias a los avances de la tecnología, hoy en día tú también puedes jugar con ventaja.

Con las automatizaciones, puedes conseguir montar un sistema que te siga generando ingresos en piloto automático (nunca mejor dicho).

Eso es lo que hice con el theme para WordPress que desarrollé.

Puedes comprarlo, descargarlo y que te llegue la factura sin que yo tenga que hacer nada.

Incluso este podcast está automatizado para que se publique mientras yo estoy llevando al instituto a mi hijo.

¿Mola, verdad?

¿Quieres que te ayude a automatizar procesos en tu negocio para que puedas dedicar tu tiempo a otras cosas más importantes?

Podemos empezar con el mantenimiento de tu web, poniéndole un blindaje mejor que el de Kitt: https://pampua.es/mantenimiento-wordpress/

Zapier, Integromat, Stripe, Coda, Airtable y Notion son mis aliados.

Si quieres te los presento.

¿Haces alguna tarea de forma repetitiva?

Cuéntame tu caso en https://pampua.es/contacto y te presupuesto su automatización.

Y ahora vamos con el tema del día:

Dando formato al HTML

Existen varias formas de dar formato a los elementos del HTML sin hacer uso del CSS, hoy vamos a verlos todos:

1.- Los styles

Style es un atributo que se usa para dar formato a algún elemento del HTML con propiedades y valores de CSS pero sin tener que hacer referencia a un fichero externo CSS

Imagina que quieres por un título más grande, pero sólo para ese caso, pues podrías hacerlo con este código:

<h1 style="font-size:300%;">Aquí el título</h1>

Si lo que quieres es que todos los títulos sean más grandes, entonces lo que tendría sentido sería hacerlo directamente desde el archivo CSS

Si lo que quieres es cambiar el color de un texto podrías hacerlo así:

<p style="color:red;">Este texto sería rojo.</p>

También podrías hacer lo mismo con el tipo de letra:

<p style="font-family:courier;">Este texto se mostraría con la tipografía Courier.</p>

Y si quieres justificar un texto podrías hacerlo así:

<p style="text-align:justify;”>Este párrafo estaría justificado.</p>

2.- Negrita

Tenemos 2 formas de poner un texto en negrita.

Con las etiquetas <b></b> y con las etiquetas <strong></strong>

De un tiempo a esta parte se viene utilizando un poco más esta segunda opción puesto que le aplica cierto valor SEO al texto que ponemos en negrita.

3.- Cursiva

Con las cursivas ocurre algo similar, tenemos 2 opciones:

La etiqueta clásica <i></i> y una etiqueta que enfatiza el texto: <em></em> Esta última visualmente se muestra igual pero le aporta un pequeño extra de SEO.

4.- Texto más pequeño

Podemos hacer que un texto se muestre más pequeño si lo ponemos dentro de la etiqueta: 

<small>Política de privacidad</small>

5.- Destacado

Podemos subrayar un texto con la etiqueta <mark>:

<p>No te olvides de comprar <mark>leche</mark>.</p>

6.- Tachado

Podemos tachar un texto con la etiqueta <del>:

<p>Mi color favorito es el <del>azul</del> rojo.</p>

7.- Subrayado

Podemos subrayar un texto con CSS underline o con la etiqueta <ins>:

<p>Mi color favorito es el <del>azul</del> <ins>rojo</ins>.</p>

8.- Subíndice

Podemos poner un texto en subíndice con la etiqueta <sub>:

<p>Aquí tienes un <sub>ejemplo</sub>.</p>

9.- Superíndice

Podemos poner un texto en superíndice con la etiqueta <sup>:

<p>Esta casa tiene 100 m<sup>2</sup>.</p>

Si te ha gustado este episodio, dímelo y crearé más explicando otras etiquetas HTML.

¿Tienes algún amigo que esté pensando en mejorar su web? Pues ya estás tardando en enviarle un whatsapp con el enlace a este episodio https://pampua.es/120 o más sencillo pampua.es/podcast y ahí tiene todos los episodios disponibles con enlaces a las principales plataformas: iTunes, iVoox, Spotify y Youtube.

Muchísimas gracias por escuchar hasta el final, por comentar, por tus “Me gusta” y reseñas. Nos escuchamos la quincena que viene, llueva, nieve o truene!