Personal website

For the unit assessment, we have to individually create a 'personal' website using the skills we have learnt through Adobe Dreamweaver and Fireworks.

The assessment criteria states:

• Using online multimedia
• Contemporary practices and technologies used by online journalists
• Appropriate online research resources from the web
• Use of dreamweaver and other appropriate web design/publishing software.

Today we designed the layout of our pages, and Steve taught us a simple way of breaking up the pages into 3 tiers, this diagram explains:

The basis of my website is an online portfolio, to showcase my work for future reference.
Tier one, tier two and tier three act like three different platforms in the outline of a website, this breaks up content to title and title to homepage.

Photoshop bits and bobs..

This photoshop lesson was our 4th online lecture of the year. Sadly, I didnt write a post on last weeks lesson...I was there but my brain wasnt...it was still drunk. Anyway, the jist of it was using the web to search for specific information on a person, and how to do it stratigically. (C.A.R.R - Computer Assited Research Reporting.)

So, lecture four, Photoshop. I have used before during my graphics class, but was never taught properly. Theres far too much to learn! Steve showed us some helpful tips for using imagery on the web.

To decrease the size of an image for the web:

• Go to image on the top option bar, select mode and use RGB format for using images on the web.


• It is important to make the image as small as possible to download on the web. So to decrease the size of the file, select image size in the image option, and by making the width smaller, this decreases the amount of pixel dimensions. These need to be as small as possible.


• When saving, use JPEG option for web, click save. An image options box will apear, use a quality of around 4/5 (medium) to compress it for a smaller file.


• This important criteria will save alot of time downloading an image from a website.

Other helpful tools on photopshop to create a high quality image, are:

• The rubber stamp tool. This tool takes colour from other parts of the image and duplicates it. Good to hide bits you dont want in your image.


• Brush tool. This basically paints colour on to your image.


• Magic wand. This can delete whole chunks of the image you dont want. It automatically selects th areas as you click on part of the image.


• Lasso tool. This is the magic wand, but in freehand form.


• Image-> adjustments -> levels. This means you can play around with the darkness of the image.


• Image->adjustments -> curves. Can make the background lighter/darker.


• Colour balance -> play around with levels of RGB colour.


• Hue/saturation -> special effetcs.


• Rotate canvas -> Flip image (just be careful if text is used.)

Photoshop lesson one...

The basic guide to fairy cakes

Fairy Cakes are fun, simple, quick and cheap to make! A fairy cake can be the essential lunchbox snack or the perfect bit of munch for a kids party.

Save money when shopping for fairy cake ingredients, and you'll be surprised how much you can actually get out your money!

Ingredients for 12 fairy cakes (24 mini cakes):

-125g / 4 1/2 oz softened butter
-125g / 4 1/2 oz caster sugar
-2 eggs, lightly beaten
-1 tsp vanilla extract
-125g / 4 1/2 oz self-raising flour
-2 tbsp milk

Method to make.

1. Preheat the oven to 180C/350F/Gas 4 and prepare 12 large, or 24 mini cake cases.

2. Whisk together the eggs and sugar until light and fluffy.

3. Gradually add the flour and the butter, folding the mixture together.

4. Pour the mixture into the fairy cake cases.

5. Bake the cakes for 10-15 minutes, until golden on top and a skewer carefully inserted into one of the cakes comes out clean. Allow to cool for ten minutes on a wire rack before removing from the tin.

6. To make the icing, whip together the icing sugar, butter and cocoa powder. You can go for a different topping too.

7. Once the cakes are cool, get messy with icing them

8. Decorate the cakes with chocolate buttons, sprinkles, or ask the kids what they fancy.

Jakob Nielson's guide to writing for the web...

Jakob Nielson's guide to writing for the web holds some interesting facts and statistics which are worth bearing in mind when writing on the web. Some main points made during this weeks class (week two) were:

1. Break up articles! Write HALF of what you would write in a newspaper. (Interestingly, this is because usual users of online information say they feel unpleasant when reading the text. Also, its boring reading a screen for half an hour.)
2. Use the inverted pyramid (as above) keep it as short as possible, readers want to read it fast and move on.
3. Don't be cocky. It is hard to convey over a screen. Readers may digest this badly. We want friends online, not enemies.
4. Chunk out the page. Split up the info and use hypertext links! VERY important. No-one wants to reads a 10,000 word essay on one long page. Keep the page short and sweet.
5. Scrolling. Again, as above, don't make the page as long as the bible.
6. Use images to break up the page, but check the resolution as a slow loading image is off-putting.
7. Color is important. Use high contrast, e.g. black text on white background (positive) negative contrast (which is off putting for the reader) is white text on a black background. Make it readable.

So...for homework we have to come up with a topic which is factual and practical (e.g. how to play the symbol professionally) using all of the above, and including what Steve taught us in the class about search engine optimization.

Search Engine Optimization (Google ranking)

Basically, Google rankings are when you type in a keyword or phrase into Google and the results are ranked. You will recieve most hits from readers if your site is in the Google top 10. To aim for this, is it based upon:

• How much the keyword the user typed in is used in the article. (repetition)
• The websites amount of hits.
• Having a good reputation. If many sites links to yours, this is a starting point for getting a positive reputation.
• Use plain text. 'Search engine spiders' which link to your content and effectively higher your ranking, are blind to images and video. Including multimedia is fine, but ensure to supplement the multimedia files with a textual description.

Intro session...

The first lecture following our long summer break, was a basic intro to the unit and a round up of last year.

As a class we discussed our favourite websites and why they work and don't always work as well..

Some main issues discussed were:

• Scrolling ( to scroll or not to scroll...being a big issue for some with lazy hands.)


• Colour and font (brightness...many of the male race can only function in a dark room and barely see daylight, so a brightly colored website is not easy on the eyes.)


• Layout, including use of images and amount of text used. ( No one wants to read 5000 words on one long page, so the next and previous tool can be applied and used well here.)
  
• Readability issues (again, many issues as above.)


• Hyperlinking (used well and enough? Or used too much?)


• Speed of the site (There are patience limitations.)
  

As far as favourite websites go, I personally only use a limited amount, which mainly include shopping websites, facebook and email. (I'm not the only one though!)

A brief analysis of one of my top fave sites is ASOS, a shopping website. Although discussed in class, I love the layout of this site and personally think it cannot be simpler to use!

• The menu bar is split into sections depending on who is using the site.


• After using the main bar, a side bar is introduced into categories making it simple to choose what you want to shop for.


• After using this side bar, there is more choice! E.g: If i click evening dresses, I instantly get a side bar asking what colour, size and price I want to shop for.


• When clicking a product, the image is clear. I can also view different angles of the product and even a catwalk show.


• The white background and black text used is simple and easy on the eyes. No clutter or bright colours.


• It is fast and has minimal scrolling unless you choose to scroll (E.g: there is a next and previous as well as a 'view all' link which means I can scroll down and view the images on one long page.)