Tag Archives: css3

Harley Aesthetics – website design

harley aesthetics screenshot

Harley Aesthetics was based in Kilmarnock and specialised in non-surgical treatments to beat the ageing process. Offered across Ayrshire and South West Scotland.

The website was designed using Adobe Dreamweaver, Fireworks and Photoshop. As always with my web designs the site is fully responsive for Phone, Tablet and PC screens.

I also sourced some colourful and appropriate stock photographs to complete the professional look my client requested.

Technology Used

Adobe Comp
Adobe Dreamweaver
Adobe Fireworks
Adobe Photoshop

Ivory and Brass Music Lessons Website

Nicola Hopkinson of Ivory & Brass provides private music tuition in piano and brass instruments.

Nicola needed a new website and hosting package. A modern responsive website was the best option to promote her music lessons online.

After feedback from my client I came up with a suitable colour scheme for her website. Next we also looked at appropriate photographs for the site.

french horn

A full width piano photograph was chosen as the main image on the front page. My client then took some photographs of her room where she teaches and these were added into the site. Finally we added some appropriate stock images.

The final stage was to make the site completely fluid and responsive for all Smartphones, Tablets, Laptops and Desktop computers.

Once my client was happy with the website I transferred the domain to my hosting and uploaded the website to it’s new home.

Visit website

Ivory and Brass Music Tuition website

Technology Used

Adobe Dreamweaver
Adobe Fireworks
Adobe Photoshop

Shree Boutique Web Design

Shree Boutique Hair and Beauty Salon are based in Bearsden near Glasgow.

A responsive design was one of their main requirements to enable smartphone browsing clients to view their services easily.

New Logo

shree boutique logo

Adobe Illustrator enabled me to create a new logo for the business based on ideas they had suggested. Choosing the font was crucial and my client had a certain look in mind. I also had to use the pen tool to create the Shree icon.

The site was created using Dreamweaver utilising Bootstrap for efficient responsiveness. CSS3 was used extensively in creating the look and feel of the website.

Shree Boutique Hair and Beauty Salon Screenshot

Technology Used

Adobe Dreamweaver
Adobe Illustrator
Adobe Fireworks
Adobe Photoshop

Clyde Homes

I was asked to develop and design a new website for Clyde Homes who design and build Modular buildings and wooden timber homes.

My client required a modern design to reflect their new Glasgow based business.

They also required access to edit content and with this in mind I chose a WordPress CMS based website. More and more clients wishing a new web design also want the option of updating the content via CMS. WordPress is by far the most popular option.

I customised the colour, design and responsiveness of the website using CSS and a flexible template.

I also edited their logo to stand out better on a dark background.

clyde modular screenshot

Visit website 

Technology Used



Customised CSS3
Wide screen Slider

Responsive web design – Drain Unblocking

asset environmental web design screenshot

Asset Environmental are an established family business specialising in drainage issues including unblocking drains, sinks, toilets

I used Dreamweaver to create the website and added in a Bootstrap menu for full responsive and device compliance. I also used Fireworks to come up with some colour blends. I then extracted the CSS from the Fireworks blend and added the code to the CSS file in Dreamweaver.

Web Design Technology used

Adobe Dreamweaver
Adobe Photoshop
Adobe Comp
Adobe Fireworks

Visit website

New responsive design

I have just launched a new website for a new Glasgow based financial advisory company Advice and Wealth Management Solutions.

The site features a dark look with distinctive photographs in a slideshow and a responsive design coded using html5 and css3. The technology I used for the design was Adobe Dreamweaver CS6 and Adobe Fireworks CS6.

After an initial Q&A was answered I met with my client and we discussed design ideas, colour preferences and page content. After further meetings, email correspondence and feedback from the rest of the AWMS partners I managed to complete the design to the satisfaction of my clients.

Here is the link to their site.


Different devices

Testing a new site on different devices is essential once you have established a design, colour scheme and navigation. You don’t always need to have all the various devices at your disposal as there are good emulators, although having at least a few devices such as a Smartphone, Tablet and Laptop are essential.

A popular design plan is ‘mobile first. This involves designing your web site to fit the screen sizes for mobile devices first before going up the way to Tablet and then finally Desktop PC. This can be achieved by using several media screen queries in your CSS style sheets. I will discuss these media queries in further detail in the future.

Responsive Web Design

I have designed a number of websites using various responsive web design techniques. They all ultimately respond to different screen sizes that users have. Responsive design is also known as fluid or liquid web design.

Here is a site I finished recently for Just Done It Medals. Try to view the website on various devices from Smartphone to PC.