Blog

Everything listed under: design

  • Make a Flexbox Homepage

    Could 2017 be the year of flex boxes? For years, web designers everywhere have been keeping a keen eye on the ever-evolving specification for flex boxes, slowly salivating at the thought that soon — Soon™ — difficulties around laying out, aligning and distributing blocks on a page. Let's take a look at them, and whether they could be appropriate for you.  Read More...

  • Add Modals, Confirmations, Expanders and Other Messaging to Your Site

    In the olden days, if you wanted to grab a user's attention with some additional information, you made JavaScript alert appear. But now it's 2017, so let's take a look at some modern alternatives and when each one may be the best design option for your site.  Read More...

  • TIL Thursday: Browser Support, Testing and IE8

    It's easy to take for granted the work that goes into ensuring that all shoppers get the same, high-quality experience regardless of the device they use to browse your site. But what about older browsers? What about mobile and tablet devices? Let's take a look at this and, in particular, the problems faced with Internet Explorer 8 (and why we're saying goodbye to it soon).  Read More...

  • Build a Style Guide

    Building and maintaining a site can be a difficult, seemingly indefinite process. One particular pain-point can be ensuring a consistent look and feel throughout the site. A solution to this can be a style guide. In this article we'll look at how you can build one, as well as looking at some advanced features in Sass.  Read More...

  • Customize Error Pages

    Error pages: the pages you never hope your customers see but you know they sometimes do. So what happens when a user is served a 404 'page not found' error? Let's take a look at the design philosophy behind a good error page and what you can do to convert a dead-end to a conversion.  Read More...

  • Extend Font Awesome and Add New Icons

    We use Font Awesome throughout the application to provide iconography. While the FA library is extensive, there may come a time when you want to add your icons. In this article, I'll take you through two options for doing this.  Read More...

  • Subtlety, Buttons and Custom Cursors

    I came across an interesting article that explains how to use custom cursors. For ecommerce sites, this gives us an opportunity to encourage an action in a subtle and fun way, that may enhance your site's user experience.  Read More...

  • Customize the Header

    Previously, we have talked about how you can customize your homepage. This time around I want to talk about something that is of similar ubiquity: the header. We'll look at how you can add your own navigational links and I'll give you some ideas about options for customization.  Read More...

  • TIL Thursday: More Best Practices for Using Sass

    You may remember a previous article about Sass best practices. For new and even experienced designers and developers, it can be difficult to know what guidelines you should follow. As before, I've asked Senior Developer at NetSuite, Hayley Easton, for advice on what we should be doing when we're styling our sites.  Read More...

  • Customize the Loading Icon

    When you're customizing your site, you'll go through the normal things like changing the colors, design, layout, and other things. But there is one ubiquitous thing that you may want to change and not know how: the loading gif.  Read More...

  • TIL Thursday: Best Practices for Using Sass

    When working with Sass, it's important to make full use of the benefits that it provides. Unlike regular CSS, Sass enables you to use functionality commonly available in other programming languages. If you're new to Sass, you may not be aware of what they are or how to best exploit Sass's power. In order to find out what the best practices are, I had a chat with Hayley Easton, Senior Developer at NetSuite, to find out what they are.  Read More...

  • Customize Your Homepage

    One of the most important pages on your site is the homepage. It is what your customers see when they visit your site; it is the store front; it is the face of your brand. It's crucial, therefore, that you get it right. I'm going to talk about how you go about making changes and what tools are available to you, so you're prepared when it comes to translating your designs into reality.

       Read More...

  • Trends for 2016: Subtle Hover States

    Around this time of year, there's always a lot of discussion around what will be the next big thing in web development. I take a look at one in particular: subtle hover states.  Read More...

  • Add a Sticky Button with jQuery.scStickyButton

    In a previous article we talked about how you can add a push pane to your site to make better use of your site's real estate on mobile devices. In this article I want to tell you about another bit of functionality that you can use to improve things for your mobile users: sticky buttons.   Read More...

  • Add a Push Pane with jQuery.scPush

    Screen space on mobiles and tablets are at a premium, so why not use push panes to hide additional content off canvas until the user requests it?   Read More...

  • Add a Custom Web Font

    As part of customizing your site's design, you can choose from an array of styles, color schemes and imagery. But one additional level of customization you can go to is adding your own web font. This article will take you through the simplest and most common method.  Read More...

  • Developing Your First Custom SuiteCommerce Advanced Module: Part 4

    In the preceding articles we built our module to the point where it is a fully functional form and list where can perform all of the basic API operations. In this article we're going to look at how we can make improvements to the user experience in the form of changes to site design and styling.  Read More...

  • Override a Module to Make a Color Change

    While we've covered adding new modules to your site, another customization you can make is overriding an existing module with your own. You may want to do this, for example, if you want to make a global changes to styling, such as to the color scheme.  Read More...