Feedback for new website

[jarod_peachey]

Project URL

https://jellydevelopment.com

I've just launched my new web development agency, Jelly Development. It's primarily focused on custom JAMstack development, but simple static sites as well.

I'd appreciate it if you could check it out, and let me know if navigating the site and understanding the services I offer is easy. Think about it from the aspect of looking to have some custom development done. Do I get that point across?

Thanks!

 

[Gummibeer]

Hey,

I will write it in order of appearance on the website. At first I'm on smartphone, so everything related to mobile version.

1) the header animation in height and background color is cool, but looks bugy/lagy if I scroll faster. I think it's because of some delays and so on instead of linear animation related to scroll height? 🤔

2) the wording "get started" related to "do something", like a quickstart guide for a framework. "Learn more" seems also not perfect for a link to "more about me".

3) mix of "we" and "I" - if you are alone behind this agency be proud of it and tell it like this. I know there was a trend of hiding behind a "we" to don't seem selfish or anything. But a lot of customers wonder who is "we" if they always/only talk to you.

4) "GET A WEBSITE" links to a page why JAMstack is cool - but nowhere any kind of request form. You should link to a page only with a sentence how long you need to respond and a contact form.

5) "THE JAMSTACK ADVANTAGE" seems to be on every page!? 🤔 On mobile this only bloats every page and doesn't clearly show what's really important/the content of this page.

6) "INTEGRATIONS" and "custom development" link to the same page. I would expect some examples what integrations could be. For example some cool APIs, a shop system, comments or whatever are common integrations are.

 

[jarod_peachey]

Hey,

I will write it in order of appearance on the website. At first I'm on smartphone, so everything related to mobile version.

1) the header animation in height and background color is cool, but looks bugy/lagy if I scroll faster. I think it's because of some delays and so on instead of linear animation related to scroll height? 🤔

2) the wording "get started" related to "do something", like a quickstart guide for a framework. "Learn more" seems also not perfect for a link to "more about me".

3) mix of "we" and "I" - if you are alone behind this agency be proud of it and tell it like this. I know there was a trend of hiding behind a "we" to don't seem selfish or anything. But a lot of customers wonder who is "we" if they always/only talk to you.

4) "GET A WEBSITE" links to a page why JAMstack is cool - but nowhere any kind of request form. You should link to a page only with a sentence how long you need to respond and a contact form.

5) "THE JAMSTACK ADVANTAGE" seems to be on every page!? 🤔 On mobile this only bloats every page and doesn't clearly show what's really important/the content of this page.

6) "INTEGRATIONS" and "custom development" link to the same page. I would expect some examples what integrations could be. For example some cool APIs, a shop system, comments or whatever are common integrations are.

Thanks for all the feedback!

1) Gotcha. I'll see about optimizing that on mobile.
2) Yeah, the wording is always the toughest part 😅
3) Ok. I didn't know which to use. I'll probably use I
4) I'll have to update the button text. It goes to the more detailed static website page. I'll also put a contact form under there.
5) OK. I'll see how it looks with that only on the front page
6) Yeah, I might remove the integrations part until I get that done.

 

[Adam]

Hi Jarod! Looks like a great start. Some thoughts:

• It is completely keyboard inaccessible, it doesn't seem possible to access the main nav using a keyboard. This means that assistive technologies won't be able to access the site. Try with tab to go forwards and shift-tab backwards. Every interactive element should be able to be selected and interacted with as well as an indication of where you're focused.

• Add a favicon, it just shows the default Gatsby one atm

• Your TTI according to Google Lighthouse is 8 seconds, this is really slow, you should follow their tips across all categories as lots of useful stuff here. You need to set an example if you are using this to sell others sites, people do look (I know, people check mine all the time!).

• The get started button doesn't seem to do anything

• Who is this targeted at? I feel like tech savvy people know this stuff and customers won't care, perhaps 2 separate landing pages will help with different personas (https://theblog.adobe.com/putting-p...esign-what-they-are-and-why-theyre-important/) in mind.

• The footer is unbalanced with a lot of space where the form stretches it.

• No address/social accounts/email address/etc. in footer which gives impression of lack of credibility.

• No mention of which country you're based in

• Those huge PNG's could easily be SVG and probably 2% of the size

• "I started building websites using the JAMstack over the last year or two" does not come off as very expert, if you got the skills I'm all for "faking it till you make it". That is, not lying, but no need to list exact experience as long as you know you can deliver quality

• [email protected] email and using "we" is quite transparent if it's just you, people honestly don't mind. I used to run under a brand name but had much more success just presenting as myself.

 

[Gummibeer]

[email protected] email and using "we" is quite transparent if it's just you, people honestly don't mind. I used to run under a brand name but had much more success just presenting as myself.

You can run a brand as single person and use "I" to show that it's only you. Possible customers have expectations in "we" like a designer, developer or any other roles.

Those huge PNG's could easily be SVG and probably 2% of the size

What do you think about my newest client website (music and poetry)? lists several ideas how to optimize images.

In general I agree with Adams points! Accessibility and performance is important and one of the key facts you also promote JAMstack with - and like Adam said, your own page and portfolio should showcase this.
It even seems that massive amounts of JS are loaded, I bet that theres optimization potential too.

 

