Custom logo and site name in SharePoint master page

Today when I was branding my master page, I had to change the default view of how the logo and site name are displayed in the SharePoint Blueband.master.

I started off with a copy of Blueband.master which has the below control that renders the image followed by the site name(url):

<sharepoint:aspmenu id="logoLinkId" runat="server" datasourceid="SiteMapDataSourceRoot" staticdisplaylevels="1" maximumdynamicdisplaylevels="0" accesskey="1" cssclass="logo">
</sharepoint:aspmenu>

As my company logo is a bit big, I wanted the image and site name to be displayed in seperate rows and I also wanted to apply my own styles to them.
The approach below from Heather Soloman's blog interested me.

<sharepoint:sitelogoimage id="onetidHeadbnnr0" logoimageurl="/_layouts/images/titlegraphic.gif" runat="server"/>
<asp:contentplaceholder id="PlaceHolderSiteName" runat="server">
    <sharepoint:splinkbutton runat="server" navigateurl="~site/" id="onetidProjectPropertyTitle">
        <sharepoint:projectproperty property="Title" runat="server">
        </sharepoint:projectproperty>
    </sharepoint:splinkbutton>
</asp:contentplaceholder>

But as I needed a bit more control, I finally ended up with my own code:

<asp:Image runat="server" id="XXX" ImageUrl="/_layouts/XXXMasterPages/images/xxxLogo.gif" />
<p class="xxxSiteNameContainer">
    <SharePoint:SPLinkButton runat="server" NavigateUrl="~site/" id="onetidProjectPropertyTitle" CssClass="xxxSiteName">
        <SharePoint:ProjectProperty ID="ProjectProperty1" Property="Title" runat="server" />
    </SharePoint:SPLinkButton>
</p>