# Composer-turned-web designer's composer website



## gtrwll (Jan 20, 2021)

Hiya there,

So I've been studying ICT for the past year and one of the areas I'm covering is web design. One of the recent projects I did was to build my own composer website from scratch using the tools I've learned. Here's the site:



Home - Janne Seppänen | Skyhammer Sound



The aim was to make a responsive, mobile-friendly page without all the clutter that the sites made with a website builder have. I took the layout that I had designed from my old website and built the new one using Bootstrap as a framework and falling more and more in love with Sass. Yes, it's very simple, but I reckon that's not the place to pull out all the bells and whistles.

Any thoughts will be appreciated, as this was a learning project first and foremost!

(...and if anyone wants their website designed, feel free to shoot a message )


----------



## Jdiggity1 (Jan 20, 2021)

Definitely very snappy and responsive! Nicely done.
I'd just look out for consistency with paddings/margins when it comes to page titles and space between elements.
As an example, the page title on "Listen" does not have the same space before it as other page titles. The footer is also not spaced enough from the body content when compared to the headings.
These are just tiny design choices though that won't matter to everyone. I just find consistency helps with the overall aesthetic and minimizes the potential for looking "amateur".


----------



## Alex Fraser (Jan 20, 2021)

Nice effort mate! Clean, easy to navigate.

Finding Bootstrap made my life at lot easier. The thought of tooling around with Wordpress makes me shudder still.

My knee jerk comment would be to replace "info and contact" in the menu to "info" or "information" as (a) You'll allow more space for it to wrap properly and (b) You've already got a big "contact" button up there.

You can probably get rid of the "production music" link too, as you've already outlined it in your services page. That would make everything neater and calm my OCD. 😉👍

But great start. You should see my first website. It was a shocker.

Edit: Oh, and some of your buttons are missing h-refs.


----------



## José Herring (Jan 20, 2021)

I like it for its simplicity and color scheme. Could you PM for your rates? I may be looking for something in the not too distant future.

I'd basically would just want almost exactly what you've done.


----------



## Pier (Jan 20, 2021)

It's nice and simple and does the job.

In terms of design I think you could be more consistent with paddings and margins.

The Contact and Listen buttons on the homepage don't seem to do anything though.

Been doing web dev for 20 years. If you get stuck and need some help send me a DM!


----------



## jonathanparham (Jan 20, 2021)

basic, to the point. I like it


----------



## creativeforge (Jan 20, 2021)

Nice and sharp.  

But yes that Listen link isn't 'live."


----------



## darcvision (Jan 20, 2021)

simple and nice website. i like it
i wonder what database did you use for storing your data? i want to make my own website but i afraid with the security stuff and the price is similar to wix (75 bucks per year including domain .com). that's why i chose wix right now.


----------



## gtrwll (Jan 20, 2021)

Damn, this is some really great advice, thanks everyone for taking the time to do this. I really, really appreciate it! I just woke up so I’ll get back to the questions in a bit, just wanted to chime in the thanks to all of you!


----------



## gtrwll (Jan 20, 2021)

stefandy31 said:


> simple and nice website. i like it
> i wonder what database did you use for storing your data? i want to make my own website but i afraid with the security stuff and the price is similar to wix (75 bucks per year including domain .com). that's why i chose wix right now.


I used Namecheap for hosting the site. It's probably not the best around as it was quite affordable (as the name suggests), but on the other hand they do have the standard 2-factor authentication available for logging into their services. I think the bandwidth could be better, as loading the different pages seem to take a bit longer than anticipated.


----------



## kgdrum (Jan 20, 2021)

I have trouble reading some of the light font on the white background otherwise clean and fresh looking.


----------



## gtrwll (Jan 20, 2021)

Alex Fraser said:


> My knee jerk comment would be to replace "info and contact" in the menu to "info" or "information" as (a) You'll allow more space for it to wrap properly and (b) You've already got a big "contact" button up there.
> 
> You can probably get rid of the "production music" link too, as you've already outlined it in your services page. That would make everything neater and calm my OCD. 😉👍


This is some solid advice, thanks! I'll definitely try how it looks like if I do those changes.

And thanks everyone for pointing out the missing hrefs, I guess one can become blind to his work after a while...

I'll have to do a check on the margins and paddings as well, it was my intention to make them identical on every page but apparently I overlooked something.



kgdrum said:


> I have trouble reading some of the light font on the white background otherwise clean and fresh looking.


That's a good point, are you on mobile or desktop/laptop? Accessibility is definitely a thing I have to take more into account.


----------



## Crowe (Jan 20, 2021)

I like the general layout, but upon opening the site I got this rather jarring artefact:


----------



## gtrwll (Jan 21, 2021)

Oh dear...you're not buying that it's a part of the design then?  

Did a quick change for the site but the browser hadn't loaded the changed site but the cached site instead, so I didn't see that. Well, that's fixed now as well, thanks!


----------



## Crowe (Jan 21, 2021)

gtrwll said:


> Oh dear...you're not buying that it's a part of the design then?
> 
> Did a quick change for the site but the browser hadn't loaded the changed site but the cached site instead, so I didn't see that. Well, that's fixed now as well, thanks!


Hah. The first thing to master when getting into development is the phrase:

"That's not a bug, it's a feature."


----------



## kgdrum (Jan 21, 2021)

quote:
“


> kgdrum said:
> I have trouble reading some of the light font on the white background otherwise clean and fresh looking.


That's a good point, are you on mobile or desktop/laptop? Accessibility is definitely a thing I have to take more into account.”

I am looking at this on an iPad


----------



## gtrwll (Apr 3, 2022)

Puhovpeny said:


> Great job! How did you start studying web design?


Thanks! I'm studying a Bachelor's Degree and the one I'm in covers a pretty wide range of basics, and web design and later web development is just something I gravitated towards, probably because it's much more visually tangible from the get go compared to "basic" programming.


----------



## Dinnyrishell (Apr 3, 2022)

It is a great job, buddy! The site is very easy to use and has a nice color scheme. But of course, web design lessons and the study of the psychology of the user of web resources are necessary for you. I am sure you will continue to develop in this direction and will soon surprise everyone with something unusual. I also started studying web design, but I learned UX/UI design online to understand better how to build a website tailored to the needs and thinking of users. I highly recommend you to think about it too.


----------



## gtrwll (Apr 3, 2022)

Dinnyrishell said:


> It is a great job, buddy! The site is very easy to use and has a nice color scheme. But of course, web design lessons and the study of the psychology of the user of web resources are necessary for you.


Definitely agree on that one, there would be so much to learn in that field. We’ll see what the future holds, now I’m concentrating more in what’s happening under the hood than what’s visible.


----------

