There are many great tools and applications out there. I decided to share some of the ones I use for my company, and give a little write-up on them. Every individual has his personal preferences, and there is often more than one good choice, but the productivity tools discussed in this article are the ones I have found most helpful. These have proven very useful for running a successful web development operation.

---

LogMeIn

All too often I need to do work from home and log in remotely to my office computers. The task can range from sending a simple email from work to editing a complex graphic in Photoshop on my office computer. (In fact, I am typing this remotely since I had already left and gone home, and had wanted to finish this document!) LogMeIn really does make you feel as if you are working on your office desk, provided you have a fast connection on both ends and are using a similar screen resolution. One of the best things about LogMeIn is that it is still free. While true that Windows Remote Desktop is also free, I find that LogMeIn is easier to configure and it also works on all Windows Operating Systems environments.

The only drawbacks to LogMeIn are that it is very quirky when it comes to remote cut-and-paste, and that the app version for Android is very expensive. If it were cheaper I would just buy it, although the reality is that I don’t really need remote login from my mobile devices. I actually use LogMeIn Ignition, which bypasses the website and makes the login process faster.

>> Visit the LogMeIn Website

 

Dropbox

Dropbox is one of the best ways to share files. In my opinion, Dropbox gets the badge for being the innovators in practical cloud storage and file synchronization. The way Dropbox works is that any computer using the software will have a shared folder that will automatically sync those files on all computers. So, if I update a file on one computer in Dropbox, it will be updated on all my computers automatically. Dropbox also allows me to access these files online, and what makes it such a useful tool is that I can share large files with my customers, and they can share their large files with me.

One of the big drawbacks to Dropbox is that the amount of storage they provide on the free startup accounts is only 2 GB (excluding camera uploads from phones which provide up to 3 GB additional). Every new referral you create gives you an additional 250 MB of storage. (You can get more space by purchasing an account, or by using certain smartphones that provide you up to 50 GB if you connect them to your Dropbox account.) Dropbox is now facing more fierce completion against other cloud services such as Google Drive and Microsoft SkyDrive, both of which are offering more space than Dropbox. Time will tell who will come out who will come out the winner here and if Dropbox can survive the onslaught.

>> Visit the Dropbox Website

 

Mozy Backup

Running a backup of all data is critical to any business. Hard Drive failures are a reality of computers, and happen all too often. I am pleased that Solid State Drives (SSD’s) are becoming increasingly mainstream, since their technology will increase the lifespan of hard drives. My guess is that in another two or three years all hard drives will be solid state, and the classic movable-parts drives will be obsolete. Nevertheless, even with a solid state drive, backup is critical. I use Mozy Backup for my backup system on my data server, and I highly recommend them. They provide an incremental daily backup that lays low in resources, and although it isn’t free, is still very affordable. Early versions of this software proved slow and lethargic, but they have really improved the optimization of the software to run more efficiently.

In addition to the online backup, Mozy also provides an option to backup all the data to a separate hard drive. I used to use a separate application for this called SyncBack, which worked out very well, but with this new additional local backup tool from Mozy, a separate local backup application is no longer necessary. With Mozy’s local backup, my data is copied daily to an external hard drive attached to my server via USB. Every once in a while I take this home and copy this to an extra hard drive on my home computer. It’s important to have all data backed up in separate locations in case of fire damage or floods, God forbid.

>> Visit the Mozy.com Website

 

ShowMyPC

I often need to login to a customer’s computer remotely to replicate a problem or help them setup their email. In order to do this, I use ShowMyPC, which has proven to work well and is free. I have tried other software in the past which was both costly or had bugs or issues, but I must say that I am very satisfied with ShowMyPC.com.

>> Visit the ShowMyPC.com Website

 

Windows Snipping Tool and FastStone Capture

One thing I am constantly doing is creating snapshots from my screen for examples to show clients on a particular window on my screen. While there are many screenshot capture tools, Windows 7 introduced a cute little tool that allows me to take a custom-sized snapshot and mark it up by underlining or circling elements. It’s nice to find this bundled together with the operating system. This was a neat enhancement that can be found in the Home Premium, Professional, Ultimate, and Enterprise editions of Windows 7.
Read more from Microsoft’s Website

Faststone Capture: Before Windows 7, I used FastStone Capture. Faststone Capture has more tools built-in then the Windows Snipping Tool, but it has to be installed separately. For anyone without Windows Snipping Tool, this is a great alternative. Although later versions are shareware, and they require you to buy the software after 30 days, older versions prior to version 7 are freeware and work perpetually. Old versions can be downloaded here.

 

Quickbooks

Quickbooks allows me to organize all my client information and projects into an organized system, and keeps track of all my invoices and finances. I use Quickbooks to generate invoices, balance my accounts, log my timesheets, and keep tabs on my customers and projects.

 

WinRAR

WinRAR is a tool for archiving and compressing files. It is most useful when sending file packages such as small websites or image groups over email as a single file. WinRAR is shareware, and can be used with several different compression formats. Although newer versions of Windows provide native Zip file support, WinRAR and other Zip file managers are much better at handling compressed file formats.

>> Visit the WinRAR Website

 

VLC Media Player

VLC Media Player is a free multimedia player for video, audio, CDs and DVDs. It does encoding and streaming and supports almost any multimedia protocol.  It also can convert a file from one format to another. I use VLC Media Player to open and playback various audio and video files I receive from clients, and use the conversion tool to convert files to more universal formats.

>> Visit the VLC Media Player Website

 

Symantec Endpoint Protection

There are a many different anti-virus and malware protection applications out there, all claiming to be the best. For the most part, all the name-brand ones are good, although some are bigger resource hoggers or more intrusive than others. I have found that many companies have their IT personnel set them up with Symantec Endpoint Protection, which seems to be the standard for businesses. I use this as well, and so far it’s been working as it should.

 

