New Design at MacSparky.com

If you do a sidebar, mobile styling typically renders left-to-right content as top-to-bottom - so unless you want your string of ads above the content they want to see, put the sidebar on the right.

But if you put it at the bottom, you can just think of it as making your desktop user experience the same as mobile. :smiley:

1 Like

I like it on the desktop browser. Gives a nice vertical and slim profile to the website, which is easy to the eyes especially when you run browsers side by side.

It works less for me in the mobile experience as all sub-menu items now become part of the one dropdown… You probably have to implement a menu button or so for the mobile site. That said, I think MacRumors.com has a nice top level navigation solution on their mobile site

I like it @MacSparky!

Personally I much prefer links to open up in a new window or tab rather than taking me away from the page that I’m on. That way I can just close the new window/tab and get right back to where I was.

Hold CMD while clicking a link. I prefer the choice to be put in the user’s hands.


@MacSparky
Using the Google font “Cabin” as the default one for body, headings and the menu items without requiring it via CSS is an odd choice. It’s not a common font that many users have installed. Especially not on mobile.
Everything will default to the second defined family, Helvetica:


(Helvetica only)

However, Cabin is an okay-ish headline alternative to Futura, which you use for your Macsparky logo. Used as a body font it is too noisy compared to Helvetica or even Apple’s San Francisco, which also would be a matching choice given the Mac context of the content (see suggetions below).

This is what users see if they have Cabin installed.


(Cabin only)

It would add more character and alignment with your “brand” by matching the logo’s font if you’d use Futura for headings and the menu. I know, it is also a font not everybody has, but at least Macs ship with Futura Medium installed.
Paired with Helvetica for the body it will look like this:


(Futura for headings and menu, Helvetica for body)

A solid alternative would be Futura for headings and menu items paired with Apple’S San Francisco for the body:

San Francisco establishes better visual hierarchy as it is less dense/compact than Helvetica.
Helvetica’s strokes result in an overall darker appearance of the body’s text blocks. Legibility is good with both.

I’d personally prefer the Futura + SF pairing. Achievable with this:

h1, h2, h3 {
font-family: "Futura, Cabin, Helvetica, -apple-system, Arial, sans-serif"; 
font-weight: "300";
letter-spacing: 1px; 
}

#header nav ul {
font-family: "Futura, Cabin, Helvetica, -apple-system, Arial, sans-serif"; 
font-weight: "300";
}

body, p, ul, ol {
font-family: "-apple-system, Helevetica, Arial, sans-serif";
}
3 Likes

An issue I’ve faced as well. Mine is basically a blog site with no advertising but I do have a sidebar listing my books (with links, of course). It doesn’t get in the way and can be ignored.

1 Like

Unless it’s on the left and stacks above the content on mobile, in which case mobile users have to scroll through it to get to the content. :slight_smile:

Well, it’s on the right!

1 Like

I’ve been told the color combo on my squarespace site is extremely readable - grey background, black text and orange links

I’m not trying to plug my site, but if you’re interested in seeing how it looks, test it out on desktop, mobile and tablet

1 Like

Nice website. Great content.

1 Like

Thanks for the feedback gang. There is some feedback I haven’t studied yet, but I have already started making some changes.

  • I brought back my beloved Futura Bold in the menus and titles
  • The drop down menus for Field Guides and Podcasts have been replaced by dedicated pages. These are still works in progress, but they are live.
5 Likes

My eyes are getting really bad and I can’t see the text as well as I’d like. I have a 28 in monitor so that plays a factor. I’d like the text to a bit bigger if you could. If not no problem. Other than that I really, really appreciate the redesign.

Good point. I’ve bumped it up bigger.

4 Likes

Like it, works for me. Found the retreat video in YT thanks to my exploration of the revamped site.

I find it hard to read. There is not enough contrast between the background color and font color for my eyes.

I like it @MacSparky

It looks nearly black on white to me, except I guess the top nav stuff is a little lighter, but still pretty easy for me to see.