Líneas decorativas que no interfieren con la accesibilidad

Cuando queramos incluir imágenes o líneas decorativas que al pasarlas por el lector de pantalla no interfieran con los lectores de pantalla podemos incluirlas en las hojas de estilo y en el HTML la ubicamos dentro de una etiqueta <DIV>, primero creamos nuestra imagen:

Luego creamos un estilo para llamarla por código, este lo ubicamos dentro de HEAD antes de </style>:

.lineamorada{
background-image:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgXdyJCQMByIlSJ6_MF6ODqy5CQWi6pW51WkgFUx66a6mCKM190X_ZzVUvGtMP7Era3f7dPiD_ZQT5Yo0-9dGtY00KWaIqJx3oc5B-S4SXWQQNRut-3mpY1uJcgQ6hNZYHVaB8wqZ0it-A/s1600/linea_violeta-02.png);
background-repeat:no-repeat;
background-position:center;
margin: 3px;
width:384px;
height:30px;
}

Y dentro del código HTML en el lugar que la queramos ubicar ponemos el siguiente código:

<div class="lineamorada"></div>

Veamos el resultado, ahora la línea se repite antes de la firma al final de cada post.