You know, put aside the wasteful markup on the page, you’ve managed to come up with one of the few scenario’s where I’d say go ahead and use the iFrame if you aren’t going to have any sort of server side scripting involved… Which means make the page XHTML transitional.
Personally if it was one of my pages, I’d probably use php to read the page in remotely, strip off the stuff I didn’t need and data scrape it to present it to match the page better – but you have to ask if it’s worth all that extra code on the server for something so simple… in this case it’s probably not - so go ahead, deploy as transitional and use the iframe. (which is a difficult thing for me to ever say)
Mostly it’s the rest of the page I’d be worried about more than the iframe. You’ve got a LOT of div and classes in there that just don’t do anything… like #header (you’ve got a perfectly good h1), #sitebranding (you’ve got a perfectly good h1), #tagline (I’d probably make that a small tag inside the h1), #navigation (perfectly good UL), span in the footer (perfectly good DIV)… or that the footer list isn’t marked up as a list.
Still, very refreshing to see quite so clean a codebase, which means you at least got MOST of what Ian covers in his book… frankly if you’re just starting out and working from Ian Lloyd’s beginner book - you’re already head and shoulders above 90% of the people you see posting code on forums like this one… especially in terms of things like heading orders, paragraphs around paragraphs (though it being around some non-paragraph elements bothers me), etc, etc…
I mean, if I had coded your homepage, the only major changes would be inside HEAD – like removing the title abuse, cutting down keywords to actually contain keywords, cutting down the description meta so it does it’s job and isn’t redundant to title… and gutting your header.
something like this
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html
xmlns="http://www.w3.org/1999/xhtml"
lang="en"
xml:lang="en"
><head>
<meta
http-equiv="Content-Type"
content="text/html; charset=utf-8"
/>
<meta
http-equiv="Content-Language"
content="en"
/>
<meta
name="keywords"
content="Frigiliana,holiday,rentals,villa,country,pool,Costa del Sol,Malaga,families,children,private, sea"
/>
<meta
name="description"
content="Holiday villa for rent in Frigiliana with private swimming pool, views of the sea and private parking."
/>
<link
type="text/css"
rel="stylesheet"
href="screen.css"
media="screen,projection,tv"
/>
<title>
Frigiliana Holiday Rentals
</title>
</head><body>
<h1>
Holiday Villa for Rent in Frigiliana<br />
<small>Private swimming pool, sea views and within walking distance of Frigiliana.</small>
</h1>
<ul id="mainMenu">
<li><a href="index.html">Home</a></li>
<li><a href="about.html">About The Villa</a></li>
<li><a href="gallery.html">Photo Gallery</a></li>
<li><a href="availability.html">Availability and Prices</a></li>
<li><a href="contact.html">Contact</a></li>
<li><a href="http://www.frigilianaholidayrentals.blogspot.com">Blog</a></li>
</ul>
<div id="content">
<h2>Welcome to our holiday villa in Frigiliana!</h2>
<img
src="gallery/gate_house_garden.jpg"
class="feature"
width="200" height="162"
alt="The villa set on a hillside of wild rosemary, thyme and lavender."
/>
<p>
Thanks for dropping by our holiday villa in Frigiliana! If you are looking for a holiday villa for rent in the Frigiliana countryside for spending a relaxing and enjoyable holiday, then you have definitely come to the right place! <a href="gallery.html">Just have a look at some of the pictures</a>!
</p><p>
Our villa is perfectly located within walking distance of Frigiliana. Frigiliana is a lively little village about 7 kilometres inland from Nerja which is a larger and better known town on the Mediterranean coast on the eastern Costa del Sol, Malaga, Spain.
</p><p>
Our 2 bedroom, 2 bathroom holiday villa is in the countryside but literally only a 5 minute walk to the village of Frigiliana on a level, surfaced country lane. As such, the villa is perfect for elderly people or families with children for its convenient location. It is fully south facing with large outdoor terraces and private swimming pool.
</p><p>
A car is not necessary as it is so easy to just walk into the village to meet up with friends for a drink or an evening meal in any one of the excellent restaurants, and then walk back home afterwards, even if you find yourself a little tipsy! No problem! <a href="about.html">Find out a little more about our holiday villa</a>.
</p>
<img
src="gallery/terrace_house.jpg"
class="feature"
width="200" height="162"
alt="View of the house and front terrace from the pool terrace."
/>
<p>
Frigiliana is a special and unique village. It has won many awards for its efforts to maintin its historical and architectural heritage. The historical centre in the old town, and especially the "moorish quarter", still retains its original aspect and character.
</p><p>
There are so many outdoor activities available and things to see and do both in Frigiliana and Nerja. Nerja and the coast are just a 10 minute drive away! According to the travel information website TripAdvisor, Nerja has been highlighted as one of the Top Ten Beach Towns in Europe! Now how about that!
</p><p>
Things to do in Frigiliana include walking and trekking, horseback riding excursions into the foothills of the Sierra de Tejeda, Almijara y Alhama Natural Park and or participating in the local festivals and fairs, to name a few. Or experience the famous and undeniably spectacular "Cuevas de Nerja" or Nerja caves which is the most visited tourist attraction in Spain after the well known "Museo del Prado" or Prado Museum in Madrid and the Alhambra palace in Granada.
</p><p>
Frigiliana's climate and weather is wonderful as the summers are relatively cool and the winters are much less severe than in northern climes.
</p><p>
<a href="availability.html">Have a look at our prices and availability</a>. Our prices are extremely competitive. And that ain't no lie or simple small talk!
</p><p>
Feel free to <a href="contact.html">contact us</a>.
</p>
<!-- #bodyContainer --></div>
<div class="footer">
<ul>
<li><a href="index.html">Home</a></li>
<li><a href="about.html">About The Villa</a></li>
<li><a href="gallery.html">Photo Gallery</a></li>
<li><a href="availability.html">Availability and Prices</a></li>
<li class="last"><a href="contact.html">Contact</a></li>
</ul>
<!-- #footer --></div>
</body></html>
Is all you should need given your appearance. You can see I pretty much swung a giant axe at all those DIV you had at the start as being pointless.
Oh, and take notice of the commenting style - putting the comment before the close let’s you know it’s being closed, while not tripping the IE rendering bugs putting it after would. Had you been doing that you may not have forgotten to close #bodyContent in the appropriate place… wait, re-reading before hitting post… that’s intentional? Given the indenting across the page you may have been better off actually indenting all that for clarity then… that or just pad one side equal to the sidebar so that the ‘structure’ makes more sense.
Still, not bad… for a human… — better than most of the garbage I’m used to seeing from ‘experts’ in the field.