It's here. Available to the public and ready to download directly from the Mothership. The new Showit update adds some amazing features that I shared in our First Look and on Showit Live. After designing mobile sites for some of you awesome Showiteers, here are a few sizing tips to get you started!
Design sizes that work for both Tablets and Phones
Showit's default sizing is designed for iPhone users in mind, and starts at 1500px long by 900px wide. This is a great place to start for many mobile users, and since it's the default you don't need to change a thing. One thing to note, using these dimensions means that when you flip an iPad sideways you will start to get gutters or bars (usually the same as your background color) appearing on the sides. For this reason our preferred dimensions for our projects starts at 1900 long x 1040 wide. We have found this to work extremely well as a starting point to cover both mobile phone platforms and tablets. When you are setting up your Stylegroup you will want to make sure you are on the Stylegroup level, and then make the changes under Page Dimensions on the right hand side. When you need a page(s) that is longer than another, you will need to create a new Stylegroup and increase or decrease the page length as needed. It's often easier to duplicate your current Stylegroup (to keep the menu, etc) and then delete the pages you don't need, and re-size for the ones your are working on! An important note to keep in mind is that the shorter your pages are, the faster your site will load. So be clear on your message, goals for mobile users, and keep your mobile site focused. We have the ability to cater to both mobile and desktop visitors in unique ways, so coping your desktop site in it's entirety is rarely the best solution.
It's OK to have less pages on your mobile site!
Don't expect to use 14pt font on your desktop site, and use the same size for mobile. The best thing you can do with text is re-write it to make it more concise, use less of it, and make it more visible (bigger font) on your mobile device. Case Study: Amy & Jordan Demos For Amy and Jordan's site we decided to get rid of their top navigation in the traditional sense because there was too much for their mobile site and it wouldn't help the flow. If you visit their site (amyandjordan.com) the navigation text they use is at 11pt Times International. It looks fantastic and gives them the room they need for their navigation options! However, for Jordan and Amy's mobile site, the minimum font size we used was 34pt on Times International. We did this using our preferred page width of 1040px wide. Compare the two sites by visiting their website on your mobile device! It's often hard to nail down a good size because each font is different, and every page dimension layout will adjust that effect. If we would have used a different font, 34pt may have been to small still! If we used the default Showit page dimension of 900px wide, it would have looked a bit big, so make sure to spend the thought going into your sizing choices- it will save you hours! Recap: Getting Started on Your Mobile Site. There is a lot of information here, but I will break it down into our standard starting settings for each mobile conversion or site build.
We are super excited to see what you guys are creating with this new release. If you have questions feel free to tag me (Jason Toevs) in the Showiteer group on Facebook! I can't wait to see your new creations! Keep an eye out for more on mobile design articles here on Showiteer.com!
Starting her career as an early education teacher, Wedding and Lifestyle Photographer, Quianna Marie, only dreamed about going full-time until she took the plunge three years ago. Through leading her San Jose Tuesdays Together chapter, countless styled shoots, and several workshops and conferences, not to mention her 12 years in the industry, Quianna has learned a […]
You have worked hard to get where you are! Let’s not only celebrate you, but share your story! Share your journey, tips, tricks, or all of it on how you were able to get your business up and running! It took not only hustle, but tons of inspiration to believe you can do it. Let’s share […]
Sage is a modern and clean design for the sophisticated photographer. This design includes: Lots of white space, and beautiful big home page hero photo to display your best work. Beautiful blog layout, with two options to showcase your most recent work. Website design by Joanna Moss View Sage View all designs by Joanna […]
Start Your Free Trial
Free for 14 days.
No credit card required.