Wednesday, 5 December 2012

Evaluation of My Website

I was quite happy with how my website turned out. The animation for the top banner worked as I intended it to and the pages all worked first time round. I ran into some issues while adding images to some of the pages as they sizes were wrong but that was easily solved by resizing them on photoshop. If I had more time i would of added another animation to the main home page and possibly more on the mobile site. The mobile site didn't in my opinion turn out to great as there wasn't a great deal of material I could put on it. The video wouldn't go on in the correct size which has left my video page blank. If i had the chance to do it again I would of spent more time figuring out what to put on there instead of the video.

Tuesday, 4 December 2012

Differences between mobile and desktop websites



The biggest difference between desktop and mobile web pages is screen size and resolution. Most desktop monitors are 19-inch to 24-inch diagonal size, whereas tablets and mobile phones are generally 3.5 inches for phones or 10 inches diagonal for tablets. Zooming-out does not successfully convert a web page to being mobile-friendly, as this only makes the text unreadable.
Most mobile pages remove some or all of their sidebar navigation links, and replace them with collapsible/expendable menu widgets. With desktop sites you have a mouse with a pointer to make clicking links much more easily accessible. With touch screen smart phones this is replaced with ‘finger tapping’, which is not always completely accurate resulting in you having to zoom in or expand the page. URLs are also different on mobile sites compared to desktop as the usually have the letter m before the web address indicating that it is the mobile friendly version. Advertisements on mobile sites are also greatly reduced as they will appear at the bottom of the screen or as a pop up to another page compared to desktop advertisements which flood web pages. 

Own Website Research


Own Web Design Research.

For my Website for the Shock and Awe project I looked at ww.apple.com to see how their company designed a website for their products and how it was laid out to get an idea how to make my own. I have decided on a colour scheme of black white and red. The top of the page with have the name Shock and Awe as the main heading which will have an animation of the words glowing red. Underneath this banner will be the four buttons which are; Home, Info, Storyboards and Video. The background to the main page with contain a short description of the company and will have the company logo in the bottom corner. As with the banner and the buttons the image theme is smoke, which I have created with a brush tool in Adobe Photoshop. The pages will contain information on the company, storyboards and illustrations on the video project and links to blogs with additional information and research, and the final video created for the main Shock and Awe Video project. 

Main Principles of Web Design Research


Research on Main Principles of Web Design and Animation.  Including 3 examples of existing websites.
The examples being used are www.blogger.com www.apple.com and www.youtube.com.
The web host is the company that houses your site and provides you with email addresses, space for your web pages, free scripts for blogging, forums, social networking, shopping carts and more. Web sites are hosted on servers that offer a range of additional services such as PHP, Java, ASP, client side scripting, Perl and CGI. For example www.Blogger.com is hosted on Google’s own servers. Blogger offers all kinds of add on gadgets that are handled by the server. For example you can embed YouTube videos without any coding since Blogger offers automatic coding for you to embed video.

How you create your site will depend on the kind you want to make. For example, if you want to create a blog, you can take advantage of the built-in templates that come with the blogging WordPress platform. Alternatively Blogger is very popular.
No coding experience is necessary. All you do is search for the theme you want to use, activate it, make your customizations and your website is ready to go.
If you don't want to use WordPress, you can hand code the site or use alternative web design software such as hand coding with HyperText Markup Language (HTML), Extensible HTML (XHTML), Dynamic HTML (DHTML). The other option is to use custom web design software such as Adobe DreamWeaver. You can also embed animation and interactive content using Adobe Flash. 
The advantage of DreamWeaver is that it gives you an immense amount of control over how pages are laid out and designed. it also allows you to work with HTML eg tables, text, font, colour, layers, frames, body, links, anchors as well as editing, modifying, inserting code and  formatting with Cascading Style Sheets.
 Youtube and Apple are more likely to have been developed this way.
There are many different types of websites. From ecommerce, membership to content sites/blogs.
There are basically two kinds of websites you can create.
1) Static HTML (Content is uploaded and displayed "as is")
2) Dynamic (WordPress, Joomla, etc.) Dynamic means information is pulled from a database so you can display your website content by date, category, etc. Think blogs.
www.apple.com is an example of a dynamic website as you everything is handed coded and nothing is done for you unlike Blogger which codes and embeds for you. It uses SSL security as it has a shopping cart and its own online store where you can purchase items.
Static HTML sites are not that popular these days. In order to create them, you have to use HTML, templates or buy some kind of software like Dreamweaver, Artisteer, etc.
In 2004, WordPress revolutionized the way we build websites because there is no software to buy. You simply install the WordPress script from your web host, launch the admin panel, choose a theme design and begin writing your content. You can see my WordPress site here.
Because WordPress is dynamic, you can add functionality very easily using plugins (which are demonstrated in the WordPress video below). YouTube again is a different type of website but similar to Blogger in that it does things for you. Such as uploading videos which the server embeds itself and it also works through Google. Alternatively to Blogger where you are not selling anything as is the case with Apple, YouTube actually offers an opportunity to pay you through Google adsense which requires a partnership depending on how popular your videos and account are.