Yaqian's Blog

October 16, 2010

I have to say…( A concluding entry)

Filed under: Network Media 2010 — admin @ 3:44 pm

To begin with, i have to say thanks for Nate and Sethken, also and all group members who worked with me for this semester, whether we experienced diffculties and unhappy cooperation or finished assisgnmnet successfully in the end, i am glad that we gained a lot from this period surely. As the proverb says, prople always grow up in tough life, it proves that the more barriers we meet the more progress we made. To be honest, Network media is the most difficult subject among my four subjects, particularlly, i am freshman. However, i feel so proud of myself, i took over a series of difficulties step by step. Im appreciate that we can keep using this blog to continue recording our life in the following semesters, I really enjoy writting my feelings and discusing study in here, especially, thanks for all comments given by unknow readers, your comments will stimulate me to keep going do this task.

I prepare to choose 10 pieces entries from , because this blog is focusing on studying, i want to show my study timeline by these entries, includes all aspects i learned from the 12 weeks, such as Blog Buidling, HTML codes, softwares, and so on.
Moreover,other 2 pieces entries will be choosed from < Extra Information>, im happy to share my daily life to others, it refers to what i care and interested in. To sum up, it is is my last day in Australia, i hope everyone have a wonderful holiday, then we can study together in the next year!

12 entries

1.http://raws.adc.rmit.edu.au/~s3256528/blog2/?p=65

2.http://raws.adc.rmit.edu.au/~s3256528/blog2/?p=16

3http://raws.adc.rmit.edu.au/~s3256528/blog2/?p=11

4.http://raws.adc.rmit.edu.au/~s3256528/blog2/?p=7

5.http://raws.adc.rmit.edu.au/~s3256528/blog2/?p=200

6.http://raws.adc.rmit.edu.au/~s3256528/blog2/?p=188

7.http://raws.adc.rmit.edu.au/~s3256528/blog2/?p=154

8.http://raws.adc.rmit.edu.au/~s3256528/blog2/?p=158

9.http://raws.adc.rmit.edu.au/~s3256528/blog2/?p=263

10.http://raws.adc.rmit.edu.au/~s3256528/blog2/?p=225

11.http://raws.adc.rmit.edu.au/~s3256528/blog2/?p=239

12.http://raws.adc.rmit.edu.au/~s3256528/blog2/?p=211
congratulation_graphics_2

October 15, 2010

Top 10 Website Design Tips

Filed under: Network Media 2010 — admin @ 12:09 pm

Top Ten Website Design Tips
1 Know your audience – Know who your market is and make certain that your site caters to their needs. It is critical that your site reflect the values of your potential customers.

2 Clearly identify the purpose of your website – Make certain your web site is focused on the goal, selling your product or service, conveying a message, etc. Keep your focus!

3 Make your website personal – The most professionally designed site won’t sell if your customers don’t believe in you.

4 Loading times – You have between 10 and 30 seconds to capture your potential customers attention. To minimize your load time, keep graphics small. Compress them where possible.

5 Use a site map or directory page – Make site navigation easy and intuitive. If your customer can not navigate your site to find what they want, they will go elsewhere.

6 Content – Good content sells product and ideas. Review your copy to insure it is delivering the intended message. Always double check your spelling and grammar.

7Consistency – Make sure the site is consistent in look, feel and design. Keep colors and themes constant throughout the site.

8Update and check all links – Make sure your site works! Check all of your website’s links regularly. Dead links will hurt you in the search engines. Free link checker

9Start Simple – When you start to build your site and add information and products to it do it one page at a time, completing each page as much as possible as you go.

10 Optimize website – 85% of all web users find what they are looking for via the top search engines. Make sure that your page is designed to maximize your placement.
Think ahead
Implementing the ten steps above probably will not make your site as successful as one of the big websites overnight. But, if they are implemented correctly and integrated into an overall website design and/or marketing scheme, you should see a marked improvement in the site’s traffic over time.

Reference:http://www.rocketface.com

Hot Spots

Filed under: Network Media 2010 — Tags: — admin @ 11:54 am

The areas of greatest visitor interest on your webpages.
When a webpage is being viewed there are some universal reactions by your visitors to be considered. Certain areas of a webpage stand out to most people who will visit your website.
Some webmasters say that the top left corner of the page and the bottom right corner of the page are the most important, according to the frequency it is used on the Web. This is especially true of internal web pages.

Example:

Google Heatmap

  • Dark Orange represents the hottest area of a webpage.
  • Orange shows the areas next in importance for visitors.
  • Yellow identifies areas of moderate interest .
  • White shows areas with little or no activity.
  • Grey are the neutral areas.

Eye paths

Keep in mind that this study focuses on areas of a webpage that produce clickthroughs. Here is where most visitors will buy your product or click on your ads.

