Website design introduction
Features to make the bad websites:
1. http://www.partiesbydebi.net/[Accessed 29th June 2016]
Reasons:
Many pictures here.
Hard to catch the main point.
Too many different colours.
2. http://www.theworldsworstwebsiteever.com/[Accessed 29th June 2016]
Reasons:
Too many art words.
Too many animations.
The background is complicated and affect the user to read the information.
Some button can be clicked but some can not, the contact pages are not working.
Features to make the good websites:
1. http://www.stephengeorge.co.uk/[Accessed 29th June 2016]
http://www.stephengeorge.co.uk/projects/[Accessed 29th June 2016]
Reasons:
The pictures are high quality
The informations are very clearly
Example to create a website
http://www.wix.com/[Accessed 29th June 2016]
http://www.wix.com/website/templates/html/portfolio-cv/1[Accessed 29th June 2016]
http://www.wix.com/website-template/view/html/1788?originUrl=http%3A%2F%2Fwww.wix.com%2Fwebsite%2Ftemplates%2Fhtml%2Fportfolio-cv%2F2&bookName=&galleryDocIndex=2&category=portfolio-cv[Accessed 29th June 2016]
http://www.wix.com/website-template/view/html/1788?originUrl=http%3A%2F%2Fwww.wix.com%2Fwebsite%2Ftemplates%2Fhtml%2Fportfolio-cv%2F2&bookName=&galleryDocIndex=2&category=portfolio-cv[Accessed 29th June 2016]
I like this website design, because it is clean, and good picture here on the home page. I prefer pictures than words when I surfing one website.
http://www.wix.com/website-template/view/html/1592?originUrl=http%3A%2F%2Fwww.wix.com%2Fwebsite%2Ftemplates%2Fhtml%2Fportfolio-cv%2F1&bookName=&galleryDocIndex=7&category=portfolio-cv[Accessed 29th June 2016]
http://www.wix.com/website-template/view/html/1592?originUrl=http%3A%2F%2Fwww.wix.com%2Fwebsite%2Ftemplates%2Fhtml%2Fportfolio-cv%2F1&bookName=&galleryDocIndex=7&category=portfolio-cv[Accessed 29th June 2016]
I like this one as well, it is simple and clean.
I like the home page in this website, it gives me a strong visual feeling.
http://www.wix.com/website-template/view/html/1240?originUrl=http%3A%2F%2Fwww.wix.com%2Fwebsite%2Ftemplates%2Fhtml%2Fportfolio-cv%2F2&bookName=&galleryDocIndex=8&category=portfolio-cv[Accessed 29th June 2016]
On the other hand, I don't like this contact page, because in this whole page, it doesn't have another colour between the pictures and words. When I read the word, the background will affect me to read, If I read longer, my eyes will feel tried.
http://richardoversmith.com/
My website
http://jonwilliamspottery.co.uk/?page_id=19[Accessed 30th June 2016]
I think these pictures in this website are very small.
http://www.knitmeastitchceramics.com/[Accessed 30th June 2016]
I prefer this website, simple, big pictures and no too much words.
http://www.apple.com/[Accessed 30th June 2016]
https://www.google.co.uk/[Accessed 30th June 2016]
I think white background is nice.
This is my plan about my personal website.
I changed my website background to white. Because it is very common and many website use white to be their home page background, in addition, white is clean and clear to show my informations.
I change my picture in home page
and delete the excrescent part.
I start to edit my 2D portfolio part, I delete the content in this page and add a new gallery in 2D part.
I upload my 2D works
replace the scenery pictures using my works.
Upload all of my works and replace the scenery pictures.
Edit the page title.
Edit the phone size as well, I changed the columns for 2 to 1, It is suitable my pictures and more clearly to show the pictures.
I upload my videos to youtube and copy the link then paste them to my website in 2D part.
I changed the type of words on my homepage
Edit the contact part.
Add the elements in contact page.
Change the elements position in contact page.
Try to change the tybe of word in home page, but it is not working to using word, it must to use button and add the link to link the other page.
Delate the button in the top part.
Add the new button, I decided to use grey button because the main color on my page are black and white, and my collection are color, so I want to use grey button to suit my page color and outstanding my collection.
Add the link on each button.
Add some logos of social media, I do not want they look colourful, I want they have same color with my page subject.
Add the link on these logo.
Accoding to suit my page color, I change the logo color to grey.
I want to change the contact frame,because it is green, it is different with my page color.
So, I change it to grey and change the model.
This is what my contact page looks like when I finished to edit it.
Add the introduction in my collection.
I add a new page about, and move my information from contact page to about page, it can introduce myself more detailedly.
I check the app maket, it might have some interesting and useful app I can add it to my website, but I want to keep my website clearly and simple, so I did not add more app or function to my website.
Fixed the contact page, try to change the frame model and position test how it looks like.
Add google map on contact page, because in the beginning, I think my contact page is empty, I want to keep it simple and clearly, but not empty, so I add the google map, it looks better.
Change the elements position, test which type is better.
Edit the size of button on phone page, because I think the buttons are very big.
make the menu buttons smaller.
This is what the phone page looks like.
In order to make my page balance, I change the size of button on top, make them align the edge.
Make my buttons and collection symmetry of the page edge.
Add the introduction in every pages, makes the reader more clearly what information in this page showing.
I try to change the position of introduction and makes it flush left, I think it probably better, but it is not very good, so I put it back, it looks more balance.
Change the position of introduction and picture, make them have same margin space with the page edge.
Add the introduction in video part, and fixed the size and position, make them keep the same size and same position with other page.
I used photoshop to edit my picture, makes it darker, it looks more comfortable.
Change the button part from green enter to iris art portfolio and simple arrowhead button, I think it is more clearly to guide the user what they can do next in this page and the subject about my website.
Test the button, I want to use same style button with my title.
I think the background picture is more darker, I want to change it.
I used photoshop to edit my picture lighter.
I make it lighter and change the title to white, it looks more clear, I want to change the button color to white as well, but I do not how to change, it is not working, so I keep to use black.
In order to solve the problem about "number word", I change the type of the word, and make every page and every word and title use same type of word.
Add the website name and date on the foot part in every page.
I did not write a title "about" in this page, but I make "hi, I am iris"bigger, means this page is introduce my self.
Delate the extra button in every phone page, fixed the position about the title and pictures.
Changed the showing way in phone page from 2 pictures to only one picture, make sure every page showing one picture at the same time. If there are more than one picture showing at the same time, this system will cut my picture, it is not better way to show my collections.
When I finished this edit, I try to text it on the HTC phone, make sure it is working in different types of phone.
(Home page on phone)
(3D portfolio page on phone)
(Contact page on phone)
