Redacción 3.0. TABLA de códigos HTML básicos y avanzados para usar en Steemit
Lección # 1 del "Curso y Diplomado en Comunicación 3.0".
Auspiciado por la Universidad Popular Clementina Suárez.
Un comunicador o comunicadora 3.0, debe acercarse un poco al mundo de la codificación en HTML, ya que através de ella, podrá personalizar sus artículos de manera más profesional. Steemit es una red social que presenta una plataforma con base en objetos (dibujitos) para redactar simples y llamativos artículos, pero también presenta, a diferencia de las otras redes sociales, una opción para escribir las publicaciones en HTML, de tal manera que se puede hacer en una publicación, tantas cosas como se pueden hacer en una página web.
El objetivo de esta lección, es aprender a hacer una publicación en steemit mediante el método simple e inciciarse en el camino de las publicaciones mediante comandos HTML. TODAS las páginas web pueden ser tratadas en formato HTML, por lo cual, después de esta lección, aprenderás no solo a redactar profesionalmente en steemit, también, en cualquier otro sitio de internet.
Además, esta publicación te servirá para tener a la mano, en todo momento, una lista bastante amplia de los comandos más importantes que podés utilizar al estar redactando tus propios post en steemit. Te recomiendo "reestimiar" (compartir) esta lección para tenerla guardada en tu popio timeline.
Índice de contenidos
- Videolección
- Tabla de códigos básicos
- Tabla de códigos avanzados
- ¿Cómo hacer una tabla?
- ¿Cómo hacer un índice?
- Preguntas generadoras
Videolección
Diseño de intro Steemit3D: @carlos-cabezaTABLA DE CÓDIGOS BÁSICOS
| FORMATO | CÓDIGO |
|---|---|
| Tamaños | # TEXTO |
| Negritas | ** TEXTO ** ó __ TEXTO __ |
| Cursiva | * TEXTO * ó _ TEXTO _ |
| Viñetas para listas | * TEXTO ó _ TEXTO |
TABLA DE CÓDIGOS AVANZADOS
| FORMATO | CÓDIGO |
|---|---|
| Justificar TEXTO | <div class="text-justify">TEXTO</div> |
| Centrar TEXTO |
|
| TEXTO con hipervínculo | [TEXTO](El link) |
| Colocar IMAGEN a la derecha |
|
| Colocar IMAGEN a la izquierda |
|
| Colocar TEXTO a la derecha |
|
| Colocar TEXTO a la izquierda |
|
| Hacer dos columnas de TEXTO | <div class="pull-left">TEXTO COLUMNA 1</div> |
¿Cómo hacer una tabla como las anteriores?
Ejemplo:
| Columna 1 | Columna 2 |
| --------|---------|
| TEXTO | TEXTO |
| TEXTO | TEXTO |
¿Cómo hacer un índice?
Si es simple y de tipo numérico, basta con escribir la lista de esta manera:
1. elemento 1
1. elemento 2
1. elemento 3
1. elemento 4
1. elemento 5
Al publicarlo se miraría así:
- elemento 1
- elemento 2
- elemento 3
- elemento 4
- elemento 5
Si queremos hacer un índice compuesto de temas y subtemas, usaríamos la siguiente lógica.
1. elemento 1
1. elemento 2
1. sub-elemento 2.1
1. sub-elemento 2.2
1. elemento 3
Al publicarlo se miraría así:
- elemento 1
- elemento 2
- sub-elemento 2.1
- sub-elemento 2.2
- elemento 3
Preguntas generadoras:
- ¿Qué otros códigos podés compartir con la comunidad steemit?
- ¿Te han servido estos conocimientos para comenzar a publicar en steemit y atreverte a un poco más?
A medida vayamos escribiendo, pulicando e interactuando, el uso de estos códigos se volverá automático, y los aprenderemos a manipular sin poblemas. Vendrán nuevas lecciones a futuro sobre redacción, cada vez más profesional. Comenzá a escribir tus primeros artículos en steemit que siempre habrá una comunidad interesada en leerles, las personas de este diplomado en particular.
Francisco Arturo Lagos.
Matriculado. Siguiendo la primera lección, desde una sala de hospital. Un abrazo a la distancia, estoy muy ansioso de devorar la información de este innovador curso y aprender juntos , más de comunicación digital...
Saludos Franco. No te olvidés de votar, la interacción es lo que le da sentido a esta red.
Hola Pavel, me pareció muy informativa la lección de hoy, a mi me gustaría compartir otro código para hipervínculos
"a href="URL"" y "/a" siempre entre <> para hacer el vínculo
"strong" y "/strong" también entre <> para resaltar el texto de vínculo
a mi me sirve mucho este tema de los hipervínculos debido a mi formación como biólogo, a veces no puedo explicar un termino en el post y con un hipervínculo, quien lee puede acceder fácilmente información complementaria.
Excelente Andrés!
Gracias por el aporte.
hola Pavel, siguiendo la primera lección, muy ansiosa por aprender lo de la comunicación 3.0 y ponerlo en practica,
¡Genial!... Ya inicio el curso, tenia muchas expectativas acerca del esto y creo que vas por buen camino Pavel, muy interesante la forma en la que lo presentaste y la didáctica que usas, eres un buen profesor, esperaremos con ansias el segundo tema. Toma tu voto te lo mereces
Genial articulo.
Me gusta la estructura del articulo y como usas los códigos, definitivamente esto motiva escribir, lo haré en cuanto pueda.
Postadata: ¡Excelente vídeo!
Gracias Narciso. Te animo a escribir tu primer post pronto, aquí tenés a un lector que además sabe que la interacción es lo que fortalece nuestra comunidad.
Hola estoy muy emocionada, es un tema nuevo para mi .
Soy completamente nueva en eso de HTML, creí que era algo muy complicado. Luego de está clase me doy cuenta que no es así. Ahora a practicar, la práctica hace al maestro. Gracias Pavel.
Que bueno que te haya servido esta lección para motivarte a escribir en HTML. Hay que comenzar a publicar en STEEMIT.
Genial esta interesante donde puedo encontrar otro articulo referente al tema
Muchas gracias Pavel por esta primer lección. Creí que era más difícil de comprender y utilizar HTML, pero lo haz hecho ver cosa de niños.
Me siento ansiosa por hacer mi primee post.
Tengo un problema para reproducir los vídeos desde tu timeline (aparece un error de HTML5), solo los puedo ver directamente de youtube.
En mi primera publicacion steemit no se que pasa mira me.modifica el texto ...por que
Escribir, googlear y luego volver a escribir, ese es el camino...