I have found that this type of pattern can vary from page to page. Some pages with a large amount of text perform best when text ads are placed at the bottom right corner of the page. It all depends on the content of the webpage.

The actual path that the eye follows when viewing a page is better explained by following the link below.

Get more information from here.

October 14, 2010

Further more to “Another progress after hard working”

Filed under: Network Media 2010 — Tags: , — admin @ 9:57 am

In my previous blog, I learned how to create simple lists for my hypertext essay, however, my group mates said that we need a bit more complicated lists, as I am responsible for this part. Arrrrhhh, a bit disappointment in one second, but I afterward realise that the more I am responsible, the more I learn.
I then look in to it, I found that we can use some style on our list, what does mean? It means we can use letters or roman numbers in stead of simple numbers for our ordered list and use circle and square in stead of bullet points.
For ordered list, we could use <ol> for capital letter list, <ol> for small letter list, <ol> for roman number list.
For unordered list, we could use <ul> for Circle bullets list and <ul> for square bullet list.

Another coding I have learned is nested list. Basically it means a list in side of a list.
Let me try it.

<html>
<body>

<h5> My favourite soups and ingredients</h5>
<ul>
<li> Maine pumpkin soup with sauteed scallops & ginger cream </li>
  <ul>
  <li>onion</li>
  <li>Ggarlic</li>
  <li>cream</li>
  <li>pumpkin</li>
  </ul>

<li>Cauliflower cheese soup</li>
  <ul>
  <li> Cauliflower</li>
  <li> Milk </li>
<li> Cream</li>
<li> Cheese</li>
<li> Onion </li>
  </ul>
</li>
</ul>
</body>
</html>


The code above will look like this:


My favourite soups and ingredients
  • Maine pumpkin soup with sauteed scallops & ginger cream
    • onion
    • Ggarlic
    • cream
    • pumpkin
  • Cauliflower cheese soup
    • Cauliflower
    • Milk
    • Cream
    • Cheese
    • Onion


October 13, 2010

Another progress after hard working

Filed under: Network Media 2010 — Tags: , , — admin @ 7:26 pm

As our group discussed before, we will set a image of ipad as our home page for our hypertext essay. A list may be involved in our homepage. Thus, I look deep into list function in HTML today, and found some very useful information.

There are basically two types of list for easy use purpose, ordered lists and unordered lists

Ordered lists <ol></ol> obvious means lists that are in order, on contrast, unordered lists <ul></ul> means lists that are not in order. An ordered list will be displayed with number ahead, and unordered list will be displayed with pullet point ahead.

Here is the example of coding and list,

<html>
<body>

<b><h1>My favourite fruits(Unordered):</h1>
<ul>
 <li> Watermelon </li>
 <li> Banana </li>
 <li> Orange </li>
</ul>

<h1>My favourite fruits (In ordered):</h1>
<ol>
 <li> Watermelon </li>
 <li> Banana </li>
 <li> Orange </li>
</ol>
</body>
</html>


The code above will look like this:


My favourite fruits(Unordered):
  • Watermelon
  • Banana
  • Orange
My favourite fruits (In ordered):
  1. Watermelon
  2. Banana
  3. Orange


But I found another cool list which called definition lists, you can actually put some description on your list, it starts with tag <dl> to tell HTML that I am going to make a definition lists, then follow with tag <dt> which means to defines a list, after that, use tag <dd> to describe the item you  list previously.

Here is a small example,
<dl>
<h1>My favourite fruits</h1>
<dt> Watermelon </dt>
<dd> — I eat one to two times a month</dd>
<dt> Banana </dt>
<dd> — I eat twice a month</dd>
<dt> Orange </dt>
<dd> — I eat five times a month</dd>
</dl>


The code above will look like this:

My favourite fruits
Watermelon
— I eat one to two times a month
Banana
— I eat twice a month
Orange
— I eat five times a month

Hey guys, please try it yourself, you won’t learn it until you actually put it in practice. If I can do it, so do you. LOL

October 12, 2010

The 1st Motification.

Filed under: Network Media 2010 — Tags: — admin @ 4:47 pm

As what i mentioned before about our Hypertext Essay, we prepare to use an iPad Frame as our Website’s backgroud. I just received my group member’s email, which said because of some problem of copyright, we have to change our backgroud. Well, a new turn to design our Web style. After discussion, we figured out it, the new backgroud is a diary. As we know, the diary page involves some tags like ” Date” ” To Do” “Weather”, yes, these tags will be our new click places for links. We are going to change every tage to our correspond content, like ” Introduction” ” Comments” ” Links”, umm, i hope it works. Indeed, this assisgnment is more harder than we imagined before. I prepared to welcome various problems we will meet soon. In conclusion, copyright is a crucial points people always ignore. To be frank, im still on the way to get used thinking about this point. Neverthelss, i predict it will become a constant hatit gradually, owing to it is neccessary for every task.

