Primer Módulo Del 1er Taller de diseño de página Steemit de Steem Sports

in Steem Sports 🏀⚾🏁⚽6 months ago (edited)

Primer Modulo

Bienvenidos al primer taller de Diseño de páginas blog para Steemit desde la comunidad Steem Sports, este módulo está diseñado con un lenguaje sencillo que permitirá que todos y cada uno de los miembros de esta comunidad y cualquier otra logre las publicaciones (Post) de sus blog. Principalmente para que cada persona que desee realizar sus blog de forma limpia y presentable, pero de forma muy simple, logre entender cómo hacerlo desde su PC pero de igual forma para lograr hacerlo desde cualquier dispositivo móvil (celular inteligente) sin importar si cuenta con tecnología 3G o 4G, ya que en este primer módulo daremos los trucos más simples y básicos que permitirán una impecable presentación.

1º Modulo.png

Quise iniciar con un ejemplo gráfico, pido a todos revisar la presentación anterior en la que se informó el contenido del programa del taller, indicándose los módulos y sus objetivos, la misma fue diseñada desde un Celular Huawei modelo U8950D, de tecnología 3G, de este modo podre describir los trucos más básicos usados en dicha presentación, aqui dejo el link para que la visiten.
https://steemit.com/hive-121930/@gustavomory2/invitacion-al-primer-taller-para-steem-sports-de-uso-de-herramientas-de-diseno-para-post-de-steemit

Comencemos aprendiendo que es HTML

Del inglés Hyper Text Markup Language que significa lenguaje de Marcado de hipertexto o simplemente HTML es un lenguaje estándar a cargo del World Wide Web (WWW) también conocida como la autopista mundial de la informática, propiedad de Web Consortium (W3C). Este lenguaje de diferenciación de textos y marcados, imágenes, videos y muchos más fue creado para que dichas informaciones no se integran dentro del texto, de tal modo que para diferenciar texto de imágenes, scrip o marcados, usa un lenguaje de códigos diferenciadores. Vamos a explicar más fácilmente, cada código es semejante a una etiqueta que anuncia la forma de presentación del texto, desde su inicio y hasta su final, igualmente indica una imagen, una posición o aspecto. Digamos que si escribo; Los juguetes de los niños son resistentes. Para que este texto se presente de forma justificada debo colocarle una etiqueta o código que anuncie que debe verse “Justificado” dicha etiqueta se deberá colocar al inicio del texto y otra etiqueta anuncia el final del texto.
Desde 1993 este lenguaje se ha modificado y generado mecanismos de simplificación que han permitido adaptarse a programaciones intuitivas, es el caso de los programas para diseño de páginas web como el Wordpress, pero de igual forma se hizo necesario para los celulares y table, como lo logró la plataforma whatsapp.
Aún hasta ahora NO conoceremos, con detalle el HTML, por ello vamos a aprender solo lo necesario que requeriremos para realizar un diseño básico para todo tipo de equipo (celular, table o Pc).
Comencemos con el código o etiqueta más importante y más utilizado, el de justificado, no necesitaremos el de alineado a la izquierda por cuanto que el mismo es natural de toda base de diseño de los blog.
Texto Justificado, etiqueta de inicio del texto a justificar:

image.png
Texto justificado, etiqueta final del texto a justificar:

image.png

Cuando queramos hacer un título o sub título bastara con no justificar para que se mantenga del lado izquierdo, pero con el fin que tenga el aspecto de título o sub título, lo pondremos en negrillas, para lograr esto deberemos usar asterisco ( * ) dos veces, es decir :

Cuando escriban luego de terminado el texto justificado, la siguiente palabra o frase aparecerá en la línea inmediatamente después del texto justificado, si necesitan que exista un espacio de interlineado solo bastara colocar un punto ( . ) justo al final del código /div (ver la imagen al final que corresponde a la anterior publicación y ejemplo) debemos recordar que todo texto no justificado siempre se alineara a la izquierda, pero si quieren hacer numeraciones para que nos aparezca en escritura continua solo deberán al finalizar cada párrafo enumerado hacer un espacio de interlineado para escribir el siguiente enumerado, el sistema de forma automática NO lo presentara en texto continuo.

Por ultimo para resaltar una palabra o palabras, además de usar negritas podemos escribirlas en “Itálicas” o también conocidas en/por Word como ”cursivas” para lograr esto solo bastara usar el guion bajo (onder escort)

image.png

Nota: Todo lo anteriormente explicado se podrá observar con detalle en la imagen que presento al final de este Modulo.

