I am a PHP web developer who specialises in front-end coding. This is my blog and portfolio.

Deep Lauch Deeplify (Deep’s new CMS)

January 27th, 2010 by Peter Sofocleous

Deep today launched Deeplify.com - our new Content Management System (CMS).

We have been working on our new CMS for some time now and its finally ready to share with the world. We took our existing CMS (DeepAccess) and rebuilt it from the ground up. To start off with we built this with Subversion. We did this for a few reasons including so all the developers at Deep could develop simultaneously and we could track changes across different versions. The next change we made was to change the entire structure of the CMS. Our biggest problem was knowing what version of DeepAccess was on what website. Also if some bespoke changes were made to a client you could then not update the CMS without a significant investment (in time & money). So with Deeplify we introduce a centralised core. All our PHP classes and all the HTML for the CMS are centralised. This means if we want to upgrade a file or find a bug we can update it once and it will be upgrade all our clients. No more comparing files and wondering if the world will end if we overwrite something.

A key area of a CMS is how well it can optimise its content for search engines. With Deeplify we have built upon our existing SEO capabilities and expanded it not only in features but in ease of use. Deeplify now supports browser titles, meta keywords, meta descriptions, HTML sitemap and XML sitemap. We have also included a feature to allow the user to view and modify their titles, keywords and descriptions all on one page. So this is much more time saving than the old loading of each page, check the SEO and modify. The HTML and XML sitemaps are also live data. So if you add a page you do not have to regenerate your sitemap.

One of the most impressive features we have developed is called “Live Edit”. An issue some people have expressed is that they type the text content for a page in the CMS and when they come to look at it on the website it does not look the same. This is because the template and stylesheet are separated from the back-end. DeepAccess could preview pages before they were published. So we took this and incorporated it with some fancy coding. Now in Deeplify, double clicking on a text area (in Live Preview mode) launches a popup WYSIWYG editor which updates the page text live as you type. Users can see exactly how the text will render and where it will break on the page. We have received excellent feedback on this feature and we hope to expand on it soon.

DeepAccess also had module based permissions with actions (like add, edit, delete) for each one. We found this was a little to complex so we simplified this. For added security we placed the permissions check on the PHP class rather than in the PHP that was calling the class. In Deeplify, simply drag and drop the module you want a user to have access to.

We wanted to reduce the amount of bespoke work we made for clients. Most of the time we were making a list of one form or another… a video manager, a news manager, etc. So we developed a List Manager. It allows us to create a list by defining its data structure. Then the list appears as a normal module with Deeplify which they can populate with their content. This module is extremely powerful as it means we do not have to code new modules every time we make a website.

Just a couple more features we added. You can now upload multiple files to Media Manager rather than one file at a time. Also we developed a backup module, so you have backup the menu, content, settings and media manager before the user makes any drastic changes. These backups can be restored at any point to roll the website back to an earlier version.

To conclude we feel this is a vast improvement on DeepAccess and we hope it pushes Deep to the next level. Have a look for yourself at www.deeplify.com

Deeplify.com [Home]

Deeplify.com - Home

Deeplify.com [About]

Deeplify.com - About

Deep Launch Golf Live

October 15th, 2009 by Peter Sofocleous

www.golfliveevent.com

Watch Learn and Indulge your Passion

Brand Events, one of Deep’s existing client which host events such as Top Gear Live (live.topgear.com) and Taste Festival (www.taste-festivals.com) have created a new and unique event.

GOLF LIVE is a new event to be held at Stoke Park on May 14 – 16, 2010. This truly engaging event is designed to give amateur golfers of all ages and abilities the chance to indulge in their passion by watching and learning from the best in the game. Leading professionals and coaches will host instructional theatres based around specific golfing skill sets such as long-game, short-game, bunker-play, chipping and putting.

The website is an integration of XHTML, FLash and Ajax to deliver a stylish and slick website. I used jQuery (www.jquery.com) as opposed to Yahoo’s YUI (developer.yahoo.com/yui) and I have to admit I found it lightweight and performed very well. Have a look for yourself.

Golf Live :: Home Th

Golf Live :: Home

Golf Live :: Talent Th

Golf Live :: Talent

Local Government Channel

May 9th, 2009 by Peter Sofocleous

Deep was commision by WebsEdge to redevelop the Local Government Channel website. Our brief was to add to the existing functionality while giving the website a completely new look and feel.

www.localgovernmentchannel.com

