Matts Blog

I wanted to put my knowledge of CSS to the test, and providing rounded corners to every browser (read: most browsers) seemed like a sufficient enough challenge and one worthwhile undertaking. I haven’t done it alone, there was some help (see the “further reading” at the bottom of the page). Anyway, I knew of CSS Sprites and I had the idea of using 6 spans within a div to achieve this (I have seen a similar version using 4 spans). So my coding and (hopefully) sufficient explanation follows below the click.

Read More >>

Seems an odd title, aye… its come from my experiences with customising Windows Vista with all sorts of little features which just seem to gobble up extra processing time for something I already do to some extent, i.e. a gimmick.

After reading a recent SmashingMagazine article (and not to pee on their fire, it was pretty good) I decided to explore some seemingly good ideas to bring Mac features to the hulking Vista OS – its safe to say most of these additions where promptly uninstalled.

Albeit I already had some of them such as the ever wonderful Notepad++, but among other features was a number of Vista themes, and while perfectly fine looks and style wise, just would not have been practical for long term use – I am still after all this time finding the simplistic Vista Aero theme the perfect style for me.

They also forgot the completely free IIS (built into Windows XP, and can be installed with Vista) which now has more support with the PHP plug-in and ability to work with a local database server such as MySQL. I won’t deny it often feels cumbersome even when used locally – but its a smidge easier to set up. Mind, I do use WAMP too and that works just as well – if not much more quicker than IIS.

The article also covers object-docks and various other Mac features which have been recreated by third-parties for Vista – safe to say I wouldn’t waste my time with them; though no-doubt they could be useful, I have just got into the rythm of Windows.

I should point out the article stems from an earlier Mac-supporting article on SM, so it was another answer to this. I’ll give it one thing, it does prove that there is yet again another alternative to Mac for web-design tasks.

In other news of my own – I’ve had an idea, but ssshhh… its my precious

Cascading Style Sheets, how I love thee. Every time I think there is something I can’t do… a little google brings up a nugget of information which doesn’t seem to appear on the usual channels. For example today I wanted to make all text input fields in a form a certain width, many a time do I forget about attribute selectors… for example:

input[type="text"] { … }

or

input[type="password"] {…}

Although I’ve remembered this little feature, an often overlooked and unreferenced trick has no end of use. Often when you use a divide tag to wrap around other divides it seems to forget it is supposed to wrap them, often looking ugly in early stages of debugging. I remember reading a complicated fix for this, when one CSS guru just said…

#wrap { overflow : auto }

Pop, it remembers its supposed to be wrapping and hops to it.

I’ve also tried to get some standard practices into my work, for example including comments in unclear or complex markup. Placing all my colours in the head comments should I need to change them later (using Find + Replace), and if that wasn’t enough – I’ve started alphabetizing any style properties, all of them result in clean and easily read markup, of course keeping the XHTML markup clean helps too.

Furthermore, I’d like to share some Firefox Plugins which might make any web designers life easier:

• Fireshot – allows you to capture a part of the rendered browser screen or the entire web page into a single image.
• Colorzilla – allows you to color-drop a certain part of the page (even images) so you can easily get RGB/Hex numbers.

Hope you find those addons useful, I certainly do.

And don’t worry, I don’t make a habit of getting over-involved in April Fools

Only a couple of weeks ago did I even realise (or think upon) the idea that the family business’ website probably has IE6 users, a sudden and all too real problem for some of my design techniques. It is a well known and well hated fact that Internet Explorer 6 is out of date, has terrible website support and doesn’t really follow proper web-standards.

So when I realised I had produced PNG images, used div tags and unusual aligning the first thing I wanted to do was make sure the sites appeared as they should in IE6 – not being a browser I normally checked consistency with, thankfully everything was for the most part ok.

While I have a large percentage of visitors using up-to-date browsers (there are some search engines in there too), there was a minority of users still using early browsers, probably featuring a huge amount of security holes. I plead to anyone still using a version of Internet Explorer 6 or less, or even early versions of Firefox, upgrade – you can find out the version usually by going into ‘help -> about’ a version number should be somewhere in there.

You will be loved by the website designer/developer community and hated by all hackers and virii producers. Ok, perhaps not so strongly but you will be doing the online world a favour!

I’ve been doing a lot of research today, more than I had expected to do; turns out I love producing websites and will happily spend hours doing so. I’ve not been able to devote a lot of time to the graphical side of things but I have produced some basic HTML forms with a clean CSS layout, ready for insertion into a large scale project whenever I need them.

Aside form that, I’m posting to share some of the places I have found on the internet which have proven to be full of knowledge nuggets and inspiration; particularly in the realm of Cascading Style Sheets and their uses.

