Websites are the foundation to doing business on the Internet.
Websites must be interesting, informative and functional.
Websites are where you begin doing business on the Internet.
Websites – Design and Development
Although these terms are often used interchangeably, Website Design and Website Development are two distinctive skill sets of the website building process. Why is it important that you know the difference as you look for someone to design and develop your company’s website? Let’s see if we can provide some clarity.
Website Design vs. Website Development in A Nutshell
In essence, website design refers to both the aesthetic portion of the website and its usability. Website designers use various design programs such as Adobe Photoshop to create the layout and other visual elements of the website.
Website Design – A Closer Look
Website designers must always begin by considering a client’s website objectives and then move on to an Information Architecture (IA) to set a website’s information hierarchy and help guide the design process.
Next, website designers can start creating wireframes and finally move to the design stage. Website designers may use several basic design principles to achieve an aesthetically pleasing layout which also offers an excellent user experience.
Balance – It’s important for web designers to create a balanced layout. In website design, we refer to heavy (large and dark colors) and light (small and lighter colors) elements. Using the correct proportion of each is critical to achieving a balanced website design.
Contrast – In color theory, contrasting colors are ones placed opposite one another on the color wheel. Web design offers a few other areas where contrast is applicable. Designers look at contrasting sizes, textures and shapes to define and draw attention to certain sections of the website.
Emphasis – We touched on this a bit when discussing contrast. Emphasis is a design principles founded in the intentional “highlighting” of certain important elements of the website layout. It’s important to note that if you emphasize everything on the page you end up emphasizing nothing. Imagine a page in a book where 80% of the content is highlighted in yellow…does anything really stand out? This is the time to take a look at that Information Architecture for direction.
Consistency – Also called repetition or rhythm, consistency is a critical website design principle. For example, clean and consistent navigation provides the best user experience for your website visitors.
Unity – Unity is the relationship between the various parts of the website layout and the composition as a whole. Based in the Gestalt theory, unity deals with how the human brain visually organizes information by grouping elements into categories.
Website Development is the study, development, transformation, maintenance and improvement of platform software. Website developers build and maintain content for the web targeting different platforms including desktop, tablets and handheld mobile devices.
Some sites require a special server because certain content has to be customized for each user based on their data. This type of development is called back end development because most of the action is not happening in front of the user, but on a server in the background. Full Stack development refers to the set of tools both frontend and backend that a company uses to build its web presence. Generally, front end development and back end development are completed by different developers with different skill sets, although both frontend and backend developers must be familiar with both development concepts. A developer who is expert in both frontend and backend development is known as a Full Stack developer.
HTML stands for Hypertext Markup Language. It describes the content and defines the structure within a webpage. Hypertext means that documents on the web are not meant to be consumed in a linear fashion, they’re designed to be linked to other documents.
A front-end developer must understand the relationship of the entire site, and how documents relate to one another. This is called Information architecture (IA; structural design of a website’s navigation) and it involves how best to structure a site, how a user is going to navigate, and what type of access users need to other content.
The second part of HTML is the markup language. That’s the set of tags that are added to the text of a webpage to define its structure. It has some really critical roles. First, it defines the role each piece of content will have. Some content will become the main headline, while other content links in the navigation. Some tags describe non-textual elements like images or video.
Mark up also generates the Document Object Model, or DOM. The DOM describes the structure of the page, it’s like an outline or a map of the content within a website. When you add markup tags to a document you’re building the map that defines the role of your content.
CSS stands for Cascading Style Sheets. CSS is the layout language and is used for website navigation which drives the user experience, and determines how content is presented to the user. Like HTML, CSS is made up of two parts. First CSS is about defining a set of rules, or style sheets, for how the DOM is translated into visual form. The second part is the cascading style rules. These are a set of rules that describe the priority of how the styles are rendered on a page.