Websites used to target a single type of user, typically browsing the Internet using a standard web browser on a desktop or laptop computer. That era ended nearly a decade ago, driven in large part by massive adoption of the smartphone. The rise of tablets further increased the number of ways to build a website for mass consumption, and the imminent arrival of wearable technology in the consumer marketplace looks to throw yet another option into the mix for consumption of online content. The question, then, is how can a site administrator effectively build a website that accommodates one, or all, of these platforms? The answer is to select from five popular ways to build your website, choosing themes that specifically target one device or adapt the code to fit all screens at all times. The top five ways to make this happen each have their own pros and cons.
1. Choose a Responsive Template that is “Screen-Aware”
Perhaps the most popular option chosen by today’s website administrators when deploying a new site is to opt for a responsive template that can detect screen size and adapt its design elements accordingly. WordPress has been a hotbed of activity in this area for several years, driven in large part by its overwhelming popularity and the massive size of its web developer community. WordPress currently comes with no less than three default themes that all leverage the power of responsive XHTML and HTML5 design. These themes detect a screen resolution and adapt design elements, like the navigation and sidebar, accordingly.
On a desktop screen, the template appears in its “natural” state, with multiple sidebars next to each other and a large header or navigation area. As the site shrinks down for a tablet screen, the sidebars may reduce in size or the navigation may get smaller. The header image may be eliminated. For smartphones, the sidebars stack on top of each other, the header is dramatically reduced in size, and the navigation typically becomes a menu instead of an on-screen series of links. This method is popular because it accommodates all devices and comes standard with WordPress. Many third-party templates have understandably copied this technique.
2. Build a Responsive Site Using Basic Responsive Templates
A fully developed template may not be the best choice for all website administrators. Some more seasoned website owners may want to more fully customize their responsive site and, for those administrators, a basic template is the choice worth making. A basic responsive template only comes with the code that reduces the site’s size to accommodate mobile devices. It does not feature colors, specific design choices, or specific layouts. All of that work is done by the website’s owner as they leverage their design and programming expertise.
These basic templates are a great way to not only design an entirely new look for a website, but also to adapt an existing design to the demands of mobile devices. Many website owners find themselves having to convert an old design to new standards so that mobile users can fully enjoy their content. A basic template allows for the copy-paste of major design elements into a new, responsive framework that will more durably stand the test of time as even more forms of mobile communication are introduced in the future.
3. Start with a Blank Slate and Code the Old Fashioned Way
Wireframe templates that leverage responsive designs have become common for intermediate-level designers, but many of the more seasoned professionals prefer to do things the old fashioned way and code their website by hand. For a responsive site, this means manually coding the website’s HTML5 code, its CSS stylesheet, and the JavaScript often required to adapt the design to the whims of a mobile browser used by smartphone and tablet operating systems. Though this might seem like a lot of work for something as simple as a web design, the manual approach to site design has its advantages.
First and foremost, manual programming allows website administrators to create their own framework for website elements, their shapes, their sizes, and other features. Designers who want to “break the mold” with their new site design will have to adopt this approach in order to get beyond the restrictions of premade site themes or basic responsive templates that allow only for filling in the blanks. Despite its rather intense amount of required work, this method is the one most likely to make a site appear truly unique and dynamic when users visit it for the first time after the new design as been completed.
4. Try a Website Builder or Automated Installer Tool
Another option that is increasing in popularity, especially among website administrators who are new to design itself, is that of a website builder or an automated installer. Perhaps the most popular automated installer tool is Fantastico, which is included in most cPanel installations at today’s biggest web hosts. Fantastico allows new site owners to enter just a few basic pieces of information, including their desired username, password, and site theme, and then it takes care of installation behind the scenes. The whole process is completely automated, taking somewhere between 10 seconds and two minutes. The result is a fully installed copy of WordPress, a configured template that meets the user’s needs, and an administrator login that they’ll easily remember. The installer also does all of the database configuration needed to get the site off the ground.
Site builder tools are also popular additions to cPanel installations at major web hosts. While many do not offer integration with WordPress and other major content management systems, they do allow users to select a site template and use “what you see is what you get” editing. As a result, creating a new site design is as easy as dragging, dropping, typing, and publishing. In many cases, these websites can even be built in a way that lets them adapt to the smaller screen sizes of today’s most popular mobile devices.
5. Desktop Website Design Software
Microsoft once built the world’s popular website design software in its Microsoft FrontPage application, but those days are long over. Today, the desktop design space is dominated by major, standards-compliant software choices like Adobe Dreamweaver. Applications like Dreamweaver function in a similar way to site builder tools offered within web host control panels. They’re based on the desktop, however, and require routine licensing and updating.
The benefit of these programs is that they integrated with images already saved to a user’s computer, they allow for a local copy of the design to be saved as a backup, and they connect directly to a user’s website server so that they can directly upload website files and images as needed. The added stability and customized permitted by these tools makes them a compelling way for novice site owners to create a design that reflects their own sensibilities.
Five Great Ways to Build Your Website
Building a website has never been easier. Whether it’s the advanced nature of building a site from the ground up, coding it manually with several different programming languages, or simply using a desktop site builder tool, users have many options to choose from as they determine their site’s appearance. Better yet, major content management tools like WordPress often include their own themes and customization options, making it even easier to blend a compelling site design with unique, authoritative content.
The best combination of these available tools and site design methods will result in a website that adheres to web standards, dynamically presents content to end users, and caters to their desire for an intuitive online experience.