Contact ZenDuo


Posts Tagged ‘website design’

Falcon Ridge website launch

Friday, July 16th, 2010

We are pleased to announce the launch of the website for Falcon Ridge Holidays, a Cornwall campsite located in the heart of Cornwall.

Falcon Ridge is set in 8 acres of South East Cornwall’s spectacular peaceful countryside enjoying uninterrupted and expansive views of Bodmin Moor towards Dartmoor, with 3 acres of grounds designated for camping for families and camping couples only.

Because of our existing relationship with Falcon Ridge, they approached Zenduo to create a themed website to promote their camping facilities. They required a website which displayed information on the campsite, detailing its facilities, local surroundings and tariffs, as well as allowing users to make bookings online.

Take a look for yourself at the new Falcon Ridge Holidays website.

Tags: , , , , , ,
Posted in website design | No Comments »

Whybrow website Launch

Tuesday, June 1st, 2010

We’re are pleased to announce the launch of the newly updated Whybrow Signing Consultants website. Building upon Whybrows previous website, the redesign and relaunch brings much more content with simpler site navigation and a much more coherent incorporation of the company’s branding.

Take a look for your self over at: http://www.whybrow.co.uk

The website has been developed in CSS, XHTML, Flash, Java and PHP to provide all content across a variety of devices and systems.

Tags: ,
Posted in website design | 1 Comment »

Spacer: Perfect layout spacing

Friday, February 12th, 2010

Get Adobe Flash player

When creating any website design layout, its crucial to pay attention to detail. A common layout formation is the three column. This often requires you to calculate the width of each box taking into account any margins you wish to apply to these boxes. This handy little tool does all of the calculations for you. Simply enter all of the information in the boxes above to retrieve the exact width to set each box to.

Tags: , , , ,
Posted in ActionScript & Flash, Website Design Tools | No Comments »

Individual Interior Solutions

Tuesday, December 8th, 2009

A sneak peak at a new website design for Zenduo:

individual-interior-solutions

Over the past few weeks Zenduo have been working closely with Devon Interior Designer and Owner of Individual Interior Solutions, Marie Hewitt to produce a bespoke website to help premote the business’s service and communicate Marie’s superb eye for design and attention to detail.

The company itself offers Corporate, Home and Marine Consultation, introducing style, colour and texture to your environment. From Heritage style properties to the ultimate contemporary apartments. The professional in-house team produce all types of bespoke hand made window dressings including curtains, roman blinds and pelmets. When it comes to furniture, Individual Interior Solutions upholstery and loose cover service is exceptional – from occasional chairs to 3 piece suites, they can transform your tired looking furniture to showroom conditions, whilst at the same time enhancing the interior of the room.

Launch Details

The website will soon to be launched at http://www.individualinteriorsolutions.co.uk in the new year so watch this space!

Tags: ,
Posted in website design | No Comments »

Transparent background in CSS

Monday, October 26th, 2009

Transparent boxes are becoming a common element to many new designs, as you will see our latest design is build around the design of 2 transparent boxes however this was done using png’s.

There are a number of ways to achieve this effect but today i will show a simple example of how to achieve this using CSS. I am not certain to what extent this code will work on all browsers but any feedback that you might have please let me know as i will include it in this post.

The below example will show a box using the background colour of white and an alpha of 50%.

Transparent Box CSS

#mydiv {
width: 300px;
height: 50px;
margin: 20px 0;
background-color: #ffff00;
/* Internet Explorer */
filter:alpha(opacity=60);
/* CSS3 standard */
opacity:0.6;
}

Here’s what it looks like

50%

30%

10%

Advantages

The only real advantage, but a good one, is that you no longer need to use images (e.g. pngs) for your backgrounds which could result in faster loading times for your web page.

Disadvantages

This may not work on all browsers, it certainly does for the most recent versions but how far back this technique goes back I’m not too sure. Using the code above you will also need to keep the width set, in IE it seems to break without it. But im sure there is a work around for this.

Tags: , ,
Posted in CSS Tips & Tricks, website design | No Comments »

CSS Star hack * {your css here}

Sunday, September 27th, 2009

