Happy Halloween

Hey Everyone, Happy Halloween, I hope you all had a great night and got lots of sweeties, I just wanted to  post a quick update, with a gift for everyone just downloaded it and save it to your site if you want it :), I got some wonderful awards from my affiliates: Carmen, FioNat and Ingrid and you can see the gifts here on my awards page,and to tell you all about the wonderful new affiliates I have:

  • Starlight Graphics
  • shiny nickel
  • apple and cinnamon
  • icy afterlife
  • Shotgun Opera

also a few new pieces of artwork, all three created for a challenge at Buffy Forums.net a challenge called Heatwave, which basically asked for shipping wallpapers, that showed a romantic connection.

Big Icon Post

Hey everyone, its been kind of a busy month for me I’ve posted three time already and its not even November!!! w00t I feel like I’m on a roll, I’m finally getting that buzz back that I used to get when I did art work, its been too long, I just wish I had more time to do the work! but that is me being lazy but its coming along. quite a bit update this weekend, I went through my old Live Journal and downloaded all my old icons, and there was quite a lot of the. well I’ve uploaded them here for you, I have also added new affiliates and new wallpapers. I also have plans for some more HTML/CSS tutorials, I want to do a CSS structure post, and show people a basic PHP include.

Affiliates first:

  • linkloveincognito
  • nyxthea
  • brinneydee
  • confessions
  • staring at the sun
  • witty comeback
  • blurred-mind
  • layout-whore
  • reflection

Icons: Not only have a got loads of the old ones up, but I have also made some new Legend of the Seeker icons from the very first episode. Well lets see, a list of all the old ones

  • 06-02-01-04
  • roswell47
  • maxnlogan2
  • constintine01
  • doc05
  • lost06
  • sailormoon09
  • smallville03
  • lots-ep1-10

Fanart: I have two new pieces of fanart, from a challenge at Buffy Forums, and this challenge is really cool basically to create a wallpaper to do with either fate of connect a character with a star sign, well I’ve done the latter, and I wanna do one for each star sign, I doubt I’ll submit them all, probably wont finish them before the end of the challenge but I want to create all the star signs and here are the two I’ve done so far.

  • Taurus Angel
  • Kahlan Virgo

HTML/CSS Structure

The people have voted! and 31% of you would like to see some HTML and CSS tutorials, Okay, well to be honest I don’t know where to start teaching you things, I started when I was but 14 years of age, and I learned VERY slowly simply becuase I was learning from the internet which I only had a little bit of access to at the time and in my spare time. I had no idea where to start or what was right or wrong and that long ago there weren’t the big websites that help you out like there are today and there wasn’t any right or wrong way of doing.

I’m not saying I’m an expert but these are a few things I learned along the way.

probably the most basic and helpful tip I can give anyone is STRUCTURE if your code and your files are tidy it is so much easier to write it, rewrite it and learn from it. In my job I have had to rewrite other people’s work or look at other people’s code to decipher if the website needs recoding, and lets face it most of the work we get in from clients their current websites need a total rewrite at the very least so I can read the code properly so I can make the changes the client wants.

Okay so the easiest thing to teach you would be file structure, if you mix all your files up it can be quite difficult to find things and move things about but if you keep things in order then its easy peasy, all the images should be kept together, (and maybe in folders within an image folder if you have LOTS of images) css, scripts and anything else should have its own folder. Below is a diagram of a basic website filing structure which I use every day.

file structureAs you can see I use Dreamweaver, which in the past I have hated with a fiery passion, and I still thing it promotes laziness but if you are in the web design business you will know what time is very precious and you will need a programmes that will help you out, and I think Dreamweaver is one of the best in the market. Anyhow this is the file structure I use in all my websites, the ‘includes’ folder is used when using PHP which I will write a tutorial about later on but basically it contains small snippets of code that needs to be included on every page. (this is also very useful and I will write a tutorial on it later).

The ‘assets’ folder is where you keep all your CSS, images and javascript, I would also create a folder for pdfs, or word documents, or any other kind of file you upload to your server. I used to just shove everything in the main folder and it took ages to find what I wanted.

HTML Structure.

What with the HTML 5 coming into play, structuring websites could get a lot easier and a lot more straight forward but thanks to the evil of Internet Explorer that has infected the internet with its F*** You’s to anything that you try to write that is semantic or anything that validates, and all those people who are forced to use Internet Explorer or people who are too lazy, or don’t know enough to update their browsers anything better, HTML 5 will have to wait around for a bit or you as a website designer will have to learn all the tricks to back date all your websites.

below is my basic HTML structure which I would recommend if you want to make it easy to update. (please note there may be easier ways out there to layout your work but this is what I have found to work best for me)

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
<html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="en-US">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>SITE NAME</title>
<meta name="description" content="" />
<meta name="keywords" content="" />
<meta name="author" content="YOUR NAME AND WEBSITE ADDRESS" />
<meta name="language" content="en-gb"/>
<meta name="robots" content="index,follow"/>

<link rel="stylesheet" type="text/css" media="all" charset="utf-8" href="assets/css/main.css" />

<script type="text/javascript" src="assets/js/jquery-1.4.2.min.js"></script>


<div id="wrapper">
   <div id="header"></div >
   <div id="content"></div>
   <div id="footer"></div>



This is the basic format I use, and I’m just going to break it down for you now.

DOCTYPE: This little piece of code that tells the browser what version of code has been written in. There are several types of these Doctype

  • HTML Strict : contains all HTML elements but doesn’t include deprecated elements like font.
  • HTML Traditional : contains all HTML elements including deprecated tags.
  • HTML Frameset : the two above don’t include frame sets so if you want to use them use the frame set version. (I wouldn’t recommend framesets they are old and horrible 😉 )
  • XHTML Strict : this is the most strict version it doesn’t allow for any deprecated tags, or framesets and the mark up must be written as well-formed XML.
  • XHTML Traditional : this is what I use, becuase it allows for a few errors, and I am not saying I make a lot of errors but simply becuase if you want your site to work for ie6 and old browsers sometimes you have to use deprecated tags and little hacks to get the site working across the board. but the mark up must be written in well-formed XML.
  • XHTML Frameset: I think you are getting the flow of things right?

for more information about DOCTYPES visit W3School

I would hope you all not what the <html> tag does, there is a little extra code in there that basically sends information to the browser to say what type of html has been written and in what language etc.

META TAGS: The next block of information is the meta tags. These are hidden bits of information that tells the browser things about your website, in the past these have been the main source of information that search engines have used to determine what your site is about, however lately search engines are must more advanced and they are able to read all the content of your site and determine what your site is about from what your write about, so meta tags are no longer the be all and end all of SEO (Search Engine Optimisation)  you now have to write the content of your site very carefully, and search engines also determine the value of your site by the type of code you write. ( I know very little about SEO, it is very in-depth and long winded and if you ask me very boring. you can find out a lot more about SEO here at SEO Moz one of the best SEO blogs on the net)

  • <title></title> this is pretty self explanatory put the title of your site here … duh lol.
  • “description” : here you should put a detailed description of what is on the page, if you have 10 page you need 10 different descriptions becuase different things are written on different pages.
  • “keywords” : these are the keywords that describe your site, these can be the same on every page to make it easier or if you want to be complex you can create new ones but keywords are hard to choose especially if you think about it, there may 1000’s of sites with the same keywords as you
  • “author” : this is basically to say you wrote it, its a good thing to put your name and website address, this is if you are writing it for someone else so if anyone wants to know who coded it they can find you.
  • “language” : pretty self explanatory
  • “robots” : this defines rules for robots (web crawlers for search engines)

There are more than this but you only really need to use title, description, keywords. the others are just filler.

