Skip to: Content | Main menu | Section menu

andreasviklund.com

CSS template designer

Listen to (and download!) my music at purevolume.com!


Modular CSS template

11 May, 2006 (03:14) | Internet, Webdesign | By: Andreas

The Modular Template (beta) by Andreas ViklundOn January 11th, I presented a concept for a new kind of website template based on modular thinking. The idea was to provide one single template with only one CSS file, and by using blocks of markup that were calling different classes from the stylesheet, it would be possible to create hundreds of different layout variations. By also adding a general framework that the modules were placed inside (for example fluid width frame or fixed width frame), even more layouts could be created.

On January 15th I had showed the idea for a couple of people, who were all very positive about the idea. The blocks are possible to move around, multiply and combine in many different ways, and in the last version of the modular template I made I had 20 modules (such as 2-column, sidebar, double sidebar, header, horizontal menu, footer, adbox and so on). Unfortunally, the project grew into something that took a bit too much time, so I abandoned it to continue the work later on. I thought that the idea was too good to not realize, especially since I thought that this way of building layouts could make a great feature in a content management system. I have in fact used parts of it in custom-designed WordPress themes, but I never got as far as releasing a final template.

And today I was browsing around the net for new, interesting sites. And to my great surprise, someone has picked up the idea and turned it into reality! It is almost exactly what I was working on - but much smaller and probably better than I would have done it. The main difference is that I added a few extra layers to the cake: Make-up (layout-wide styling for typography, forms, headers, links and so on), Colorscheme (just what it sounds like) and Backdrops (background images). Designers can add each layer separately. If you have a site based on the template and you want to change the styling - add a new Make-up. It is a matter of cutting and pasting blocks of code into the CSS, even a beginner with no CSS design skill can do that. If you want to use different colorschemes for different pages - just add more colorschemes and call it from the colorscheme class of each page. One line of code to change, and the effect is very obvious…

Now, with the idea already taken this far, should I go on and finalize my own version? Or should I just drop it? Or release it as it is now and let everyone do whatever they want with it? Send me your feedback! I've spent more than many, many hours planning and coding this project, and I want to do something with it - even though a lot of people will say that I "stole the idea from Yahoo!". Comments are more than welcome!

Comments can be only posted for 14 days after the post date. If you have comments about an older post such as this one, feel free to send me an e-mail!

Comment from Jason K.
Time: May 11, 2006, 3:55

You should just give up. No need to reinvent the wheel.

Comment from Sam
Time: May 11, 2006, 6:52

Quote:
"You should just give up. No need to reinvent the wheel"

WRONG !

There is no such thing in creativity called "reinvent the wheel", look around how many CMS and blog system available out there and how many inspiring ideas?!

Go on and finalize your version :)

Comment from Benny
Time: May 11, 2006, 7:20

Andreas, if you ask me, you focus on to many things at the same time. Since you are one person i think it would be good for you to "be_not_all_over_the_place_at_the_same_time" or you will be taken by the guys in white …

On the other hand, as long as YOU are alright with it all "GO FOR IT" - one day at the time. Don't forget, YOU are the most important person in YOUR life. I like all the work you are doing and i would like to see you "online" for many years to come.

Oooh - btw, the CROWN looks good on you. If you walk in others footsteps you can never be #1 …. GO GO GO !

// Benny

Comment from Barracuda62
Time: May 11, 2006, 8:19

The modular idea is simply brilliant! Loved it from day 1!

Folks, let's not argue whether Andreas or that other guy invented the wheel. That's not the point. Point is that "time to market" is very short on the net. Andreas announced it early Jan, now 5 months ago. The other guy just went for it and … bam!

Andreas, I suggest and encourage you to go ahead with it; just throw this project - even in alpha version - in the open so that we can all experiment, test and contribute. Seeing Andreas' work so far, my feeling is that his version will be even better, cleaner and easier to use, certainly if this community helps out. And now that Andreas focuses back 100% on design, things can and will be moving at the speed of light ;-)