Link is Root.

Filed under: Network Media 2010 — admin @ 11:15 am

I searched some information this morning, i think it not neccessary to do the whole reaserch about WebSign, it totally depends on everybody’s individual siatuation. Speaking to myself, i have to improve some skills in specifical aspects, take an example,how to make a distinct link.

“To link pages in your web site from one page to the next you have a choice of using one of two types of addresses: absolute addresses (complete) and relative addresses (partial).

URL is a nerd’s way of saying ‘address’.

An absolute URL is the complete address of a page that can be found from any other location on the Internet. So let’s say you have a page called contact.html on the root of your web site who’s domain name is www.myStore.com. In this case, the absolute URL of the contact.html page would be:

‘http://www.myStore.com/contact.html’

When geeks talk about the root of a web site, they are taking about the base of the web site, the starting level.

The files (pages, images, etc.) that make up your web site are organized in folders just like any other files that you store on your home computer. Your host will give you a space/directory on their server for you to place all your website’s files.

This space/folder assigned to you will be the ‘root’ of your web site. This means that as far as the Internet is concerned, anything (html files, images, other folders, etc.) in this folder is directly accessible by your domain name plus the name of the item. Huh! Even I’m a little confused! Perhaps a little example will explain this better:

Let’s say that on the root level of your website, you had these HTML files:

index.html and contact.html

And in a folder called ‘products’, you placed whole bunch of other pages with one called ‘bookcases.html’. You decided to put all your ‘product’ HTML pages into a ‘products’ folder to keep the web site more organized – a smart thing to do! ”
Here is the website provides learner with wonderful Web design tutorials.
Reference:Lesson 3: Building a Web Site – Part 1,how-to-build-wedsites.com

October 7, 2010

Preliminary Ideas

Filed under: Network Media 2010 — admin @ 4:40 pm

The idea we are going with for our hypertext essay involves an image of an iPad. The play is to have the image of an iPad as the home screen, and also we will take a photograph of an ipad which is held by hands;each application on the screen of the ipad will have a picture (each group member’s profile photo, it likes a self introduction), after that each picture will link to specific pages (some will be repeated, it is hard to avoid that there are too many same key terms will be highlighted in all pages). Moreover, we will link this web to our individual blog, this idea is really cool, although we know some groups are also preparing to do that. In order to indicate it is a group work, we will arrange the whole web in a same standard, including thier style, location of text and images, click places, all details will be same for each page, which is a complecated task of modify each page. We decided to rewrite the general extract content in the home page, it is helpful to show our theme and our purpose directly. In fact, there are various ideas appeareing in the discussion period, like we tried to download pictures, but it out because of the copyright, we also thought about moving text, but is out because of different aesthetic standards, such brainstorms give rise to our final plan. So far we are still just in the planing and beatiful imagination step, there still a lot of things have to do, im expecting to compare the final achievement with this plan, how many places will be improved!

How to use an image as a link?

Filed under: Network Media 2010 — Tags: , — admin @ 3:46 pm

As our group discussion, we might design to use some images to link to our page, that means we need to use an image as a link. So I do some research on online tutorial and try to learn how this is gonna work.
Basically, I obvious need a proper image on my blog.
july' blog
I printscreen it from my blog, lol.

Then I need to put my blog’s link into the quotation mark <a href=”"> , put it at the beginning of the  image coding, and close the it with</a>
Here we go.

july' blog

For this tutorial, please Click me
On this cool tutorial website, I also found the cool function, <area /> It actually sets a area for clicking inside of the image, however, it is far too complicated for me so far, therefore, I have to leave it for future study.

October 6, 2010

Final essay – web design

Filed under: Network Media 2010 — Tags: , — admin @ 9:01 pm

It is closing to final week now, we have to finish an essay (Click me to view)

We’d better using sketching and wireframes as advised from the assessment criteria. Basically, sketching is all about drawing and planning on the paper, however, what is wirefames? In order to understand what the wireframes are? I googled it and got the general idea on Wiki((Click me to wiki)
Here is the definition “Wireframes allow for the development of variations of a layout to maintain design consistency throughout the site. This is an important part of the initial development stage because it creates user expectations and helps develop familiarity with the site.”

So it is all about layout designing, I started to imagine in my mind what the layout of my page would look like, and draw it on the paper. Things I need to think about are that,

The importance to make good wireframes is that to leave for all the graphical elements blank and use boxes and lines to represent pictures and text, correct placement of headlines and sub-heads and keep it as simple as possible.
Doing wirefames is important as we do not want to end up with a finished website which you do not satisfied the placement of the elements. Thus, if you want to save your time, please do not afraid to “waste” the time on doing wireframes.

Older Posts »

Powered by WordPress