Dreamweaver website pages

These are the pages of my website that I created in Dreamweaver.

Dreamweaver: Creating a site from scratch

After having made a website using an easy online website such as yola, I will now create a website from scratch using Dreamweaver Cs6, although this is much more difficult, a website you have created yourself has many more possibilities and you don't have to credit the original designer of the website template... because there isn't one.

This is just the beginning

Div tags I added

I added some properties to the parent div

I added hyperlinks between thumbnails and pages

I am using this website (link) as a tutorial to create the website, it seems very informative and easy to use with pictures and lots of memorable explanation.

Alphonse Mucha

Throughout this project I have attempted to combine two things. Hats, and Surrealism/Art Nouveau style artwork.
My favourite source of inspiration for this was Alphonse Mucha, an Art Nouveau artist who was successful in the early 20th century.(24 July 1860 – 14 July 1939)
I personally have always found Nouveau to be very surreal itself, some see it as the predecessor of the Surrealism movement.
Alphonse Muchas artwork has inspired me with its quirky look and usage of intense bold black lines to make certain things pop out, and the general randomness and creativity which makes the work enjoyable to look at, I tried to replicate this in my own work to the best of my abilities.

Notice the bold lines, without those the central figure would blend in with the detailed background

Showing and promoting my work

Now that I have everything set up, designs finished, website made, and understand the rules of copyright, I decided it was time to publicize my website and work.
Firstly, I uploaded my designs to the popular website "Deviant Art" where I am guaranteed to at least get some views, and if a lot of people like them I could get literally thousands as the word spreads. I linked to my website and asked them to support the website by liking it via the facebook button or google+ button featured on the website.
I also created a facebook page, like most company's do these days, as its very important for a company to interact with its potential customers and provide an easy for them to keep up to date and for new people to easily find out about the company.

Deviant Art

 Facebook

Legal and ethical constraints further analysed

Here are more definitions from google and around the web as to what important legal and ethical words mean, if running a website, or doing most things online, it is important to know these things as to avoid getting into trouble.  Although there are a lot of rules to consider when creating a website, they shouldn't get in the way of making creative and unique website that potentially generates large amounts of profit or popularity, they simply serve to make sure that everyone who does make a website doesn't have to worry about anyone else stealing their ideas and concepts which could ruin their entire business or steal customers without having to have worked as hard as you did to come up with this stuff, and as such you should be glad these rules exist for the benefit of everyone.

 "Permission" Definition

 "Decency" Definition

 "Safeguarding" Definition

Copyright and intellectual property as defined by Google dictionary.

"Copyright" Definition

It is, basically, the right of the owner of whatever has been copyrighted, they have all rights to whatever it is and decide who else, if anyone, gets to make use or profit out of it.

 "Intellectual Property" Definition

Basically the version of copyright aimed at the creative side of things. They are very similar with different specific purposes.

Topped Hats goes live!

ToppedHats: http://toppedhats.yolasite.com/

The free yola website has been published, Yola is very simple and easy to use, it has a drag and drop interface and although quite limited compared to what the premium service, its quite good considering it is both free and anyone can do it without technical or artistic prowess.
Because of limitations, I just made a very simplified version of what I originally had in mind.

"Homepage"

 "Contact us"

"Designs"

Clicking on a thumbnail brings up the full size image.

 "All about us"

They ish so beautiful ;____;

These are the designs I created digitally. I'm sure they are considered very fashionable... or at least "unique"

Hat templates

I digitally created some templates using a vector based program, using these I can quickly create designs that would then be put onto my website and selected for sales.

Concept sketches.

Here is some traditional concept art that could go onto my websites, these are not the absolute final designs, although I would put these onto my website, and if people liked any of the ideas, they could request them online.

 Sloth beanie hat.

 Hat based off of a dark character.

 A quirky design based off of popular visor hats.

 An odd redesign of the fedora, including bell.

 Quirky baseball cap.

Casual pirate hat.

Free website maker

I'm going to attempt to create a free online website using something such as Yola.
These sites are free to create, often come with templates to choose from making site creation easy, and you get a domain name such as "www.example.yola.com" or similar, free storage space with a limit, and the potential to pay money to remove the "yola" in the domain name and get much more storage space, it would become a fully functioning website.
These types of sites are often used for galleries or online forums.

Investigating existing website design

http://www.deviantart.com

Deviant Art is a well known site, it is the most popular website for uploading and sharing artwork, used both professionally and by a large community of hobbyists.

The site itself is optimised for displaying pictures, lacking information generally as the photos themselves are what people use the site for. The site has a green, easily recognisable theme and tries to be innovative with its design to fit in with its artistic nature. The sites layout allows for easy management of your own account and following of your favourite artists and friends, when you aren't doing this you'll most likely be spending your time browsing the latest and greatest artwork, your searches can be easily refined or you can simply look at whats trending with the community.

The site is known for its large teenage user base, and they definitely try to facilitate and appeal to this audiance.

The site lacks animations (Other than the user submitted ones of course, gif avatars can be used which is pretty useful) And despite lacking animations or fancy typography, the site manages to look both modern and creative, looking different to any other website i have seen, i could easily recognise it from a small thumbnail like those used in internet browsers sometimes, which is probably something intentional.

Overall deviant art has a very well designed layout which is extremely effective in delivering a great user experience for artists interested in art as both a serious profession or a hobby.

The potential of online media