[Adam]

You can run a brand as single person and use "I" to show that it's only you.

Yes absolutely. It did sound like I was saying not to have a brand. I think a brand name is great even for one person but can be kept more personal while it's just you! :)

 

[jarod_peachey]

Hi Jarod! Looks like a great start. Some thoughts:

• It is completely keyboard inaccessible, it doesn't seem possible to access the main nav using a keyboard. This means that assistive technologies won't be able to access the site. Try with tab to go forwards and shift-tab backwards. Every interactive element should be able to be selected and interacted with as well as an indication of where you're focused.

• Add a favicon, it just shows the default Gatsby one atm

• Your TTI according to Google Lighthouse is 8 seconds, this is really slow, you should follow their tips across all categories as lots of useful stuff here. You need to set an example if you are using this to sell others sites, people do look (I know, people check mine all the time!).

• The get started button doesn't seem to do anything

• Who is this targeted at? I feel like tech savvy people know this stuff and customers won't care, perhaps 2 separate landing pages will help with different personas (https://theblog.adobe.com/putting-p...esign-what-they-are-and-why-theyre-important/) in mind.

• The footer is unbalanced with a lot of space where the form stretches it.

• No address/social accounts/email address/etc. in footer which gives impression of lack of credibility.

• No mention of which country you're based in

• Those huge PNG's could easily be SVG and probably 2% of the size

• "I started building websites using the JAMstack over the last year or two" does not come off as very expert, if you got the skills I'm all for "faking it till you make it". That is, not lying, but no need to list exact experience as long as you know you can deliver quality

• [email protected] email and using "we" is quite transparent if it's just you, people honestly don't mind. I used to run under a brand name but had much more success just presenting as myself.

View attachment 179

Holy cow, thanks for all the feedback! That's awesome!

I'm working on updating the page structure. The main landing page will be an overview of what goes into consideration for everything I build (performance, accessibility, ease of use). This page also has the services listed, which each go to their respective pages.

I'll let you know when I update everything. Thanks again!

 

[Adam]

Holy cow, thanks for all the feedback! That's awesome!

I'm working on updating the page structure. The main landing page will be an overview of what goes into consideration for everything I build (performance, accessibility, ease of use). This page also has the services listed, which each go to their respective pages.

I'll let you know when I update everything. Thanks again!

Thanks Jarod! Sorry if it came off too critical, overall I think you’ve made a great start. Cool aesthetic. 😎

 

[jarod_peachey]

Thanks Jarod! Sorry if it came off too critical, overall I think you’ve made a great start. Cool aesthetic. 😎

Yeah, no problem. I work best with constructive criticism 😅 Thanks!

 

[jarod_peachey]

@Adam Just updated it. I fixed the images and made sure they loaded better. Can't make them SVG, trying to convert them right now.

Most of the other page speed bloat is from the imported Google fonts that I have. I'll remove those and install them locally in the project. Right now, they're blocking for 500ms 😬

I also updated the buttons, footer, and landing page to make it a little more clear for both developers and non-devs.

 

[Adam]

@Adam Just updated it. I fixed the images and made sure they loaded better. Can't make them SVG, trying to convert them right now.

Most of the other page speed bloat is from the imported Google fonts that I have. I'll remove those and install them locally in the project. Right now, they're blocking for 500ms 😬

I also updated the buttons, footer, and landing page to make it a little more clear for both developers and non-devs.

Nice one! Normally image places offer up the SVG to download, much better than converting. Can you not grab them from where you got originally?

 

[jarod_peachey]

Nice one! Normally image places offer up the SVG to download, much better than converting. Can you not grab them from where you got originally?

Yeah, couldn't get them. I went through Icon8's SVG generator and would have had to pay for the SVGs. I might end up doing that though...

 

[Adam]

Yeah, couldn't get them. I went through Icon8's SVG generator and would have had to pay for the SVGs. I might end up doing that though...

Ah that sucks. Usually auto converting doesn't get the gradients right. Even if you stick with PNG you should be able to get them significantly smaller with appropriate scaling and running them through something like ImageOptim. :)

 

[jarod_peachey]

Ah that sucks. Usually auto converting doesn't get the gradients right. Even if you stick with PNG you should be able to get them significantly smaller with appropriate scaling and running them through something like ImageOptim. :)

Yeah. I'm using gatsby-image with them, and then will use TinyPNG to further optimize them.

 

[Adam]

Yeah. I'm using gatsby-image with them, and then will use TinyPNG to further optimize them.

Nice one! Could also look in to using WebP with a PNG fallback for Safari using the <picture> tag if you wanted to get really fancy. But a nicely optimised PNG will get you 90% of the gains there.

I am having same problems with slow Google Fonts. I saw something recently about self-hosting being faster which surprised me. Going to be experimenting with that myself too.

 

[Gummibeer]

I am having same problems with slow Google Fonts. I saw something recently about self-hosting being faster which surprised me. Going to be experimenting with that myself too.

Google Fonts are in general most times faster, they support http2, spdy and so on out of the box and depending on the font they are already cached from other pages.

Could be that they have some issues right now. 🤔
500ms sounds like unresolved DNS lookups. Try to dns-prefetch the two Google domains used for fonts.