TABLE OF CONTENTS
1 QUESTION 1 – WEB PAGE DESIGN 1
2 QUESTION 2 – CREATING A COLOR SCHEME 5
3 QUESTION 3 – COMPARING WEBSITES WITH HOSTED SCRIPTS 7
4 QUESTION 4 – GUIDELINES OF WEB DESIGN 9
5 REFERENCES 10
WEB PAGE DESIGN
-3683003466465URL : HYPERLINK "https://www.mercedes-benz.com.my/passengercars.html" https://www.mercedes-benz.com.my/passengercars.html-36131576200
URL : HYPERLINK "http://www.perodua.com.my/" http://www.perodua.com.my/
Reasons for Appealing:
The Mercedes Benz website is more appealing out of the two shown. It’s because of its font and colour usage. The first step to making a website visually appealing are the colors we design it with. It’s what first catches our eye as we bypass a bus or makes us pause when flipping through our Facebook feed. Colors catch the eye, and provides an instant layer of communication. Even before the conscious mind has started thinking, the subconscious has already assessed if something is interesting or not. Purely based on colors. This website’s background colour is just perfect for it. It punches the body of the website page forward and keeps the focus on the website itself. Black is useful for sites that contains photography and art. Furthermore, the font colour is in white which matches to background colour. It helps people to read the text without any struggle. The font size and style are used in a correct balance.
In this website the HYPERLINK ;http://www.sourcesoftsolutions.com/ux-ui-design-services/; web designers already understand the psychology of visitors while putting their imagination into reality. It has an attractive headline saying “The best or nothing”, “Best Never Rest”. This website’s layout it’s easy to see, has strong contrast between their elements, and highlights the most important points. The language to convey message remains English throughout the website.
Best services for writing your paper according to Trustpilot
Moreover, this website is more appealing because of its pictures and graphics. Good photography brings instant visual appeal, class and quality. It’s still unusual today for a car website to have well composed and well lit photos of the car’s interior and exterior. This is the easiest step to one to up their competition and help to build trust with their visitors. Graphics, especially info-graphics, provide a lot of information in an interesting and efficient manner, allowing visitors to get a complete story from a single image.
Reasons of Unappealing:
The Perodua website is more unappealing out of the two shown. Mercedes Benz website has its own favourite icon which called favicon. A square image associated with a web page. It displays in the browser address bar, tab. Whereas it not in this Perodua web page. Favicon is easier to look for a familiar icon than to read all of the website names. Thus, it has to improve the user experience. In addition, Perodua web page colors are not effective and dull. This web page theme is not good as it’s not catching viewer’s attention. Even the quotes don’t have solid colour background.
This website doesn’t stick to one language. While creating web page language is very important. This web page uses English for some and then Malay for some. For example, on campaign and promotions (Perodua M team) in the web page they use Malay to convey the information. This web page is unorganized. It makes it uncomfortable to view. Also, the web designer for this page should have given productive border to the headline to emphasize.
Besides, the Perodua web page does not contain many pictures and graphics. Images speak volumes about your company and play a key role in your website’s look and feel. The website doesn’t include borders, various graphic elements, hover over menus/images and transition of photographs. Navigation to important sections wasn’t nearly as intuitive as it should have been.
How to improve an unappealing website:
Background colour is very important for a website. We often find it helpful to have a different colour background. By doing this, it gives a enthusiastic feel to the website. So, Perodua website should use attractive colors. Red and black are attractive and powerful and would go well for websites that are focused on products meant to be viewed in graphics more instead of text. Web designers should add colors according to their products to grab attention. Web designers can use helpful colour scheme tools such as paletton.com to choose a scheme for the web page. As a rule, we recommend that the website employ the use of 2 – 3 colors at a maximum. Often the biggest statement of a site can make is in its simplicity.
Graphic design must play a fundamental part of any web design. It not only is the creative spirit of your site but is critical to the overall branding strategy of a product, business or recording artist. Graphic Design encompasses everything from back ground images, banners and button controls to colour scheme, text style, and graphics. An ideal graphic design can give a huge boost to your website by increasing its visual appeal, professionalism, brand value and usability. Visual appeal is vital to web design because it promotes communication of ideas to your viewers by stimulating aesthetic senses and increasing a feeling of connection. Effective graphic design also lends an air of professionalism to your site. Visitors are more likely to consider your content worthy of reading if the overall website gives an appearance of authority on the subject.
In addition, the unappealing website should improve their website by including a favicon as it’s a unique symbol. Global companies have recognizable icons, which help them stand out from the crowd of other web resources. It was created for a fast visual search of the necessary website among thousands of bookmarks on the Internet, which helps your target audience find you faster and simpler.
Information footer is an important element in a website. A footer is the how you can connect to your audience with a wealth of information without getting in the way of the design. Because the footer is at the bottom of the page, it is a logical location for a small site map, company or contact information, links and context for your site. Make the footer useful and keep it simple. Whether you opt for a couple of buttons or link-style design, the footer should be designed to mesh with your site but may have a much more minimalistic feel. These elements will guide us to create or improve a website to make it attractive to visitors and grab their attention by one look. It will lead the website to be more trending in social media and business too.
CREATING A COLOR SCHEME
78422534925
To create a color scheme one needs to know the meanings behind colors and color terminology. After which, we have chosen to go for a monochromatic scheme. Monochromatic color schemes are made up of different tones, shades and tints within a specific base hue. So as shown above is a traditional monochromatic scheme, with white added in as a neutral. By using tones, shades, and tints we wish to interest people viewing the website. Monochromatic colors gives out a soothing effect to the viewer.
Firstly, the background color we chose is cream/beige (#FFFFCC) as it’s a very calming and easy on the eyes color. When a background is too bright, it can be distracting thus the reason we have chosen a simple color. Next, we’ve used the yellow ground color (#FFFF99) for text color and element background as it’s a very happy and stimulating color. Lastly, we’ve also added the color orange (#FF731A) as a background and text color as it’s a vibrant and inviting color. These colors are easy to design with and causes no distraction and you can easily focus on the content.
A social website like Facebook or Twitter is where this can be applied because this type of websites focus on minimal design as they need to focus on content they share. Business websites may also prefer to use this color scheme as they want a simple web design so that they can emphasize on their products. Also, even blog-sites may use this scheme as they share long posts and these colors will make it easier to read.
RESOURCES: HYPERLINK "http://www.sensationalcolor.com/category/color-meaning/color-meaning-symbolism-psychology" l ".WTDJtmiGPIU" http://www.sensationalcolor.com/category/color-meaning/color-meaning-symbolism-psychology#.WTDJtmiGPIU
HYPERLINK "https://meyerweb.com/eric/tools/color-blend/#FFFF99:FF6644:8:hex" https://meyerweb.com/eric/tools/color-blend/#FFFF99:FF6644:8:hex
-94043576835
COMPARING WEBSITES WITH REMOTELY HOSTED SCRIPTS
Remotely hosted scripts are scripts created by third parties and people creating websites include these already made scripts to make life easier. Integrating these scripts on your website is quite easy as you only have to copy/paste the codes on your HTML document
-20320835660All websites require contact forms to help customers or viewers with enquiry questions. These forms can be added to your website using hosted scripts. In this question, we have chosen two such websites who have scripts for form processing and we are going to compare these websites to see which one is more convenient.
18415177800
Formbuddy.com Response-o-matic.com
Ease of Registration There are 2 types of registration, Free and Premium. Shows the features for both types. Needs you to have your own website URL. Provides username and password. Sends a confirmation E-mail to you for going further. Has a separate tab called Features that shows 3 types of registration; Free, Professional and Business. Provides username and password. Send a confirmation E-mail to you for going further.
Number of services offered For Free Members:
Store upto 500 form submissions
HYPERLINK "http://www.formbuddy.com/adpolicy.html" Pop Under or Banner advertising
No link back required
HYPERLINK "http://www.formbuddy.com/auto.html" Custom Autoresponder
HYPERLINK "http://www.formbuddy.com/formhosting.html" Form Hosting
Custom thank-you URL
Can also store the form data submitted by your visitors
For Free Members:
Unlimited questions per form & unlimited submissions per form
Forms are hosted from four servers, so even if one of our servers goes down, your forms will still be available
Data automatically backed up
Data is kept safe and encrypted using SSL
Integrated spam filter keep spam forms out of inbox
Instantly receive submissions and notifications
Choose a web page to send your visitors to after their submission.
Site banner or ads Shows a pop up ad or banner ad after someone submits form. You can choose one. Shows a pop up add after someone submits form.
Ease of use After signing in, choose Form Builder from the menu section. Shows specific contents of a feedback form in the form of check-boxes including questions like Name, Email, Gender, Address, Country, Phone, URL and Comments/Suggestions. Has a space to enter a website to redirect to after someone submits your form. Provides the HTML code to add to your web page. Also has the option to have a preview of the form.
NOTE: Need to create a form within 10 days of joining. First you click on New Form tab and then give a name to your form. To get started they provide two questions: Name and Email. Then there is an add question tab where you can choose from different type of questions such as Short Answer, Long Answer, Radio Buttons, Check-boxes and Comment box. After finishing the layout you can choose what should happen after someone submits your form; Show a thank you page or redirect to another website. You can also choose if you want the form data emailed or not. Lastly, provides the HTML code to add to your web page.
NOTE: Need to delete previous form to create new one.
Our preferred one If we had to choose one to include to our web-page, we’d use Response-o-matic. It’s because it’s more flexible when compared to FormBuddy and lets you add your own feedback questions. The instructions are more clear and easy to understand. There are no time restraints in it like in FormBuddy.
GUIDELINES OF WEB DESIGN
The chapter that got my interest is Chapter 14: Graphics, Images, and Multimedia. I chose to read this chapter because nowadays we often use graphics, images and multimedia on web pages to make the web pages more appealing and attractive. Other than that, it is really important to understand how we can use them on our web pages efficiently. Another reason why I chose this chapter is because graphics, images, and multimedia can be used widely in a variety of fields such as education, business, communication and so on. There are about sixteen guidelines for us to read and understand. Among them, I find four guidelines which I think are useful.
The first guideline is to use a background which is simple especially if they are used behind the text. Visitors can read the text on a web page with a simple background easily. A complex background may make it difficult to read the text. The download rates of a web page with a simple background is faster than a web page with a complex background.
One of the other guidelines is using video, animation, and audio meaningfully only when they help to convey or are supportive of the website’s message or other content. Multimedia elements can attract users to watch it. Users can get to the most important message of the website quickly and they will not feel bored to compare to reading texts. The time users waste on the website will decrease, and it is a more effective way of spreading the information to other people by sharing the multimedia elements.
The third guideline is placing your organization’s logo in a consistent place on every page. A website with the organization’s logo on each web page can let the users recognize and know the website belongs to the organization. It also helps the users to confirm that they are still on the organization’s website even when they click to view another web page of it. A website with an organization’s logo is more like a validated official page of the organization than a website without an organization’s logo on it. The users can search for the official Web site by recognizing the organization’s organization’s logo putting on the top left corner of the Website to prevent reaching for another Web site.
The last guideline is to use thumbnail images to preview larger images. When viewing full-size images is not critical, first provide a thumbnail of the image. It is essential to provide a thumbnail of the larger image to avoid slowing down the download rates. This allows the users to make the decision of loading the full image of the thumbnail or not. The users can save their time on loading images, they just need to load the larger high-resolution images and images brief information they need for a better experience.
REFERENCES
QUESTION 1:
HYPERLINK ;https://www.mercedes-benz.com.my/passengercars.html; https://www.mercedes-benz.com.my/passengercars.html
HYPERLINK ;http://www.perodua.com.my/; http://www.perodua.com.my/
QUESTION 2:
HYPERLINK ;http://www.sensationalcolor.com/category/color-meaning/color-meaning-symbolism-psychology; l ;.WTDJtmiGPIU; http://www.sensationalcolor.com/category/color-meaning/color-meaning-symbolism-psychology#.WTDJtmiGPIU
HYPERLINK ;https://meyerweb.com/eric/tools/color-blend/#FFFF99:FF6644:8:hex; https://meyerweb.com/eric/tools/color-blend/#FFFF99:FF6644:8:hex
QUESTION 3:
HYPERLINK ;http://formbuddy.com; http://formbuddy.com
HYPERLINK ;http://response-o-matic.com; http://response-o-matic.com
HYPERLINK ;http://answers.google.com/answers/threadview?id=102267; http://answers.google.com/answers/threadview?id=102267
HYPERLINK ;https://www.phpjabbers.com/; https://www.phpjabbers.com/
QUESTION 4:
HYPERLINK ;https://www.usability.gov/sites/default/files/documents/guidelines_book.pdf; https://www.usability.gov/sites/default/files/documents/guidelines_book.pdf
