Introducing a Mobile Friendly Redesign to the Website

Today, I am happy to share with you our new mobile friendly website design. A mobile friendly site has been something I’ve considered over the years, but it was not something I felt was necessary. That is until last week, when found myself in a discussion on Twitter after Tom Bricker decided to redesign It turns out I may not have considered it a priority, but you, my awesome readers, wanted a website that was usable on any sized internet capable device.

DCL Blog Site Redesign

Below is a screenshot of how the site loads on an iPhone. The regular sidebar content that includes the daily port schedule and other various links are moved below the most recent posts. On some pages, this means a considerable amount of scrolling. To get back up to the top of the page, there is an up arrow that hovers in the bottom right corner that will return you to the top of the page when you tap on it.

DCL Blog Theme IPhone 6 Plus

When viewing the site on a smaller screen, you may notice 3 grey lines in the top right of the screen; this is the menu for the website. When you click on the icon, it will expand as shown below:

DCL Blog Theme IPhone 6 Plus Mobile Menu

I want to thank Tom for unknowingly triggering a discussion with Natalie, Jose and David that caused me to move forward and bring the site it to the mobile age. Additionally, I hope these changes help render the pages faster on your end. I am already seeing a noticeable increase in speed on my end.

If you are interested in a few more features that I have in the works, you can get a sneak peek of them at our Movie and Drinks of the Day pages. Both are still works in progress, but they are online now. Development on the new features is on hold until the dust settles from the redesign.

The new design just went live this evening and I am sure there will be some hiccups along the way. So far I’ve tested the site out on a few iOS devices and worked out some of the quirks. If you see something that looks odd on your particular device, please let me know (screenshots are great if you can get one) and I will see what I can do to resolve it.

So… What do you think of the redesign? Be honest –  constructive criticism will only help make the site better.

14 Replies to “Introducing a Mobile Friendly Redesign to the Website”

  1. james

    Nice use of the android hamburger menu. Can also have it collapse the sub menus?
    Example, we would only see Ships and it would expand after touching Ships to show all the ships

  2. Andrew Waghorn

    Looks good on the iphone and ipad in vertical orientation but with the ipad horizontal I don’t think it works – content is in a narrow strip down the middle. Let me know if you want any screenshots.

    1. Scott Sanders Post author

      Andrew, I was able to see the site transition between landscape and portrait on my iPad2. At one point it did hang when going to landscape, but switching the orientation to portrait then back to landscape corrected the layout.

  3. Marnix

    Hi Scott. Great job when using iPad an iPhone in portrait position. Much better use of screen real estate.
    However on a Mac (or PC) in a regular browser more than half of the width is now used for two wide bars with only a smaller strip in between. When scrolling downs the sidebars are just blue columns waisting horizontal space. For example the daily schedules look really awful when cramped into this small amount of space. I would much rather prefer the desktop version of the site (and landscape on my iPad) to make much better use of the screen width.

    1. Scott Sanders Post author

      I agree. I’ve noticed this myself and am working to change the css to % based widths rather than fixed pixels to adjust for wider screens to eliminate the the wasted space.

  4. Linda

    Scott, when I go to the menus tab, it cuts off the Wonder menu column. Is there something I can do to see it?

    1. Scott Sanders Post author

      I am working on a menu update for the site, but in the interim I changed the layout so this is no longer an issue. Thank you for bringing this to my attention.


Leave a Reply

This site uses Akismet to reduce spam. Learn how your comment data is processed.