imagen de ejemplo.png
@steemcurator01
@belenguerra
@brahmaputra
@jesus1995
@wentv
@ejimaruaoko
@osaeprecious
@mini80
@zorank
@euclid49
@yancar
@rose-o
@supreme-o
@annelaurie
@agha.sam
@ubel
@luisdaniel01
@fucho34
@gabrielito
@dulcem05
@captain-tom
@psalmprince
@nericblinkz
@samugobest
@preciousoft
@udeesther
@eddytorres
@muaazali08
@riveradc
@loice-jane
@puntocrochet
@reservedsingle
@debbyann
@sobuj28
@jerometorino
@zulay7059
@joseperaza10
@lg-sus
@daylemi
@carlosventura
@johnpatrick12
@ablaze
@basry
@arimiyawu
@diapamata
@danielsleonardo
@mmolina
@yetzy
@isaacgyank
@embassyclassic
@gabyvi
@sfeperezr
@starrchris
@basky14
@alexcarlos
@richardrondon
@chadsee
@mmykel
@blenice
@rosirys52
@zerometal
@ibnoe.arc
@maduranga852
@miguelgarmen21
@hatexjunior
@coachalfonso
@ikechukwu411
@fooart
@uzoor
@pursa
@sebnobasi
@icon11
@carmelyimo
@jeylsm
@elohoerero
@horlydae
@fida143
@davejr
@blessedjokpa
@oluwasholaaliyu
@danonymous247
@qadeerarif546
@andreseloymarin
@ericsonidoga
@evanslite
@joejimmy
@mohammedsami
@dinosayago01
@b-blinks
@lorde20
@sanguine.here
@dremojerry1
@blessing2
@sidereal28
@yuswardi.murdani
@alvinv12
@edwardyakuza
@arashid1
@simonnwigwe
@joelmak
@danvasilache1980
@cesarmataa
@superwisdom
@dobleapg
@zulbahri
@logansteemit
@rencross
@pankaj703
@tmighty
@donaldnesky
@miguel001122
@joel1971
@hafiz2007
@jlaya-xd
@alejandracampos
@elzia
@chichebe
@thirdeye7
@desiigner
@franciscomendoza
@emon42
@moisesjavier
@jlap
@gamuji
@milagro74
@elyayo
@danielealp
@anye2021
@jamescam
@markcovenant
@ahmadg
@marziaa
@rajasalman1
@myousafkhan
@waterjoe
@tcome
@vanessa1507
@menfita
@gehiel
@miviki
@cheerful03
@elianny16
@remay
@kenalofficial
@oswaldo21100
@raliuga
@pranandaputra
@sagacious-yas
@jhonpower
@avagah
@exceleden
@joelmaxwell
@ahmadnawaz546
@vlaswrest
@humayunwatto
@ginworld
@eldoge
@gabikay
@marquezjg
@mattyvik
@vibrant6689
@isabelfrancis28
@rafaelperez
@jmanuel-e
@bahrizul
@mtahirhanif
@saneltattoos
@davidjossy
@nafazul
@mnur
@willyzerpa
@abdulhalim100
@julia253
@elizama
@jesus0404
@jessfrendcor
@sanelleadguitar
@edgarf1979
@stephenpaul
@elisilva05
@ruckmesideways
@winstonq7
@stockaldous
@exceptionalwise
@ekwe
@projeck
@joeltoro23
@lolyfuentes
@constanzagr
@furkanunalan
@sportsjrfc2018
@henryhart
@gabrielo89
@antimony09
@josegonzalito
@browneyes01
@paulchim
@ebukalevi
@alley1
@ponsaya
@adrian-bastardo
@fuentesjo3006
@jal11
@franklinmorillo
@luisjh14
@ecemsay
@d2xns
@carenmarte
@sher11
@rose92
@jesusherrera28
@josecent
@yaneznicolas
@the-doctor07
@hjjm2015
@buraksivas
@rkorganic
@nicolodion
@shamir17
@shani.chaudhary
@sharetosteem
@mazhar.chishti
@alizamankhan
@josesan26
@owura555
@candymay8
@adebayosefiu12
@tycozor
@bensonace
@abongwa
@brendyformals11
@raceoff
@stranger-lumber
@brendan111
@ozil20
@akcares
@ahosan01
@nazaruddin
@marcorodriguezz
@julioh78
@isabelp
@isabeldc10
@arablasgidi
@van10
@akhtarali1245
@shamira16
@naabara
@sheila23blessed
@proxyb
@irene1983
@mfabiolasa95
@paulo5

Sort:  
 6 months ago 

Muy Bien bro Lo voy a leer con calma para aprender! Muchas Gracias

 6 months ago 
Estoy a la orden para cualquier duda, de este modo ayudar a todos y cada uno de los interesados en hacer un trabajo presentable, saludos y suerte
 5 months ago 

Amigo yo uso todas estas técnicas bien las aprendí de usted, la que no uso es la de justificado la verdad todavía no la e terminado de comprender pero ya aprenderé.