Website

Analysis of Websites:

https://martinsky.club

This is the website of my chosen artist and is very simplistic in the sense that it only has one page which has links to all of Sky's social platforms, with the heading 'Follow Martin Sky' in a handwritten font.















www.axwellingrosso.com

First Page of Axwell and Ingrosso's Website

This is the website of one of the three artists which I chose. The main colour scheme of Axwell and Ingrosso’s website is mainly in black and white (black background/white text), the text is also exclusively in block capitals. 

The layout of the website is fairly simple as there are only a few hyperlinks which lead to their tour page or their merch page or for you to purchase their newest single.

The Page with Tour Information

When you click on the hyperlink the colour scheme stays the same and the use of picture stays somewhat minimal as the only picture you really get on the website is the cover art for their new single, pictures of merchandise you can purchase and there are three photos of Axwell and Ingrosso which are constantly on rotation. However, the photographs of Axwell and Ingrosso do include a lot of intense, moody coloured lighting which works well with the constant theme of black and white which their website has.

Merch Page

Merch Page

Jai Wolf

www.jaiwolf.com

First Page of Jai Wolf's Website

This is the link to another example of a website of one of the three artists that I have initially chosen. Much like the Axwell and Ingresso website, Jai Wolf's it is mainly black with a white text, which is again all in capitals.

The layout of the website still also gives you the option to check out the latest tracks from Jai Wolf with the option to buy them. There is also a drop down menu which give you hyperlinks leading you to different pages on his website. Within these other linked websites you get links to Jai Wolf's official accounts. Just like on the page where he is promoting his single 'Starlight', there is a link to his Spotify account at the very bottom of the page. There is also the option of subscribing to a newsletter where you will get all new information on Jai Wolf's work via email. 

The use of photographs again remains only to the thumbnails, cover art for his singles and pictures of products from his store.

Menu Page

Tour Page

              

Music Page

Contact Page

             

Whilk & Misky

www.whilkandmisky.com

First Page on Whilk and Misky's Website

Unlike the websites for Jai Wolf and Axwell and Ingrosso, the website for Whilk and Misky has a blue camo colour scheme and it isn’t solely in black and white. This website is then somewhat of an anomaly due to the fact the other two websites I have looked at are in black and white, suggesting that black and white is a common theme for the websites of dance music artists.

The first web page also gives the viewer somewhat of a top playlist of their work which they can click on a listen to via YouTube. This is then accompanied by a small bar at the bottom of the page with a suggested track that you can click through to see a wide variety. When it comes to the 'Upcoming Shows' page on their site, it is empty empty with a disclaimer saying their are no current updates/shows.They also have an update page, which the other two websites don't seem to have, and they are links to posts you can click on which are usually on their Instagram or Facebook, and it gives you a little message updating you on what they are doing and how they plan on moving forward.

Updates Page

The layout is again simple, with a small bar menu at the top of the page which will hyperlink you to different pages of the site. They also have the option to click on social media icons in order for you to go and visit their different social media pages, with the option to subscribe to a newsletter which is sent via email. The use of photographs is also again very minimal, as the only photos which are visible are thumbnails, cover art and product photos.

News Page

Tour Page                                                                                 Store Page     

    

                                                                                                                                     

Typography:

Typography is a key element in presenting an artists' work on their webpage. The typography used for most dance artists all seems to be incredibly similar. For the sake of comparison, I looked at the Billboard Top 100 Dance Artists of the year, and then I took a mixture of artists from the top and bottom of the list, in order to show comparison on how it may change from a well known artist to an artist who isn't as popular; and then analyse the different typography they use on their websites.

Calvin Harris:


The Chainsmokers:


Kygo:


Major Lazer:


Martin Garrix:

Flume:

Clean Bandit:

Lost Frequencies:


Cash Cash:


Jax Jones:


Steve Angello:


Jonas Blue:

San Holo:



Kungs:

Illenium:

The general consensus, whilst looking at all of these artists' websites is that the use of block capitals is possibly the most popular preset. The fonts that are used are also somewhat similar, and putting logos aside, they are all very basic fonts, and don't seem to have anything particularly different or special about them. 

                                                                                                                                     

Use of Colour:

On the websites that I researched the main colour schemes seem to predominantly black backgrounds with white text, and only very few of them have a colourful colour scheme (like The Chainsmokers). The black and white colour scheme does give the websites a more sophisticated look. However, with me trying to make a website to fit the work of Jai Wolf, I believe that I would like to use more colour than most artists use, therefore, I will test out different colour palettes for what I want my website to look like. Or the alternative idea, as to just having a solid colour background, would be if I used photographs for a background, just like Lost Frequencies' website.

 

                                                                                                                                     

Conventions of a Website:

1) Logo Placement

Typically, logos are placed in the upper left of the page. The aim is to also have the logo on every page, so that when a viewer clicks on a link on your page, the logo will still be on that page, letting them know that they are still on your website.

