Starting a coding project can seem daunting. A lot of people tend to hear web design and immediately think of writing code, inspiring weariness and worries about Python, Ruby, and the like. Luckily there are many different ways to build a website
Before we get into actually building a site, we should cover the steps that need to be taken to get there. When we discuss “web design”, we’re talking about visualizing ideas in broader terms, such as image-focused software like Photoshop as well as coding with HTML, CSS, and Javascript. Web design is a process that covers the following steps:
Info gather/project definition
Planning
Design
Development
Testing and delivery
Maintenance
This process answers the questions of why you need a website and what it is supposed to achieve. User research informs the planning and design stages of the process, creating a guideline of what the site needs and options of how that may look.
Like any other design process, steps throughout the web design process may need to be revisited until you get it right.
At the development stage, the site is actively constructed using everything learned in the previous steps. Testing and delivery polish the final product, making sure everything is in working order. Once the site is constructed, maintenance needs to be continued to keep everything running cleanly.
An important aspect to consider throughout this process, no matter what method you decide to build with, is responsive design. Responsive design considers the many different devices and platforms on which users can view a website and delivers sites that flex or respond to the user’s needs/devices. Screen sizes are always changing, so it’s important to make sure your site can adapt to any screen size, now and in the future.
When it comes to setting out and building a website, you have three main options: CMSs, hand coding, and HTML editors.
CMS stands for Content Management System. A CMS is a digital application that supports the creation and maintenance of online content. These systems are targeted towards a wide range of users and require only a base level knowledge of how to build a web page. They are often complex and deeply customizable in all aspects of web design. CMSs integrate front end components and backend components to make complex functionality something available to any user. (Front end components of web design are elements that are controlled by your computer’s browser while backend components are complex technologies not visible to the user, which are integral to the site’s inner workings). Services like WordPress, Wix, and Squarespace employ templates and widgets to prompt users to simply fill in the blanks and come away with a functioning website. Most of these services are free but come at the cost of outside advertisements.
pagely uses WordPress as an example to show how easily customizable CMSs are.
Hand coding is the traditional way of building a website by writing code from scratch or stitching together free code found online. While this method requires more knowledge and a considerable amount of time, there are also something about it that affords more benefits: Hand coding allows you full control over what you are trying to design. You don’t have to work within the constraints of a template, which allows you to explore more innovative designs. CMSs can provide thousands of options in terms of graphics, templates, and plug-ins, but they can be difficult to modify according to your specific needs. Hand coding is best suited for large projects that have too many moving parts for a CMS to handle.
An example of very basic code from W3Schools.
If you’re leaning more towards the option to hand coding but feel your knowledge will be limiting, HTML Editors are also an option. HTML editors are low level authoring tools that are essentially text editors specialized for writing HTML code. These editors assist by cataloging all HTML tags and common structures in menus while also catching syntax errors.
An example of HTML editor Sublime Text
In short, a CMS is a good option for personal use with little to no budget, hand coding is more ideal for large projects that can afford the time and money needed to back the work being done, and HTML editors fill in the in-betweens.
It will always be beneficial to learn a base level knowledge of coding. Even if you’re planning on using a CMS or HTML editor, knowing the structure, semantics, and process of coding and web design can help throughout the process.
Photo by Shahadat Rahman on Unsplash
Comments