The CSS star hack is one of my favorite hacks when developing any good website design in CSS. This CSS   star hack effectively allows you to reset any attribute to all HTML elements of your web page, saving you time and code if used correctly. It’s a great way to remove padding or margin on all HTML elements on your website giving you a blank canvas to start developing on especially when you have ie6, ie7 and ie8 to deal with! 

How to apply the CSS Star Hack

Firstly I will begin by explaining how and where I generally use the star hack within your css document.

Begin by opening your stylesheet, and paste the CSS below into the very top of your stylesheet :

Code:

* {
margin:0;
padding:0;
border:none;
}

What does it do?

By doing this we are effectively setting every element of the HTML document to have no margins, no padding and no borders.

This can be of major benefit to you when building a website from scratch, mainly due to the fact that almost all browsers apply different padding, margin and border defaults. By applying the css shown above we are making things easy for ourselves by setting a blank canvas and stripping any elements from its previous default style. 

Pros:

  • Can increase productivity and reduce development time.
  • Could reduce your code dramatically.
  • Resets all HTML elements so they have no predefined styles allowing you to eliminate browser compatibility issues.

Cons:

  • Could put more load on you browser.
  • Technically it might increase code if not used appropriately.

Things to consider:

The CSS star hack is great for removing the margin and padding etc but don’t get too carried away. For example if you set the colour to be black, this will apply this to every element of your web page and can be very annoying. This will mean you have to set the colour on everything that is different thereafter and will increase your code dramatically.

Give it a go and see how much time and coding it can save you. I’ve never looked back since implementing it into every website I create.

Tags: , ,
Posted in CSS Tips & Tricks | No Comments »

Posh and Cosy Salon Website Design

Thursday, February 26th, 2009

Below is one of the most recent design ideas that we came up with for Posh and Cosy’s new website. The idea was to create a stylish feminine and professional looking website design to appeal to its ever growing client base (p.s as you can see its not quite finished).

Click on the image to see a larger version.

Posh and Cosy

Tags: ,
Posted in website design | No Comments »

How to Test your Websites Loading Speed

Wednesday, February 25th, 2009

After stripping and streamlining my xhtml, css, javascript, php and images for the design and launch of the new website i thought id do a little hunting for a decent website speed checker.

I managed to find ‘Web Page Analyzer‘ which is a free web page analysis tool that calculates page size, composition, and download time and gives speed recommendations based on best practices for usability, HCI, and website optimisation.

This was not only good for showing the data that i was after but it highlighted files that were larger than first expected and pointed out a couple of small but non important errors.

Give it a go.

Tags: , ,
Posted in Website Design Tools, website design | No Comments »

Favicon: How To Create A Favicon.ico

Wednesday, February 25th, 2009

favourite-icon

Personalise your site by creating your very own icon, removing the standard browser icon such as the I.E or Firefox logo. This will change the icon not only on the browser tabs but when a user adds your site to their favourites.

Step 1 – Design your icon

Simply design and image that you want to use (standard is  16 x 16 px).

Step 2 – Convert your image to a .ico file

Once you have created this icon simply convert this to an icon. There are a number of ways to do this. Download/Purchase software to create .ico files alternatively visit http://www.html-kit.com/favicon/ and create your own free icon by simply uploading your image and downloading.

Step 3 – Upload your logo

Once this has been done and you will need to put your favourite icon in the root of your website. e.g. www.mysite.com/favicon.ico make sure you keep the file name as “favicon.ico”.

Step 4 – Add the following code

In your webpage document simply add the following code anywhere within the <head> tags.
<link rel="shortcut icon" href="favicon.ico" mce_href="favicon.ico" />

or if you need it to work on a number of pages within folders simply link to the file direct.

<link rel="shortcut icon" href="http://www.zenduo.co.uk/favicon.ico" />

And its as simple as that!

Tags: ,
Posted in Website Design Tools, website design | No Comments »

Alcatel Speedtouch Vista Drivers USB PPP & 330

Sunday, January 25th, 2009

If you have an old Alcatel Speedtouch usb modem and are having the same problem as i had when installing Windows vista try downloading the driver from the link below.

http://www.speedtouch.co.uk/downloads/330/301/st330_3012_windows.zip

Before installing it make sure you unistall all other versions and drivers and restart.

Then Simply unzip the file and run the install file and all should be ok after that.

Tags: ,
Posted in Other | No Comments »