Website Design Studio

Welcome to Erika’s Web Design Part of CFD & IP Ltd.
We specialise in producing user-friendly personalised websites using the latest XHTML and CSS standards.

We offer a complete package from photography and graphic design through to website building, maintenance and hosting. We have in-house computer expertise covering a wide area.

Although based in London, we also work for the holiday industry in Cornwall and will accept assignments anywhere.

Please view our portfolio of sample websites and if you have any questions do not hesitate to contact us either through the contact us page or by telephoning 01720 458193.

Background
Erika has a MA (Hons) in Fine Art at Central Saint Martins College of Art & Design in London. In addition to her artistic background, she has a good eye for retailing and marketing, having been a manager at Selfridges on Oxford Street and been heavily involved in visual merchandising.
Sample Websites Here are a selection of websites commissions which have been undertaken. Please roll the mouse over the images to enlarge or click to visit the websites. You will see that the websites are custom built and can reflect your individual requirements.

Classy Cottages This large website has 200 pages. Features include: New Logo & Photographs, Online Booking Form, Rollover Floor Plan, Contact Form, PDF Map, Notice Board and Tariff Database.

Hamar Acrylic This small website has 6 pages. Features include: Design background, Vectorised Logo and a new Map.

Lerryn Cottages This website has 7 pages. Features include: Website Design Graphics, Rollover customer’s photographs, Contact Form, Notice Board and 3 PDFs (Tariff, Map and Directions, Booking Form).
Sample Prices Here are two websites: Pink Cottage and Yellow Gallery with a fixed price. You can also have any other modification at an extra cost

Pink Cottage . . . . . £230 This website layout has been purposely designed for a single self-catering cottage with six pages:

• Design header banner
• Home welcoming
• The cottage
• Photos
• General information
• Notice board with Client Editor Site
& sublinks to 3 PDFs
• Contact pages

Yellow Gallery . . . . . £310 This eleven page website has been designed to display photos or images:

• Design header banner
• Home welcoming page
• Four different gallery webpages
• Total of 33 photos on website with six photos per gallery page
• Two Sublinks
• Contact form page

Design header banner This gives your website an individual look and design combining your company logo, name and colors

Client Editor Site Allows you to change the text on any page of your site. Gives you the freedom to update or change the information you wish to give your clients at the click of a button. With an annual fee of £20 inclusive for the first year.

Photos Each page has a pre-sized photos with the height and width of each photo display in the middle.

Text Boxes The text boxes have a pre-sized number of characters across and lines at the top left side of each text box.
Build Your Own Website An easy way to design your own website within your budget

Simply select from the 24 page layouts below, we will add your content, colour and customized the website to suite your needs.

– Initial website set-up is priced at £70
– Set-up fee includes one year’s hosting, one UK domain name and ten email addresses

 

BBC Iplayer

There are quite a few user experience mistakes during the building phase for a range of devices. These are mainly due to still thinking from a desktop point of view, when information can easily be related and arranged to guide users
through the online experience, or it’s because the design and build has become too focused on what is technically possible and lost sight of what
would be best for the user. It goes without saying that the navigation
of a website is vital and problems here are normally caused by the navigation being The BBC iPlayer website has undergone substantial development over the past year. This seems to been more of an evolution than a rebuild, and this
approach has led to a very well-considered solution. The navigation is separated into two, one for global BBC sites and one for navigatingwithin the iPlayer. This approach enables users to switch between a range of BBC sites
seamlessly and reduces the amount of navigation items required within the iPlayer navigation itself. Instead of showing everything in a collapsible menu as the screen gets smaller, the iPlayer navigation keeps the key items
immediately available, and even on small screens the channel menu remains.
The slider section is available on larger screen sizes including some tablets, it uses draggable touch interactions as well as hover interactions when using a mouse. This is an excellent example of the UI that considers specific input and
method support of the device or browser being used.
New interface, new experience complicated on desktop layout, and in turn being extremely difficult to support on smaller screens. It is standard practice to switch the main navigation to a collapsible menu, but it is a good idea to keep the most popular top-level links visible for as long as possible. If the website has multiple levels of navigation, a slide-in menu works well and you can leverage swipe interactions to make it easy to use.
Make sure that a navigation menu containing lots of images that takes up more than the screen area is avoided. This ensures that users can always exit the navigation easily. Additionally it is important to keep any navigation icons
aligned with best practice symbols as much as possible for user familiarity. It can be infuriating for users when there is an interactive element such as a slider that isn’t draggable on a touch screen. Instead of relying on button controls to move information around within the UI, make sure touch interactions are used on the UI elements themselves.
This is much more intuitive for users and is always the first thing they will try. Any elements that have click events bound to them should use a touch event
when available (for example touchend). When a click event is triggered on a touch screen the following events are fired in order: touchstart, touchmove, touchend and click. The time diff erence between touchend and click can be as much as 300ms – this may seem small, but within a UI it makes a huge difference in how responsive the UI feels when using it. When using a desktop computer, a form with many fields is easy to digest due to the space permitted by the screen size. As screens get smaller, forms can get unwieldy and difficult. This will impact conversion rates of your forms, which are core business drivers of websites. To alleviate these problems forms should be broken down into smaller, logical sections and the progress through the form indicated to set the expectation with the user. Additional enhancements, such as field prompting and location lookups, can make the process easier.

Master Google’s best APIS

Software is an unique product in that it can be multiplied with minimal cost. Once the development has been footed, adding new installations tends to be an issue of purchasing extra hardware. Google has used this very approach to produce a variety of APIs, providing web designers access to building
blocks used for the realisation of its own services. Some of them are, fortunately for us, made available for free: Google willingly foots
the bill in order to tie developers closer to its own ecosystem.
In addition to the eventual introduction of monetisation (well-established APIs tend to stop being free when enough people use them), Google furthermore profits from the ability to get its APIs stress-tested by third parties without
needing to pay them for their work. Another, possibly more sinister, benefit
though involves additional access to customer data. If a website generates graphs and other features using Google’s services, then the search engine can track user movements and site retention times more efficiently. It would not surprise us if this data somehow found its way into search engine rankings. For example, a scammer with a well-placed but content-poor website could give himself away via the very short visit duration. But let us throw caution to the wind for now though – in all fairness, the possibilities offered are far too great for us to simply pass them up. Look forward to effortlessly creating diagrams
and graphs, handling sign ins automatically, renting databases on an as needed basis over the next few pages in our list of top APIs. If you can name it, it’s likely that Google already has you covered. Mobile AMP pages.
Making users sign in is a sure-fire way to lose them: creating a new account is an extraordinary level of hassle. Many users will simply switch off or close the tab at the sight of such a page – they want to get content there and then, without having to wade through username and password boxes. But by using Google’s sign-in system, we can mitigate the problem by permitting users
to log in with their already available Google account. Getting started with most
Google APIs requires you to sign up for an account in the Google Developer’s console (http://console.developers.google.com). Next, create a project and open the subsection APIs&auth and click the Credentials subtab. Then,
create an Auth ID. If you created a new project, the Developer Console will now ask you to configure the Consent screen: the information entered here will be displayed to the users as your app authenticates. Then, you just have to create a client ID for a web application – don’t forget to fill out the authorised URL fields with your testing and deployment URLs in order to prevent Google from blocking the app. Google will then reward your efforts by generating a client ID
and a client secret. In the next step, a test must be hacked up. Its structure is relatively simple – it loads a script, and runs an on SignIn-Method when the login process is completed.