Crear elementos para las entradas de wordpress... Tirando de tablas!
Tengo un blog y deseo crear (en código) las típicas "cajitas" parecidas a widgets del tipo: Luego te puede interesar... Vota este articulo... Sobre mi... Etc...
Me lo trabaje duro y por ejemplo para hacer una caja de "luego te puede interesar...", con el editor de texto de wordpress creé una tabla de una columna con dos filas. En la fila de arriba puse el texto "luego te puede interesar..." con el fondo de la tabla azul y letras blancas; y en la fila de abajo (con el fondo de la tabla gris) inserte una foto de otro articulo, con su titulo.
En esta entrada están todas las que ya hice: https://planetapress.com/cuando-te-digan-no-puedes-mira-este-video-3/
Y este es el código de una (Siii ya se que esta mal hecho y que tiene muuuchos horrores de código):
----------------------------------------------------------------------------------------------------------------------------------------------------------
<div align="center">
<table class="table table-responsive" style="border-color: #000000;" border="3">
<tbody>
<tr>
<td style="background-color: #143c87; border-color: #000000; width: 677px; height: 37px; text-align: center;"><span style="font-size: 14pt; color: #ffffff; font-family: arial,helvetica,sans-serif;"><strong>Luego te puede interesar
</strong></span></td>
</tr>
<tr>
<td style="background-color: #bfbdbd; width: 677px; height: 37px; text-align: center;"><span style="font-size: 14pt; color: #143c87;"><strong><img class="wp-image-2062 size-thumbnail aligncenter" src="https://planetapress.com/wp-content/uploads/La-increible-historia-de-la-autentica-niña-de-la-Selva-04-150x150.jpg" alt="" width="150" height="150" /></strong></span>
<span style="font-family: arial,helvetica,sans-serif; font-size: 14pt; color: #143c87;"><strong>La asombrosa historia de Tippi, la niña de la selva</strong></span></td>
</tr>
</tbody>
</table>
</div>
----------------------------------------------------------------------------------------------------------------------------------------------------------
Pero resulta que leyendo este artículo, se me va todo a freír espárragos cuando la autora (una desarrolladora y analista), afirma:
"Las tablas son elementos que se crearon para mostrar una presentación de datos encuadrados dentro de filas y columnas, NO fueron creadas para darle forma al diseño de una página web. Estas son algunas de las razones por las que tenemos que olvidarnos de estructurar una página web con tablas y deberíamos optar por maquetar con hojas de estilo CSS"
Y enseña a hacer lo mismo pero con código CSS...
Yo no se nada de CSS y tampoco termino de entender que es lo que lo distingue del html...
Alguien me dijo que tendría que hacer las tablas (dentro de cada entrada) en html y luego colocar un código css en la hoja de Style del theme. ¿Pero aun así siguen siendo tablas no? ¿Y perjudican al seo según el artículo no?
La cuestión es que dado que la autora del reportaje afirma que el exceso de tablas perjudican el SEO y otros factores... Ahora ya no se si puedo poner estas cajas (que estoy haciendo en código html) tan alegremente copiando y pegando en todas las entradas de mi blog.
¿Cómo puedo crear esas tablas o marcos, de la forma mas correcta para pegarlas en mis entradas?
SOCORROOOOOooooooo...
1 respuesta
CSS no perjudica al seo para nada, son hojas de estilos que le dicen a cada parte de tu HTML que formato ha de tener;
Por ejemplo:
Creo un párrafo html=
<p id="1parrafo">hola</a>
Ahora si asocio una hoja de estilos puedo llamar a ese id que llamé 1parrafo y darle cualquier formato que se me antoje por ejemplo:
#1parrafo{ llamo a la id 1parrafo
margin-top:10px; le doy un margen superior de 10 pixeles.
color:red; le doy un color rojo al texto.
border: 5px solid red; le pongo un borde de 5pixeles sólidde color rojo
}
El CSS se puede integrar en el html aunque lo aconsejable es asociar una hoja de estilos que debes de hacer aparte al HTML.
Te aconsejo que aprendas CSS hoy en día si quieres maquetar en HTML todos los estilos se dan por CSS incluso hay estilos como los @media queries que hacen que tu contenido HTML se vuelva responsive y se adapte a cualquier dispositivo desde el que se visualice la web.
Así que olvídate de crear todo el contenido en tablas o en div o incluso en frames como se hacía hace unos años, CSS es muy poderoso y si lo dominas podrás crear webs elegantes, modernas y responsive en HTML.
