HTML5-CSS3 Schoolproject

Samir Talic, HTML5, CSS3, Fend 16 @Nackademin

Schoolproject in HTML5 and CSS3.

CyberiaV1(without using frameworks and libraries) is published at:https://4886talga.github.io/cyberiaV1/

CyberiaV2(Bootstrap) is published at:https://4886talga.github.io/cyberiaV1/

GitHub Repo: https://github.com/4886Talga/HTML5-CSS3-Project

Project description

In this task, we created a web page for presenting a fictional web agency. Cyberia is a web agency that helps customers create their dream websites. What makes Cyberia unique is that we not only offer web development and graphic design but also additional services like maintenance to keep its site up to date and secure to keep the customer's website safe from hacker attacks. Another service provided by Cyberia is urgent assistance to programmers who are in need of excellence in Javascript to solve complex issues.

Workflow

Since one part of the task was to work with the SCRUM method, we started with writing a backlog for the project. We made a backlog that had everything we thought we needed to easily add everything to our sprints later. We placed great importance in planning so that everything went as smoothly as possible.

As a name, we chose Cyberia, which comes from a combination of Cyber and Siberia. Why did we choose this name? Because we are an all-round but fun company that has excellence in all Cyber technologies. The colors we chose reflect the harmony, tranquility, and generosity that comes from the combination of Cybers and Siberia's environment. For fonts, we tried to choose a simple, clear, solid fancy font that fits the Cyber / Siberia theme.

We have spent quite a lot of time working on our graphic design. As a result, we got a functional but well-detailed mockup. We've really tried to make it as detailed as possible with all pictures, colors, texts and all other details (margins, paddings, white spaces, etc.). We knew that if it's well-made from the outset, it would make it much easier for us to program the site. The programming part went smoothly due to well-made mockup.

The first part of the task should be programmed without the help of known frameworks and libraries. We chose to program the page with its own grid system based on flexbox technology. As a preprocessor to css, we used SASS where we worked a lot with variables and mixins. Working without the help of large frameworks, we felt in some way more free, but at the same time more responsible for doing the rough job of all positions, responsiveness, etc. The next step was to validate the code, write all prefixes for different vendors, test responsiveness, test how the page is displayed in different browsers.

In the second section we got to work with a framework. We chose to work with the Bootstrap framework only. It was about adapting us to the bootstrap rules and making use of all the possibilities it gives us. It is very easy to get started using bootstrap but to master it the learning curve is a little steeper. Freedom disappears, but results get much faster with bootstrap.

In conclusion, I can say that I have learned a lot by working with others in the group. I had to use your own knowledge in a different way, and I learned quite a few new ways to solve the problem. One important thing I want to point out is that you learned how to dare ask for help and how to find the solution at last.

Technologies Used: