you are at: home / Professional services / Design to XHTML/CSS

Design to XHTML/CSS You design it, we program it

Tons of HTML and CSS code have passed through our brains and that is why we know how to do it right. We code meeting all standards and making sure that a perfect separation between content and its visual appearance is achieved. We use semantic code to assure accesibility and SEO.

We also offer counseling to improve the navigability of your graphic creations, easy information access and site usability.

Web environment has certain restrictions when compared to graphic design applications. Therefore, we can not always pixel-pin designs, but we are close.

Some recommendations:

Fonts

There is only a limited number of standard fonts that you can use. This is one of the great advantages offered by flash with respect to plain XHTML. Even though texts can be substituted by images even in a dynamic way using sIFR or flir, we do no recommend this practice. In no case it is a good idea to use these tools for every text appearing on a web page.

It is accepted that banners, logos, buttons or titles will be shown as images or flash movies with the selected font by the designer. For all the rest, these are the main available fonts:

Arial, Helvetica, Arial Black, Comic Sans, Georgia, Impact, Lucida Console, Monaco, Lucida Sans Unicode, Lucida Grande, Palatino Linotype, Book Antiqua, Tahoma, Geneva, Times New Roman, Trebuchet MS, Verdana.

There is not too much to chose from , is there?

Size of design

Added to bars and browser's menus, target screen resolution is another issue to be taken into account.

A browser use and resolution statistics section is maintained in W3Schools. Statistics are not too reliable since the type users visiting a web site can vary considerably depending on the context. For example, msn.com use statistics will show a high Internet Explorer percentage and apple.com will reflect a high Safari percentage.

W3Schools is frequented by web design professionals and, in our opinion, it reflects higher statistical use for Firefox.

After figure analysis, we have come to the conclusion that the most popular size is 1024x768 pixels. By eliminating space taken by browser toolbars we get and extra working space of some 1000x670 pixels. This is all just speculating because each user has his/her own personalized toolbars and the browser window is not always maximized.

On the other hand, maximun width and height sizes loose importance when we think about more flexible, fluid or changeable, or however you want to call them, size design.

Anyway, if you want your design to be fully viewed in most screens without any scroll bar nor fluid designs, 1000x670 pixels is your working area.

Accepted formats

We accept any professional format: PSD, Freehand, Illustrator and so on. We quickly adapt to any material delivered to us although we have some preferences:

  • Separate files for each screen.
  • 72ppp RGB.
  • An assistant document, PDF when possible, with screen shots and explanations about unobvious function and animations.

User interface

When designing we also have to think about the functional appearance and usability of the web page. This might sound very obvious but  "last minute changes" happen too often because nor the designer nor any of the persons who take part in the creation process thought that the user might have needed a search box.

There are many elements in the user interface that make pages more usable and, therefore, information is easier to find. This makes the user want to spend more time in your web site. Such elements are: filtered lists search boxes, tags, tag cloud, pagination, slideshows, etc...

We Humbly recommend the UI designer to use references, which means finding existing web pages with similar functions and noticing the solutions applied.

Animations

Animations can be useful and can improve the user's experience depending on the context. But they may also be unnecessary and annoying. As a general rule we could say:

  • Users want fast information access and avoid watching the same animation 30 times each time they click somewhere. The first three times it looks good. The next three it just does not matter. From the seventh, it subtly becomes a nuisance.
  • Movement on the screen catches our attention permanently and concentrating on reading becomes very difficult.