There are many important programs that are used when designing, developing, and maintaining websites. I would like to discuss the different tools that I use and recommend.  I hope that this will be helpful for all those learning web design and development.

 

Adobe Photoshop

Photoshop is the de-facto tool used to create graphics. It is used by both web designers and print designers alike. Photoshop is essential for making an initial website design, as well as generating graphics for web pages. It is a powerful program that can really do a lot, and it provides all the tools to graphically lay out a website prior to its construction into HTML. Once I create a layered site layout (called a website “mock”) in Photoshop, I then generate the graphic files and incorporate these items within the HTML.

 

Adobe Dreamweaver

Dreamweaver is a standard for working with HTML code and CSS, and is also very important for working with php pages. Dreamweaver lays out the code for each page in an organized and color-coded fashion. It has many tools and shortcuts allowing me to easily work with the code. Dreamweaver also has an extremely useful split pane design which allows viewing of the code at the same time as a WYSIWYG Editor. (Dreamweaver also has built in FTP tools to connect a site to a web server, but I don’t use their FTP tools since I prefer the additional control of manual FTP.)

 

phpDesigner and NetBeans

These are other code editors we use when working in php, css, html, or JavaScript. Each one has its strong points, and they are both free. phpDesigner’s color syntax and auto-fill are particularly useful.

 

Filezilla

In order to create or update websites, the files need to be placed on a web server. The web server contains a file structure where local files can be uploaded. An FTP client allows one to login to a web server and upload and download the web files. While there are many FTP clients available, Filezilla is free, and is one of the most popular.  Aside from providing the standard FTP utilities such as a divided pane and stored website lists, Filezilla is very useful for its flexibility and upload speed. For example, if it has a problem with a certain file uploading, it will skip it and continue without halting the procedure.

 

Microsoft Visual Studio

Visual Studio is what I use for working in asp.net. Most of the .net sites I work in can be configured with the free express version. I used to do a lot more programming in .net, but lately all of my data-driven websites are in php. (php is much easier to use, and there are so many new libraries and controls, making php more practical and effective then asp.net for the types of websites I work with.)

 

phpMyAdmin

phpMyAdmin is an open source web-based application written in php that controls the administration of MySQL databases. MySQL is the most popular open source relational database management system, and is a standard on many websites. phpMyAdmin is the tool that I use to run queries and configure, maintain, import, and export data from MySQL databases.

 

Microsoft SQL Server Management Studio

SQL Server Management Studio (ssms) is software that is used for configuring, managing, and administering MSSQL Databases. Unlike phpMyAdmin which is entirely web-based, ssms is a GUI desktop application. There is a free “express” version of ssms which is what I use, since all MSSQL sites I work on only require the MSSQL Express version. Most of my recent database projects are in php/MySQL rather than asp.net/MSSQL, but I still do work in the latter, especially on existing projects done in this orientation.

 

Firebug and Web Developer Add-ons

These tools are free, built in add-ons to the Firefox browser. They allow me to view code issues on a web page, and tinker with the generated source code. For example, I can set a command to temporarily disable JavaScript or change CSS display elements while testing.

 

Notepad

The plain and simple Notepad that is built-in to Windows is an important tool when it comes to web development. I use notepad regularly to clean formatting when copying text and code. Notepad strips all garbage code behind HTML content and content from Microsoft Word, and allows for clean text code for copying inside a web page.

 

FastStone Image Viewer

Faststone is a free imaging application which allows image manipulation such as resizing, adding special effects, and watermarking of images. Its most powerful tool is the batch processing tool, which allows editing of multiple images on a single procedure. For example, with FastStone I can take 20 images and size them, add a watermark, and give them unique names all in one process.

 

Adobe Acrobat Professional

Acrobat is the standard for print documents on the web. This includes printable forms and graphic brochures. Acrobat Professional allows editing and organizing of such documents.

 

I was planning for my next blog entry to describe the different software that I use in designing and developing  websites. Upon starting the article, I realized that I would be using a lot of terms and acronyms that many people would be unfamiliar with. I therefore decided to put together a list of common terms regarding website design and development.

When I started this article, I thought it would be quick and easy. As I started compiling the entries, I realized just how many terms there are, and how extensive this would be. After almost three weeks of work, here it is. The next time you don’t know what I am talking about, just refer to this handy glossary.

---

