STEM/Industrial Design Students Create Websites with Code

Students in Caroline Epp’s STEM/Industrial Design class learn how to create HTML sites by writing code. The students looked into front end development, which is the component of a website that customers see and interact with. This is the first time Epp has taught the coding unit in her STEM/Industrial Design class.

At the beginning of class, art teacher Caroline Epp reviewed new information about HTML coding to her STEM/Industrial Design students before they broke off to edit their websites.  HTML, one of the main components of web pages, is the content on webpages that is made up of open and closed tags. Credit: Kara Hersey for Manchester Essex Multimedia Online
At the beginning of class, art teacher Caroline Epp reviewed new information about HTML coding to her STEM/Industrial Design students before they broke off to edit their websites. HTML, one of the main components of web pages, is the content on webpages that is made up of open and closed tags. Credit: Kara Hersey for Manchester Essex Multimedia Online
Sophomore Santana Tosi reads over her wire frame for her website before making changes to the Sublime Text. Subline text is what the students used to write their codes for each part of their website. Credit: Kara Hersey for Manchester Essex Multimedia Online
Sophomore Santana Tosi reads over her wire frame for her website before making changes to the Sublime Text. Subline text is what the students used to write their codes for each part of their website. Credit: Kara Hersey for Manchester Essex Multimedia Online
Epp helps freshman Jared Zaval make the correct edits to his Sublime Text before seeing the final results on the website. In each Sublime Text, there are tags written between angle brackets and the content shows up on the website as words to the viewer. Credit: Kara Hersey for Manchester Essex Multimedia Online
Epp helps freshman Jared Zaval make the correct edits to his Sublime Text before seeing the final results on the website. In each Sublime Text, there are tags written between angle brackets and the content shows up on the website as words to the viewer. Credit: Kara Hersey for Manchester Essex Multimedia Online
Sophomore Melanie Carter types in new tags to her source code view to make changes to the actual website. The tags can change the color and size of the text or the color of the background using specific codes.  Credit: Kara Hersey for Manchester Essex Multimedia Online
Sophomore Melanie Carter types in new tags to her source code view to make changes to the actual website. The tags can change the color and size of the text or the color of the background using specific codes. Credit: Kara Hersey for Manchester Essex Multimedia Online
Junior Alex Beckmann makes some changes to his written plan before executing it in the source code. Epp asked each student to draw out what they want their website to look like before actually creating their own website with code. Credit: Kara Hersey for Manchester Essex Multimedia Online
Junior Alex Beckmann makes some changes to his written plan before executing it in the source code. Epp asked each student to draw out what they want their website to look like before actually creating their own website with code. Credit: Kara Hersey for Manchester Essex Multimedia Online
Brendan Driscoll, a junior, used a wire frame to plan out his webpage. He included the box model that uses divisions in HTML to layout the page. Credit: Kara Hersey for Manchester Essex Multimedia Online
Brendan Driscoll, a junior, used a wire frame to plan out his webpage. He included the box model that uses divisions in HTML to layout the page. Credit: Kara Hersey for Manchester Essex Multimedia Online
The Sublime Text of junior Nathaniel Rautio includes many different tags for each section of his webpage. Epp and the students also looked into the salaries for college interns that work in the coding industry and are making over seven thousand dollars a month. Credit: Kara Hersey for Manchester Essex Multimedia Online
The Sublime Text of junior Nathaniel Rautio includes many different tags for each section of his webpage. Epp and the students also looked into the salaries for college interns that work in the coding industry and are making over seven thousand dollars a month. Credit: Kara Hersey for Manchester Essex Multimedia Online
Along with HTML and CSS coding, the school also has been teaching other computer languages. The math department teaches another computer programming language, Java to its students. Credit: Kara Hersey for Manchester Essex Multimedia Online
Along with HTML and CSS coding, the school also has been teaching other computer languages. The math department teaches another computer programming language, Java to its students. Credit: Kara Hersey for Manchester Essex Multimedia Online
Junior Briant Bradley shows off his personalized web page that includes some of his favorite funny pictures. Each student was able to personalize their made up webpage with anything they wanted to and even learned how to add pictures in the Sublime Text. Credit: Kara Hersey for Manchester Essex Multimedia Online
Junior Briant Bradley shows off his personalized web page that includes some of his favorite funny pictures. Each student was able to personalize their made up webpage with anything they wanted to and even learned how to add pictures in the Sublime Text. Credit: Kara Hersey for Manchester Essex Multimedia Online
Freshman Chris Brosch, James Riordan, and Ames Sheriff worked together to help each other fix and update their websites. To put text on a webpage, the tags must be put around the words in the Sublime Text that they want to include in the actual webpage.  Credit: Kara Hersey for Manchester Essex Multimedia Online
Freshman Chris Brosch, James Riordan, and Ames Sheriff worked together to help each other fix and update their websites. To put text on a webpage, the tags must be put around the words in the Sublime Text that they want to include in the actual webpage. Credit: Kara Hersey for Manchester Essex Multimedia Online

Epp gave each student a packet to reference throughout the whole process that included all the information they’ve learned. Last year, Epp took part in a web design course in Boston where she learned about HTML and CSS coding. Credit: Kara Hersey for Manchester Essex Multimedia Online
Epp gave each student a packet to reference throughout the whole process that included all the information they’ve learned. Last year, Epp took part in a web design course in Boston where she learned about HTML and CSS coding. Credit: Kara Hersey for Manchester Essex Multimedia Online

(0)