To put into practice the skills learned over your first year of studies.
- The task An interactive science museum called the Community Science Museum is opening in your town/city. Its core target audience is primary and middle school children (7-15) and families with young children. The museum wants a website that is informative and appealing, that will attract both middle school pupils and their parents. The site should appeal to youngsters without pandering; it should take for granted that the audience is inquisitive and intelligent. The website should be informative and engaging, but should encourage viewers to visit the museum itself. The website should be responsive and be easy to use on a variety of devices.
- The site must be have a design that appeals to the target audience.
- The site must have at least 4-6 pages.
- Compositional principles, typography, and color schemes must be considered.
- Your HTML should be semantic and neatly indented.
- The site should use external CSS style sheets which follow the DRY principle.
- The site should download quickly, and not be overly "heavy". Images should not be over 200kb.
- The site should take WCAG principles into consideration, especially regarding hierarchy, navigation, and color usage.
- The site should be responsive, attractive, and easy to use on a variety of devices.
- The site should show consideration for content strategy and SEO (consider your use of meta tags and alt text).
- The GitHub repo for the project should be set to private. You do not need to submit this with your project.
This page was built from own design and is mainly built with HTML and CSS. But this is also my first big project that includes JavaScript. For this project we initially built it with with a local API, but it has since been reworked with a Rest API using a WordPress installation on a different page with Headless CMS.
- HTML
- CSS
- JavaScript
Because this project was my first one with JavaScript and because the initial project was built with a local API, there is a huge lack of structure on this project. Not very clean and neither semantic. Part of the idea with this, I suspect, is to prepare us as students for later, setting us up with our own "mess" from an earlier stage.
I am still limited in my JS skills at this moment and the handling of innerHTML is functional but I am aware of the security dangers of doing it this way. Also with CSS I am still learning and experimenting but I try to keep it semantic along the way. Allthough I must admit it is not easy to practise the correct mindsets on coding at this moment. Everything is still fairly new.