JavaScript and CSS: after the meta tags I always put the assets, CSS first and then the JavaScript if need be, many people like to put the JavaScript at the bottom of the site as it can take a while to load and most people want their site to load before waiting for the JavaScript, but many sites these days rely heavily on JavaScript as it is a common language and most people have browsers that enable JavaScript.

As all the code above is written within the head tag it is hidden from the viewer now we get onto the actual content the body of the the HTML file.


I like to keep this a simple as can be, I always cut my sites into three second HEADER, CONTENT and FOOTER, almost all sites run on this structure, even if the author doesn’t realise it, you may notice that I haven’t put menu in there, well I put that anywhere I want, as long as it fits into one of these three sections. (cutting your site up this way helps when it comes to using PHP includes tutorial soon)

Wrapper: this is probably the most important thing in the site, the wrapper keeps everything within a certain space. even if your site is a liquid layout (a layout that changes width with the size of the browser window) I tend to do all my sites as a fixed width as it make it easier to code and to be sure what it looks like across different resolutions. but adding a wrapper around things means you can control the shape of everything inside the wrapper.

Header: this has everything that appears on every page at the top of the site your website title, main image, and possibly a menu. you can put as many <div> or content in the header as you want, but the main thing is that everything you want on every page should be contained in the header.

Content: this area should contain all your unique copy, from the title of the page down to the last full stop, these shouldn’t be anything that is going to appear on more than one page (unless you have included a sidebar but if you have included a side bar the best way to do it is to divide your content div into two section, the less confusion between the DIV’s the better. (and I implore you DIV’s not tables!)

TABLES ARE EVIL: just a quick note, I learnt tables first, and I used tables for years!! they are easy to use and make it really easy to divide up your page but they are not supposed to be used for content, or layouts or anything like that, the true use for tables has always been data. I remember when my friend Kitty first told me to use DIV’s I was so against them tables were safe and worked so well but they didn’t they were difficult to move and although they layout the site into blocks which is what I am asking you to do with DIV’s using DIV’s you can move things around the page so much more easily and use the CSS to do so much more with them. Tables are great for any kind of data like a size guide, or a pricing table, or anything like that, but keep it data only please.

Content and Sidebars: as I said above try to keep your content separate from the static content of your site, it will help you when you want to edit your site later on and will cut down the amount of time that it takes to redesign your site when you get bored of your layout and if you are anything like me, I always get bored of my layouts almost as soon as I’ve finished the redesign.

Footer: well all your footer information goes here, most websites have contact details in here, or important information that isn’t very pretty, this could be accreditation, or outbound links, for example my site (at the moment) has a poll, a bit of information about me and all the links to my social networking places, these are important bits of information but they are thing I wanted to show people. I also use this section for a quirky little thing that promotes my commenter, so the more you comment on my site the higher up your name and your website link will appear on the site. However the important thing to remember about the footer is this is for things that appear on every page at the foot of your website.

current footer 2010

Okay well I think that’s it, you may think that is a really in-depth way to describe the structure of  web site, and most of you probably already know about everything here, but just hope there was maybe something you didn’t know about or something you are going to try out and if you learnt nothing oh well your doing great and didn’t need to read the post 😉 but like I said there are other ways to do thing this is just what works for me.

Organisation is the key to speed and understanding

Bye Bye Summer Hello October

Its been a busy couple of weeks for me, work has really been taking its tole but I haven’t forgotten Elucidation Art, in fact I have even won an award over at Buffy Forums in the past month for my Tears wallpaper I plan on entering a few more challenges, but I am finding some of the subjects really challenging, they really make you work for it over at Buffy Forums lol, but I guess that’s why they have some of the best Fanartist on the web.

Okay so its October so another Site of the Month, and this month it goes to Brinneydee Designs!

October 2010 Brinneydee DesignsReason: I have recently found Brinneydee Designs and I have fallen In love with the designs and wallpapers she has created, I really enjoy the fresh and creative ways she presents her work, she is able to focus on the character essence in her artwork, and inject it with amazing colour and vibrancy to each piece of artwork. [read more]

So like I said I have dome some art work which is below and I have also made a collection of icons for Legend of the Seeker season two that you can check out

and here are the latest wallpapers I have created.

  • Richard Cyhper
  • Angelus Coin
  • Tears

Immortal Memories SotM Sept

Unfortunately this is almost a week late, I was on holiday last week an although I didn’t go abroad, which I never get to do anyway (*grumble*) I’ve been down south away from my computer so I’m very sorry for the delay but I would love to announce my Site of the Month September 2010 as Immortal Memories, I have been a huge fan of Monica for ages, and her artwork keeps getting better!

Some of you may have seen my Birthday Bundle I put up, I’m keeping an eye on the poll at the bottom of the site, so please keep voting, and this bundle came as a result of the poll, so if you want to download it you can download it here or view the individual downloads in the gallery.

September 2010 Immortal MemoriesReason: I Love Immortal Memories, I have for a very long time, Monica has such a clean and fresh style of fanart, each piece is clear and high quality, the best images with the best textures, I love the crisp feel to her art work. Not only does Monica have an amazing fanart site with helpful donwloads which I have used over the years, but she also has an amazing gallery of images, it is so hard to find quality images especially of TV shows usually they are small or poor screencaps from the tv, [read more]

I have also done a few pieces of art work over the month of August W00t I told you I would lol.

  • Legend of the Seeker
  • Wonderfalls
  • Angel Opening Credits
  • BtVS Opening Credits
  • trueblood-credits

Freebie Pack

Nearly another month since my last update, but this is a special month for me as it is my birthday tomorrow, and I wanted to do something special for elucidation, I see other community sites doing freebies and bundles so I thought I’d make some freebie stuff that people can use, also becuase this month someone opted for freebies on the poll at the bottom of the page.

[5 mb zip file]

In this bundle you get my all time favourite gradients, I have three in this bundle that I have used all the time but I’ve never put them in to a gradient set till now.

– Two tone set which has various tones that fade into a similar tone [view gradient]
– There is also a a HDslr set which are bright red and orange gradients which I have been using to help me recreate HDR style photographs [view gradient]
– And my favourite one which I have called heaven and earth because it combines earth tones and sky tones to bring out the colours in photographs which have both sky and other features in it [view gradient]

I have also added some photographs I have taken of torn paper, I always find it hard to find torn paper that is big enough to fit on my wallpapers, the torn paper in this bundle is very large and maybe a little blurry in section but the size of each piece is at least 1920px in width or height depending on whether it is landscape or portrait which should be big enough for almost all wallpapers (15 photos in total) [view photo set]

and finally I have made some textures out of the paper stock photographs (8 Textures in total) [view texture]

you can download the bundle here or you can have a look at my gallery and download each part individually.

[5 mb zip file]

August Already!!

Wow July really flew by, I have been so bogged down with work I haven’t had chance to do a single piece of art work… ok probably a big fib but I have been so tired from working that I haven’t had the energy to spend all day on the computer and come home and spend all night on the computer as well, this is one of the draw backs of finding a job in something that you enjoy doing as a hobby it doesn’t make it an enjoyable hobby, as well as draining all the inspiration out of you… but enough whining, I vow to make at least one piece of art work every week of August, and by George I will do it lol.

One new affiliate this update, so I would like to welcome Reviews Gone Askew to Elucidation Art

Review Gone Askew

Since its a new month there is a new Site of the Month: Vision award, and this month is dedicated to the hard work and beautiful artwork of Bre at Primordial Souls

August 2010 Primordial SoulsReason: I have been a fan of Bre at Primordial Souls for a long time now. I love how she presents her work and how unafraid she is to try something new, the different way she experiments with light and colour blows me away. She has an amazing skill of bring different images together, her work always looks so delicate and intricate every time I look at a piece of work by Bre… [read more]