Graphic Euphoria

Please come in, make yourself at home..

This is the personal website and project of Simon Donaldson. It's still early days but things are picking up in pace. I have installed this basic theme, which I created from scratch, it should do till the main theme is complete. I'm still working on customising the backend and the navigation. Hopefully I will have a portfolio section up very soon as well as some more mumblings and information about me. Until then, I hope you find my posts interesting or maybe useful, come back again soon!

Well, I’m slowly getting through all my bookmarks, blogging the important sites I’ve discovered over the last couple of years.

I’ve found another gem..

If you write CSS then you will be aware how bulky it can become and, more importantly, difficult to read. Using shorthand CSS you can cut through a lot of the bulk by removing excessive property declarations and with a quick scan you can find a property to change or update.

Roger Johansson over at www.456bereastreet.com has written a good post about the most common forms of shorthand.

A summary of efficient css with shorthand properties

Typically they combine many declarations into one single declaration. The most important thing to remember from these findings is the order of the attributes within the new longer declaration!

One other thing is worth mentioning again.. if you are setting a value to zero or 0 you don’t need to add the measurement on the end (it is px by default).
For example:

Margin:0;

is the same as

Margin:0px;

and finally, this is purely my own habit, when setting margin or padding i always use..

Margin:0 0 0 0; Padding:0 0 0 0;

..even if i just want to change one value. It saves typing, keeps things neat and if you do need to go back and alter something you have already included it so you just change the value!

I recently stumbled across a few 100% fullscreen interactive flash websites. Now, if there was an award for the ‘Best Interactive Flash Websites’ out there, these would have to be contenders!

I would love to have the opportunity to see the source code and fla’s for these:

http://www.scifi.com/tinman/oz/

http://samorost2.net/plantage/plantage.swf

http://www.adobecards.com

http://www.potatoparade.co.uk

http://www.nawlz.com

http://www.zunejourney.net/

Today I stumbled across a cool new online Web 2.0 application. It’s called ‘CSS Frame Generator‘ but I think that title is a little bit confusing to what it actually does..

Since CSS is hierarchical and semantic you can greatly condense your style sheets by cutting out the over use of classes and id’s. For example, if I were to have a list within a div, you only have to give the containing div and id name to style all the contents.

This is where the CSS Frame Generator comes in. Basically you enter your (x)html, with the main elements given id’s, and the application will create a stylesheet full of empty CSS attributes. You can then start filling in the style attributes and finally delete the ones you don’t use!

So, to sum up, it doesn’t help with design but could just save you some time and make your code better!

Two of the trickiest problems when coding with CSS is knowing the property name, the order of the property attributes (if using shorthand) and knowing which browser supports what..

This is what you need:

CSS quick reference sheet

and

CSS Property Index

I discovered this list via one of the RSS feeds i subscribe to.. it’s very comprehensive and has some really useful plugins.. definitely check it out, though some won’t be needed if you have updated to WP2.5!

a powerfull list of wordpress lifesavers plugins

Just a quicky as i found a great and quick Wordpress tip.

If you want to create a RSS feed for any category or tag within your blog, simply copy and paste the URL shortcut to that category or tag, then add on the end ‘/feed/’

e.g. for the category ‘Wordpress’:

URL = http://www.graphic-euphoria.co.uk/categories/website-design/

the RSS = http://www.graphic-euphoria.co.uk/categories/website-design/feed/

http://example.com/feed/
http://example.com/feed/rss/
http://example.com/feed/rss2/
http://example.com/feed/rdf/
http://example.com/feed/atom/

That’s it… Done!

As everybody knows, getting a website to look the same across different browsers is a tricky task to get right, if not impossible. That is because every browser has it’s own standard default CSS styling sheet built in. So Mozilla Firefox will have a different default style to IE7 or even IE8. Even though these differences are subtle they are enough to give you some surprising results when you view your design in a new browser or platform.

The only way to fix this is to include at the top of your own CSS style sheet a ‘CSS Reset‘ script.
A while ago i stumbled across a basic CSS reset script and after some research i discovered Eric Meyer’s CSS Rest Reloaded script. Eric has created a really comprehensive script but as ever i felt the need to edit it for my own use. I personally felt it could be stripped down slightly and sometimes went too far. Specifically the body, blockquote, q resets and setting list-style to ‘none’. The following is what i had left:

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {margin: 0; padding: 0; border: 0; outline: 0; font-weight: inherit; font-style: inherit; font-size: 100%; font-family: inherit; vertical-align: baseline; line-height:100%;}
:focus {
/*outline: 0; if used define new style */
}
ol, ul {list-style:circle;}
/* tables still need ‘cellspacing=”0″‘ in the markup */
table {border-collapse: separate; border-spacing: 0;}
caption, th, td {text-align: left; font-weight: normal;}

I’ve been holding back for a few weeks now to get my hands on Wordpress 2.5 to launch my own blog. It has new features including dynamic drag and drop widgets so any custom theme i design will need to include these.

Well so far so good, it’s up and running and i officially have a blog! I’m a blogger!!

First impressions are good, it’s a dream to install and easy to manage. It even has a built in cache system to return unchanged pages without calling the database!

This is seriously hot!

Well done Wordpress!