With 500+ large videos (640×270 pixles) across the website, bandwidth is a definite concern. We decided to use AJAX to break up the website into sections. Each section is only called when its required thus saving on unnecessary data transfer. With a website so heavy, efficiency is a must. We spent some time optimising and improving the speed not only of the data processing but the delivery of that data. The videos are on a seperate server so that streaming has no bearing on the server load. We are caching PHP functions, MySQL queries, and HTML output. We are even caching friendly URLs.

The redeveloped website had to be ready for May 4th to coincide with the start of the annual “Council Worker of the Year” awards hosted by the Local Government Channel website.

Local Government Channel [Home Thumb]

Local Government Channel - Home

Local Government Channel - Awards

Local Government Channel - Awards

Deep Launch Brand Events Website

February 7th, 2009 by Peter Sofocleous

www.brand-events.com

We bring brands to life and inspire
consumer passions through live events and experiences.

During January 2009 Deep launched the new Brand Events website. This website incorporates several different technologies to bring together a website which reflects the personality of the team – fun loving, yet hard working and promotes their top global brands such as Taste Festivals and Top Gear LIVE.

Firstly we had to construct a Event Manager which allows Brand Events to add all their events they hold across the world. This data is provided in XML format for use on the homepage (www.brand-events.com/) and in a PHP array for the calendar page (www.brand-events.com/events_calendar/).

Several pages across the website are flash based. For these a text only version is running in the background. On the homepage we had to construct a 3D model and animation of the world and plane. These for put together and incorporated with data from the events manager to give the user a more interactive experience. On the event calendar we had to find a way to display all the events for a country, event and date. We did this with a table of data with events marked against the year’s months. We used Yahoo YUI to make the JavaScript animation requires to show this data on a mouse over action. All this data for the events is also written in the mark-up to enable Search Engines (like Google) to index.

One of the biggest challanges with this website was the fact that it is designed to a four colomn grid with rounded corners added to some areas of text and to all images. This might not sound as a big deal but when you need the entire website to be content managable by the client without them having any HTML knowledge. We decided the best approach was to modify our WYSIWYG editor in our CMS (DeepAccess) to automatically position images and to allow the use of code snippets to handel all the rounded corner text blocks. By the end this enabled us to content manage a conplex design with relative ease.

Brand Events - Homepage Thumb

Brand Events - Homepage

Brand Events - Who We Are

Brand Events - Who We Are

Top 10 SEO tips

November 9th, 2008 by Peter Sofocleous

In the last few years through trial and error I have found certain things that make a difference for Search Engine Optimasion (SEO).

  1. “Update your Homepage”
    Your homepage is the most important page. If its identical every time a search engine comes back then a search engine will come back less often thus dropping your ranking. Adding a latest news feed on your homepage can do wonders for your ranking. Although your homepage is the most important the rest of the website should also be updated as often as possible.
  2. “Content”
    If you want to have a good ranking you need to give a search engine what it likes… That’s plenty of content to munch through. Again make sure your homepage has at least 200-300 words on it. For a search engine, information is king. The more relevant information your website has to offer the better your change of getting a good ranking.
  3. “Relevancy”
    Its important that you browser title, meta keywords, meta description, page heading, and page content all are relevant with each other.
  4. “Linking”
    A search engine needs to be able to get to every page on your website. A menu with the submenu hidden which expands means a spider needs to go several levels deep to get all the pages. Having all the links on the page and potentially using JavaScript to hide the sub menus is one way to get all your links on the top level.
  5. “Webmaster Tools”
    Google and Microsoft both provide free tools for managing your listings. One of the best things you can do is create an XML sitemap for your site and then use the tools to tell the search engine where to find it. (Google Webmaster tools, Microsoft Webmaster Centre)
  6. “Structure”
    Think about how your page is layed out. A page should be coded in a logical manor. Starting with Logo, menu, H1, content, H2, content, H2, content, H3, content etc.
  7. “Accessible Pages”
    Making your page accessible not only means it can pass WCAG (Web Content Accessibility Guidelines) tests but it also gives a search engine a lot more information about your page. For example an image without an ALT tag is useless to a search engine. Links should have titles on them. Tables should have summaries on them. Basically every none text element should have a text description. Get a report on your website.
  8. “Validate your Website”
    Goto W3C to analyse HTML and CSS. Here are the links to the W3C’s HTML Validation Tool and CSS Validation Tool.
  9. “Optimise”
    Every page should be unique. That means, the browser title, the heading, the meta keywords, the meta description, and even the content should be unique. Optimise each and every page.
  10. “Friendly URLs”
    Assuming your server supports this, its a must. It can turn an ID based URL into something readable. This also increases the pages relevancy for a search engine. For example a page called /index.php?id=123 gives you nothing for search engines however with Apache’s Mod_Rewrite that page can look like /contact_us/ which gives search engines something extra to rank the page on.