July 17, 2008 at 15:29Searching for the ideal
Once such a booze started, then I, in turn, decided to submit my version of the layout to the public, which, it seems to me, is very close to ideal.
But in the end, I got this: http://gruzzilkin.110mb.com/layout/
According to my idea, an ideal layout should have the following properties:
I believe that I succeeded in fulfilling all points of the plan, except the last.
In principle, everything I did is the same bike, but I assembled this bike from various parts all over the Internet:
Here's how I went about creating the final layout:
To begin with, my Holy Grail version was taken and made up. You can watch it here . It was no different from the revolutionary version that it was on ALA, just a basement pressed to the bottom of the screen and speakers of the same height.
After the appearance of the article “Faux Absolute Positioning” on A List Apart, I was impressed by this technique and decided to remake my “perfect” layout, and this is what I got in the end.
Then I stumbled upon a way Roger Johansson developed the way to create flexible frames and decided to complement my layout with it.
In the end, I got what I wanted. But at the same time, the number of additional blocks in my version is simply terrifying. It is also worth noting that for “columns of the same height” it will not work to apply a non-repeating background image, pressed to the bottom of these same columns (because the bottom is far beyond the viewing window). Those. this image would have to be positioned inside the parent .box or (and?) .content container. And if you have on your hands a design that is different from mine, you will have to dance long and hard with it.
Not considering myself an experienced and sophisticated layout designer, I would like to ask Habr users for advice, how could this layout be optimized? Or are there already other ways that are much simpler than mine and satisfy all the requirements described above?
Thanks in advance for the answers.
But in the end, I got this: http://gruzzilkin.110mb.com/layout/
According to my idea, an ideal layout should have the following properties:
- Doctype XHTML 1.0 Strict;
- layout without using tables as design elements;
- cross-browser compatibility;
- valid html and css code;
- the layout does not fall apart when you resize the page and scale the fonts;
- It would look acceptable with graphics disabled;
- the contents are framed by a beautiful frame with rounded corners;
- the basement is always pressed to the bottom of the screen;
- speakers of the same height;
- the content in the HTML code of the page is as high as possible;
- minimum “extra” markup elements.
I believe that I succeeded in fulfilling all points of the plan, except the last.
In principle, everything I did is the same bike, but I assembled this bike from various parts all over the Internet:
- translation of the article “Finding the Holy Grail” on Design For Masters ;
- article “Flexible box with custom corners and borders” at 456 Berea st ;
- Faux Absolute Positioning article on A List Apart .
Here's how I went about creating the final layout:
To begin with, my Holy Grail version was taken and made up. You can watch it here . It was no different from the revolutionary version that it was on ALA, just a basement pressed to the bottom of the screen and speakers of the same height.
After the appearance of the article “Faux Absolute Positioning” on A List Apart, I was impressed by this technique and decided to remake my “perfect” layout, and this is what I got in the end.
Then I stumbled upon a way Roger Johansson developed the way to create flexible frames and decided to complement my layout with it.
In the end, I got what I wanted. But at the same time, the number of additional blocks in my version is simply terrifying. It is also worth noting that for “columns of the same height” it will not work to apply a non-repeating background image, pressed to the bottom of these same columns (because the bottom is far beyond the viewing window). Those. this image would have to be positioned inside the parent .box or (and?) .content container. And if you have on your hands a design that is different from mine, you will have to dance long and hard with it.
Not considering myself an experienced and sophisticated layout designer, I would like to ask Habr users for advice, how could this layout be optimized? Or are there already other ways that are much simpler than mine and satisfy all the requirements described above?
Thanks in advance for the answers.