Website design services

Outline of what we did

The new website had to graphically last for many years resulting in no need for the client to redesign in a few years time. The website is aesthetically and technically well built, that uses 1 of the best HTML/CSS frameworks available. We handled the client’s content putting a lot of effort into maximising the clarity, quality and structure of all the different sections and content. We presented and structured information in a way that gives people potentially looking to commission their planning services, the information they are going to want to know and need, in a quick and precise manner. This was especially true for the Project Examples section, that was edited more than 30 times. When doing user feedback, a main point with the old website and with many town planning websites in general, was that they do not display their telephone number in an obvious and blatant enough way, often hidden away and difficult to find. So what did we do?, we put their telephone number along with an icon, in the footer of all of their webpages. The website is also highly accessible and usable, here are some features: adherence to good practice in graphic communication design, fully Google friendly, all webpages pass many of the W3C (World Wide Web Consortium) Web Content Accessibility Guidelines (WCAG) requirements at levels A, AA and AAA. We tested all webpages with various screenreader software and there is also a skip navigation option. They also do public consultations and need questionnaire forms designed and setup, that then send the user’s responses and data back to them by email. The website appears simple, but is surprisingly complex and contains a lot of content. We also monitor the website’s performance from time-to-time over the year, against new website design and accessibility standards, technical updates, bugs, and potential security issues. This website ticks many design quality boxes and gives them every chance of success, echoing their professional and credible service.

3 main improvements for them

• A website that works well on mobiles and tablets. Their previous website did not work well on mobiles.
• Using advanced information design methods, we increased the chance of satisfying people who may commission their services, leading to more chance of new business enquiries.
• 1st page on Google’s search results for 7 relevant keywords.

Award shortlist

• Shortlisted in the Corporate Design and Communications category (in the top 10 entries within this category) in the International Institute for Information Design (IIID) Awards 2020. You can read a full case study (PDF).

Details

Webpages: 75 • Images: 265 • Website code technologies: HTML, CSS, XML, JavaScript, jQuery, JSON, PHP, server-side website statistics, WAI‑ARIA.

Designed a plan, for built to last credibility

Outline of what we did

Working in close collaboration with the client, we started by doing updates to the content and links, but then redesigned in places, pulling-out out and visualising the content, by using images and better typographic design, rather than having just text links or links to PDFs that does not tell users what was going to be on the linked webpage, or what was inside the PDFs. We worked on the text content, suggesting new text and additions, and also amended many corrections from the client. We strengthened and added colour to the client’s website, although not too much, as to not overpower the content and work. We optimised the folder and image names, and the file names and titles within the PDFs, to give the client’s content the best chance of being found and searched online by search engines, improving search engine optimisation (SEO). Some of the navigation menu buttons were reworded to better describe what was on the subsequent webpage, giving users a more accurate idea of what to expect in each section. The website also has many accessibility and dyslexia-friendly features. Furthermore the website’s web fonts are very interesting, and use the client’s own specially PhD researched, tested and designed dyslexia typefaces: Sylexiad Serif and Sylexiad Sans, how cool is that? Another unusual aspect was the research, rewrite and plain English edit of the end‑user license agreement (EULA) for all the client’s typefaces. These types of small print documents are usually lengthy, written using complex terms and descriptions, and are not inviting to use or easy to understand. We removed unneeded text, rewrote and added updated terms and conditions. We also added coloured bullet lists to help increase the appeal of this dry, dull and boring document. The result is something that has a much higher chance of being read and may actually be more joyful to read…

For the 2nd stage, the client decided the Examples/Showcase webpage that used purely text and bullet lists that linked to PDFs, needed more work. So, we suggested the large task of saving‑out images from the many PDFs, and inputting them into various grid structures on 2 new typeface Examples/Showcase webpages. The result was 2 Examples/Showcase webpages (client and personal) that visualise the client’s personal work and other people’s work who use his typefaces, in a more visual, obvious and explanatory way.

It might sound incredibly straightforward and basic what we did, but the result is a much better aesthetically, technically and functional website. There was much work done that is nearly invisible, that goes on in the background to bring about civilised order.

3 main improvements for them

• Cool, clean, precise and functional design to show-off the client’s information and work, that does not overpower.
• 51 (0 previously) transformational revisualisations of the client’s work and projects.
• Web Content Accessibility Guidelines (WCAG) accessibility and dyslexia-friendly design features, to help make the website robust and easier-to-use for a wide-range of people.

Details

Webpages: 20 • Images: 165 • Website code technologies: HTML, CSS, XML, JavaScript, WAI‑ARIA, Google Analytics, server-side website statistics.

Classy creativity and practicality

Outline of what we did

We designed a website that is relevant to the client’s content and purpose, reinforcing their quality resource. We used an XML video sitemap to help their promotional video get found. There was technical work that needed to be done on old PDF publications, and reproduction work on new photographic material. With the client, we researched and decided upon a pro web font that reflected the charity’s activities well, that was equipped with small capitals and oldstyle numbers. We also put in an interactive map of interest points along New Walk, and things to see and do. This feature is likely to be of high interest and value for the public, and a useful feature when considering to spend time or take people to New Walk. The more useful the website is, the more chance people will use it and get something out of it. Much work was done on accessibility issues, along with the creation of a detailed website accessibility statement. 1 notable accessibility issue was that we put in subtitles for their promotional video (better for people with hearing difficulties or who use screenreaders). We also monitor the website’s performance from time‑to‑time over a year, against new website design and accessibility standards, technical updates, bugs, and potential security issues. We provided a robust solution and support at every stage.

3 main improvements for them

• Saved the client 66% (⅔) on their yearly website domain name and hosting bill, by helping them move to a better quality and cheaper supplier, with even more features than their previous supplier.
• Gave their website users more information and a better chance of exploring and understanding New Walk.
• A website that passes many of the W3C (World Wide Web Consortium) Web Content Accessibility Guidelines (WCAG) requirements at levels A, AA and AAA.

Details

Webpages: 19 • Images: 58 • Website code technologies: HTML, CSS, XML, JavaScript, jQuery, JSON, server-side website statistics, WAI‑ARIA.

Gave their users information needed for improved action and experiences