• Responsive Web Design Techniques and Tips

    Your customers are coming to your website over a myriad of devices, from smartphones to tablets to desktops, and the range will likely grow as smaller devices and different sizes of screens come onto the market. To ensure that all of these devices can get full functionality from your site and that your team isn't wasting time creating multiple versions of your main site to accommodate each device, you need to integrate responsive design techniques into your web design.

    Responsive web design is an approach for architecting websites to enable them to automatically serve up content in the most appropriate layout for the customer's device. It's a better approach than creating individual versions for each device, as it doesn't require updating multiple versions of content. This saves time that can be better spent creating high-quality content.

    Responsive design works on a grid principle, with each page element sized according to units on a grid rather than specific measurements, thus producing a display that is proportional regardless of the size of the display. The web architect creates different grid-based templates showing how the pages should be displayed for different devices. The site can then automatically recognize the screen size of the device accessing it and serve up the appropriate layout of the page.

    The over-arching concept for responsive design is simplicity; simple layouts and graphics are more easily reduced and re-constructed without ruining their appearances. Visually-rich designs with complex layouts look great on laptops but need to be simplified on smaller screens.

    In addition to simple design, here are some other tips for creating responsive websites:

    1. Minimize Navigational Aids on Smaller Screens

    If you have just two or three navigational items on a page, list them at the top. But if you've got four or five, instead use a navigational icon at the top and use JQuery to create a simple dropdown menu with navigational choices. This leaves more space for focusing on the content of the page.

    2. Design for Screen Size Not Brand Name

    Determine the different screen sizes you want to target in your CSS files. CSS doesn't recognize names of specific mobile devices but, rather, is programmed with screen widths.

    Determine the most common screen sizes viewing your site then specify their measurements in the CSS media query. Also, include whether you want a portrait or landscape screen orientation. Below is an example of what that code would look like:

    1. @media screen and (max-width: 1024px) {
    2. /* Tablet styles */
    3. }
    4. @media screen and (max-width: 700px) {
    5. /* mobile phone styles */
    6. }
    1. @media screen and (max-width: 1024px) and (orientation : landscape) {
    2. /* Tablets in landscape orientation */
    3. }
    4. @media screen and (max-width: 768px) and (orientation : portrait) {
    5. /* Tablets in landscape orientation */
    6. }

    Remember tablets are becoming the new desktop. More and more users are working off of their tablets, forgoing laptops and desktops altogether. Generally, tablets do well with desktop layouts when in landscape mode, but may require a different template for portrait mode, depending on the number of components and the functionality to be included. Designing with tablets in mind can help ensure that the overall organization is simple and thus able to be designed responsively.

    3. Organize Based on Importance

    Organization and structure of page elements is different for mobile phones vs. desktops. To create a mobile device template, reorder the sections from your desktop version into full-width sections, like stacking blocks, based on their importance.

    • Header, Logo, and Navigational Elements. These normally go on top, to identify the page and make it easy to find the navigational menu.
    • Body and Main Content. The next component should be the article or other unique element that comprises the body of the layout.
    • Sidebars and Advertising. At the bottom comes the advertising or other sidebar content. Sidebar content is the least important content on a page because it's usually boilerplate. It shouldn't infringe on the main content of the page.

    Whatever your layout strategy, do include all of the content and functionality available on the main site. People get frustrated when they can't do the same things on a mobile site that they can on the main one. If customers can update their account preferences or view videos on the main site, they should also be able to view those on the mobile versions as well. There are some exceptions, of course, such as data-heavy elements that may be too much for mobile connections.

    4. Test!

    The best way to see how your website responds to different device sizes is to try it out. You can do this by resizing your browser to test media queries. Also be sure to test it on actual mobile devices to see what your visitors are experiencing. You may want to add more breakpoints (screen sizes) including device-specific ones to get the best appearance for the most commonly-used devices.

    The goal is to make your website as attractive and functional as possible for all of the devices your customers use to access it, while also remaining easy to maintain. Following a responsive web design strategy is important for achieving both goals.

    LightCMS Enables Responsive Design for Everyone

    LightCMS offers many responsive design templates to choose from for creating fully responsive websites that adapt to fit in any browser across all devices. If you are a current LightCMS customer, check out the many different responsive templates by logging in to your website and selecting "Design" on the top toolbar. Then select "Gallery" to view a list of featured designs. It only takes a click to preview the design, apply it to your website, or even download the source code to modify on your own. Plus, as always, you can customize the design in the LightCMS Design Editor as well.

  • LightCMS Upgrading to New Datacenter!

    We’re pleased to announce that we are migrating the LightCMS system to a beautiful, new home inside one of NetSuite’s Datacenters. As you know, NetSuite is the parent company of LightCMS and we are very excited that this change will locate the LightCMS servers inside a Datacenter over which our company has control.

    New Datacenter Upgrade

    This arrangement holds many distinct advantages over our current situation. NetSuite and LightCMS will now have control over physical server security, maintenance and scheduling as well as the ability to improve our monitoring capabilities and scale more rapidly. Additionally, LightCMS servers will now gain access to NetSuite’s global load-balancing infrastructure which has the potential to improve system performance in some locations around the world. This move also sets us up for potential expansion to multiple data centers in the future.

    Our team is already hard at work ensuring this transition goes as smoothly as possible. Our goal is to make the change as seamless as possible for you and your clients. However, due to the nature of this change, there are a couple of items that may affect you or may require action on your part. Please read the details below to ensure you are aware of all that is happening.

    Scheduled Downtime - May 5, 2014

    12:01am to 4:01am CDT (GMT -5)

    In order to ensure the server transition goes smoothly, we must take the LightCMS system offline entirely while we make the move. The maintenance window listed above reflects the time we plan to make this transition. When we bring the system back online at the end of this window, LightCMS will be operating on its new servers.

    IP Address Update Required for Custom Domains

    Moving Datacenters means that LightCMS’s IP address will change. This means if you are using custom domains with your LightCMS websites, you will need to update the IP addresses for those domains AFTER we have made the move on May 5th. Don’t worry, your websites will continue to function even if you don’t make these updates. However, custom domains that are not updated after the move will resolve to their associated publishpath domains.

    Changing your IP address means updating the Address Records for your custom domains. You must do this using tools provided by your DNS provider (GoDaddy, BulkRegister … etc.). When you originally set up a domain to work with LightCMS, you would have created an address record to point to LightCMS’s IP address. Now, you’ll simply be editing that address record to point to a new IP.

    The new IP address you will need to use AFTER we make the change on May 5th is: 64.89.44.97

    IMPORTANT: Do NOT make any domain changes now. You should make these changes after we move LightCMS to its new home on May 5, 2014.

    To help you with this transition, we’ve created a handy support article about the changes you’ll need to make. Please take a look and if you still have questions, feel free to email us anytime at support@lightcms.com and we’ll get back to you right away.

    Thank you for your support of LightCMS. We look forward to continuing to serve as your website partner for years to come.

  • Six Tips for Building a Successful Web Design Business Through Sales

    Even the most talented web designers must learn how to sell in order to get business.  For the majority of designers, however, it’s not a skill that comes easily. Fortunately, selling isn’t the mystical thing that many think it is. Sales is a process which, if followed religiously, will bring in leads and convert some percentage of those leads into clients. 

    Building a Successful Web Design Business Through Sales

    Your specific process will depend on factors such as time and the staff you have available. It might start with some initial research on the prospect’s company, followed by an introductory meeting and needs assessment, then the project proposal, a follow up Q&A, and the signing of the contract. The most important point is to have a process and follow it. And remember that selling is an expected, and valued, part of running a web design business. Designers sometimes feel uncomfortable selling themselves, but without an intentional sales process, many will struggle to bring in new business.

    Here are six tips for successfully selling your web design business.

    1. Follow Up – Again and Again.

    Until you close a deal, or are told by a prospect that they’ve chosen another provider, you need stay in touch with your prospects by following up at each stage of the process. Each time you talk to or meet with a prospect, end with an agreement on when you’ll contact them next. By agreeing on the date, you avoid having to play telephone tag later or feel like you’re chasing the prospect. That said, if a lead needs time to decide, don’t necessarily give up on them. Sometimes a project gets put on the back burner, budgets get sidelined, and other priorities take precedence. You may have a potential clients who seem like a lost cause, but that still come back unexpectedly months later to close the deal.

    2. Use Social Media

    Setting up shop on Facebook and Twitter is a common, but nonetheless good, thing to do. These tools let you engage with your customers cheaply and easily. Both tools are great for sending out updates while allowing potential customers connect with you, ask questions and provide feedback.

    3. Get Involved Locally

    Selling is a lot easier when people already know and respect you. So, it’s worthwhile to join local business and community groups, including those in industries in which you work. You can also do volunteer work for local charities, but be careful. Too much free work is a drain on resources.

    4. Advertise

    An ad in a local paper and mailers sent out to areas businesses are tried and true ways to bring in leads. In the age of social media, the right print advertising still works. Even Google sends out mailers on a weekly basis.

    5. Ask for Referrals

    The biggest driver of most businesses is referrals, so it pays to ask clients for the names of colleagues who would benefit from your web design services. The best time to ask is during the successful launch of your client’s new site, when they’re most excited about your work. Also make it a habit to call clients once a year to see how they’re doing, how the web site is performing, and if they have any friends who need help improving their site.  Be sure to get the name and contact information of the referral, rather than letting them pass your name to them. Because you might never hear from “my friend Doug” and will have no way to reach him.

    6. Sign Your Work

    Work your signature and URL into your designs so that admirers can easily see the creator and contact you. It’s a surprisingly common way to get leads.

    Finally, keep in mind that learning how to sell effectively is a topic worthy of long-term study. Go out and buy two or three popular books on the topic for starters. One suggested title I recommend is The Psychology of Sales by Brian Tracy. It might well be worth a few extra clients to you.

  • New Features: 10 New Responsive Design Templates and More!

    Today, we’re pleased to announce that we’ve added ten new, responsive designs to the LightCMS system. As always, these designs are available to be used on any LightCMS website at no extra charge. They are customizable through our built in Design Editor and advanced users can even download their source code to use them as starting points for their own designs.

    10 New Template Designs

    The best place to check out the new designs is on the LightCMS Design Viewer. Here are links to see a preview of each of the ten new designs:

    New Feature: Custom Domain Check

    We’re also rolling out another nifty, new feature called Custom Domain Check. The LightCMS system now automatically checks all the custom domains you register on our platform to determine if their address records are correctly assigned to LightCMS’s IP address. When you view your custom domains on the Advanced Tab of the Website Settings screen, you'll see a yellow icon with an exclamation point if there are issues that need to be addressed with that domain (see image below). Hover over the icon and you'll find details about what's wrong and what needs to be corrected.

    Custom Domain Check Screenshot

    Remember that DNS changes can take 24-48 hours to propagate completely, so if you recently made updates to your DNS you may need to wait a bit for our system to detect those updates.

  • Partner Spotlight: Fellowship of Christian Athletes

    For the Fellowship of Christian Athletes (FCA), managing nearly 250 websites with 1,000 staff members spread across the country and around the globe requires a content management system (CMS) with some specific capabilities. Yet, when the nonprofit organization began its search for a platform on which to run its myriad of sites, it came up short.

    Fellowship of Christian Athletes

    “We looked at a lot of terrible content management systems,” admitted Danny Burns, Director of Digital Ministry for the FCA.

    Ultimately, FCA found LightCMS, a perfect fit with functionality allowing their staff the freedom to build and manage sites on their own while staying true to the organization’s look and feel.

    FCA works with athletes and coaches in a vast array of sports to not only improve their athletic performance, but also grow in their Christian faith. It does this through four primary areas of ministry: camps, campuses, coaches and community.

    Up until a few years ago, the FCA was running all of its sites with a home-grown CMS. Knowing it would need a new system to expand beyond its 100 sites to the nearly 250 it has today, the FCA began a year-long selection process that ultimately ended with LightCMS.

    Local FCA staff, administrators or volunteers manage their regional and local sites, like NortheastFCA.org. Support and training comes from the FCA National Support Center in Kansas City. This means the organization requires a system that isn’t overly technical and can be implemented with minimal training. LightCMS meets this need beautifully.

    LightCMS’s on-page editing style is a huge benefit for FCA’s non-technical users, allowing them to see the changes as they’re made. Plus, FCA’s site managers are thrilled with the vast capabilities LightCMS offers such as photo galleries, blogs, calendar of events and form builders. These were not available on FCA’s previous system.

    LightCMS’s flexible templating system allows FCA to offer staff the ability to choose and customize their own website designs, while still ensuring each design is consistent with the FCA brand. FCA even developed its own “Site Customizer,” a custom application that works with LightCMS to provide even more design options to site owners.

    “One of the main reasons we chose LightCMS was the freedom and flexibility of the templates,” Burns said. “For the non-technical user, we wanted to protect the look and feel of our brand, while giving our users the flexibility and control over some of the design aspects. LightCMS allows us to give them a lot of control but also to keep them in line with our best practices and consistent branding.”

    Together, FCA and LightCMS have provided an incredible array of design options for FCA websites, including fully responsive designs which work well on desktops, tablets, and smartphones alike. According to Burns, LightCMS’s capabilities have far surpassed the FCA’s early expectations.

    “I don’t think we ever envisioned the kind of customization we’re doing today,” Burns said. “It’s really easy for those without design experience but if you have design experience it doesn’t handcuff you.”

    Following its launch on LightCMS, FCA saw demand for local sites more than double over two years. The support that the FCA receives from LightCMS has helped the organization to handle this growth, according to Burns.

    “We’ve traded enough emails and been in the relationship long enough that we feel like we know the team and we are really excited about the partnership,” he said. “It never feels like we’re just another number. That’s super encouraging especially as LightCMS continues to grow.”

    LightCMS’s cloud model also spares Burns and the FCA a lot of the overhead, patching and infrastructure costs that other deployable content management systems require. And LightCMS regularly adds enhancements which are added automatically with no downtime. On the whole, Burns counts the move to LightCMS as a great decision.

    Learn how other organizations are growing and expanding their business with the help of LightCMS.

RSS Feed

Connect

Tags

Archive

Try it yourself. It's free.

  • Takes less than 60 seconds
  • No commitment
  • No payment information required
Sign Up For Free

Copyright © 2014 LightCMS® Content Management System Powered by LightCMS LightCMS is a product of NetSuite