Andreas - tap on the shoulder dude and … go on!

B-62

BTW Andreas - I know you're a busy man, so are we all, but do you have a habit not answering your e-mails?

Comment from Andreas
Time: May 11, 2006, 9:57

I've never claimed to have made up the original idea about modular CSS and markup. It has probably been around for many years… What I wanted to do was to build an open source website template based on a modular concept, because noone had ever released a single template that included hundreds of possible layouts. The Grids CSS is pretty much what I wanted to do, although it is a bit more limited.

And while Benny is perfectly right (I don't work well if I take on too many projects at the same time), this is not really about me. It is about the template. I don't know if it this worth spending more time on, or if the interest is large enough to wrap up the template and release it. It would be comfortable to leave everything behind amd put my energy on other projects, if it wasn't for the fact that the code I have could still be useful for someone.

Thanks for the feedback, keep it coming!

Comment from yosefa
Time: May 11, 2006, 10:38

hi dear :) you're a great designer and i'd love to see what you would do to this project so… finish it (but only if you will enjoy it!). also, if you release it now and allow others to participate in advancing it - wonderful! this is what open source is all about, right? working together and making something as a community. the best thing is if you can contact the designer who made something like you did and work together - it's super fun ;)
by the way, i have a plan (which i hope i'll have time for) to convert some of your great designs to RTL (i am a hebrew speaker as you can see from the website i chose to include). when i do that - i'll let you know (and of course share).

Comment from Stuey
Time: May 11, 2006, 12:05

Andreas, I really appreciate your design work. You most definitely have a natural artistic ability.

I downloaded and played with the YUI myself and it is, indeed, very configurable, however it lacks the aesthetics that you provide so well with your designs/templates.

Unfortunatley many people will look at the YUI design and not see the "wood for the trees" with respect to the look of it (at least, in the mundane style it is currenty in).

I think that people follow your designs first, then the code. It's what immediately attracts us - good design gets your attention and then you become interested in how it was made.

So to conclude, I think that it would be a shame if you did not present a variation of this code in it glory! I think you should do it.

Comment from Gordon
Time: May 11, 2006, 13:35

I agree with Stuey, your designs/templates are aesthetically pleasing, more so than almost any other designs/templates I have seen.

Carry on with the project ? Yes, yes, yes ! Go for it. We are all holding our breath to see what it's like.

Oh, and your highlighting of your own comments is muh appreciated and makes the comments section more readable.

Comment from GO ON!
Time: May 11, 2006, 13:42

GO ON. Since 2005 many people are Andreas Templates Fan's so you must go on and finalize your project. We know your principles so take it with peace and go on. We all love your minimalist style.

Comment from Adolfo Tavizon
Time: May 11, 2006, 16:14

Oh man, go for it, your work its great, and as the other boys are saying, you have a comunity whit you, your work whit Anslie its great, keep going

Trackback from Raible Designs
Time: May 11, 2006, 17:11

Yahoo's Grids CSS

When I first saw Mike Stenhouse's CSS Framework , I was very impressed. It's hard to believe it's been a year since I first saw it, and only now am I integrating it into AppFuse. It figures that the week I'm implementing it, Yahoo comes up with …

Comment from moraes
Time: May 14, 2006, 20:16

Yahoo! is certainly not the first one thinking on modular and reusable CSS grids (or "templates"). This is a natural evolution and I bet there are others, besides Yahoo! and you (uh, and me) thinking on the same concept. Yahoo!'s grids are done, and I appreciate their implementation very much. I would like to see other approaches and I'm curious to see your project. So please go ahead! :-)

Comment from Benj
Time: May 17, 2006, 10:38

Andreas,

I think you should take the time to develop the idea more if you think that it can be done right.

I'm a big fan of OWD and your dedication to clean code - I'm even working on variations of themes made by you as a way to improve my understanding and use of CSS.

If the overall efect of your completed project, combined with a decent CMS can come together I think you would have something that is truly flexible in its application which is often the most lacking feature of many CMS's.