For starters, I wouldn’t go anywhere without my CSS and XHTML references, luckily w3schools has them free for access to anyone; so I needn’t worry about losing them, unless I don’t have an internet connection. XHTML Reference and the CSS Reference; that site also has some very handy free tutorials for getting started in website design.

One of my new favourite sites comes in the flavour of Smashing Magazine, one of my new favourite sources for web 2.0 style trends and tips/tricks on making CSS do magic things. It also has some general style ideas, resources and I believe fonts; nice for those beautiful banners.

If there would be just a small number of must-try articles I would point anyone towards it would be these:

• Holy Grail of CSS Layouts

This tutorial will give you a good idea of using div tags to format your site, its a little tough to get your head round initially; but that soon wears off when you realise what is going on.

• Accessible Forms

Accessible Forms will give you a little experience in making use of lists for formatting, although do step with trepidation; the CSS and XHTML don’t initially match until you stick the class on the form (nothing else). You may also notice the idea of only affecting elements within another surrounding element.

I hope you all find this useful, if you have any questions let me know

I’m working on a brand new style for the site, something a lot more colourful than before. I have uploaded the current work in progress which can be viewed [here], this one has a number of benefits over previous styles – mainly:

• XHTML DTD Transitional conformity.
• CSS 2.0 valid.
• It has some lovely colour in there.

This one is my little gem, it hasn’t needed a single fix in Internet Explorer (just yet); while it is primarily being made for the frontpage, I am playing with the idea of developing it further into a WordPress theme for this blog. Only when it is completely finished and finalised I should imagine.

The only issue developed is that my host provider has PHP short-tags enabled, and while I normally wouldn’t have an issue with this – it has caused a little trauma thanks to the XML tag at the start of the page being wrongly identified as a PHP opening tag.

I have updated the frontpage to the website, which can be found -> here; hope you like the new style, it is simple to navigate – doesn’t burden the visitor with too much information – and doesn’t deviate a great deal from the site.

It is essentially a frontpage with some simple navigation; and although the individual sites might operate differently with menus, it shouldn’t be so daunting now.

For those interested, the main options (forum, blog and more) are 3 div tags with set width and height. Using CSS to help position each one, and the Stylesheet (CSS) changes the background from one to another when the mouse is hovered over it. All images are transparent Portable Network Graphics (PNG), seeing as they seem to provide the highest quality image.

I have also added a new category to the blog called “Site News” which is linked to from the footer of the main page. The forum will (or was) updated with some links to include this; including removing the old forum for site news – the blog is overall more convenient for this.

The definition of the word Vista stands for:

“A distant view or prospect, especially one seen through an opening, as between rows of buildings or trees.” [reference]

So its a bit of a shame that Microsoft’s Windows Vista is so resource and memory hungry, even if it is a very pretty operating system. I say “so resource hungry”… if you are still on a computer from before 2007 or around that time. Laptops are fine, but when it comes to gaming – you want as many system resources to remain available to your gaming app.

I’m still fighting a slight ongoing battle even today, with a seperate page file partition of 10GB, I still find it is getting swallowed up – leaving only 1.7GB free. I want to know what is using all that space, and it will most certainly be an application I’m not using.

Edit: I have since been told that the pagefile reserves space on the partition, showing up as ‘used space’, but this used space does not actually show the amount of virtual memory used.

But there are some helping hands around, and with a little bit of digging around you can get a vastly faster and compact Vista. A prime example is this one by redchaos.

Furthermore, one thing to seriously consider is disabling some of the services that come with Vista. Some of these are absolutely unnecessary for the everyday user.

Only recently when browsing through files, I found a partially completed guide I started work on. It covered some basic concepts for keeping a clean and presentable desktop and system. I may at some point rekindle that little project – but keeping it as unspecific to operating system as possible, although it will be more focused towards Window’s operating systems.

I hear good things for the next Windows OS, although once again there is still a bit of doubt as to whether it will be what it claims to become. And I hope people remember that I was a Vista skeptic, and I still moan about it – but I don’t see it as an inherently bad iteration of Windows… it just lacks polish.

I love making web-pages, I had just temporarily forgotten that I do. But here is a shocker – in all my attempts to make websites, I have usually had a problem with Internet Explorer 7 (IE7). Currently I am restyling my index page for this website, and no – you can’t see the work in progress, its on my personal development server.

But for once, I could almost kiss IE7 for not being a pain in the ass. I have a “layer-cake” layout this time, with my banner at the top, menu below it, and then any following content below that. But here is that shocking discovery, Firefox 3 (FF), Opera 9.5 and Google Chrome all have a gap between the menu and main content section, so the black background is leaking through; while IE7 is working just how it should.

Which means I need to fix the other browsers and then “fix” IE7 to combat that fix for the other three. How frustrating can it possible get?!

I’m a Firefox fan by the way, so it makes a change for me to be praising IE for something. Still doesn’t mean I’ll use it as my main browser!