{"id":474,"date":"2024-12-09T19:14:14","date_gmt":"2024-12-09T19:14:14","guid":{"rendered":"https:\/\/jana-skarpas.graphicandwebdesign.ca\/?p=474"},"modified":"2025-03-31T21:09:51","modified_gmt":"2025-03-31T21:09:51","slug":"photogallery-website","status":"publish","type":"post","link":"https:\/\/jana-skarpas.graphicandwebdesign.ca\/index.php\/2024\/12\/09\/photogallery-website\/","title":{"rendered":"Photogallery Website"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-post\" data-elementor-id=\"474\" class=\"elementor elementor-474\" data-elementor-post-type=\"post\">\n\t\t\t\t<div class=\"elementor-element elementor-element-659a45b e-flex e-con-boxed e-con e-parent\" data-id=\"659a45b\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-48c1d36 elementor-widget elementor-widget-image\" data-id=\"48c1d36\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img fetchpriority=\"high\" decoding=\"async\" width=\"800\" height=\"600\" src=\"https:\/\/jana-skarpas.graphicandwebdesign.ca\/wp-content\/uploads\/2024\/12\/photogallery-mockup-1-1024x768.jpg\" class=\"attachment-large size-large wp-image-893\" alt=\"photogallery mockup 1\" srcset=\"https:\/\/jana-skarpas.graphicandwebdesign.ca\/wp-content\/uploads\/2024\/12\/photogallery-mockup-1-1024x768.jpg 1024w, https:\/\/jana-skarpas.graphicandwebdesign.ca\/wp-content\/uploads\/2024\/12\/photogallery-mockup-1-300x225.jpg 300w, https:\/\/jana-skarpas.graphicandwebdesign.ca\/wp-content\/uploads\/2024\/12\/photogallery-mockup-1-768x576.jpg 768w, https:\/\/jana-skarpas.graphicandwebdesign.ca\/wp-content\/uploads\/2024\/12\/photogallery-mockup-1-1536x1152.jpg 1536w, https:\/\/jana-skarpas.graphicandwebdesign.ca\/wp-content\/uploads\/2024\/12\/photogallery-mockup-1-2048x1536.jpg 2048w\" sizes=\"(max-width: 800px) 100vw, 800px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-fd45a90 e-flex e-con-boxed e-con e-parent\" data-id=\"fd45a90\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-33c3e33 elementor-widget elementor-widget-spacer\" data-id=\"33c3e33\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"spacer.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"elementor-spacer\">\n\t\t\t<div class=\"elementor-spacer-inner\"><\/div>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-f5503d6 elementor-widget elementor-widget-heading\" data-id=\"f5503d6\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"heading.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t<h2 class=\"elementor-heading-title elementor-size-default\">PhotoGallery Website<\/h2>\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-afd9b8b elementor-widget elementor-widget-text-editor\" data-id=\"afd9b8b\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<p>This <strong>Photo Gallery project<\/strong> was created during <strong>Semester 4<\/strong> in my <strong>Web Design IV<\/strong> class. The main goal was to code the gallery layout using <strong>HTML and CSS grids<\/strong>, with a requirement to showcase images from our <a href=\"https:\/\/jana-skarpas.graphicandwebdesign.ca\/index.php\/2024\/12\/09\/photobook\/\"><strong>photobook project<\/strong><\/a> from <strong>Semester 3 Photography class<\/strong>. Once I got the hang of it, the process of coding felt surprisingly smooth and straightforward. There&#8217;s something satisfying about building a design from scratch, and I found myself really enjoying the coding process.<\/p><p>The photo gallery features <strong>Diva<\/strong>, my dog, from my photobook project, and it reflects my love for clean layouts and user-friendly design. It was rewarding to see my work come together as a functional and visually appealing webpage. Overall, this project allowed me to combine both my coding skills and photography in a fun, creative way!<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-8737704 elementor-widget elementor-widget-spacer\" data-id=\"8737704\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"spacer.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"elementor-spacer\">\n\t\t\t<div class=\"elementor-spacer-inner\"><\/div>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-4363242 e-flex e-con-boxed e-con e-parent\" data-id=\"4363242\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-dab3501 elementor-widget elementor-widget-image\" data-id=\"dab3501\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img decoding=\"async\" width=\"800\" height=\"600\" src=\"https:\/\/jana-skarpas.graphicandwebdesign.ca\/wp-content\/uploads\/2024\/12\/photogallery-mockup-2-1024x768.jpg\" class=\"attachment-large size-large wp-image-894\" alt=\"photogallery mockup 2\" srcset=\"https:\/\/jana-skarpas.graphicandwebdesign.ca\/wp-content\/uploads\/2024\/12\/photogallery-mockup-2-1024x768.jpg 1024w, https:\/\/jana-skarpas.graphicandwebdesign.ca\/wp-content\/uploads\/2024\/12\/photogallery-mockup-2-300x225.jpg 300w, https:\/\/jana-skarpas.graphicandwebdesign.ca\/wp-content\/uploads\/2024\/12\/photogallery-mockup-2-768x576.jpg 768w, https:\/\/jana-skarpas.graphicandwebdesign.ca\/wp-content\/uploads\/2024\/12\/photogallery-mockup-2-1536x1152.jpg 1536w, https:\/\/jana-skarpas.graphicandwebdesign.ca\/wp-content\/uploads\/2024\/12\/photogallery-mockup-2-2048x1536.jpg 2048w\" sizes=\"(max-width: 800px) 100vw, 800px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-9cf978e elementor-widget elementor-widget-image\" data-id=\"9cf978e\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"image.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<img decoding=\"async\" width=\"800\" height=\"998\" src=\"https:\/\/jana-skarpas.graphicandwebdesign.ca\/wp-content\/uploads\/2024\/12\/photogallery-home-Large-821x1024.jpeg\" class=\"attachment-large size-large wp-image-907\" alt=\"photogallery\" srcset=\"https:\/\/jana-skarpas.graphicandwebdesign.ca\/wp-content\/uploads\/2024\/12\/photogallery-home-Large-821x1024.jpeg 821w, https:\/\/jana-skarpas.graphicandwebdesign.ca\/wp-content\/uploads\/2024\/12\/photogallery-home-Large-240x300.jpeg 240w, https:\/\/jana-skarpas.graphicandwebdesign.ca\/wp-content\/uploads\/2024\/12\/photogallery-home-Large-768x958.jpeg 768w, https:\/\/jana-skarpas.graphicandwebdesign.ca\/wp-content\/uploads\/2024\/12\/photogallery-home-Large.jpeg 1026w\" sizes=\"(max-width: 800px) 100vw, 800px\" \/>\t\t\t\t\t\t\t\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-b68f08a e-flex e-con-boxed e-con e-parent\" data-id=\"b68f08a\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-d8e0ad8 elementor-widget elementor-widget-spacer\" data-id=\"d8e0ad8\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"spacer.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"elementor-spacer\">\n\t\t\t<div class=\"elementor-spacer-inner\"><\/div>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-f8ccaf3 e-flex e-con-boxed e-con e-parent\" data-id=\"f8ccaf3\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-30887f3 elementor-widget elementor-widget-text-editor\" data-id=\"30887f3\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"text-editor.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<p>Wanna see the website in full?<\/p>\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-f85055c elementor-align-center elementor-widget elementor-widget-button\" data-id=\"f85055c\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"button.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t\t\t<div class=\"elementor-button-wrapper\">\n\t\t\t\t\t<a class=\"elementor-button elementor-button-link elementor-size-sm\" href=\"https:\/\/jana-skarpas.graphicandwebdesign.ca\/web-design\/photo-gallery\/\">\n\t\t\t\t\t\t<span class=\"elementor-button-content-wrapper\">\n\t\t\t\t\t\t\t\t\t<span class=\"elementor-button-text\">Click here<\/span>\n\t\t\t\t\t<\/span>\n\t\t\t\t\t<\/a>\n\t\t\t\t<\/div>\n\t\t\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t<div class=\"elementor-element elementor-element-cb6ec10 e-flex e-con-boxed e-con e-parent\" data-id=\"cb6ec10\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t\t<div class=\"e-con-inner\">\n\t\t\t\t<div class=\"elementor-element elementor-element-b8dccd9 elementor-widget elementor-widget-spacer\" data-id=\"b8dccd9\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"spacer.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t\t\t\t\t<div class=\"elementor-spacer\">\n\t\t\t<div class=\"elementor-spacer-inner\"><\/div>\n\t\t<\/div>\n\t\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>PhotoGallery Website This Photo Gallery project was created during Semester 4 in my Web Design IV class. The main goal was to code the gallery layout using HTML and CSS grids, with a requirement to showcase images from our photobook project from Semester 3 Photography class. Once I got the hang of it, the process [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":893,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[23],"tags":[19],"class_list":["post-474","post","type-post","status-publish","format-standard","has-post-thumbnail","hentry","category-web-portfolio-comprehensive-assessment","tag-semester-4"],"jetpack_featured_media_url":"https:\/\/jana-skarpas.graphicandwebdesign.ca\/wp-content\/uploads\/2024\/12\/photogallery-mockup-1-scaled.jpg","_links":{"self":[{"href":"https:\/\/jana-skarpas.graphicandwebdesign.ca\/index.php\/wp-json\/wp\/v2\/posts\/474","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/jana-skarpas.graphicandwebdesign.ca\/index.php\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/jana-skarpas.graphicandwebdesign.ca\/index.php\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/jana-skarpas.graphicandwebdesign.ca\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/jana-skarpas.graphicandwebdesign.ca\/index.php\/wp-json\/wp\/v2\/comments?post=474"}],"version-history":[{"count":5,"href":"https:\/\/jana-skarpas.graphicandwebdesign.ca\/index.php\/wp-json\/wp\/v2\/posts\/474\/revisions"}],"predecessor-version":[{"id":917,"href":"https:\/\/jana-skarpas.graphicandwebdesign.ca\/index.php\/wp-json\/wp\/v2\/posts\/474\/revisions\/917"}],"wp:featuredmedia":[{"embeddable":true,"href":"https:\/\/jana-skarpas.graphicandwebdesign.ca\/index.php\/wp-json\/wp\/v2\/media\/893"}],"wp:attachment":[{"href":"https:\/\/jana-skarpas.graphicandwebdesign.ca\/index.php\/wp-json\/wp\/v2\/media?parent=474"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/jana-skarpas.graphicandwebdesign.ca\/index.php\/wp-json\/wp\/v2\/categories?post=474"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/jana-skarpas.graphicandwebdesign.ca\/index.php\/wp-json\/wp\/v2\/tags?post=474"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}