Absolute URL – A reference to a website page or file within the site structure of a website requiring the entire path (i.e. preceded by http://www…)

Address – The location of a web page on the Internet where it can be accessed.

Admin Section – A password protected area of a website where one can view and process certain items on the website that are not for public viewing.

Ajax – Client-side coding on a website using JavaScript and XML that can send data to and post from a database on a web server. Ajax works in the background, without interfering with the display and not requiring a page refresh.

Alt Tag – Hidden attribute on an image that describes it in an HTML page. Alt tags are useful to search engines and can also show a tooltip text when the image is hovered over.

Analytics – Tool from Google that analyzes site usage, statistics, and website traffic.

Animated GIF – Type of graphic file that allows multiple frames, which can be compiled into a simple animation.

Apache – Type of HTTP web server software developed for use on Linux servers.

ASP – Acronym of Active Server Pages, which is Microsoft’s original server-side script engine for dynamically generated websites.

ASP.net – Web application framework developed by Microsoft for developing dynamic websites and web applications. ASP.Net is the successor of ASP.

Authorize.net – Popular merchant gateway software that can be integrated into a website in order to process credit card payments online.

Back-end – The part of a website where a website administrator can control certain aspects of the website.

Beta – Design, page, or website that is under development, either not fully completed or fully tested.

Bitmap – Describing an image such as a picture with fixed proportions, where if resized larger it will get distorted. See also Vector.

Blast – See Email Blast.

Blog – Type of website where one posts and publishes any type of information such as articles and musings. The most popular blog website engine is WordPress.

Bookmark – A browser function that places a shortcut to a specific website or webpage for easy reference.

Bot –Web scanning script that is programmed to search websites for specific content. Search engines use bots to scan a website for content to display on their searches.

Browser – A computer program that can access a web page and display its contents. Web pages are viewed in browsers such as Internet Explorer, Mozilla Firefox, and  Google Chrome.

C# – Programming language that can be encoded in ASP.net and applied to web applications and dynamic website pages.

C Sharp – See C# (above)

Cache – Website content that is automatically stored on your computer after visiting a web page for faster subsequent loading.

Captcha – Set of random letters or numbers in graphic form that are placed in a form. The users type in what they see into a field to ensure they are human and not a spam bot.

CGI – A standardized method that allows web browsers to execute server-side web scripting code within several web scripting languages.

Checkout – The final purchasing process in an Ecommerce website.

Chrome – A browser developed by Google for displaying web pages. Chrome has become one of the most popular browsers.

Cloud Computing – Development of platforms or installation of software across multiple servers online.

Cloud Hosting – Hosting of website or web application among several online servers rather than on a single server.

Classic ASP – Referring to old ASP coding, prior to its transformation into ASP.net.

Client-side – Describing code that can be executed directly within a browser and does not have to interact with a web server to be executed.

CMS – Short for Content Management System (see below)

Code – Text specific to a layout language such as HTML or CSS, as well as all programming languages, that will process and render data based on the code content.

Coding – To write code.

Collapsible Table – Describes text in a box on a page that can be opened or closed when its title is clicked.

Cookie – A setting that is stored on your computer in a file that a browser uses to remember your information the next time you go to that page.

Compiled Code – Programming code that has been processed and can no longer be edited without the source files.

Content Management System – Web-based application which allows a web user to login and make changes to certain parts of the website without requiring HTML skills.

Control Panel  – Web pages that control all the hosting settings of a web server account.

Cron Job – Task or web page that is set to be executed or processed at repeated time intervals.

CSS – Acronym of Cascading Style Sheets, which are coding elements an HTML page uses to add color, style, and positioning to text and graphical components within a page.

CSV – Comma delimited file that can be organized in a spreadsheet format that is used to import data into a database.

Data Center – Facility that has many hosted computers connected online that function as web servers.

Data-Driven  Website – A website that has content controlled by a database or XML files, instead of just on a static HTML page.

Database – File that has content organized in a grid format. Data-driven websites can read from a database on the server and write to a database to store information.

Dedicated Server – A computer that is specific to one company’s website or websites. A dedicated server will usually be used to host complex or high-trafficked websites, as opposed to a Shared Server which is one server hosting several different websites.

Dev Server – Temporary server used to develop a website before it is live.

DNS – Acronym of Domain Name System, which is the system used on the Internet to translate website names into IP addresses to properly serve the websites.

Domain Name – The name of a website that is used when typing a website address.

Domain Name Extension – the part of a website domain name that follows the period – for example .com or .net.

Dreamweaver – Computer Program that is made to easily layout and position HTML pages.

Dynamic Menu – A menu of links on a webpage, usually in the header or sidebar, that can fly out or drop down additional menus when a mouse cursor is hovered over it.

Email Blast – An email that is sent out en masse to numerous recipients.

Encryption – Placing sensitive information on web page such as passwords into a undecipherable format during transmission so that it can only be read by its intended party.

Exchange – Type of email protocol developed by Microsoft for synchronous email.

Exchange Server – Server that hosts Exchange email accounts.

Feed – A data format to provide web users with frequently updated content. The feeds are syndicated, or distributed via a web channel, and this allows subscribers to pick up the feed.

GIF – Type of image format, usually reserved for images that are more word-based with extra whitespace.

Google Analytics – See Analytics

Hardware – The physical components of a computer.

Favicon – Tiny icon assigned to a webpage that identifies it by displaying it on a browser tab and on the browsers “favorites” menu.

Field – An element in a form which can be typed into or filled.

Filter – Software that blocks out certain websites.

Firewall – Hardware or software filtering unit that blocks certain incoming and outgoing connections to a computer or network.

Flash – Software used primarily for web animation. Flash is used less on web pages today as Jquery components dominate.

Footer – The bottom part of a website page.

Form – Web page that has fields where one can type into or select, and then the inputted information is processed into an email or into an online Database.

Frames – Set of HTML pages that work together where different pages or sections can be viewed as part of a single page.

Front-end – The viewable pages of a website that are seen in a browser.

FTP – The method of uploading a file such as an HTML file to a web server.

Google+ – A new social media platform from Google which is a social layer overarching many aspects of the web rather than a single website.

Header – The top part of a website page.

Host – A computer such as a web server that contains websites or email accounts.
Hosting – The process of having a website on a web server which allows it to be viewed as a web page.

Hover – To place a mouse cursor over an item which will subsequently trigger and action or event.

HTML – The coding language used to lay out the content of a website.

HTML Page – A web page that is encoded with HTML

HTTP – Acronym of HyperText Transfer Protocol, which is a web protocol for distributing web pages and communicating pages from a web server to a web browser.

Hyperlink – Link on a web page.

Icon – Small image.

IE – Short for Internet Explorer

Iframe – A web page that that is embedded as a window or hidden frame within another page.

IMAP – Protocol for email retrieval off of a mail server. Unlike POP email, IMAP stays connected to the server for instant email retrieval, and allows message flagging status to be stored on the server.

Import – The process of copying in files or data into a website or database.

Include – Generic file on a website that is used within other pages in the website.

IP Address – Numerical label divided by 3 periods assigned to all computers and devices in a network that uses the Internet Protocol for communication.

Java – Programming language that can be used for web applications. Java on the web is usually limited to very complex and detailed web applications.

JavaScript – Scripting language that can execute actions on a web page without requiring the server to process the code.

JPG – The most common file standard for images used on the web, with an efficient compression system.

Jquery – Library of code that can provide animations, effects, and coding operations to a web page.

Keywords – Important words that will be relevant to search engines. Keywords should be used within text on a page, in the title tag, and in a Meta Tag description. There is also a “Keywords Meta Tag” which has the keywords separated by a comma, but this is generally no longer relevant to the search engines.

Landing Page – Single page website that is usually meant for a specific campaign leading a person to a form or as an entry to a different website.

Language – The specific defined methodologies that codes are written in to execute and display items. There are several different programming languages for web applications.

Layered PSD – Photoshop file that has its graphic as individual components that can be freely moved around.

Library – Pre-defined set of codes or graphical components.

Link – Text or image that will take the user to a different page or function when clicked upon.

LinkedIn – Social Media website and platform to connect businesses and professionals.

Linux – Unix-based operating system and web hosting platform that was created as free and open source software for development and distribution.

Live Text – Text on a website that can be selected and is readable to the search engines, as opposed to graphical text which is compiled into an image.

Mail Server – A web server that hosts email accounts.

Magento – A popular open-source shopping cart website platform with many configurable items and custom controls.

Malware – Malicious software residing in a computer that can slow it down, as well as compromise security and sensitive files.

Menu – A list of page links on a website, usually in the top header or in a sidebar.

Merchant Account – An account with a company that provides credit card and other financial processing services.

Merchant Gateway – Software that integrates with a website to enable it to process credit cards online.

Meta Tag – Snippet of hidden code in a web page that is interpreted by various applications and bots, especially search engine bots.

Microsoft SQL Server - A relational database management system developed by Microsoft. Many data-driven websites are run by MSSQL databases.

Mock-up – A design preview of a website in its initial design phase.

Mobile Site – Website specifically designed for small screens such as phones. Mobile sites generally work in tandem with regular sites, and will load only if a small screen size is detected.

Modal Pop-up – A pop-up window that is inherently still attached within the original page it was clicked from, with the background of the original page being grayed out to focus on the pop-up.

MySQL – The most popular relational database management system that is open source. The websites of many data-driven websites are run by MySQL databases.

MSSQL – See Microsoft SQL Server.

Nameserver – Web server that hosts a network service that routes a domain name to its intended location on a web server.

Nav Menu – The navigation links of a website where the other pages can be accessed. This is usually in the top header or in a sidebar.

Network – Group of connected computers.

Open Source – Describes codes that are available and not compiled, and can be modified by someone else who didn’t create them.

Optimized – Describing web pages that are well-organized with keywords and visible to the search engines. Optimized can also refer to graphics that are properly sized and compressed  to optimally load on web pages.

Outlook – Computer program made by Microsoft that downloads, stores, and organizes emails.

Path – The URL syntax to get to a web page via its web address.

PDF – A type of file that is used to display data in a universal format. When used for the web, it is often used for printing pages.

phpMyAdmin – Open source web-based application written in PHP that controls the administration of MySQL databases.

Photoshop – Computer program for designing graphics, including graphics that will be used on a web page.

PHP – An open source, server-side web programming and scripting. PHP is very popular for dynamic web pages for its capability to embed code directly in an HTML page.

Pixel – A single dot in the display of a monitor. On the web, images and graphics are measured in the number of pixels they contain.

Pixelated – When a photo or graphic is stretched or skewed larger than its dimensions, resulting in rough edges and box forms in  the image.

Plugin – An application or web technology that is added on as an addition to an existing program.

PNG – An optimized graphic image format that allows for transparency.

POP – Stands for Post Office Protocol, which is an email deliver and retrieval standard.

POP3 – POP Version 3, which is the current version of POP email.

Populating – Placing content within a database or on pages in a website.

PPC – Acronym of “Pay Per Click”, which is a form of advertising that can be purchased through search engines.

Programming – Writing or organizing code that will execute functions or applications within specific languages.

Proxy – Server or application that acts as an intermediary for requests such as web page serving or file sharing from a clients computer that seeks resources from other servers.

PSD – A Photoshop file.

Refresh – To reload a page in a browser in case it is showing old or cached data.

Relative URL – Describing a reference to a web page or file within the site structure of a website and not requiring the entire path.

Resolution – The number of pixels that a screen can display. Higher resolutions will display more on the screen.

RGB – Acronym of Red, Green, Blue, which are the primary colors used for web and screen graphics, as opposed to CMYK (Cyan, Magenta, Yellow, and Key) which are the primary colors for print graphics.

RSS – Type of web feed used to publish frequently updated content such as blog posts, news, and multimedia in a standardized format. Users can subscribe to RSS Feeds.

RSS Feed – See RSS.

RTE – Acronym of Rich Text Editor, which is a built-in module on a web page form that allows the content to be formatted by selecting text or content and placing a style or activity on that word (such as bold, font, color, link, etc.)

Script – A defined section of code that performs an operation.

Scripting – Writing code in a defined language that will perform an operation.

SEO – Acronym of Search Engine Optimization, which is the process involved to increase a website’s visibility and rankings with the search engines.

Sidebar – A bar or column on the side of the web page that is usually present within most of the pages of that website.

Search Engine – Web program that scans and indexes the web for content, and allows users to conduct a search to find pages they are looking for.

Search Engine Optimization – See SEO.

Server – A computer hosting a website or web application.

Session – Code on a web page that allows data to remain available for use on others pages while the session is active.

Shared Server – Web server that hosts multiple websites on a single computer.

Shopping Cart – The part of an Ecommerce website that allows one to place items into a virtual cart and continue shopping, and then checkout at once with all the items in the cart.

Sitemap – Page or file that contain an outline of all the pages in a website. Sitemaps can be important to search engines to understand the structure of a website.

Slider – Animated image on a web page that transitions through several images with a controllable set of links.

Snippet – A small selection of code.

Source Code – The code running behind an HTML page.

Source Files – Original files used to create Photoshop files or compiled code.

Spam – Junk email.

Spam Bot – Automated program that scans the web for online forms and fills them out with spam.

SSL – The protocol of encryption that secure web pages use to process sensitive data such as credit card information.

Static Website – A website that does not require any programming or database connectivity.

String – Letters or numbers appended to a web address to pass along a value from one page to another.

Stylesheet – See CSS.

Tab – Browser function that allows multiple pages to be open in one browser application screen.

Table – A format in HTML that allows content to be laid out in an organized layout with rows and columns.

Template – A standardized design that is universal to several or all web pages within a website.

Thumbnail – A small-sized preview image that is often auto-generated from a larger one.

Title Tag – Code on a website that defines the name of the page and displays it in the top of the browser. Title tags are important to search engines.

Traffic – The volume of visitors a website receives.

Transparency – Attribute of certain images where their backgrounds are colorless and allow whatever layer is underneath them to be visible.

Trojan – Type of malware which mimics a legitimate program, but instead facilitates unauthorized access and attempts to retrieve sensitive and compromising data.

Twitter – Social Media tool that allows individuals and companies to make short news and updates which are viewed by followers.

Unix – Simplified operating system in which websites can be hosted on web servers.

Upload – To place a file from a local computer online to a web server.

URL – The web address of a website or page name in a website.

Validation – Process in a form submission which only allows valid fields, or requires certain fields to be entered when submitting a web form.

Vector – Graphic format with defined mathematic coordinates that allow the image to be resized without any distortion.

View Source – To look at the HTML code behind a web page.

Visibility – Describing the capability of a page to be visible and indexed by the search engines.

Web Server – A computer connected online, usually in a data center, used to host websites.

Webmail – Tool to manage email directly from a web browser connected to the mail server web platform.

Whitespace – Empty white space on a web page.

Widget – Tool or set of defined functions that can be placed on a web page.

WYSIWYG – Acronym for What You See Is What You Get.  This term is often used on the web to describe HTML editors that visually lay out web content as they would appear on the web.

XML – Type of computer markup language that defines a set of rules for encoding content. Web applications and web pages can use content in an XML file.

XLS – A Microsoft Excel spreadsheet file.

Web Feed – See Feed.

WordPress – Comprehensive and popular website engine used mostly for its blog publishing capabilities and CMS.

WWW – World Wide Web.

People are surprised when they see I don’t have an iPhone. Or an iPad. How can a web developer bent on the latest technology and gadgets not have a brand new iPhone 5 or iPad Mini? Don’t get me wrong: I do think these devices are well designed, slick, and very intuitive. However, my issue with Apple is their closed approach. I believe that most developers also feel this way. We like open-source environments with full access and control, and hate being stifled. That is why developers including myself prefer Android phones and tablets.

Let’s get into specifics. First of all, I want to plug my device into my computer – or any computer – and have full access to all my files on there. I don’t want to be restricted to using iTunes to access my audio files, or having to bypass the rules with SharePod. I want to plug in my device with a standard Micro USB cord to any computer, and then all my files on the device become available without restrictions.

This one really bothers me. Why don’t the Apple devices have an SD card reader? Micro SD is a standard for almost all phones today, and allows upgradable storage and easy transfer of files. Apple intentionally does not want you to easily upgrade your memory – they want you to pay extra for a device that holds more.  Additionally, batteries cannot be removed and swapped in the iPhones and iPads, and I really don’t understand the reasoning behind this. Why not give the ability put in a spare battery when it is needed? Especially when they can make money selling these extra batteries to customers?

Next, why does Apple intentionally cripple Flash on their devices? Indeed Flash is on the decline, and less sites continue to use it. However, many older sites are still using Flash, many video players are encoded in a Flash player, and many banners are still in Flash (not that I mind if the banners are blocked). Though all their devices have the technical capacity to play Flash animations, Apple has intentionally crippled it due to a feud with Adobe. If I don’t like Flash I can choose to turn it off on my own. But don’t force it away from me.

Many of us recall the recent fallout of Apple with Google Maps. Apple management decided to no longer provide the best mapping software on its devices, due to their long-standing rivalry with Google. Instead, they forced their sub-par Apple Maps program on their users without an option to choose. If Apple decides something, that is they way it is going to be, even if you don’t like it. This highlights a broader problem: when Apple intensifies their struggle with their rival Google, the Apple user is the one who loses.

One thing that the Apple products do have going for them is their accessories. No phone or tablet has any many accessories as the iPhone and iPad. However, the lack of variety when compared to Android phones and tablets makes up for this. There are so many different Android phones and tablets, in all different sizes, specs, and prices. This allows one to choose a product that best suits their needs, as opposed to being stuck with the very limited options provided by iPhones and iPads (basically color and GB space, and now a new iPod Mini).

A recent issue iPhone users are experiencing with the new iPhone 5 is the new “Lightning” port. The problem is that many people already have accessories such as speakers and car adapters designed and fitted for their older port, and these suddenly don’t work since they no longer fit in. Granted an adapter is available (which, by the way costs an additional $29 – a whopping cost for a simple adapter that costs pennies to make), but many accessories still do not fit in. Again, Apple made a bad decision here to switch to another proprietary port rather than taking the opportunity to make their new devices compatible with a universal USB port.

Now that I stated my position, I do want to give credit to Apple for being the innovators. After all, Apple introduced the GUI computer interface, finger-swiped phones, and today’s tablets. Their research and development is top-notch, and they come out as leaders of great innovations. They make a robust and solid product that just grabs attention and appeal. Their only problem is that their competitors catch up pretty soon after, and finish the job of making a more open and comprehensive product.

The bottom line is that despite Apple’s innovations, the new Android phones and tablets are really putting solid competition to the Apple products. And now with Microsoft entering into the tablet market, and introducing their new Windows 8 phones, this will be adding a whole new dimension to the pie. While Apple lovers will always remain committed to the products of the company they love, the openness of Android and Windows platforms will steadily dominate. These products are coming with more bells and whistles, while retaining the same sleek and innovative features as the Apple products. Devices such as Samsung’s Galaxy product line are being dubbed as iPhone and iPad killers, and for good reason. They provide the same sleekness as the iPhone and the iPad, but have many more features and a much more open platform.

 

Being in the New York City Metro area, our business was affected by Hurricane Sandy. While not receiving the devastation and flooding like the coastal regions, our area was plagued by a staggering amount of fallen trees and downed power lines. Roughly eighty percent of Rockland County lost power during the storm, including our office building. All of our employees also lost power at their homes.

The power went out in the office on Monday afternoon. Once we lost power, our data server in the office shut down. Our battery backups kicked in at the initiation of the blackout, but it was obvious that this was going to be a long-term blackout. Unable to do any work in the current situation, I closed the business for the duration of Monday, as well as Tuesday. I moved into the home of my in-laws, who live in one of the few areas that remained with power throughout the storm. This allowed me to have email access throughout the week and still be in touch with my customers. I was also able to setup an email autoresponder message stating that our business operations were down for the storm. I also had the ability to access all the data files on our office server through our online backup. This proved critical since there were two clients that needed emergency changes, and we were able to accomplish this with our online backup.

On Wednesday, power was restored at our office complex. I got our computers and file server up and running again, but our Internet and phones were still down. Our Internet provider is Optimum Online, and it was impossible to get through to them to know when they would be fixing the problem. In the meantime, the offices in our building with Verizon FIOS had service. Being that our business is crippled without an Internet connection, I needed to think of a plan to get up and running. What we did was run some wires and cables into our neighbor’s FIOS account, change the settings, and get our system back up on a temporary connection. Getting everything back up and running again, and rewiring and configuring the network took a significant amount of time, but we were finally almost back to normal again by Thursday, except for our phones.

Our phones system uses an in-house Asterisks box connected to VOIP through our Internet. This requires a static IP connection, which we have with Optimum. We could not get this configured on the temporary FIOS account, so our phones remained down, without any update from Optimum when the Internet and hence our phones would be restored. To make matters worse, cell phone reception was awful and phone calls kept on dropping. The cell phone problem had to do with many of the cellular towers being out of commission, and the overload of cell phone calls during this time due to the other phones being out. Thankfully our customers understood and were able to bear with us.

The following week after Hurricane Sandy found us still without phone service, though business was otherwise pretty much back to usual. We were managing off our cell phones, and putting a special emphasis on email communication. We also had routed our business phone to a call service, who would email us all messages. Finally on Thursday, a week and a half following Sandy, our Internet came back. However, the phones were still not working, and I had identified the problem being the static IP box which malfunctioned, presumably from the blackout. I attempted to call Optimum in vain, as the wait to speak to someone was several hours. I then tried their chat, which too was in for the same reason.

On Friday, I made sure to start a chat session with Optimum upon coming in to my office. When I had to leave the office early at about 1:00 PM, there were still close to 100 people ahead of me on the chat queue. I logged back in from home to periodically check, and sometime in the afternoon, about two hours prior to sunset, I finally got through to a chat operator. I explained the problem, and she made an appointment with us on Monday to correct the problem. A technician came on Monday, resolved the problem with the unit, and we were finally back up and running 100% exactly two weeks after the storm.

Though our business was definitely affected by the hurricane, we are thankful that our losses were only temporary. There are homes and businesses in other parts of our area that were totally devastated and will take a long time to recover. We are proud to say that none of our web hosting servers went down during the storm, and all our clients’ websites and emails remained up the entire time. It is important to have a disaster recovery plan, and we cannot stress the importance of having a backup of all data, especially an online backup system. We have learned many lessons from this storm, though we hope not to have to apply them anytime in the near future.

If you did not have a chance to participate in our Social Media for Business Presentation back in March 2012, you can now watch the complete video online. My friend and business partner Mordy Gilden of Rombus Digital has compiled the video and associated video screenshots of the presentation, and you can watch the full 32 minute version below.

Specific topics in the video include:

• Facebook for business
• Twitter for business
• LinkedIn
• Web Video
• Email Marketing

The presentation was sponsored by the New York Business Development Network (NYBDN), with a fine breakfast spread of bagels, eggs, potatoes, and coffee. The presentation was held on March 14, 2012, in the conference room at the Radial Web office. There were about twenty attendees, and they all benefited from the presentation.

 

WordPress is a great tool. It is a powerful, open-source engine for posting blog entries and news articles. It has an intuitive, easy-to-use interface, and is very flexible and easy to work with. WordPress also has a strong community behind it, with discussion forums and online help websites elaborating every searchable nitty-gritty aspect of WordPress. It also has many free and purchasable plug-ins, and custom requirements are often easy to integrate.

Despite its robust platform, WordPress should only be used for its intended purpose: as a blog or news engine. That’s it. All too often I see informational or shopping-cart websites stretching themselves and overburdened to fit within the WordPress box, where ultimately they just can’t fit in properly. This effectively takes a great platform and corrupts it into a complicated jargon. I call this “WordPress Abuse”.

There are several manifestations of WordPress abuse. I like to lump them into three categories:

1. Informational Website Overkill
2. Data-Driven Website Arm Twisting
3. Comatose Websites

1. Informational Website Overkill:
This happens when a web designer takes a simple informational website and places it within WordPress. The only advantage of doing this is that the informational pages are controllable via a database in the Content Management System (CMS). The practical meaning is that the owner of the site can change his page content by logging in to the CMS without having to know any HTML. As nice as this sounds, it is in fact overkill, since none of the other WordPress tools are utilized or necessary, and the CMS isn’t the greatest one out there. One can just as easily have the website run a lighter, simpler CMS which is customized for that specific website.

What really irks me when I take over a website done in WordPress is when the website owner has no idea how to use the WordPress CMS. So ultimately any text changes I end up doing myself despite their controllable CMS. Not only is the WordPress CMS worthless to them, I have to inconvenience myself and make the changes in the CMS when it would be much easier and quicker for me to edit them directly in the native HTML and upload it.

2. Data-Driven Website Arm Twisting:
This is when a complex or shopping cart website has specific out-of-the-box requirements, and a slew of plug-ins and/or custom coding is necessary to make the website work as per the requirements. It is okay to have a couple plug-ins and customizations installed on a WordPress website, but relying on too many of them can present a witches brew, with some of the following symptoms:

• Incompatible plug-ins
• Plug-ins that are unstable and crash
• Plug-ins that were developed overseas with poor customer support
• Outdated plug-ins that prevent WordPress from being upgraded
• Difficulty in making changes, sometimes even minor ones
• Lots of unnecessary items that can be in the way that come together with packages

3. Comatose Websites:
This happens when a WordPress engine is installed on a site for publishing content, but it stays dormant with hardly any updates or posts ever made to the website. Though all websites can get old and dusty if not updated, WordPress websites are particularly vulnerable due to their nature as portals of news, updates, and musings which are meant to be posted to regularly.

The bottom line — WordPress is great, and I highly recommend it. I say this first-hand using WordPress to write the words I am typing now.  However,  don’t abuse it. Only use it for its intended purpose.

More and more people are browsing online with their smartphones, and the trend only continues to rise. Mobile users are often looking for basic information, so it’s important to keep a site design in mind for this. Mobile websites are made to fit the small resolution of the phones, and have enhanced navigation and controls specifically designed to enhance the mobile navigation experience. A website with a mobile version will contain “browser sniffing code”, which will detect the browser type. If it detects a large screen browser, the regular website will load, and if it detects a mobile device or small resolution screen, the mobile version will load. This is all automated within the code.

There are two types of mobile websites:

• Multi-Page Mobile Website
• Mobile Landing Page
  

Multi-Page Mobile Websites are websites that have multiple pages with a navigation menu. They can be a full version of the main website, with the same exact page names and content, but may also be a stripped down version of the main website. The stripped-down version is still multiple pages with navigation, but contains less content and easier navigation formatted specially for mobile reading. Some mobile websites even contain shopping carts and data-driven content in a more friendly format for small screens.

Mobile Landing Pages are single page websites with the basic information such as logo, phone number, and the rest of the contact info on one page formatted for a mobile device screen. These pages allow someone doing a quick search to find the important info they need from their mobile device, and also allow a link to the phone number to allow calling directly from the phone by clicking the link. Mobile Landing Pages usually have a buttons or link on the bottom of the page to view the full site where more information is available.

While many companies prefer a Multi-page website for versatility and professionalism, the mobile landing page is a quicker and more affordable option. These are very easy to setup and in many cases will only be an hour or two of work. Being that a mobile option can be so quick and affordable, there really is no excuse today not to have at mobile website, even if it is just a simple mobile landing page.

All websites use graphical images, with some websites more dependent upon them than others. Today’s website design standards require a strong visual approach to maintain a cutting edge website, and image size and graphic quality have been increasingly important. While some websites may be able to provide their own images and custom photography, many, if not most, will require stock photo to fill this void.

Stock photos are provided by several agencies that have large online databases of searchable images and photos.  One can type in a keyword or keyword phrase into a search box on the stock photo agency website, and relevant photos and images will display in the results. Each photo that is put up by the stock photo agencies is tagged for keywords so they can be easily searched.

Stock photo agencies get their pictures from photographers and designers, who make an arrangement to get a payment or royalty from the agency every time their photo is used. It is not uncommon to see the same photo in more than on Stock Photo agency; this happens when a photographer submits the same photographer to multiple agencies.

Some of the big stock photo names include:

• Corbis.com
• Fotolia.com
• Istockphoto.com
• Gettyimages.com
• Shutterstock.com
• 123rf.com

To prevent copyright infringement and protect their suppliers, every stock photo agency watermarks or stamps their images with a logo. While an experienced graphic designer can graphically remove the watermark, this is considered copyright violation and is illegal. Similarly, some unscrupulous web design companies will take random photos for use on a clients’ website by just doing a website image search on Google Images. (This is an all too common practice of offshore website designers.) The proper way to get stock photo is to spend the few extra dollars and properly purchase them from the agencies. At least one of the Stock Photo agencies, Getty Images, has a nasty policy of doing a sophisticated image scan of their images on the web to see which website are using their images without authorization. If they find an image originated from them used illegally or erroneously, they will issue a generated fine via mail to the holder of the website. I have seen this on several occasions where a previous developer or company worker found an image on Getty Images and used it on the website, and subsequently (sometimes even years later) got slapped with a hefty fine close to a thousand dollars. Whether intentionally copyrighted or inadvertently copyrighted, this is no fun to deal with. Besides for keeping the law, it is highly advisable to stay out of any potential trouble and only use stock photo that was legitimately purchased.

There are two forms of stock photos:

• Rights Managed
• Royalty Fee

Rights Managed stock photo allows a user to buy the image and gain exclusive rights to that photo with unlimited usage. Rights Managed stock photo can be very expensive, sometimes even several thousands of dollars. Royalty Free stock photo is the more common usage in websites, where the purchaser buys a specific license to use the photo, but it is not exclusive. When purchasing stock photo, one can select different sizes of the image to purchase, with higher resolution versions costing more than the lower ones. For the most part, when it comes to the web, the smallest or second-to-smallest size will usually suffice, as screen displays require a much lower resolution than print. This allows stock photos used on the web to be very affordable.

My preferred choice when choosing Stock Photography for websites are Fotolia and IStockphoto. Both these websites are reasonably priced on most images. In many cases the desired photos can be purchased for around a dollar each! Both these agencies have straightforward policies and an easy purchasing process, unlike other agencies such as Corbis where the price structure and fees are very confusing. Although none of the agencies allow you to purchase one photo at a time, but rather only allow purchasing a minimum amount of credits, it is still worth it to spend the extra amount and go the safe route. In general, the more credits you buy at a shot, the better price you will get per credit.

Whenever I do a website for a client, I usually assist in attaining the stock photo if it is needed. I will either do a search within the stock photo agencies website, and present the options to the client, or offer suggestions where and how to search. If a client only needs a few stock photos that are around a dollar each, I may even purchase the photos under my own account and not bill for this.  If a client provides their own stock photo for me to use on their website, I trust that the images they are providing us were properly licensed to them, and indemnify myself of responsibility towards this.

 

Part 2: Putting Together Your Website

 

1. Being Involved

The only way to have a successful website is to have you or someone from your organization involved with the production of your new website. Somebody will need to be available to put together content for the website, check progress during the development, and answer questions we may have. This is imperative in establishing a successful web presence, as it requires cooperation and communication.

 

2. Identifying Your Website

Think about the goals and objectives you want to accomplish with a new website. To help you decide how you want your website to function, study how other companies, especially your competitors, put their websites together. View their page structure, their wording, their color/styles, and the graphics they use. This will help you determine what you want (or don’t want) in your website. (If you don’t have the availability to do this, we can provide a pre-design consultation strategy to help your organize the material for your website at our hourly rate.)

 

3. Text for your Web Pages

You or your writer will need to put together content for the pages of the website. Text used in a website should be well written and grammatically correct. We have a professional writing partner should you require assistance in the writing or proofreading of text. Website text should contain relevant keywords so that the search engines can properly index the pages.

The Home Page
The Home Page (the first page of a website) is the most important page in the site. It determines if the visitor stays on your site or clicks further and leaves. Home page text should generally be one or two paragraphs and loaded with keywords. Visitors will read more about the site by clicking the links if they are interested – there is no need to stuff everything on the home page.

The Inner Pages
The inner pages are where all the content is placed. You can have as many inner pages as you wish and give them any name you desire. Each site uses its own unique names for all the pages, and most have the following standard pages:

• About Us
• Services
• Contact Us

If your site will have many pages, you will need to have the pages grouped by category or section, and this is often organized with dynamic flyout or dropdown menus.

 

4. Graphics for your Web Pages

Most professional websites use graphics and images in their web pages. You can download and purchase royalty free photography from stock photo galleries such as Fotolia.com or Istockphoto.com, or send us your own digital photographs. We can also assist you with image searching and purchase the pictures for you.

We can also edit your own digital images by changing the size, color, etc. or create custom graphical banners, mastheads, and montages that combine several images into a single composite. If necessary, we can also provide the services of professional digital photography through a partner.

 

5. Logo and Branding Identity

Most professional websites use graphics and images in their web pages. You can download and purchase royalty free photography from stock photo galleries such as fotolia.com or istockphoto.com, or send us your own digital photographs. We can also assist you with image searching and purchase the pictures for you.

We can also edit your own digital images by changing the size, color, etc. or create custom graphical banners, mastheads, and montages that combine several images into a single composite. If necessary, we can also provide the services of professional digital photography through a partner.

 

6. Jquery, Sliders, and Animation

Animations can enhance a website by providing a rich, multimedia experience. When used properly, these can really enhance a website’s appeal. (Animations can also seriously detract from a website’s objective if used improperly.) Other multimedia elements you may want to incorporate into your web pages are audio and video such as MP3, MP4, Flash video, and YouTube videos. These can be seamlessly integrated as streaming media directly through the website.

 

7. Text on Page Footer

It is recommended that you copyright your pages by placing copyright information on the footer of every page. Copyright text should not exceed one line. Many websites also have an email link or text page links on every page footer, and this is often useful for navigation and search engine optimization.

 

8. Web Forms

You may want to provide fill-in forms on your site where visitors can input information and submit it to you. These forms can be customized by their fields, the way they look, and how they process the data collected. Forms can also be customized to limit the data within each field. For example, if more than five digits are placed in a zip code field, an error message will be generated. Web forms are useful as email contact forms, application forms, and online donation forms, among other things.

 

9. Search Engine Tags

Search engines such as Google, Yahoo, and Bing use content to determine rankings as one of their many ranking methods. To achieve the best results, it is recommended to put together a description and page title for each website page (keywords are no longer relevant).

• Description: A short, one sentence description of the website that sums it up and contains keywords.
• Page Title: Eight or less words describing the page.

 

10. Data-driven and Shopping Cart Sites

Websites that contain data that can be controlled and edited directly online are known as dynamic websites, or data-driven websites. Most online stores and shopping cart websites are database-driven. The nature of these websites tends to be quite complex, so we can discuss with you the exact requirements and how to best achieve them. There are many features that can be used with dynamic sites, including search capabilities, catalogs, customer accounts, calculators, and administrative functions.

 

11. Data-driven and Shopping Cart Sites

Social Media integration with Facebook, Twitter, and LinkedIn are important in today’s changing world. Blogs have also become an important forum for companies to post news and updates. Not all websites require these features, but they are very important and should be thought about for website integration. Mobile Websites have also become very popular and should be considered whenever designing a new website.

 

12. Domain Registration and Hosting Information

As previously noted, if you don’t already own a domain name for your website, you will need to purchase one. We recommend Godaddy.com, an established company with the most competitive pricing.

We will setup all accounts on our own hosting server and manage it. If you require the hosting to be provided by a third-party vendor, you will need to prepare your login information such as FTP login and Control Panel login so that the site can be placed on your hosting server once the site is complete.