Estás mezclando cosas diferentes.
El color siempre se declara con la almohadilla delante. Es la única declaración que lleva almohadilla. Después se utiliza, como te dije, para identificar un elemento UNICO, es decir, que en tu código html solo lo puedes nombrar una vez, si lo nombras varias veces no se aplicará la característica.
No sería muy sensato ponerle la almohadilla a h1, h1 se utiliza para los títulos y si se lo pones, querría decir que solo vas a utilizar una vez esa etiqueta, te restas posibilidades, sería una mala aplicación de las hojas de estilo, y no sé, eso lo dirá quién sepa más, si realmente se puede definir h1 con #. Quizá lo correcto sería definir una clase y un h1 para esa clase
En realidad la diferencia está en las capas, si defines una clase .loquesea podrás utilizarla en muchos <div class= "loquesea"> y te ahorrarás tener que escribir siempre lo mismo, pero si lo que quieres es ubicar capas, darles posiciones ... establecer características propias para cada una, lo mejor es identificarla ÚNICAMENTE con un #.<div id= "loquesea">
Yo estoy aprendiendo y mucho más no te sé decir, pero aqui tienes casi toda la normativa traducida,
pero puedes echarle un vistazo a esto
Un beso ;)