At the end of this lesson-
- 1. You will be able to explain web page design and development.
- 2. You will be able to explain the importance of website publishing.
- 3. You will be able to explain the steps of website publishing.
- 4. You will be able to explain different types of hosting.
Go for Bangla Version
Web page design and development:
Web page design is the process of creating websites which is front end design. It encompasses several different aspects, including webpage layout, content production, and graphic design using the different technology and CMS. Web designers build webpages using HTML tags that define the content and metadata of each page. Most websites include a combination of HTML and CSS that defines how each page will appear in a browser. Designer must keep in mind that website run on all platform and browser.
Website design means planning, creation and updating of websites. Website design also involves information architecture, website structure, user interface, navigation ergonomics, website layout, colors, contrasts, fonts and imagery (photography) as well as icons design.
The various tools like Adobe Photoshop are used to formulate the layout and other visual elements that form the website. Some of the website design principles are Balance, Contrast, Emphasis, Consistency, Unity.
Web page development is the coding or programming that enables website functionality, per the owner’s requirements. It mainly deals with the non-design aspect of building websites, which includes coding and writing markup.
Web development ranges from creating plain text pages to complex web-based applications, social network applications and electronic business applications.
The web development hierarchy is as follows:
- Client-side coding
- Server-side coding
- Database technology
The following steps are followed for website design and development process:
1. Gathering Information
2. Planning
3. Information architecture
4. Design
5. Development
6. Testing
7. Maintenance
Gathering Information: In this stage, the most important task is to get a clear understanding of your future website purposes, the main goals you wish to get, and the target audience you want to attract to your site. Such kind of a website development questionnaire helps to develop the best strategy for further project management.
Planning: Based on the information that was gathered together in the previous phase, the sitemap is created. The sitemap should describe the relations between the main areas of your website. Such representation could help understand how usable the final product will be. It can show you the “relationship” between the different pages of a website, so you can judge how easy it will be for the end-user to find the required information or service if he starts from the main page. The main reason behind the sitemap creation is to build a user-friendly and easy to navigate website.
In this case, a wireframe or mock-up is created. A wireframe is a visual representation of the user interface that you’re going to create. But it doesn’t contain any design elements such as colors, logos, etc. It only describes the elements that will be added to the page and their location. It’s artless and cheap in production sketch.
Information architecture: In this stage, website structure is selected. Website structure is selected based on the type of website.
Design: During the design phase, your website takes shape. All the visual content, such as images, photos, and videos is created at this step. Once again, all the info that was gathered through the first phase is crucial. The customer and target audience must be kept in mind while you work on a design.
The website layout is the result of a designer’s work. It can be a graphic sketch or an actual graphic design. The primary function of the layout is to represent the information structure, visualize the content, and demonstrate the basic functionality. Layouts contain colors, logos, images and can give a general understanding of the future product.
Development: In this step, you can finally start creating the website itself. Graphic elements that have been designed during the previous stages should be used to create an actual website. Usually, the home page is created first, and then all sub-pages are added, according to the website hierarchy that was previously created in the form of a sitemap. Frameworks and CMS should be implemented to make sure that the server can handle the installation and set-up smoothly.
All static web page elements that were designed during the mock-up and layout creation should be created and tested. Then, special features and interactivity should be added. A deep understanding of every website development technology that you’re going to use is crucial at this phase.
Testing: Testing is probably the most routine part of a process. Every single link should be tested to make sure that there are no broken ones among them. You should check every form, every script, run a spell-checking software to find possible typos. Use code validators to check if your code follows the current web standards. Valid code is necessary, for example, if cross-browser compatibility is crucial for you.
Maintenance: What’s important to remember is that a website is more of a service than a product. It’s not enough to “deliver” a website to a user. You should also make sure that everything works fine, and everybody is satisfied and always be prepared to make changes in another case.
Feedback system added to the site will allow you to detect possible problems the end-users face. The highest priority task, in this case, is to fix the problem as fast as you can. If you won’t, you may find one day that your users prefer to use another website rather than put up with the inconvenience.
The other important thing is keeping your website up to date. If you use a CMS, regular updates will prevent you from bugs and decrease security risks.
Website publishing:
Website publishing is the process of publishing web pages or content on the Internet. It includes creating and uploading websites, updating web pages, and posting blogs online. The published content may include text, images, videos, and other types of media.
The following steps that should be followed for website publishing. They are-
1. Domain Registration:
The Domain Name defines the address that people use to find your website – for example, the Domain Name of this site is edupointbd.com. Most Web Hosting companies offer to register a domain on your behalf when you buy a hosting package with them. It is usually simplest to register a Domain with your hosting company, as they will then automatically link the Domain Name to your web server.
If you prefer however, you can also purchase a Domain Name from a ‘Domain Registrar’. To register your Domain this way, you will need to log in to your account on the Domain Registrar’s website and link the Domain to your website’s DNS address(es). These can usually be found in the email you get from your hosting company after you sign up.
Some popular companies or ISP(Internet Service Provider) who offer domain name registration service are GoDaddy.com, Hostgator.com etc. Beside these some companies who offer free domain name registration service are 000webhost.com, freehosting.com etc.
2. Web page hosting on the server:
Web hosting is a service that allows organizations and individuals to post a website or web page onto the Internet. A web host, or web hosting service provider, is a business that provides the technologies and services needed for the website or webpage to be viewed in the Internet. Websites are hosted, or stored, on special computers called servers. When Internet users want to view your website, all they need to do is type your website address or domain into their browser. Their computer will then connect to your server and your webpages will be delivered to them through the browser.
Most hosting companies require that you own your domain in order to host with them. If you do not have a domain, the hosting companies will help you purchase one.
Some popular companies or hosting service providers who offer hosting service are GoDaddy.com, Hostgator.com etc. Beside these some companies who offer free hosting service are 000webhost.com, freehosting.com etc.
3. Search Engine Optimization(SEO):
Search engine optimization (SEO) refers to methods used to increase traffic to a website by increasing its search engine page rank. Websites improve search engine optimization by improving content, making sure that the pages are able to be indexed correctly, and ensuring that the content is unique. Going through the search engine optimization process typically leads to more traffic for the site because the site will appear higher in search results for information that pertains to the site’s offerings. This step is not mandatory for making website live.
Types of hosting:
Based on operating system two types of hosting:
Linux hosting: In general, Linux hosting refers to shared hosting, the most popular hosting service in the industry. In fact, most of the websites are now hosted using Linux hosting due to its affordable price and flexibility. Linux hosting is compatible with PHP and MySQL, which supports scripts such as WordPress, Zen Cart, and phpBB.
Windows hosting: Windows hosting, on the other hand, uses Windows as the servers’ operating system and offers Windows-specific technologies such as ASP, .NET, Microsoft Access and Microsoft SQL server (MSSQL).
Based on different facilities there are several hosting types:
Shared hosting: Shared hosting means just that. Your website is hosted on a server shared by other websites. All domains will share the same server resources, such as RAM (Random Access Memory – a type of computer memory) and CPU (Central Processing Unit – the “brains” of a computer). The advantage of this setup is that costs of this type of hosting is comparatively low.
When most people start an online business they usually start out with a shared hosting plan to minimize costs, and they’re not likely getting a ton of traffic initially. Shared hosting is good for a brochure type site or a newer site that doesn’t get a lot of traffic.
The biggest disadvantage of a shared hosting account is that you’re at the mercy of the other sites on your server. A really popular site may adversely affect the performance of your own site. On the other hand, if you’re the most popular site on the server, you get to use a super server for a very low price.
Dedicated server hosting: When you have a dedicated server, it means you are renting one physical server from a hosting company. You can have full control (called “root” permissions in Linux) if you want it.
With a dedicated server, you don’t have to worry about other websites on a shared server taking up your resources and slowing your website down.
A dedicated server is generally the highest level of server you would need if your online business grows into a presence that is getting a lot of website traffic. While the costs of a dedicated server are significantly higher than shared hosting, your business will be at a point that can easily afford the necessary costs of having your own server.
Virtual Private Server (VPS): Virtual private servers share one physical server but act like multiple, separate servers. A VPS is a stepping stone between shared hosting and getting your own dedicated machine. Even though each VPS instance shares hardware resources, they are allocated a dedicated slice of the computing resources. A VPS avoids the problem of having your hosting neighbors bring down your website, while avoiding the cost of a dedicated server.
Cloud Based Web Hosting: Cloud Based Web Hosting refers to a fairly new hosting technology that lets hundreds of individual servers work together so that it looks like one giant server. The idea is that as the need grows, the hosting company can just add more commodity hardware to make an ever larger grid or cloud.
The advantage of cloud-based web hosting is that if you get an unusually large amount of website traffic the web hosting plan can accommodate the surge of traffic – rather than shutting your website down.
If your website is growing and you’re driving more traffic to your website, this is probably the first point you would upgrade too from a shared hosting plan.
Colocation Web Hosting: When you colocate, you rent rack space from a data center. You bring in your own server hardware and they provide power, cooling, physical security, and an internet uplink. This means you’re responsible for your own server software, data storage, backup procedures, etc. If hardware fails, you’re responsible for replacing it and getting the server back up and running.
Unless you have the technical know-how in-house, colocation is probably not worth the investment in time, expertise, and money for most small businesses.
Managed hosting: Most hosting packages you are likely to find online will be managed. Hosting companies provide technical services such as hardware and software setup and configuration, maintenance, hardware replacement, technical support, patching, updating and monitoring. Unlike standard dedicated hosting, the hosting provider looks after the day-to-day management of the hardware, operating systems and standardized applications.
A popular sub-category is WordPress managed hosting. For many businesses, the beauty of WordPress is in its simplicity. Its benefits are clear, it’s easy to setup and it’s straightforward to manage. Choosing a hosting provider for a WordPress site can be more of a task, however, especially for those without expert knowledge or experience of the market. Many web hosting companies now specialise solely in offering managed services for WordPress.
Lesson Evaluation-
Knowledge Based Questions:
- a. What is website publishing?
- a. What is web page hosting?
- a. What is SEO?
- a. What is ISP?
Comprehension Based Questions:
- b. “Hosting is an important step of website publishing” – explain.
- b. Why domain name has to be registered? explain.
Creative Questions:
Read the stem and answer the following questions:
The home page of the “X” organization is provided with the picture (administration.jpg) of the administrative building of the organization and the two webpages named Employment.html and Production.html are linked to the home page. If the website is on the Internet, conscious people in the world will know about the organization.
d) What might be the necessary steps to make a conscious person appear the website as mentioned in the stem? analyze.
Read the stem and answer the following questions:
The ICT teacher added an image to webpage using HTML in the class and asked for creating a webpage where the image named logo.png in the “picture” folder of F drive should be shown as 500×300. Finally he asked to manage the webpage to visit anytime from any corner of the world.
d) What steps should be taken to view the webpage of the stem from any corner of the world? Argue for the answer.
Multiple Choice Questions:
Read the stem and answer question No-1:
Didar and his friends together created a website, where webpages are connected to multiple level. He later took the necessary steps to make the website appear on the Internet.
1. The steps taken are-
i. Domain Name Registration ii. Linking webpages iii. Website Hosting
Which one is correct?
a) i & ii b) i & iii c) ii & iii d) i, ii & iii
2. What is the process of publishing content on the Internet?
a) Website Publishing b) Webpage Designing
c) Webpage development d) Searching webpages
3. The main two things for webpage publishing are-
i. Domain Name Registration ii. Search Engine Optimization iii. Website Hosting
Which one is correct?
a) i & ii b) i & iii c) ii & iii d) i, ii & iii
Written by,
- Mizanur Rahman (Mizan)
- Lecturer of ICT, Shaheed Bir Uttam Lt. Anwar Girls’ College , Dhaka Cantonment
- Author at www.edupointbd.com
- Software Engineer at mands IT
- Formar Lecturer of ICT, Cambrian College, Dhaka
- Email: mizanjust@gmail.com
- Cell: 01724351470