Unfortunately you cannot connect a web page directly to a database because of security concerns, normally you need some middleware to join the two together.
So for your example and if you want to stick with Open Source software you could easily use GeoServer as your geographic server to serve your data from your PostGIS database to your OpenLayers HTML web page.
Why this is good is that GeoServer will serve the data in a standard way, OGC Web Map Server (WMS) or Web Feature Service (WFS) and both are understood by OpenLayers and many other APIs (ESRI ones, Leaflet etc) and other Desktop GIS software (ESRI, MapInfo, QGIS, uDig etc)
So I would look at the GeoServer documentation getting started which walks you through how to connect GeoServer to PostGIS and then serve the data.
If you are new to these types of things there is no better place to start than the OpenGeo tutorials
I would definitely stick with your data being in PostGIS if
a) you have a lot of data
b) you want to run queries (like you do) and
c) if lots of people are going to use your app
If you are going to run queries I would look at Web Processing Services (WPS) these are still "new" but these are supported in GeoServer.
Hope that helps