menu

BKv6_thumb.pngIn constructing a building the foundations are the first things that go in. Much in that vein, I've decided to approach (and name), every iteration of Broken Kode after the construction of a building. These are then followed on by the superstructure (the stuff that sits above the ground level), and once everything is there, the cladding and services (ventilation, electricity, water) come in.

Back in May when I updated the site, I called it Foundations. I eluded at the time that the reasons behind this name was because I was effectively taking a step back and start taking things in a simple manner. Build the site up at my own pace. No real rush in getting anywhere, just proper steps into crafting a site that I would be happy with. In order to do that I had to make sure that the foundations (see, there was a reason for that name) I lay were rock solid, thus making my life in updating the site less of a chore that it traditionally is.

Inspiration is a funny thing, in that you don't know when and where it's going to come down. Arguably the worst period for me in the past year was when this itch decided it had to be scratched. I actually started the mockups on this site before I even switched over to Ubuntu, as I had begun the mockup design in Photoshop. When I moved over to Ubuntu, I started using Inkscape as my first method of tackling layout and design for websites and have found it an utter joy to use.

Structure

The biggest difference is the structural layout of the page. You'll notice I've tried to steer away from a traditional blog look. I've done it far to many times, I've tried a couple of other iterations and while it's been good, I think my writing style and how I have chosen to use this site and how I write has taken a shift and the site design should really reflect this accordingly. I'm traditionally a verbose person and therefore my posts and even my asides at times can be very lengthy.

The first and most significant change that can be seen in this design is the rigid grid layout that I've adopted. Effectively the only page that's had a proper makeover is the index page. The post page also got a very slight change (but that was implementing ideas that I had for the previous incarnation of the site but was too lazy to get on and implement it all).

One of the many criticisms I get from friends regarding the old incarnations of the site is the fact that there is far too much text on the page. Not enough explanation. I guess the designs really didn't provide all the information required. I can definitely vouch for the fact that a lot of what I've done/have been involved with is hidden under the wayside and I felt it was pretty important to get those elements on the page and shown in a proper light. It's been very varied, but I will say that a great deal of inspiration was derived from the Guardian newspaper I have been reading this newspaper on and off since it got it's face lift earlier this year. It's got a crisp clean design which is what I was intending to get in there as well.

Where to next Mr.Jones?

