Peppercorn Blog
Archive for the ‘Coding Practices’ Category
Captcha Code
April 23rd, 2010
With SPAM mail causing such a problem to most email users, web designers can add a small piece of code to web forms they develop that stop form scripts being used to send SPAM mail.
We’ve all seen the small graphics with letters and numbers that we have to read and enter into the form before we can send it. This is called a “CAPTCHA” code and if the letters and numbers entered, do not match the code, the form will not submit.
Computer programmes and robots can not read these images so there is no way to by-pass the code and send out unsolicited emails using scripts from your page.
There are many types of Captcha codes available on the Internet now so web designers have a large variety to choose from. This is a simple and effective way to stop SPAM being sent from your pages.
Peppercorn to Prototype Websites
December 22nd, 2009
Peppercorn is now using a new prototyping tool to develop front-end and CMS areas of websites it is developing. By developing sites in a usable, clickable format for our clients to view, feedback, amend and approve we are sure this will make the development process easier for us as web designers and our clients as they will be able to see exactly what is to be delivered in a working model before its coded.
Peppercorn always strives to ensure customer satisfaction and is always looking for new ways to improve our service. Any feedback is appreciated!
Google Page Speed
December 8th, 2009
There has been talk recently that Google will soon be using website speed as a major factor in determining search placement. While this is not yet confirmed there is a new tool available from Google that may help in making your site run even faster. Almost all of the points that will need to be optimised will have to be completed by your web designer.
Downloaded Google PageSpeed using the link below:
http://code.google.com/speed/page-speed/download.html
In addition to this, Google has now outlined its own best practices for website development here:
http://code.google.com/speed/page-speed/docs/rules_intro.html
Web designers should be aware of these new practices especially if SEO is part of the website development.
Font Control With sIFR
November 24th, 2009
sIFR allows web designers to replace short passages of static text with text rendered in your preferred font in a search engine friendly manner. It does not matter whether users have that font installed on their systems. This is achieved by using javascript, CSS, and Flash.
A very short delay can occur while the page is loading but the impact is minimal and offer website designers much more opportunity to work with various fonts within websites they build.
Search engines are still able to spider websites that use this technique and do not have any issues with it. For a live example of this technique, keep your eye on www.peppercorn.co.uk as we have integrated this with our new website design.
JavaScript and modal windows
October 30th, 2009
JavaScript has evolved in leaps and bounds from its first appearance in 1996. It was designed to give web designers the ability to add interactivity to HTML pages, and the very simply syntax has given designers a nifty programming tool.
In this article we discuss JavaScript generated modal windows. A modal window is basically a window that floats above the page, and requires the user to interact with it before they can return back to the page.
This prevents many advantages to a web page layout. For example, the modal window can present a smaller element – such as a login form – over the page, instead of an entirely new page to display the smaller element. This approach allows website designers to save space by not displaying elements on the main page until requested by the site visitor.
With numerous scripts available, implementing modal window elements has never been easier! To get started here are three scripts well worth looking out:
- Shadowbox.js : http://www.shadowbox-js.com/
- Lightbox2 : http://www.huddletogether.com/projects/lightbox2/
- Highslide JS : http://highslide.com/
Here are some examples that Peppercorn Web Design have used of the above scripts and modal windows to present hi-resolution images:
Tempest Shop : http://www.tempestshop.com/
Each product thumbnail image links through to their hi-resolution counterpart. The Lightbox2 script was used for the modal window.
Willbox : http://www.willbox.co.uk/
In the Gallery page we have used the modal window to present multiple hi-resolution images for each product. The site visitor can view all the product images by using the numbers presented in the bottom left hand of the modal window.
The Shadowbox.js script was used for the modal window.
Business Edge : http://www.businessedgeltd.co.uk/
In this final example we used the Highslide JS script. This script offers additional functionality whereby the site visitor can move around the modal window to continue reading the text underneath.
Modal windows can also be used to present contact forms, videos, sign-up and log-in forms, alerts & notices, help elements & tips, search boxes, PDFs and web pages!
For the Digital Directory project (http://www.digitaldirectory.info/) we were supplied a PDF form that was to accessible from their holding page. The use of a modal window to present the PDF form meant we could still present more features from the single page.
JavaScript has evolved in leaps and bounds from its first appearance in 1996. It was design to add interactivity to HTML pages, and the very simply syntax has given designers a nifty programming tool.
In this article we discuss JavaScript generated modal windows. A modal window is basically a window that floats above the page, and requires the user to interact with it before they can return back to the page.
This prevents many advantages to a web page layout. For example, the modal window can present a smaller element – such as a login form – over the page, instead of an entirely new page to display the smaller element. This approach allows us to save space by not displaying elements on the main page until requested by the site visitor.
With numerous scripts available, implementing modal window elements has never been easier! To get you started here are three scripts well worth looking out:
§ Shadowbox.js : http://www.shadowbox-js.com/
§ Lightbox2 : http://www.huddletogether.com/projects/lightbox2/
§ Highslide JS : http://highslide.com/
Here are some examples that Peppercorn have used of the above scripts and modal windows to present hi-resolution images:
Tempest Shop : http://www.tempestshop.com/
Each product thumbnail image links through to their hi-resolution counterpart. The Lightbox2 script was used for the modal window.
Willbox : http://www.willbox.co.uk/
In the Gallery page we have used the modal window to present multiple hi-resolution images for each product. The site visitor can view all the product images by using the numbers presented in the bottom left hand of the modal window.
The Shadowbox.js script was used for the modal window.
Business Edge : http://www.businessedgeltd.co.uk/
In this final example we used the Highslide JS script. This script offers additional functionality whereby the site visitor can move around the modal window to continue reading the text underneath.
Modal windows can also be used to present contact forms, videos, sign-up and log-in forms, alerts & notices, help elements & tips, search boxes, PDFs and web pages!
For the Digital Directory project (http://www.digitaldirectory.info/) we were supplied a PDF form that was to accessible from their holding page. The use of a modal window to present the PDF form meant we could still present more features from the single page.
