Archive for the ‘Programming’ Category

In the new YetToBeBranded site, I’m using wordpress to power it, due to lack of tiem to create a custom platform. The long of the short of it, is that i wanted everything to be as integrated and look as natural as possible. This would mean permalinks.

Another thing, was that YetToBeBranded is a company website, not a blog, so I’m using a custom frontpage, which complicates things just a little.

My permalink structure was to be simple: /articles/ is all my articles, it’d be based on title of the article. However, when I set my permalinks to be

/articles/%postname%/

I also had a page called ‘articles’, which was the default frontpage of a wordpress blog. I messed around for quite a while, trying to figure out why my pagination was bugging up in the custom permalinks, the answer:

Because I had a page called articles, and my articles where pointing to that page, instead of that post, there was conflict. The solution was to set my permalinks to:

/article/%postname%/

This worked. I’m not sure if this article will help anyone else, but this helped me, as i couldn’t find the solution to my problem in the codex or related resources.

I’m sure anyone, who has ever down any hardcore web development or developed a web application will know that after you reach a certain size, your CSS files start to get unwieldy — That is, they become hard to edit, cumbersome to make bug fixes to, and sometimes start taking a month of Fridays to load.

A Common solution to this is to use CSS Indexing, where you set up a system of comments to be able to quickly find your way around your files. While this method of having Comment Headings for each section works, it still leaves you with a massive file size.

Another solution is to go the way of a Framework, where by you break each part in your css down to it’s core components. A list of the core components may look quite similar to the following:

reset.css
Yes, I use a reset stylesheet, simple because it makes it easier to develop styles consistently across browsers.
typography.css
This includes everything to do with type. From the Baseline and Line-height settings, right through to font-sizes and image alignment.
grid.css
A standard style grid systems. Typically including CSS for doing column layouts and table grids.
importer.css
One file to @import in all your CSS files, alternatively you can just link in each of your stylesheets using the <link> tag in HTML.

From that basic layout of files, I then use a I trick call “Body Identification”, this is simply the method of applying a unique ID to each type of page in your site. e.g. If your ‘about us’ page needs a red background, then I’d use this selector to apply the CSS rule.

With using a unique page ID, it’s probably a good practice to put all the CSS files named by their unique ID’s in a folder called ‘pages’ or ‘layouts’. You’re file structure is now looking much more like this:

  • ./ grid.css
  • ./ reset.css
  • ./ typography.css
  • ./ pages /
    • aboutus.css
    • frontpage.css
    • blog.css
  • ./ importer.css

So there you have it, a simple way to manage your css, with the benefits of being in small chunked files, having an abstracted framework to work around — a Scaffold, if you will — and, you also have highly specific stylesheets targeting individual pages of your application.

You can Learn more about CSS Frameworks at:

What’s your own take on the Use of CSS Framworks and They’re Applications?

Over the past few months, some would’ve noticed that i haven’t been too active; other would’ve noticed it in the past two weeks. The reason is simple, I’ve been cracking away at the design for this site, once I get a domain name and host sorted.

I’ve gone for a simple and minimalist look, whilst using a grid based layout combined with a dark palette to emphasis on the content. I’m still undecided on the final color palette, but now it’ll include colors around #a0a0a0 and #4a4a4a.The new colour palette for Yet To Be Branded

For typography, I’ve gone with a mixture of serif and sans-serif fonts. I’ve tried to use the serif type for headings or areas which need emphasis, as it stands out against the body text of sans, you can see this in the image to the left. A sample of typography in the new YTBB, both sans-serif and sans!

As for layout, I’ve started by prototyping the design on a few of 960.gs’s grid templates, very handy for use in a boring school class with a substitute teacher. Then i progress to use simple XHTML and CSS. The grid system used is 20/80 in header and content and 50/50 in the footer, all is centered in a container of 78% (there’s a reason for that odd number, but ten points if you can work out why =P )

That’s all for now on the new design; Keep watching and if you’ve got any feedback, by all means, leave a comment and tell me, happy browsing 🙂

Update: You can see the work in progress periodically at this deviation on deviantART.com

Okay.. I know this place has pretty much been dead, so I’ve revitalised it. New theme, new categories, new pages.

News:

In brief..

  • Started getting ideas for a new design.
  • Started looking for domain sellers, know any good ones?
  • Started looking for hosting, if needed.

Continue Reading »

Recently I’ve been working heavily in javascript to build an application. I’ve learnt a hell of a lot about structuring an application and ideas on good design as well as patterns.

The Situation

When I started building the application, I wanted to be able to make it extensible. Everybody loves Extensible, don’t they? Well, I know I’m a fan of customisation. So I wanted to add the option that other developers could easily extend my application. Since I was using xulrunner as the environment, lucky me, I already have an addons library, BUT, that didn’t give me a way of adding functions to events, say when the program starts I wanted to alert “hello”, how would I do it?

The program had a startup function, but my event needed to fire after that ran. So I started thinking of writing a way to add events to functions, what i came out with, was EventJS.

Continue Reading »