The page layout normally is a pain even to web designers with a lot of experience, imagine for the poor developers worried about their code. But there is some CSS frameworks around the web that could be used to reduce quite a lot the effort to create a prototype or even the final page layout.
As you need to have a good foundation at Java to use any Web framework around, you should have a good foundation at CSS and page layout to use those kinds of framework. The good point is that even if it is not your case you can still use those frameworks as a start point to learn about it.
One of those CSS frameworks is the Blueprintcss:
Blueprint is a CSS framework, which aims to cut down on your development time. It gives you a solid foundation to build your project on top of, with an easy-to-use grid, sensible typography, useful plugins, and even a stylesheet for printing.
First we need to understand what is a CSS framework. Let me say that it is not: it is not a magic box that everything renders magically, it is not a code generator for CSS, it is not a component that you plug into you HTML page and the page is rendered automatically. A CSS framework is just a pattern that you should follow to develop your web page, elements and CSS styles, and provide the foundation for a fine and consistent layout.
The first step of those CSS frameworks is to define how the elements will be displayed into the page. Blueprint, as many other CSS frameworks, divides the page in fix size columns which are used to place the component elements. For an example: imagine that you divide your page in 24 columns of 10 pixels each. You can say like, my header will be a box that will take over 24 columns, my left menu is a box that takes over 10 columns and at the side of it my body will take over 14 columns. So basically with this kind of layout style you just need to create boxes and say how much columns does it takes.
As this column division is not produced using tables but using divs and styles to make it as big and the amount of columns that you expect, you will end up with a tableless layout too.
The second characteristic of the Blueprint is to define the fonts, there is a basic set of fonts to guarantee that you page looks like the same in all the browsers. Not that it is not just the font familt, but also the size, space and etc.
And finally it provides you with a set of other styles that can be applied to your forms, tables and so on.
There is much more there so far I recommend you to take a look at this example (you will understand much better how the column layouts work): A Closer Look At the Blueprint CSS Framework.
Using those kinds of frameworks (Blueprint is not the only one) is a good step to simplify the page layout, but it for sure do not replace a good layout and user interface analysis. Take a look, you may not use the framework, but I am quite sure that you can take some ideas over there.
For those that wants to go further the project wiki page as really good material: http://wiki.github.com/joshuaclayton/blueprint-css/.
And as usual the sidekick, today I recomend the song Ya no sé qué hacer conmigo, from the Uruguayan band Cuarteto de Nos.
Nenhum comentário:
Postar um comentário