Final Site

Here is where you can find my final website..



I was quite daunted to start the making of the website as I knew the horizontal slide would be a challenge and I was afraid that it wouldn’t work. I watched tutorials and read up and downloaded many different basic layouts and eventually I got it to work. Below is the initial frame-work before I put in content and started styling it.I created this by using dreamweaver but hand coding as I find all the dreamweaver buttons are scary and confuse coding in my mind. Also I like the fact that through letters and symbols I’ve made a website look good, and that gives me real satisfaction.

Once the frame-work was successful, I started adding in notepad background, changing the background pattern, then title, and navigation and eventually content. This was the “easy” part. However, occasionally I would try to add in a bit of css and it would stop the horizontal scroll completely, and then spend ages fixing it again. During the making of the website I found the horizontal slide quite difficult especially as I don’t really know javascript. But I did manage to pick up a few bits, but it was definitely difficult to get my head around so I have decided to pick up a few books over the summer and read and teach myself some javascript, so I feel more confident in the future.

I have also found that I enjoy more structured websites and found this really difficult as I kept trying to make it more free and I feel it shows in the outcome. However, this assignment has taught me way more than my first as it was more of a challenge and a lot more hard work(even though it was only one page!!)

One thing I may do differently is make it more interactive, make it maybe more of a puzzle and that way I could have used roll over images and titles more.

Website Elements

After deciding the style of both my book and website, I thought it was about time I designed the website elements in photoshop, so I could incorporate them in easily. See below an image of my title, all of my links, my background and a few extra things just incase.

This slideshow requires JavaScript.

Now what..?

Once I had my title sorted, this really drived my content. I took pictures of specific objects that would relate to my memories that would relate to the four different types of recalling memories. See below for the pictures I actually took, and then after is the old styled photos that were done in photoshop that I will use in the book and on the website.

This slideshow requires JavaScript.



I felt the title of the book/website was bugging me the most and stopping me from moving on, I looked at meaning of memories and the mind and memory, and came across the word Subconscious, which means the following:


1. existing or operating in the mind beneath or beyond consciousness: the subconscious self. Compare preconscious, unconscious.
2. imperfectly or not wholly conscious: subconscious motivations.

3. the totality of mental processes of which the individual is not aware; unreportable mental activities.
This really sums up what I’m exploring within my book and website. However just calling it The Subconscious doesn’t really say much and seems too factual. So I thought maybe I want to make the subconscious seem more important and maybe it is just as important as the conscious mind. So I explored the word important and found the word significant. So there is my title.
The Significant Subconscious.


Whilst still getting my head around using InDesign to create the book, and a bit daunted by the website coding, I decided I would look it to the typography of both as I want there to be a consistent style. I want the style to be slightly handwritten as if to say its someones memories. Because I wanted the same typeface for both this has limited me to using @fontface kits. Below are a few trials that I did.

Out of these typefaces I really like the first one because its easy to read but still looks a little like someones handwriting, it is called Veggieburger and can be found at

I need to decided what typeface I would like on the book cover and in the website header as I may want something more elaborate, especially if it will be incorporated in with the ink blot.

Header Insipiration

As I now know my cover for my book is based on ink blots, I want to make sure the header of my website correlates with this. So I have looked around at others headers as below and found I really like the use of real elements and the black sketchy look, so I will redo a few mock ups and incorporate the ink blots and same typeface in the header.

This slideshow requires JavaScript.

Continue reading