Crear enlaces que lleven directamente a los Titulos

Muchas veces tenemos en nuestras páginas y/o blogs elementos que resaltan mucho, cabeceras grandes o gadgets muy vistosos, tan vistosos que pueden hacer que otras funciones, algunas incluso fundamentales no sean tan notorias afectando la navegabilidad.

Eso fue lo que me paso hace algunos días cuando estuve creando un "Blog Curriculum", pues tiene unos gadgets como el de la lista de actividades que ocupa bastante espacio y no deja que se vean casi las páginas si no son muy grandes, como la del formulario de contacto que apenas ocupa unas cuantas lineas, las de los campos del formulario.

Este problema se podría solucionar con una ventana modal, pero esto contradice un poco el estilo minimista del blog, ademas que puede ser complicado y afectar ciertas funciones con scripts incompatibles. Por lo que opte por una solución sencilla, crear enlaces que lleven directamente al titulo de las entradas o páginas:

1. Lo primero que hay que hacer es identificar la clase y el id que lleva el titulo, hay varias formas de hacerlo: 

Podemos ir al codigo html de la plantilla y buscamos id='titulo', la linea casi siempre comienza por <h2 class o <h3 class

O entramos al blog como lo haría cualquier visitante y le damos ctrl + u, allí buscamos el titulo de una página o entrada que tengamos abierta, en mi caso logros personales.

Enlaces internos en las entradas

2. Copiamos el contenido de id, o si no aparece simplemente lo agregamos, en mi caso no lo tenia así que agregue id='titulo'.

3. Creamos los enlaces y al final de la url le ponemos #valor de id en mi le coloco a los enlaces #titulo. Ahora esos enlaces llevaran directamente al titulo de la página o entrada.

Este tip también podemos usarlo para enlazar a partes de una misma página o entrada tal como los artículos de la Wikipedia, también para enlazar a gadgets o imagenes una explicación mas detallada esta en este enlace.