2) Main Navigation

The main navigation should appear in a bar across the top of your site. This is where viewers will look to work their way around the website, it helps to make the navigation as simple as possible.

3) Link Styling

Make the text for the links stand out from the main text on your website. This means, links should either be in bold, or underlined or even in a different colour. This lets the viewers clearly know what are links and what is just normal text.

4) Standard Icons

Icons which are common are good to be used, and you should be careful to use popular icons which people will immediately associate with something else. For example, using an icon with the 'f' in it, people will automatically associate it with Facebook.

5) Visual Hierarchy

Visual hierarchy allows the viewer to know what to look at or read first., through putting the most important information in a place which will surely be viewed. This then brings viewers back to a structure, meaning processing the page is something they will do automatically and find easy. If this hierarchy is lost the viewers may get confused.

6) Minimalism

A minimalist design allows the viewer to navigate the whole website with ease. Generally people don't like their senses to be overpowered, therefore, when it comes to loading the website up with photographs and links, there should only be ones that are necessary on there.


                                                                                                                                     

Use of Images on Websites:

The do's and dont's of images on a website:

DO

1) Images what draw the most attention are usually of ones of a human face. Also, any movement will get extra attention, so try to include images that change. 

2) In order to draw more attention to your page try to cover relevant information with an image. Audiences will generally look at the image first and then work their way around the page taking in the relevant information. 

3) Use captions under images, make sure they are relevant o your information. 

4) Use images of people with the emotions you wish to evoke from your audience. Because of mirror neurons, we have a natural tendency to empathise with others, even if that other is just an image of a person. If you use a picture of a smiling face, your prospect will smile, too. If, on the other hand, you use an image of somebody angry or sad, you will create the same emotions in your prospect. In most cases, you will want your audience to be in a happy state. This is because when we’re happy, we tend to be more open to trying new things. 

5) Break the text to reach the optimal line length, people don’t like reading long lines, use design elements, like images, to break it to the right length. Just remember that images need to support your message, so they should be aligned. Don’t just use random images. 

DON'T

1) Make sure you don't overuse images.

2) Don't use images that have nothing to do with your message. 

3) Don’t use images that have no other purpose rather than simple decorate your site or fill the space.


                                                                                                                                     

Basic Layout of a Website:

Homepage:

Using Jai Wolf's website as an example, typically the home pages for an artists website, shows their latest release and links you to see it on different platforms. For example, Jai Wolf's homepage shows the thumbnail for the music video for his new single 'Lost' featuring Chelsea Jade. This then has the Youtube video embedded, so you can watch it on site, and it also gives you a button underneath allowing you to watch the official lyric video, and go and see it on streaming platforms such as Spotify and Apple Music. 

'Music' Page:

This is the page where Jai Wolf promotes his music. This page provides accessible links to all of his music which has been released on the streaming platforms (Spotify, Apple Music, Soundcloud etc.) The layout of this page is incredibly simple and just requires you to scroll, there is no information. on there that is overwhelming and it is very easy to navigate. 

'Tour' Page:

The layout of the 'Tour' page is also simple, it just requires the ability to scroll. The dates and locations are then on the left, and there is a small button on the right which will take people to the relevant website in order to purchase the tickets for a show. 

'Videos' Page:

The layout of this page is simple and easy to navigate. This page includes the embedded Youtube links allowing you to view the music video whilst staying on the main webpage. 

'Photos' Page:

This page has a grid layout, and it shows the Instagram feed of Jai Wolf, with his username at the top of the page. When you click on a photograph from this page of the website, it takes you straight to Jai Wolf's Instagram profile.

'Contact' Page:

This page is one that is straightforward. This page provides information for how to contact Jai Wolf's management team, in regard of business, and at the bottom of the page it even allows you to signup to Jai Wolf's Newsletter, which you will receive via email. 

                                                                                                                                     

Constructing a Website: Reviewing the Templates

Using the Wix website builder, I looked through all of their default templates for music websites, and I then intend to use the template and change the contents of the website to fit it to my liking. 

These are the templates which I liked the most:

I think the template that I will use is the 'Kody Hanson' template, because I feel as though that is an appropriate template which could mirror the work of Jai Wolf.

                                                                                                                                     

Building a Website:

Homepage:

This is the completed version of my homepage using original images for my artist Martin Sky.





For the top of my homepage I have the artists' name in all capital bold arial font. This heading stays the same amongst all of my pages, allowing people to know that they are on the site of Martin Sky.



I have then used a simple banner navigation menu, which identifies all of the pages on my website, so that people can explore different pages.



I have then put the cover art for the song 'Layers' on the homepage of the website with a button underneath saying 'Listen Now' to try to entice people to check it out. To create the actual cover art, I used an original image on top of a white square, with 'Layers' written on top in arial font.