Online media has become an essential method of keeping contact with the general population. In this day and age if your business isnt taking advantage of the internet then you're doing it wrong, almost every business imaginable could benefit from a website, or at least something along the lines of a facebook page. They are easy ways for people to quickly find out everything they need to know about the business or company, for example for a fashion company like we aim to produce potential customers could come to the website, look at designs in a way that they otherwise couldn't and immediately order something from there home. The general ease of this increases the chances of getting customers since it doesn't require as much effort, which could of been off putting.
Online media is already completely integrated into daily life and will probably continue to become even more essential, to be successful there really isn't much choice other than to expand your reach online.

Connecting with the online world mind-map

Heres a quick mind-map showing some of the many different methods of connecting to the online world, a great asset for anyone looking to reach an audience.

Here, have a website design

Toppedhats.com/

"Homepage" design

The main page of my website, with featured and interesting images from around the site featured in the image boxes, big links to the other pages and one large image that is reserved for the current most important image of the site, one that deserves attention(money maker ;) ).

"Order now" design

This is where hats are purchased if any happen to be on sale. They are displayed around the page, with the selected image appearing big with details and a price. Theres also a buy it now button...

"Designs" design

Conceptual sketches and drawings of hats that aren't yet for sale but can gain attention or be requested.

"All about us" design

Information about the company.

"Help!!!" Design

Help for anyone who might need it, answers to FAQ and obvious answers.

Website Mind-map

http://www.mindmeister.com/296125812/websites

This is a mind-map to give me a better understanding of website layouts, what to include in my own before I attempt to design Topped Hats.

Topped Hats Logo

Normal and inverted designs for Topped Hats company website and franchise. I tried to make it contrast, stand out and relate to the purpose of the website.

Topped....Hats?

I just had the brainwave idea of calling my website company "Topped Hats" Topped meaning "Be at the highest place or rank" indicating my site to be the best at what it does, and the name is a pun on top hats, which should make it easy to remember while relating to the sites theme. I will now work on making a logo for this =|:D

Well now I know what works and what doesn't... What next?

Okay so I have taken a look at some interesting websites and have a pretty good idea of what works and what doesn't design-wise.
My ultimate goal is to make a website related to fashion, I decided to do this focused on hats, with a surreal element as I think they would be fun to design. My website will include a page of conceptual fashion designs for surreal hats, some primary photos that have been editing and more. My knowledge of fashion is fairly limited however, but  hopefully  I will be able to design some interesting things, I will include traditional sketches, photos, photo-montages of existing designs to closely represent my own ideas and digital drawn examples of my ideas.
I want the featured images of the site to be displayed on the home page so they are easily accessible and visitors will know the sites purpose straight away. I will  also include a company logo for the site as I have found that to be an important aspect of most of the sites I have visited.

Good and Bad website designs

The internet is huge, and there are countless websites, despite this some manage to stand out by being modern, effective and  aesthetically  pleasing.
Today I have looked at both good and bad website designs, designs I should learn from, and some designs I should avoid...

The GOOD


AndPeople: 
andpeople.co.za/
This site is frankly amazingly well designed, the companies iconic logo is unmissable, important images are large, expanded upon mouse-over feature a small description and link to a portfolio. This website manages to be very original, well designed and very easy to navigate in  an interesting, creative way.

Whitney Museum of America:
whitney.org/
I noticed that this website also features its logo in a very obvious and creative way, this one's follows you as you scroll, drawing attention to itself. I will incorporate similar ideas into my own website.

Tractorbeam:
tractorbeam.com/
What I really love about this website is the great way it displays everything to you in these squares, no space is wasted, it has enough colour and it looks great.
I will definitely try and do something similar in my own website.

The BAD

The world's worst website ever:
theworldsworstwebsiteever.com/
Since i'm going to be looking at bad websites, I decided to begin by looking at the worlds absolute worst. Obviously this is intentionally bad, but it still perfectly illustrates what not to do, the contrasting colours are ugly, its difficult to navigate and full of pointless stuff.

Arngren:
arngren.net/
This is the most cluttered website I have ever seen, its cluttered, ugly, too many colours and its completely impossible to navigate. Definitely helpful in knowing what to avoid.

Feng Shui Interior Design:
jamilin.com/
The colours used on this website are terrible, the clash of neutral and colourful makes it ugly and difficult to read, and therefore navigate. The website is just a pain to use.

Art throughout 20th century overview

Here I have researched some of the key art movements from my  previous  min-map, featuring art movements spanning across the entire 20th century.

Art Nouveau 1890-1910:
An art style that lead to many other art  movements, in some ways one of the the most important ancestors of modern art. I have a  mood-board  for this earlier in the blog.

Fauvism 1900-1910:

A very  colorful  style of artwork that gained a reputation as being wild for its visible brush strokes.

Cubism 1900-1920:

Pablo Picasso is a name that is recognized throughout the entire world, his work has simply revolutionized art. In cubism, objects are broken up, analyzed and then reassembled in an abstract way.

Futurism 1910-1920

This style attempted to portray high speed movement as much as possible to represent pollution and cities, noise and other modern chaos.

Dadaism 1916-1923

You may recognize this as one of the most controversial art movements of the last 100 years, Dadaism existed to challenge art, what artists can do, and succeeded to change the worlds perspective on art.

Pop Art 1950-Ongoing

Popularized for featuring themes and techniques drawn from popular mass culture such as comic books,  celebrities  or advertising.

Digital Art 1970-Ongoing

Digital art can be completely computer generated, or it can simply refer to any artwork created using a digital medium. Perhaps the most important art evolution in history, giving the masses access to any tool imaginable and new creative  possibilities.