The site is slightly borked in IE. All I can say is IE and IE users can suck on my fat hairy toe. I mean seriously people, if you're still using that piece of shit, stop it. You're doing yourself a massive disservice and giving me enough grief to have to deal with and try and the blasted thing make play nice (and obviously I'll have to think about the rubbish that IE7 will no doubt be spewing out). Grumble grumble grumble.

Seriously IE is a lame animal, and the quicker someone puts it out of it's misery the better we'll all be. It's the only humaine thing to do to be honest. It's a waste of my time (of which I don't have all that much at the moment to give to clean it up).

The site looks manageable after a fashion and I'll be sure to clean it up to pick up the minor elements that are still showing up. I do need to sort out the additional pages (as I only really concentrated on the main pages) but that'll no doubt get sorted out once the dust settles in the next couple of weeks.

So what's next you ask? I've got another 3 website that I'll be sorting out over the next month or so, and then I'm taking a complete step AWAY from web designing, for anyone, in any capacity. I will finish off my obligations however once that's done you won't even be able to afford my services in that department, because they won't be for sale. I'm going to be concentrating on my artwork fully and my writing. I think it's time I buckled down and did what I first set out to do with this site.

Meta . Info
    1. WOW

    2. Great! Like it!

      IE7 (RC1 - quick view) errors :
      - Blog title and description push the header image to the right.
      - Post title (Main course) too large (supersized)
      - Background for Continue Reading and Add comments doesn't resize (ie only the first word has an image as background, the next word is BELOW the image). Both links are under eachother, thus meaning you have FOUR lines for those 2 links)
      - Copyright notice appears right of the Flickr headline, doubling the width of your page.
      - Also no bottom-padding, last element on the page is the more [flickr] link, only 2-3 px from bottom.

      OK guess that was a first view at it, couldn't see more.

    3. That looks t3h s3x.

    4. Thanks for the list Franky, pretty much the same list I've got based on my brief IE6 look but it does beg the question, what the hell have they sorted out for IE7 if these same shitty problems still exist? Code validates completely and I've not done anything overtly elaborate as far as I can tell. Grumble grumble :).

    5. I like where the site appears to be going, but one thing. It seems to be a bit broken in safari, mainly on the fruit salad bit in the middle. The recently on the kode and the colophon appear below the fruitsalad (asides). the colophon has simply moved down but stays on the right, while the recently bit has lowered itself an placed itself below the asides. Comments on this page are also a little sketchy. I can only see 2, and franky's name appears below his post.

    6. Nicely done Khaled, I like it.

    7. Great stuff Mr. Alfa! Loving the trippy header.

    8. Khaled, things look great. Yes, some stuff requires a second or third going over but I know you'll get to it.

      My own design has become much more organic in process of late. I haven't done a huge redesign in a few months and finally am hitting on an HTML structure that is rather stable allowing me to focus more on the wallpaper and less on the bricks.

      As for the comments on this page (the look not the content) I'm thinking there's an unclosed div in your

      foreach

      somewhere that's causing things to fall apart a tad.

    9. Chris said:

      Khaled, things look great. Yes, some stuff requires a second or third going over but I know you’ll get to it.

      As for the comments on this page (the look not the content) I’m thinking there’s an unclosed div in your foreach somewhere that’s causing things to fall apart a tad.

      Always the astute one Chris. I think that sorted things out on the comments page (hopefully). I'll have to look at what's going on in Safari at a much later stage.

      I think when it comes to your own personnal playground, don't rush it, start with the simplest thing. As long as you understand it completely and why you put every line of code in there, it'll make maintenance and upreving it a much easier task in general. Totally hearing you about concentrating on other things once you've got the foundations sorted :).

      Olav - Glad you like the header.

    10. Padding has become better in IE7, right-sidebars (of valid designs -yes this was spam :D) don't get pushed down anymore.
      Besides that I had the option to blacklist your site as a phishing site when firing up IE7. Just kidding. ;-)

      Oh and if I remember well IE7 knows CSS1.0. Completely even. Another thing which has changed is that IE7 (probably) is an even bigger security risk than IE6. Don't you love new MS products?

    11. [...] Khaled revealed Broken Kode’s new superstructure. [...]

    12. Looks wonderful Khaled. I particularly love the layout and structure of the front page but it looks great all round.

      It's a bit of a shame that you're moving away from web design but I understand your reasoning. Just so long you don't leave this site:)

      Phu
    13. Great design as always. You're very talented.

      Only thing that struck me as odd is the background you use for your own comments. I think it makes it a bit hard on the eyes :)

    14. Great redesign, Khaled. I really like the pink on the blue.

    15. we all love firefox!!!

    16. I'm lovin it! Nice work Khaled!

    17. Thanks for the kind words everyone.

      Phu: I'll never leave the 'kode, even though I might have been tempted from time to time, it means to much to me over 3 years on, to abandon.

      Ion: Yeah you're right, I've sorted out my background. It looks better on my tft at home than it did at work, so I can only imagine at worse screens what it would have looked like :)

    18. Is it just me or is the main page "article" different from the full text once you click the permalink.. If so perhaps "Continue reading" should be "Read article". Nice touch!

    19. Very Cool!

      but, so i dont repeat what has been said before... refer to Ion Pagkalos' comment...

    20. As always, beyond excellent.

    21. http://www.usatoday.com/tech/products/cnet/2006-10-20-ie-bloggers_x.htm

You can also comment as a Tweet.