CakeDC Blog

TIPS, INSIGHTS AND THE LATEST FROM THE EXPERTS BEHIND CAKEPHP

Basic CakePHP markup for designers

This article assumes you practice semantic markup and have a fairly good understanding of CSS.

CakePHP does a number of things automatically that designers might not expect, which can cause confusion for designers and difficulty for developers in implementing markup. I hope to provide some general purpose information and guidelines to designing for a CakePHP site. I would like to make a couple quick notes first however. CakePHP is a very flexible platform where markup can be re-used very easily. The more you as a designer try to make reusable markup, the easier your developers life will be. One of the most important things that you can do is to avoid id's other than for top level wrappers such as columns. This allows the developer to change content to address shifting specifications without having to rewrite chunks of CSS in order to avoid Id conflicts in the generated markup.

CakePHP has a flexible output system that lets developers easily specify how output is generated. Unlike some applications such as older CMS systems which have a specified header and footer that are called before and after the content, Cake applications render their (x)html into a layout. Two main types of output are rendered into a layout, Views and Elements. Views are the page specific content, such as a blog post, or an entry form. Elements are blocks of markup that can be used across multiple pages, and can be used in the layout, in the view, or even from inside another element.

Form related tags can appear in any of the output region types, but it is helpful if you as a designer try to avoid having forms span multiple elements or different sections. Doing so makes it much easier to ensure that the form will work correctly every time it appears. By default most form elements are wrapped in a div with descriptor classes such as “input text” for a text field. Check boxes, and radio buttons are wrapped in a fieldset instead of a div. Also by default the form helper automatically generates id's for the form input widget, and a label that matches it. This is another situation where it is easier to avoid an id attribute and use a class name as a designer. If you specify and ID, your developer has to check that it has not been used in CSS to specify a style, or choose to override it with your specified value and loose flexibility in the future.

Examples of form widgets:

Select box:


 

Blog blog.

Text field:


 

Title

Check Boxes:


 

Status

Published

Allow Comments

Moderate

 

The other CakePHP core utility that generates a fair amount of HTML is the paginator helper. While the helper itself has been covered on the bakery before and is worthy of several blog posts itself, I'd at least like to touch on the default markup generated by the helper.


 

You can easily specify a string that will appear in between the spans, and each of the other elements are called separately, so they can be in other spots on the page, or have markup between. Unfortunately it is not easily possible to remove the span from the markup, but it would be fairly easy to change the pagination output to something similar to this:


 
Latest articles

Simplicity is important - here’s why

When it comes to web design, simplicity is not valued enough. Simplicity is important - but why? Simplicity reduces navigation confusion, makes the website look more sophisticated and can help in increasing site conversions (sign ups, contacts). All too often, web designers tend to miss the point of simplicity and over do the amount of information given on a single page - the need to get everything across at once can seriously hinder how much a website visitor is able take in. Over complicated pages can lead to higher than average bounce rates or lower on-page conversions. We thought we’d share with you some top tips to simplify your website.

  • Keep things along the 80-20 rule
    • Use the Pareto principle which is that 80% of the effects come from 20% of the causes. This means taking away as much as you can from your design that will not lead to any type of conversion. Take things back to the bare essentials and make those work properly
  • Embrace few colors in your theme
    • Does a monochrome color scheme work for you? If not, try out as few colors as possible. Work towards a design that requires less effort for your website visitor to process. Fewer colors will also give your site a sleek, classic look
  • Keep copy short and sweet
    • Embrace compelling copy but keep things shorter and to the point. Make your point quickly and keep things easy-to-read by sticking to a few key points. Use shorter sentences, and keep paragraphs to a maximum of 3-4 sentences for easy reading.
  • Fix your navigation
    • Often many sites have over complicated and lengthy navigation options. Remember to include navigation to your list of things to simplify today. Keep important and key pages in your navigation bar. Remove excess clutter and keep all navigation menus visible. Other key things to keep in mind is the use of universal icons as well as ensuring a sitemap in your footer - these are all standard items that visitors look for.

How Much Does it Cost to Design a Site?

If you are in the market for a website or application, it can sometimes be daunting. Being unsure of where to start, which development firm to use or how much the whole process is going to cost you can be truly overwhelming. And then there are those horror stories of others, who selected a developer based solely on cost (the cheapest quote perhaps) and ended up majorly down the hole with their budgets, while owning a unfinished website. Whether you are in the market for a website application with a specific outline and goal, or have a rough idea of what you need your application to do, how do you go about finding the best selection for you? And then how do you know that whoever you select is going to deliver what you want and in the time frame that you need it? And then, not knowing how to code yourself, you can land up frustrated at not understanding the process - especially if your development team gives you the runaround. At CakeDC, we are committed to a transparent workflow - we've created our own git workflow (MIT license) and we've used it successfully with our clients for 3+ years and dozens of projects. We use it to accelerate growth and innovation providing the highest quality application development. What sets CakeDC apart from others is that our experts listen closely to your needs. Second, we formulate a roadmap of milestones based on your specifications. Third, we offer guidance while delivering the highest quality results in a fraction of other developer’s time, by doing things The Right Way™ So how much is it going to cost you? Well this is of course dependent on what you project scope includes, however, we will work with you in determining the best package to suit your requirements. You can check out all of our rates and packages here. Ready to get your project started? Reach out to our experts today to see how easy it can be to get your application up and running.

What your website users are trying to tell you

Every visitor to your website has a goal in mind - this may not be a conscious goal, but they are visiting your site for a reason. So listening to your users feedback is key to meeting their expectations! As a business owner, be sure to keep these in consideration and as a developer, be sure to pass these recommendations through to your clients. What are some things that users are trying to tell you and how do you find out? What and why is it Often people forget about the basics and fail to include what their product, service or business is. By excluding this vital information there will be users who will not know what the purpose of the page that they have stumbled upon is, but what to do next - and therefor bounce quickly off of your site. Where is your pricing information? If you are trying to sell something - a product or a service - be sure to include the price information as this is used by your visitor to determine their next action. Even if you are providing resources in return for their details, it is important to be clear. Where are those testimonials or reviews? Have others tried it People like to know that whatever they are investing money into is worth it - reviews or customer testimonials help to show your visitors what you can do. Be sure to add this information in a way that is easy for you visitors to find. Where can I sign up or contact you Another vital piece of information that many often forget is to let your visitors know how to signup and contact you. Perhaps you have chosen to hide your contact information due to spam bots or other issues faced, however, if you are in the business of recruiting clients, then be sure to have some form of contact information easily available to your visitors.
Not sure if you are missing anything? CakeDC, the experts behind CakePHP, offer a range of services including consulting, guiding you through the best practices with your CakePHP application.

We Bake with CakePHP