{"tag":"refactoring","articles":{"blog\/technology\/redesigning-a-website-naked-adventure":{"key":"blog\/technology\/redesigning-a-website-naked-adventure","type":"article","published":true,"meta":{"createdAt":"2020-05-23T22:45:46+02:00","publishedAt":"2020-05-23T22:45:46+02:00","group":"redesign","links":[{"icon":"globe-europe","colour":"primary","url":"https:\/\/naked-adventure.eu","displayUrl":null}],"category":"blog","subcategory":"technology","slug":"redesigning-a-website-naked-adventure"},"content":{"en":{"slug":"redesigning-a-website-naked-adventure","title":"Redesigning a website: Naked Adventure","intro":"\u003Cfigure\u003E\n                \u003Cnoscript\u003E\n                    \u003Cimg src=\u0022https:\/\/avris.it\/image\/naked-revamp_small.png\u0022 alt=\u0022\u0022 class=\u0022border-bottom\u0022 width=\u0022480\u0022 height=\u0022323.41488807913\u0022\u003E                \n                \u003C\/noscript\u003E\n                \u003Cspan class=\u0022hide-noscript\u0022\u003E\u003Cimg src=\u0022data:image\/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAYCAYAAACSuF9OAAAACXBIWXMAAA7EAAAOxAGVKw4bAAAHx0lEQVRIiaWWy48cVxnFf\/dRr65+THfPjD0zHj\/iJI5IFAnHJBHEioJAiCAkImUHiC0LFglISKxZwJ+AEiGxgA0SAgmxCAvEBhZBCQ85ColfsROPZzzueXV3dT3uvR+L9kxiQjbkbKpUdUvn3O+c77ulnvre7yUxiuVehtYah8EYTTuP0FqDUhSVwzshBEGUIo00mTRMVMysFuqm5trlEf1ejgTHeFzwQPdPRHrKv29qVpd63L57gFKKOI5JEnhoeAenh+RmG60bnAp02zn2hfWGTEM3DmSxJWl3aecxJ9f6LK\/1McYQghBCYFY0RGlMUQtRrHFBcVB4alfzzZ9ucTCpsKoheIfWnuVOwWihw82NEdpoEGGx3+LFL18Ev81b\/3qNPAZvLAZHXY2xiYZWZGillsgo2rail0bgS+5sbaAjTfAeazRLx1aIs4yWKKomUNZCP7aUpRBZTZxoZqVClGah1XBr3zJzFqUcwXlEhGJaMZ3cQIdAJ824vG1Z6lSs5AmJK7HPPnkGAgQfGB8UaF+jfAWNZlrOyAdtRAnGRKR5glcG8UISG6wVahfwQROphtnU0W1pGkru7jVcvgF1s4PWljhNcFXN8UGLWzc3ePv9PTA91lq7dIPgSkuoNXby3l\/oL51gcXWV9OQQBFCgECYzodaC7fbJshwdR2gJWB2Q4BEViJXHuBkqlCy0EopZgW9K9sISSbRNEkVEcYr3jrzT4sK6ZWD3OPeYZTytmLkeeewZFYrltePYevsm195\/j+23Y9bWThBFhlZnAZN1GAwHxMMhujtABPzuNlUjNEFRV55JUVFUnp29A8QVBO0wUlOWE37245fp9hZ4b3NKEOHJR\/pEBowxfBKUUtjW8mk6CJGG0sMsCAfS0DWgixLTqRBREAJeBKUEowJWO1qxYEQwHUtV7INL0MqDmwKBwSBGZQLATl0D9wxQIAJxZI\/EZMbQSyLs09\/6LlVVsbm5yfr6+rzVPwGm1fufz6uqQurf4aWiqEqapgQJJAi5r8mzjCRN+cUfb\/C3d3fwrqBtJhw\/cZrNvZpqb4Ozi56Xvv08FkBrTavVYjweA9DpdJh5zdZ+gUIxDjEdtpk0W+yFFbQfYXTFQpLwwOJZACazBt0o2mZGCCUi866K4xhjLd57lswGZ5vXWe8I7WOr\/Py1PzDZuc1J\/S7m\/JPA81ilQJmIie6jyymdyANQOMWbey1SDqiC4BtNphWTsqITrpC0YqYzODM8AyjGdy6D0qSLXaqiQEIghMBkPKGpa7rdLmsLUC136VrIO22+9NmEY9lpHlh9GpcM5xkSAQXksUbbBGsC3ntAIwLVdJM33tljtR+wMuWJczOKKiFKDJE1KKUQwNdjlNJUBYhvUAijSeDGSKNNQG7v8tDpR1hZPUOn1yXLMh5+fBejNL2FeRREZG6ZiOBcg7UxThqKsgYbgVL47AwPr7zBqeGEK9cnSK1pRwlJlDKMM6zSNAR8PUEpDT5iNp0ymYy5M9vizSt3CQEiHAfnVtmcBJSu6aYGWxZs71WU02ucOtbi4hNrWKUUu7PA9397wDDX1E4oauGFJww6i2nKESoIt\/aHdAddtkZjuoMVboc1VLjLksy7aPXzP0CZmGP9iOmkIO2uYPxfCfUrCOCA6p1naa5ewhpF1V3mN3++wgcf3CSKIr7w7HN85eJPsCJClo754jOvkpkcEGa+4NHlr7OefobgcqL4PE7FGAJN3RCbeQMrtYI1Md5V82kKFKVHmM+bB9e\/yHLvUbIkJUkTXn\/tV2SxIwRoRY5zJ4+zNIhZWBhiIosxZm5ZIi2+ln+Hfr9PnufIvV0rpRDpsLGxQZ7ndHo9iO7l5iNr5rY7CBqrYeYaQEjjnGFvlSzLUEox7C\/yfujTHyRESZ9HL5wh67SoixnLaycB5pYZY8jzHGMMInJEckio4pzSQVQ7Yq3QWn1s4gZXo3QgNAZXzxAJxHFMHMdHa85e+AanHv8q\/cEQrTWTyQSjIMvbR1xWRAgCe9OGSelYHiiiKLpPVKwcdV2zvzNDHVVOiKKI4XA4F9QUKG1pKoOSCpCjKh5iey9QNpqbox12Nt7iqc+dJ05beO9pmoYsy+aWKQV5q4XWCo8lvifmkHi\/STDeEqeBNI7QzHefpimHultqRukNo50KcRXB+\/uqLCJcvT3m+t2CNLUcXLnGr3\/5KosLbbwIKycf5KWXfzi37N5X+CD44FHq0I65fScX06M5cX\/15CjMYTYikOLrCvE1BP8x60c3\/sHW1esUtePO+29x8cFF9rc3cM5xqvvwh5YZrVnII6y19wX2kNRay0fx3+8B6mqG6BpflQRfHx0dH8Vzz5znwmOnSbMWcfQiabuLNZq83TniPWISZWkCOC9oBVqDD2DvXfX8DxQFBEADRivMvbNY3D6VA1fXiG+Q8HHL+oMhvYU+aTqvuHMOrfV9HWsvXbrEp0Vd17jpPsZGVGWBiONHr\/yT5eMjklhRlnORVVnQ1AWprimLA6rigLMnemxtbrKzcxfxDXZ3d\/dTC2qahtBMqGqFb+b5ufrBPptFG60E39SEpkLCjGKyTyQzivEOrtynHa\/z90vvMrq7jfgafViqQ\/y\/92VVIL4iuA8zFLxHiQfxKOWJjNBKFHVdg3hEPJev32Jvb8xhFv8DbBYDPiGD0eUAAAAASUVORK5CYII=\u0022 data-src=\u0022https:\/\/avris.it\/image\/naked-revamp_small.png\u0022 alt=\u0022\u0022 class=\u0022border-bottom\u0022 width=\u0022480\u0022 height=\u0022323.41488807913\u0022\u003E\u003C\/span\u003E\n                \n            \u003C\/figure\u003E\u003C\/p\u003E\n\u003Cp\u003EYet another one of my projects, \u003Ca href=\u0022\/projects\/naked-adventure-de\u0022\u003E\u003Csvg class=\u0022icon\u0022\u003E\u003Cuse xlink:href=\u0022#light-cogs\u0022\u003E\u003C\/use\u003E\u003C\/svg\u003E Naked Adventure\u003C\/a\u003E,\ngrew too outdated to support it. I had to rewrite it from scratch.\u003C\/p\u003E\n\u003Cp\u003EI took the opportunity to redesign it as well. (screenshots before \u0026amp; after at the bottom)\u003C\/p\u003E\u003Csvg xmlns=\u0022http:\/\/www.w3.org\/2000\/svg\u0022 style=\u0022display: none;\u0022\u003E\u003C\/svg\u003E","content":"\u003Cfigure\u003E\n                \u003Cnoscript\u003E\n                    \u003Cimg src=\u0022https:\/\/avris.it\/image\/naked-revamp_big.png\u0022 alt=\u0022\u0022 class=\u0022border\u0022 width=\u0022960\u0022 height=\u0022646.82977615825\u0022\u003E                \n                \u003C\/noscript\u003E\n                \u003Cspan class=\u0022hide-noscript\u0022\u003E\u003Cimg src=\u0022data:image\/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAYCAYAAACSuF9OAAAACXBIWXMAAA7EAAAOxAGVKw4bAAAHx0lEQVRIiaWWy48cVxnFf\/dRr65+THfPjD0zHj\/iJI5IFAnHJBHEioJAiCAkImUHiC0LFglISKxZwJ+AEiGxgA0SAgmxCAvEBhZBCQ85ColfsROPZzzueXV3dT3uvR+L9kxiQjbkbKpUdUvn3O+c77ulnvre7yUxiuVehtYah8EYTTuP0FqDUhSVwzshBEGUIo00mTRMVMysFuqm5trlEf1ejgTHeFzwQPdPRHrKv29qVpd63L57gFKKOI5JEnhoeAenh+RmG60bnAp02zn2hfWGTEM3DmSxJWl3aecxJ9f6LK\/1McYQghBCYFY0RGlMUQtRrHFBcVB4alfzzZ9ucTCpsKoheIfWnuVOwWihw82NEdpoEGGx3+LFL18Ev81b\/3qNPAZvLAZHXY2xiYZWZGillsgo2rail0bgS+5sbaAjTfAeazRLx1aIs4yWKKomUNZCP7aUpRBZTZxoZqVClGah1XBr3zJzFqUcwXlEhGJaMZ3cQIdAJ824vG1Z6lSs5AmJK7HPPnkGAgQfGB8UaF+jfAWNZlrOyAdtRAnGRKR5glcG8UISG6wVahfwQROphtnU0W1pGkru7jVcvgF1s4PWljhNcFXN8UGLWzc3ePv9PTA91lq7dIPgSkuoNXby3l\/oL51gcXWV9OQQBFCgECYzodaC7fbJshwdR2gJWB2Q4BEViJXHuBkqlCy0EopZgW9K9sISSbRNEkVEcYr3jrzT4sK6ZWD3OPeYZTytmLkeeewZFYrltePYevsm195\/j+23Y9bWThBFhlZnAZN1GAwHxMMhujtABPzuNlUjNEFRV55JUVFUnp29A8QVBO0wUlOWE37245fp9hZ4b3NKEOHJR\/pEBowxfBKUUtjW8mk6CJGG0sMsCAfS0DWgixLTqRBREAJeBKUEowJWO1qxYEQwHUtV7INL0MqDmwKBwSBGZQLATl0D9wxQIAJxZI\/EZMbQSyLs09\/6LlVVsbm5yfr6+rzVPwGm1fufz6uqQurf4aWiqEqapgQJJAi5r8mzjCRN+cUfb\/C3d3fwrqBtJhw\/cZrNvZpqb4Ozi56Xvv08FkBrTavVYjweA9DpdJh5zdZ+gUIxDjEdtpk0W+yFFbQfYXTFQpLwwOJZACazBt0o2mZGCCUi866K4xhjLd57lswGZ5vXWe8I7WOr\/Py1PzDZuc1J\/S7m\/JPA81ilQJmIie6jyymdyANQOMWbey1SDqiC4BtNphWTsqITrpC0YqYzODM8AyjGdy6D0qSLXaqiQEIghMBkPKGpa7rdLmsLUC136VrIO22+9NmEY9lpHlh9GpcM5xkSAQXksUbbBGsC3ntAIwLVdJM33tljtR+wMuWJczOKKiFKDJE1KKUQwNdjlNJUBYhvUAijSeDGSKNNQG7v8tDpR1hZPUOn1yXLMh5+fBejNL2FeRREZG6ZiOBcg7UxThqKsgYbgVL47AwPr7zBqeGEK9cnSK1pRwlJlDKMM6zSNAR8PUEpDT5iNp0ymYy5M9vizSt3CQEiHAfnVtmcBJSu6aYGWxZs71WU02ucOtbi4hNrWKUUu7PA9397wDDX1E4oauGFJww6i2nKESoIt\/aHdAddtkZjuoMVboc1VLjLksy7aPXzP0CZmGP9iOmkIO2uYPxfCfUrCOCA6p1naa5ewhpF1V3mN3++wgcf3CSKIr7w7HN85eJPsCJClo754jOvkpkcEGa+4NHlr7OefobgcqL4PE7FGAJN3RCbeQMrtYI1Md5V82kKFKVHmM+bB9e\/yHLvUbIkJUkTXn\/tV2SxIwRoRY5zJ4+zNIhZWBhiIosxZm5ZIi2+ln+Hfr9PnufIvV0rpRDpsLGxQZ7ndHo9iO7l5iNr5rY7CBqrYeYaQEjjnGFvlSzLUEox7C\/yfujTHyRESZ9HL5wh67SoixnLaycB5pYZY8jzHGMMInJEckio4pzSQVQ7Yq3QWn1s4gZXo3QgNAZXzxAJxHFMHMdHa85e+AanHv8q\/cEQrTWTyQSjIMvbR1xWRAgCe9OGSelYHiiiKLpPVKwcdV2zvzNDHVVOiKKI4XA4F9QUKG1pKoOSCpCjKh5iey9QNpqbox12Nt7iqc+dJ05beO9pmoYsy+aWKQV5q4XWCo8lvifmkHi\/STDeEqeBNI7QzHefpimHultqRukNo50KcRXB+\/uqLCJcvT3m+t2CNLUcXLnGr3\/5KosLbbwIKycf5KWXfzi37N5X+CD44FHq0I65fScX06M5cX\/15CjMYTYikOLrCvE1BP8x60c3\/sHW1esUtePO+29x8cFF9rc3cM5xqvvwh5YZrVnII6y19wX2kNRay0fx3+8B6mqG6BpflQRfHx0dH8Vzz5znwmOnSbMWcfQiabuLNZq83TniPWISZWkCOC9oBVqDD2DvXfX8DxQFBEADRivMvbNY3D6VA1fXiG+Q8HHL+oMhvYU+aTqvuHMOrfV9HWsvXbrEp0Vd17jpPsZGVGWBiONHr\/yT5eMjklhRlnORVVnQ1AWprimLA6rigLMnemxtbrKzcxfxDXZ3d\/dTC2qahtBMqGqFb+b5ufrBPptFG60E39SEpkLCjGKyTyQzivEOrtynHa\/z90vvMrq7jfgafViqQ\/y\/92VVIL4iuA8zFLxHiQfxKOWJjNBKFHVdg3hEPJev32Jvb8xhFv8DbBYDPiGD0eUAAAAASUVORK5CYII=\u0022 data-src=\u0022https:\/\/avris.it\/image\/naked-revamp_big.png\u0022 alt=\u0022\u0022 class=\u0022border\u0022 width=\u0022960\u0022 height=\u0022646.82977615825\u0022\u003E\u003C\/span\u003E\n                \n            \u003C\/figure\u003E\u003C\/p\u003E\n\u003Cp\u003EYet another one of my projects, \u003Ca href=\u0022\/projects\/naked-adventure-de\u0022\u003E\u003Csvg class=\u0022icon\u0022\u003E\u003Cuse xlink:href=\u0022#light-cogs\u0022\u003E\u003C\/use\u003E\u003C\/svg\u003E Naked Adventure\u003C\/a\u003E,\ngrew too outdated to support it. I had to rewrite it from scratch.\u003C\/p\u003E\n\u003Cp\u003EI took the opportunity to redesign it as well. (screenshots before \u0026amp; after at the bottom)\u003C\/p\u003E\n\u003Cp\u003EHere\u0027s an overview of what I did:\u003C\/p\u003E\n\u003Cul\u003E\n\u003Cli\u003Ereplaced my abandoned framework \u003Ca href=\u0022\/projects\/micrus-v4\u0022\u003E\u003Csvg class=\u0022icon\u0022\u003E\u003Cuse xlink:href=\u0022#light-cogs\u0022\u003E\u003C\/use\u003E\u003C\/svg\u003E Micrus v4 \u2022 Beauty of simplicity\u003C\/a\u003E with \u003Ca href=\u0022https:\/\/symfony.com\/\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Csvg class=\u0022icon\u0022\u003E\u003Cuse xlink:href=\u0022#light-link\u0022\u003E\u003C\/use\u003E\u003C\/svg\u003E Symfony 5\u003C\/a\u003E,\u003C\/li\u003E\n\u003Cli\u003Ebased the project on \u003Ca href=\u0022\/projects\/avris-booster-quick-start-of-new-projects\u0022\u003E\u003Csvg class=\u0022icon\u0022\u003E\u003Cuse xlink:href=\u0022#light-cogs\u0022\u003E\u003C\/use\u003E\u003C\/svg\u003E Avris Booster: Quick start of new projects\u003C\/a\u003E, to take advantage of built-in features:\nuser management (including a passwordless approach to authentication \u2013 \u003Ca href=\u0022\/blog\/passwords-are-pass%C3%A9\u0022\u003E\u003Csvg class=\u0022icon\u0022\u003E\u003Cuse xlink:href=\u0022#light-computer-speaker\u0022\u003E\u003C\/use\u003E\u003C\/svg\u003E Passwords are pass\u00e9\u003C\/a\u003E), push notifications, etc.\u003C\/li\u003E\n\u003Cli\u003Ereplaced \u003Ca href=\u0022https:\/\/gitlab.com\/Avris\/Micrus-Assetic\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Csvg class=\u0022icon\u0022\u003E\u003Cuse xlink:href=\u0022#light-link\u0022\u003E\u003C\/use\u003E\u003C\/svg\u003E custom Assetic setup\u003C\/a\u003E\nwith \u003Ca href=\u0022https:\/\/symfony.com\/doc\/current\/frontend\/encore\/installation.html\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Csvg class=\u0022icon\u0022\u003E\u003Cuse xlink:href=\u0022#light-link\u0022\u003E\u003C\/use\u003E\u003C\/svg\u003E Webpack Encore\u003C\/a\u003E,\u003C\/li\u003E\n\u003Cli\u003Eupdated \u003Ca href=\u0022https:\/\/getbootstrap.com\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Csvg class=\u0022icon\u0022\u003E\u003Cuse xlink:href=\u0022#light-link\u0022\u003E\u003C\/use\u003E\u003C\/svg\u003E Bootstrap\u003C\/a\u003E from 3.0 to 4.4,\u003C\/li\u003E\n\u003Cli\u003Eadded more contrast to the design, filled the excess of white spaces with content, making filters and maps more prominent,\u003C\/li\u003E\n\u003Cli\u003Ereplaced Google Maps with Apple Maps, because of privacy concerns (see: \u003Ca href=\u0022\/blog\/ungoogling\u0022\u003E\u003Csvg class=\u0022icon\u0022\u003E\u003Cuse xlink:href=\u0022#light-computer-speaker\u0022\u003E\u003C\/use\u003E\u003C\/svg\u003E Ungoogling\u003C\/a\u003E, \u003Ca href=\u0022\/blog\/log-out-for-privacy\u0022\u003E\u003Csvg class=\u0022icon\u0022\u003E\u003Cuse xlink:href=\u0022#light-computer-speaker\u0022\u003E\u003C\/use\u003E\u003C\/svg\u003E Log out for privacy\u003C\/a\u003E) \u2013 the website is now officially Google-free,\u003C\/li\u003E\n\u003Cli\u003Eremoved a couple of unnecessary and unused features:\n\u003Cul\u003E\n\u003Cli\u003Ethe homepage (now the user is shown the map right away \u2013 after all, the map is the whole point of the project),\u003C\/li\u003E\n\u003Cli\u003Ethe \u201dgeographic\u201d links (there\u0027s no separate map of e.g. German nude beaches anymore, it got integrated into the main map),\u003C\/li\u003E\n\u003Cli\u003Eseparate events section (now they show up together with places on the same map),\u003C\/li\u003E\n\u003Cli\u003Eforum (it wasn\u0027t used at all),\u003C\/li\u003E\n\u003Cli\u003Eadmin panel (now the buttons for admins are just integrated across the website),\u003C\/li\u003E\n\u003C\/ul\u003E\u003C\/li\u003E\n\u003Cli\u003Eimproved filters (for instance added filtering by name and location),\u003C\/li\u003E\n\u003Cli\u003Ethe process of submission of new steps isn\u0027t split into steps anymore: place info, review and description are finally just one single form,\u003C\/li\u003E\n\u003Cli\u003Eincluded some more \u003Ca href=\u0022\/blog\/reducing-website-size-by-a-half-by-optimising-bootstrap-and-fontawesome\u0022\u003E\u003Csvg class=\u0022icon\u0022\u003E\u003Cuse xlink:href=\u0022#light-computer-speaker\u0022\u003E\u003C\/use\u003E\u003C\/svg\u003E optimisations\u003C\/a\u003E.\u003C\/li\u003E\n\u003C\/ul\u003E\n\u003Ch3\u003EBefore:\u003C\/h3\u003E\n\u003Cfigure\u003E\n                \u003Cnoscript\u003E\n                    \u003Cimg src=\u0022https:\/\/avris.it\/image\/naked-before-home_big.png\u0022 alt=\u0022\u0022 class=\u0022border\u0022 width=\u0022960\u0022 height=\u00221147.3333333333\u0022\u003E                \n                \u003C\/noscript\u003E\n                \u003Cspan class=\u0022hide-noscript\u0022\u003E\u003Cimg src=\u0022data:image\/png;base64,iVBORw0KGgoAAAANSUhEUgAAAB4AAAAkCAYAAACe0YppAAAACXBIWXMAAA7EAAAOxAGVKw4bAAAHV0lEQVRYhc2XS48dVxWFv30e9bhV97offsUPHJLYMpFQeCTioUiIARIC8Q9QxvwAxvyijBig8AMACSkSgQFECbZjE8duu93dt\/s+quqcvRlcu7svcRIYEFjDe+4+66y99llVJaO33jGe4tr5BlQBmPcZL8L+fGBSB6aLxJlRYNZl2jKwNxvokvJZEOBbX6nYvfuYT8KEunDsz9PxevjljSMcUAoUYUFdlBQxEooCQkGMYzYnkbObNXVTYghlFXDOkfpEVmXoMvN5QoJHRMgIQzYyjhheQg2cd8w7YzFAXTpCHR1RhNIZUYTK9ZRO8SKE4CkjxKyEFDk3aambipSUsozo0+44JxxN5yQVmrbicJ4YFGJ0eC+YCcmMo4WBgHMQNCXMe0wcMQZidIAS6aljoCodo5GnKozoFeeUGAQfBDGH5Yw4aNqI4YlVpBqXmK36rQqH88x8kYnFitQ7CG0ViSLUwVEXEINDEGJwBAacCYGI08TdO\/eQwmFOQQTnhGG+wATOn7\/I+YuXwDnEOfpB6QYjqeG8Y9IKApgZ3WCEN75+FTEFNQQYktL1inYLggePYqlHkzCuW3Zne5RtBCekviMGY9SM2dyY4KOQbNVaNaGMwsgLqsaQjT4pGXBBCOOREIoWyxnvQFXoFksWc8NpxovhJCPWYcNALYnaFdSbEwgR74Sh7wltg68qyEZWoxRBBLIaiBH8ahbMwDDCw7+\/y9a5S9R1RdOOGZ1pkLMtpg3Oe8Q5ADQNdMsF3d4MrOfwcErRjjEXERfJGGaKE0PciswwnBjmDGy1bqqYGaF99Ece38087iqIFW+8dp1z117FO4\/zHmTlmQuB5kxke\/sqyUcO+wFXNEy2zhG8QE6Qe7IqlpWcVwSalKxKSpmUMzkrqkbYyRcgwAvjEi\/Cw7u7HDz4A2V0mCnjjS2qUYvFiqKuaTY38KOW7XELVYE4sOUUm89Iy4F+gCyOrELKRt9nll3PvOvpE3TLnsNlTxhXBajiyThTvBna9XQDmDjSkz047Gm3ztKIEKf7jJxCXUBKoAnSQF7MyUNGTPDicQCaUVUKG5hs1PSDktqASUM4\/43vIRgOwTtwrIZiFXqQcYgviUWBRM8QPV1dEXyDxBFQQLUFocWp4syOffSqFKrkIdMte4wBCSsrRFWPs\/rLRJCVPADefvttbt68yfXr1ynL8lN\/7jOcHPNpNAE6zBHAR49SgHZoVnz0wCoJRYTCF8d7rSm+ffs2dV0jIgzDAEDbtmxsbABw50mHLQ9XbRfHnUXF+VoZ2RP6dMTt6S325fs09meyFSABZ\/s0Qfjqxktc2b56ovi0oo0L11ADzYlJvUREGI\/Hx+sfLUp25iXMYOQWdCbcXxa0aZ+MUriGIQl\/u1dy44UnhCIjElgk5db+h2vE7jTx7kyZLpXpbMHuYccwDMxms+d6FPNDdHGfnJR7R5dx6nl0UBBD4JXxfbz1CIZ0iWBGGYq1+jWPt5vVOaweYwZeF6SUGIaBolgVikAxPODegwfcvn+EazMXNpVFPOCv7z\/mR9\/5C\/WlMft7M6oYkRK8c5TBcZprrdVPZkpSw1uHt4EmQhnXmrI6WKzZvnyDOzt\/osqf0C4esHso\/PT1CVsjZaCkn2SqGDEyRSjYCqPTO5wmNrYat3pbkBFJofCrKV4sjo4VYzBwhpQXbG5O+OaVGU29wXsfHPHBrUNeeTFjAUo8osJ43FBJyUROa5TTxMKv330EcbTWkhUcL59bQlk9u0GEWLPZjrn1jx0uTHo+uJu5erGmCRX7yxnjdsK8uMbjTrk62sMV59Y9NjvJj99+6HgwnfG1C5Gdo0xwwnIwDpbKj1+t+e7NiFPl\/Y8e8YOXdykvZX7zu4ILL77Om9\/eQXzLO+99yJs3PHv5LI9mm4Dj4HDJa9sLxpMTLrFTzL\/4\/U94tPyEcdzA4UBglg5JOvDDiz\/j5y\/+ij4r89khk1IpYmDGGMQjopSy4PHU2K4zmKx8AcQ5vBPa5uRq\/s8ic21kP\/74Y7quY7lc\/lvFBwcHHB0d0XXdf0y8do+HYWBnZ4e6rqnr+guLp9Mp3ntUlStXrjxnKJ\/hJNePiU8PV1VViAgigqp+zkYrLKyin\/d4J9zf3WVjvIUnYZoJIRDC6Su07uh6gMyNIWWcDCy7h1y+dPFziTdroQ+CqZEWC\/aW9wEQEcwMM8M5h6oyGo3Y2to6IV6pWrXi8nZDCP64uO97gOc+IgE6qVEfMWcIhi8AdQTJ5LSKWe89ZVlSVdXzFK9a2kvFfIDgQJzHJ2Gr8Z+h12gKIQ1GcI6UFdWBUVkBDovhWECM8bjmGdeaxz4dUYZAzhlLRtO2mH06q59hUFgmqMUwgxDcsULv1w98wvP0bp8OkHuPjhBxGEJwSigqthuH+4Ih+2J8eqrXAmS5XGJmx978N\/H\/kVxfJsK\/\/vBkrtRRGDKoGe7px9coCtOl4p1QxdVTy8yoC0c3GKNS2JspmyPHwUKZ1I7pQinC6n29juse\/xPzaJzjyI4XIAAAAABJRU5ErkJggg==\u0022 data-src=\u0022https:\/\/avris.it\/image\/naked-before-home_big.png\u0022 alt=\u0022\u0022 class=\u0022border\u0022 width=\u0022960\u0022 height=\u00221147.3333333333\u0022\u003E\u003C\/span\u003E\n                \n            \u003C\/figure\u003E\n\u003Cfigure\u003E\n                \u003Cnoscript\u003E\n                    \u003Cimg src=\u0022https:\/\/avris.it\/image\/naked-before-map_big.png\u0022 alt=\u0022\u0022 class=\u0022border\u0022 width=\u0022960\u0022 height=\u0022911.20234604106\u0022\u003E                \n                \u003C\/noscript\u003E\n                \u003Cspan class=\u0022hide-noscript\u0022\u003E\u003Cimg src=\u0022data:image\/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAiCAYAAAA3WXuFAAAACXBIWXMAAA7EAAAOxAGVKw4bAAAKPElEQVRYhcWYSYwk2VnHf++9eLFkZORamZWV1bX1NnTPdGMPHgwDshjbhznYt\/FyQliIAyfEhSPiAAIhS3O1sBC++MAiGYQBGazB7WHG46Vtpj0zraarl6qacm1dWVlZWZEZ6+OQldGT08NIRkh8Uii2F+998f\/+3\/\/7IgQv\/a0Bw5ULbZw8IUoyhBDkxrB9OGJ5rsR\/7ZzQbXiEUUZuDFpJjsOElVaJQZhwdJowijLAAIKJffDxfM1hoWZj0ojSuzv8QDV5rh3xw32HLAPxlX9dN\/x\/mTEgxOM9IIwxBmA4HOL7PkKID53jw+c3xfP\/22M5PXn55Ze5ceMGN2\/enFng5zn+vzCR57nJsow3dr5HmqcfOGipvEwq19jZvMfqyipHR0cIKdgTdc7pEVprtNaQDrl753t0a13ssuZOVGKQ12hmrzEOU3K3hZQ5ILFMD0FO2Qk4FyzRrrYJ3ABr+pZ\/9tYfE+cxLbdFmIZIIUnzlH58xJcu\/g7X5lYR1QV2x4JUV5BCMBjB3dRFjMBgUFlC4Odsm0OssQVpzJjn6ZnzGFfi8TNMHqGJSI0EkzKKQx4ND2hVW5OwGWNMkiREUfQ\/wygEr\/dcHg7PzpnkjStSmnKXvaxNho00EaV8i0w6+OYeg2yRYb7Mj974N168muDWNRN8IBMuIg8RgFKSFy59Gt\/2JxwC2NjYYGdn58Pji0Fg4GwfG4Gb3scyIWmSEaWKhz2Na0mS1JDKOSr2kJeeFWhlMCafzDE2OFGMpTSOtmm6ZdRZLskpKR3HodlsEkURxhiiKCJJEvI8Lxwy082AIiPr3+L12xbf+s4PUJZgNBpRcSTZ6SP+6K92cU2fitpD2eBVHFxbo5VElxWlqoWjBLYlEdLFmIlHBUL1ep3BYEC\/38cYQ7\/f5\/j4GCEESqlZjwAr6TOvdjl\/ZYWdg33+5l\/e4Ctf+2vc01scHW\/zhV82LIv7tPM9atUyyTgnH+W4UuM5GqUknmvhWhpfKaRglkPD4ZDxeIwQAtu2CcOQRqOB53lEUcSrB5qN4XvDN8nIYX+Tk\/4jRonHx1sP2AsNJ72IjzxVxVEujZrHOIkZpGMkEqkhyzKUkATao6JrBOmIoP0Mti5NsmxK3CzLsCyrEKs8z98nlO\/RHyao7R0LWp7kWvNndNo1alHMK4cZcZhya3\/A+UYPO9DM1SqkYUoaCeo1HyuXeMrBNxkCiRLvC1mWZURRhOM4jEYj6vU6juPMsto8ua0tLXN\/O6TmCsJwzHd\/sk8y2OOffnzI85crLDWaqFzQ2xkgKVOpdRmk58hEAIBWkhE1onyCjcjz3KRpysHBwaSo5jmWZeH7\/uPwTNP+ZFahk3iE45Qop\/d45Y23+eQVh+MQYuGydeRyuXnIvKeplgV1v8Sd7CqJsTAI6vltOu6IxaCN5V1EapuqDdY0JH\/62pjVquTWXoLnOmgrA2AhUPzer5YRWY6XDEhlidSyGQ5POd78Dl98tkGcG15PEgb+b2DVJX7cZ7l2yK74GO88\/D5X5zOSxGJUrmCiI6Tlssd1dt7+ZwbthGqrwkp3ESHkY1J\/8819qrZhP8yRUpLnBstSNMouH19yGKSKcRSTIzFCEA+PMeNjmvUySkl6eY3+yKBFSmoUmghLwv5RyHxNU3ZsBichUkqyPAch0MJgpCJNM66sdbEt9ZjUr26MWQoEt3Zjrnc0n7vqUCq52LYNwPHOQ3q9XhGuKbL9Xg\/Lsrh1HPHNH+9jhCDJEvLoBOHXEHnM+NEGX\/rMr\/GNnzzC0RIJ5MZQVQlbWxscPPhP\/u7Lv8\/KuQWsqTB+YtWlahu6FYuWL3EcZ1Iw38vps7F7e3vEcczi4iJSTvKi4oxYqR5ja9i9\/X0qRw\/o2x7x0R6+yUj6Fxndf4vTLEXkCV60xfqdVxkNDoiiiDz9XYwxjxG6cX\/EUkXw5m7CRxZsfrHrPYHG1Hq9HmmaMjc3h+dNxtXSIy6YbdoqYd0N+ewXPsMIg9EOqRG8ud3j4fpbeK6DFQ+oRBt0Sy5edZGNvR7irKMsSP0rKx7zZYv5akonUBhjJgI2VemzbAO4dOkSxhi01sU1bcaINKR\/Injwztts1EvsnPSwGw1c10boJbz0Xdr4LLUdnj73NCtzDq5tEeY5jWoZIcRjhH60GbJYEdw+SLk2b3OxrKjVaoUztVrtiRBOTUpJHJTQIkIITbVkUav5NJ0rZLYiSVMuttZwP\/8p5so27WpApewjBQyjhDDKEGoyd8Gh55Y8WmWL+WpOJ1B4nij4AVAulwvE4jim3W4XwmmMIQxDglqTLMu4ePU6aZrieR7NZrO43+0u4LouxhhardYMHaZFvEDoh++OWPAN7xxkXJvXXCjbBT9gouTTRdrt9hMo5XlOkiS4rkur1SpCPH1hYwxpmhLHMfPz80VZen87XHDo2aUyLV\/SmZN0A0WjYc8sqJTC8zy01gyHQ9I0LUJqjEEpheu6SCkZDodkWUYQBAXK0+cBTk9PybIM3\/exrAIThBCPhfEP\/\/EBnZLhkCqC4quEli\/5rY\/6hGHIaDT6QA4JIdhJA27tnGKEnEws5NkmQMDHqiHrm7sYk2NMjq01JU6YC1xsrVi99AyeV3rMoafP1egEiodHCVKIIraBPalvh4eHM8I4dWT69jfHHf7+p4dIZSGUQkoLpSyEmjg2ctb5+j+8QtOOef7pJa4v19CBz96jEcKSLK09Ncuh25sH9APJ+mGKpRRpmgAwH2heWJmfQeTu3btEUcTly5cLYqe9bSr5GE8KcuEglY2yNEIKtF3iUkPx4gU4322zutql5JfZf7BFLAzKUU9y6MryHJ3AwgsSrPdoT8URuK4745DWeiYDARrhOvNv36BWdjkYhJzoKn1jc5rZ7MceL33+Os\/9wjK+X0IoTZIktJfbJKfHnIwzzBnJC4TubPc5dFK2RzaVSsCFhsVnn5p1ZGpra2tPXOu2GlxcW8SSku6CwrY1CIlSkjg1CG3x0\/sndM9liHc3uXxhif7RAbpUI8oUytKzITu\/UKMbWLj9yU+Dsp6k8hSJTqdDo9EouFN8+kqJZVmMR8ucWz5PlmWUPBel7cknjpTkxuCVSgSrV0kqFc6Pe2RpzLKtSTKDcnzss9AXpL5mbREfxzyDodPpABCGPuVyGZg4NxgM8DyvaN7yPKdUKmHbNlJKBidDyn5AEARUq9UZBE9PT+noISoe4gX1gjP+mVRIqWY59Ac323x0weLfH8RIAc8v2fzJp2e7xiRJqNfrSClJkoRGo1F0mVk2+Y0z5Ve\/36dSqRS1cCqMWmuUmizu+35RjqZCWejQ5uYmxpiz5mzSxsZxjOu6NJvNGdV+v31QR\/DzjhFnUlOE7De\/ZfFLC5pv34+QwuLXl22+\/OJc8cBXv\/rnfPc\/buBosC2P2qVPcO76JxGlOr4n6ZRavHYvha0bqEqHNFjBCA+T5QgSfvuFEre3HvDtb3ydrfV7jEchUTjGKwckccTX\/uIvac81+W9xS9XYCGf+5QAAAABJRU5ErkJggg==\u0022 data-src=\u0022https:\/\/avris.it\/image\/naked-before-map_big.png\u0022 alt=\u0022\u0022 class=\u0022border\u0022 width=\u0022960\u0022 height=\u0022911.20234604106\u0022\u003E\u003C\/span\u003E\n                \n            \u003C\/figure\u003E\n\u003Cfigure\u003E\n                \u003Cnoscript\u003E\n                    \u003Cimg src=\u0022https:\/\/avris.it\/image\/naked-before-place_big.png\u0022 alt=\u0022\u0022 class=\u0022border\u0022 width=\u0022960\u0022 height=\u0022892.66666666667\u0022\u003E                \n                \u003C\/noscript\u003E\n                \u003Cspan class=\u0022hide-noscript\u0022\u003E\u003Cimg src=\u0022data:image\/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAhCAYAAACxzQkrAAAACXBIWXMAAA7EAAAOxAGVKw4bAAAGuklEQVRYhcWXzW8kRxnGf1XVXf1p99je9Ud2vcN6DVlyixBhySESUoT4CBJCyoED\/wo3rvwDHEGIC0TLJUIILkEkaCOtILkgJ2SD7azxLuuZnfH09EdVcZiZ9jjucRaB4D1VV1XX+9TzPu\/7dovdH7zpaLEk1axEHtY5nHMUpaWsLUoJitISh4q8MCwnPr1BSVHZtmMmZ4WKG1d8Tg6fMNY+pdOMyla3iNqY9pX\/olljGY1GVFVJUTmi0CPLsta9npKydeHjBx+xt7dHkiQURYH2NcudDkrA8198AYQABwgQwNPBAFOXaM9DCEFtDNY6lJIIAcI5JJY08oiiiInf6QHQjL35h3nbe\/8+P\/7RDxkWOVIofOWRRjFOSEqh+e7r3+eVV19j47nnCLXkT+\/eZyVboixzYl\/ymzd+SlFbfKWQwmFqg\/A0X33lVbq7L7Bz6\/Of8jkZe87NInY+cuOiREu4spxhgaUwZDQuKKucyuT8+mc\/4fd3f8Gdr32br3\/rO\/z8l3f53R\/eJohDvvnSLrc3M\/LeECUdRWVJN9cYHPe5+8aveO17ATd3dttD1joLZEshuzvXkELhjGVYOE5sQGd1iTs765wOTxn0h\/z5j78lFAXWGKhrqrLi4aM+z69nDCufK8seSegQIsQGI059i7fQ6yWAkjihsDWJtJgqZyWKSdZ3SLRio6Ppax9fB4SRJE1KcGBqi6hqnvRH5EXJSf8xV9MrBErhjU8Zjka8\/JUX2dq6vhBQu6IBgcUXCs8T5E6TO82gd4xWlqN\/jjh8eMTYWPxklRfvfAPPd1hjMWXFRwdPeOeDQ97+8CF\/fzKgso7KwGhccv+vn1CP68UMCSFaF\/KixJiCcCnmS7du44TEBhm3dm\/R6XTwg4CydtTG4emYauxwtaVyDmMK3vnLAb7WlKWll9dspQFxGPDll15meXWFRX6Fc861ZdnB3nscfvAea+tbJNkatTFo7VNVNUJIrIOyqhkXJWGc8ta773P4yUNGozEIiZAChKDTieleXSZbSgBBECXs3PoC2zc+R5vfKaCL9vjxY5xzKKXwPA9rLVEUIaWc1Jm65ujoqJl3zhHHMWma4s2p9q2jN7EYpFFcL28DsLq6urgwnn88Q5ymKXU9ifXMqVKKoiio6xrf9wnDEKUUWmuqqsL3ffI8RwhBmqYAXI22AJBOkerJnNa6lR0AYa1tZchaS7\/fxxiDlJIkSZBS8qR4RGgm4ziOUUoBcHp6inMOL0gwduJOSXAOYt2ulzZbmGXNBimx1jIYDAAYuJNmrqoqZhE3xgAQ+oIkEKSBIPLFvwUGLskyACEEQgjkfL+bMu15Ht60bwkBWbY8WWjpT89ubnFhBHDOYa3FOYcQAmstsxajtcb3\/eagBw8+JooijDHEcUyn02nAWGu5d+9ec8lut8vGxkYbBZ+tIa01URQ1bB33\/kEgQqSUaK0JggCAp8cnJOMR1fpas9c516znp0OsF5MEsrlgm13KkBACYwz9fp8syxBCEKmYsiwJgoC6rhuHhYLBwQG1qxswzjnW1tammnOIasSwosnAVkAToLPYn1EHMB6PEULgeV5Tf4IgmKbtJGyzmwa+wux0UVN2tdasrKw0WSjEJONmYCfvXdSYdzZxkcIwDBtNjEYjlFKUZdmwNwMGE70ZYxqAVVVxfHzcaG0+RGmaTp8v+vQWFGqcc5RlSV3XaK3RWiOlbKryvE4ATkePuOoC5MZW876UsmGo1ztBxxmxlk0422yhhpxz5HlOp9PBGENRFE0Lmd8ThiG+7zP2LId7H0JVN2zMhJ+mKVoHmOKUSoRz2XnRLs2yXq83Qe15TV+DibaiKCJJkmZ\/nufU9RmYWUJIKRs2hBBNC1pkCxmaAVJKUdc1Ukq63S482Ce8ce1cA53tn\/W+5rZTULPQzreahYAW1QMpJWtra01hXF1dRQjB39bHXG+pI0EQNM7m68xsPM\/wDOyCLLucoZWVFZxz9Ho94jimexxib1w8bH9\/nziOEUKQZRlhGM6d5tjfP+Dw8BDnHDdv3mRzc5O2FjP3G8Q5B1JKOp1Ow1CWZSilGoY+fbNy9JT0yg1qCxWS8NyqYHt7m+3tRd\/Sc37PJi6Gbpa61lqGwyEA3Yd6ju4zu7bd5eqSYnNZkQaLGmq7nzmPi+vQTAOzNJ\/VH5ScguUcqHS5M33v7DKXW\/v6Z34PwSR8RVE8y9b\/2BbWof+XPRND\/0u79PMjryY\/eIEnOC0tnhRIAZEvGBQWKQShLyhrh3WT+XHl0B4UNWgPajNRS+gJhoUliyTyEl3\/C8C8KrFX1sBMAAAAAElFTkSuQmCC\u0022 data-src=\u0022https:\/\/avris.it\/image\/naked-before-place_big.png\u0022 alt=\u0022\u0022 class=\u0022border\u0022 width=\u0022960\u0022 height=\u0022892.66666666667\u0022\u003E\u003C\/span\u003E\n                \n            \u003C\/figure\u003E\n\u003Cfigure\u003E\n                \u003Cnoscript\u003E\n                    \u003Cimg src=\u0022https:\/\/avris.it\/image\/naked-before-submit_big.png\u0022 alt=\u0022\u0022 class=\u0022border\u0022 width=\u0022960\u0022 height=\u0022811.96261682243\u0022\u003E                \n                \u003C\/noscript\u003E\n                \u003Cspan class=\u0022hide-noscript\u0022\u003E\u003Cimg src=\u0022data:image\/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAeCAYAAABE4bxTAAAACXBIWXMAAA7EAAAOxAGVKw4bAAAEl0lEQVRYhcWX328bRRDHP7M\/7nx3dpxcQvqLEl6QSiMEVXkAiWfUf4A\/EvVv4AkhJFSJhyIkhITatClJXSexfbbPd7e3PASntnFcpyrqV1p5bzw7Ozvfnbk54buH3lrFnY9SfFFQOo8SOO7l7LRCXg0KtAKjFN2s4MZmg9NhwXYroKhqTrOSUeGYhwdk5hcaVmG14sF+ix9+7bDtctgwdKqYs3F9sVIe\/nzgeR+Y7irzYqnr2jvnOD4+Znd3FxFBRFBKISKUZYkxBhHB+3Mrq+YA3vsL+axsHR3x3vt+v8\/jx48JggCtNVEUMR6PMcaQZRmtVov9\/f3\/JVDTAMxFyHvP4eEhVVURRRFlWRLHMcPhkCRJGI1GaK1pt9vv3CFrLdbaeYdmw77ovfeePM8ZDAZ47\/HeX1A7qzOdwzug7E2ncG4xi9aH9x5jzFL5okMAZg1\/KMuSsixJkuTKDi1Gfxkbs8\/mMqVZ+WKWXQXT9aucmqXMzN6Fy05YFAX9fp80TZeGfxXeZH9RV+q6XusOVVV1EamrQil1qQOLUb+41KsoexuqpvDeo7VeO8su4r+KslfZhIPjE7bSlDAIAMjzHmQnNBoBYRIwqps4L4S+R1kUTJQiDmJiq0njzbUpWyvLJhLQsjW2HOKKjMlkQl8cTZkwqmvq0iOq5slZQlIXDL3leNzl\/o7DO8tWtLqgzmXZYuFa9Nh7T+WFH0fXaeZjsjrEo9B1Rlr+yUhtEelD+u4GIzZo5keEdGhEjt9f1uylH3M7vbWUstl9pjI1K1wcs8oAafUHsXRxVU3uIvrRfVS4g\/I9arPNhj0hsROsTNDiESVQzNtfBRFBTS\/tqiFAgy5no4ry4De0UVirUcUAycf0zTcYFdCoTkhcDxtqtAhaBDHLbS5SNh1qMQqLHgP4umJ7\/Igiuc3eJ5pE9zDDF7R5zlb0lNNnv\/Dh5CeuhR3Cdkg5dIRiCbShEdn5t\/mSSM3K1iqMohSv4q8wUjKaJARVlw15QkhB3in47FZCGiXYQJMVOVUaE2jDtjY0g9ZK+4t7rZVlHsXYt7FMCM0uH8gzbKwpS0vrZszZUUZnXFBUjrAdsBlH9E9yTDMkEPPGOnbld9kUzgc0VI4ucora8fywwzAbEkURn+7toYAXgxMaI02zfQMTJTiSS1uU2X2mMjVL2aosU97hvSerUhqJxaCJWze5e\/ceJv2S7qjPcDwhDZsk7TaPizsQ3qSWZM7+KqxNGa7i1vgR14Ix1gYcv3Q8j77GJY7h4JQNNaBnvsBMfmd8NuKk3MaGBd2zLhvt6\/jm+pSt1TFmwyFHR0e0Wglawbi2OAxWHKVXqDpnp91+\/eEjCiXn9pTWBDZ4tx3j4mlEhIPsKQ\/\/+h7va2rvEYHP03t8e\/vBpd3gMjtv1TEug1WWzWAT4fVda9rmym5w1SGnWIuyq8ynG7xtk79WYVzm4Ox\/6xa9dXTEOfd+PqUvgZnWB+89z3oVkRE2I30x1+o8cwItJFbRGTqUAi2wHWs6Q4f3oBXsJJq\/B46df+WRFWIrnI5rNhvna3cSTTap0UrYSfR\/KPsHj\/b+fF+Z7QQAAAAASUVORK5CYII=\u0022 data-src=\u0022https:\/\/avris.it\/image\/naked-before-submit_big.png\u0022 alt=\u0022\u0022 class=\u0022border\u0022 width=\u0022960\u0022 height=\u0022811.96261682243\u0022\u003E\u003C\/span\u003E\n                \n            \u003C\/figure\u003E\u003C\/p\u003E\n\u003Ch3\u003EAfter:\u003C\/h3\u003E\n\u003Cfigure\u003E\n                \u003Cnoscript\u003E\n                    \u003Cimg src=\u0022https:\/\/avris.it\/image\/naked-after-home_big.png\u0022 alt=\u0022\u0022 class=\u0022border\u0022 width=\u0022960\u0022 height=\u0022784.8\u0022\u003E                \n                \u003C\/noscript\u003E\n                \u003Cspan class=\u0022hide-noscript\u0022\u003E\u003Cimg src=\u0022data:image\/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAdCAYAAADCdc79AAAACXBIWXMAAA7EAAAOxAGVKw4bAAAJQElEQVRYha2Wy49l11XGf2vvfc499123ul7u6lbb3XI3dkIejgMTgnhaiaIQQbCiCGWUDBghZkiREEiI\/4ARAgYMQEIMkFAiGGBkWRkgO2AIsR0nbne7u+3uqlv3UfdxHvuxGNzqcrdRhBSxdAZ7n3O0z3e+9a1vLWn\/9t8pqoCCAiRQBY2QEmhk397iqa332GtX\/MedNtF7fufzn+Erv\/prfPNP\/ozxdI51GVtdYdBpc++kJgSPiFAUlk\/uTMAI9yvDblHhWi0yo6AJ5xzedti9eIX56QQnKAg8eTiiTaRuAs4K3nsW65rj2YphZ8214YJX7wzRGIi+4R9ffp2qVsbT+eYHUmIyT0xOPc7luFYLEbg8LBHTcNy0SepY+xyThH4WSOJZRk8mJfdujRERbPbMi3887GREH1hVntpHah+pmoBBiTGS6Zhr28cUboHQZr6KrMuGH9y8i6pirCVpAiDLC1JKXBx6yuhwLiOII0bhuU\/8Am3\/HmIrcmtQEYwRYowYqxiTcKDYas1xNDgDAvgQ+NSe560TR+MjzghlA9084\/KoZrLOWSwqNCWMsagqKUbEGGLwtAvDi1\/6MkV7lw\/GE0adivsnU+7813eASNFzGHUk8WTiiE5pq9JIwqDKSbQAhKj4mADh9QeWyicSgjEBZx0xKiGW9Npxw0RMRO8J3qO6Wfu6whjDm7fucbi\/x9XhKVcPD2lOvk+rSNhcyFWx0lAYQ4dEF8GqYhCMAnlmORh16HdaIBbrHPvbA3ZGfbAtILGqT5nVgbcmu7QLg8tzsrxFigmNCRFBUyKGwHy24u77U6bjN\/n+f79EUWxxYWtISpFQJaZVi7XmOIRZpRhVMpORNw7Xy5VRzxBCQ9cp\/YEwXVQ8ODo9q7RIliuFgdurAbGpuDWJ2Ayacg0iiDUgBjEGDYHnnn0G\/APqxlCap3n5tVcY9D\/G1tZ9fnRvyY+P2uz2a65fqLi72Od6f0lAqE2Ja2fCfFlR1QE9E\/HhdhvtGtDIeLpENXL7aIej44ayqkAVMQZUADDGYI0hpoSqsjUc8OvP\/wyv3Zzw7e++SbsNl\/ZGtLOczMFn9sfU6shKpVqvGc8ajE2oBmTrt\/5KU1IEQBOQGLQd3geMJDQE+rzLevwOMQRENlUuAiIGm2eIMaQQid5jncMYw8\/d6LFjS3ot5T\/vW945AWMEa2C3Ay9cKqmSUpJRWEg+sPaKG3Uc2\/0Ws2VFWXvWVaST57giI4XA8XTNaRUxMYAoqgZQVIWiPwBjaVYLNEUg8Zuff4HV9DaHzdvknRaaAi88mbh5wTGyJe+vLJmxWISOE07WijhlZ9CniAZXVRUzDRS5RSMEo7Ss4owiRsiMnmlEIJ05OputXy8JIbKJhDGGV777Er\/xNAwKyyoGrAjWWA6yipZEyBsehC4zU+DXS5rQ5v2Z5yi0ODwY4aJvsIXQySy+DmhoGE88aCSEQIqeJ7fbPPvsx\/ngeEIV5FxDm1SFDR4BYy0fP2zT7dVkuWXfghHwCYq+YjUwSMpll\/PGvMUzFxtIysky8tZyxFHdwrUzxWggeDBEMpPo5BYUFo2H5Pnln3+eb33jC3w0jBE6rY0x\/n+EiOCqssRqxla7w8lqjW8aeoMegkGiYblKzBYVv\/cXrwMw7OaEmFhVgSt7Xf7wxRs03m8oQum02z81IAWck0AKidUKRD1WA6enC1KKrNcVKQaGHcOf\/u6nN9\/8SMyTgnXn+7LxPzWgljG40FR4VUZdy3KxxIhSdLtoAlMYUjCoJm5O5\/gQEBFiilhrP5xYHkmZiJyn8OHaGIOqoijDbvcnAtrKM1xhFWcNViP9QmiaAKnBCczXK5qmQVLgswc7\/+cfNj79xGdiBGsEHxJyxvSj0hMBZwTXVGskd5RlwtclwQeMbowxxRojkRga5qenlOs11lqquuZgf588z89ZePXNI\/7gz39AAhQlycbIRQQRuHGpxwvP7\/E3r9yhyCwPlhFBsShOI5My8MVP7eJSqOh0e3RzocmFWVVzukikFCkywfuEFaVotdCUQITMGVLaNNSHkbUMB9d6iLEElPjev5MOblCvZizff4vyXqDzua8zGGbkzjEYJIyALj7gzg9fg7tvs86exNUR7i88ad6AKskHdgYtVMGIoi4jes\/p6QIfPP1+H+My2h+ppkxLLsXb7AwLbCz58d2XeKJ4hxAhf6LF\/sETnNy5yxsv\/yuSArEp2Qs3WYzfpmxKyqpmdW0H52mxNdglRsUYmN5fIxrQGDg6mZFSBI0Mh4PHAFRV9dg+J7LLKd35McuTu1w\/PODLX\/gVfnjrFq7doTPY5o0HM6bjm\/SKHCPKMsBTl6+y2\/ZUIfHU4QFOZ+8ynb3Lw0HfoJTFkBQjvbYjJcFZOROhfqjARyrJOYclUKQJmC7Tkzk6G\/PqP\/0z826HLM\/Z3a\/IucCuO+Fip8fVnYIbh1c4GOVYa2mScnD9WZzE5qw76dmltJyQdwqOxxPquiF4z3K1YjabgYLERDRQtApGoy1arRaaPC5NyFNFO4s8qNa4VkZLoaxr5qcz9i4dcGV\/RWFKyLfYGh7QarfxCW7fm3CruoXT9NDIzk0FTYGm8gy6LY7WS1IKeO9RVfb39lCEQb\/3WMouX7nGV77++8SUzntdjJFBv0+\/3yfGiKrys5\/4NHmWoygXtrdx7kNTjTHiSP6MfT0Htjidb9JnhCJ3ZNawv7fH3u7ueZk\/2r8erjudDnVdk7kMKWvsVp9Op\/NYNfZ7PVJSkhqq2Sn5oLdh+OwMRwrnQOQsZVv9NqqK957JckntA3\/9L+88xog+BKJgRfjaL11hOp1RliU7uzt0RwOKouCjMR6foKrs7Fygs7W1cfxH4hFAGzCbLyVC2Ogmc4Z11fD33ztCkE0\/eyhq3dBsUb76i5fZ29t97PBHK\/FhCzk8vHh+r2max94XEZxqfNzDgePxCTFFjAgxJpwVruzmHAwsV0cZP5p42haGLYOTRGGFO9OGv\/y3B9TKZuA\/G\/pFDCLCpYHjs9vCd177gLqJlHWkqRp81RB8QEPgc588wKH\/u\/9cGA0Q4PhkCii5hS9ezzBmM2IcHDoysxm8Fqs13\/6Hv+X603\/E9+4uMMYg1iHGYq3FiEWsIybhuUHEhzV1UlYxsPaesvb4OpBqz3xd8z8wvSjf7jlH7gAAAABJRU5ErkJggg==\u0022 data-src=\u0022https:\/\/avris.it\/image\/naked-after-home_big.png\u0022 alt=\u0022\u0022 class=\u0022border\u0022 width=\u0022960\u0022 height=\u0022784.8\u0022\u003E\u003C\/span\u003E\n                \n            \u003C\/figure\u003E\n\u003Cfigure\u003E\n                \u003Cnoscript\u003E\n                    \u003Cimg src=\u0022https:\/\/avris.it\/image\/naked-after-place_big.png\u0022 alt=\u0022\u0022 class=\u0022border\u0022 width=\u0022960\u0022 height=\u0022647.34864300626\u0022\u003E                \n                \u003C\/noscript\u003E\n                \u003Cspan class=\u0022hide-noscript\u0022\u003E\u003Cimg src=\u0022data:image\/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAYCAYAAACSuF9OAAAACXBIWXMAAA7EAAAOxAGVKw4bAAAHIklEQVRIibWVS6slVxXHf\/tRj3Oq6jzu+9Hv0OkkEgQHcSLJwDgWjAMRR4ofQZwKfgU\/giMdiBMRHCQoSETQxkQx706nO7dvbvc9fZ51qmrvvRzUubfP7VbBgYsqqgr247f\/\/7VWqeyNX4jWgUhrRAIKIXiPdw3BN1w6\/iXF9APyvIcKnk5\/k29994fcvPUCj47usnf5CtdvvkCUpGiliCMwRvGDH\/2YD+58xMsDTe0atjeG5HmXuiyJjebeaMpB0cFYzZ2jE3pbhxSRwoLQTVN2+gkqOIwWvPPMyiUnpw2DtEOfnNFsjNLQPGr4+c9+ShwnmChiXjvy3oDvfO\/7vPLq62zv7GANhCBEcYpkXTpNydbGJgbPZDRC5z2aZck0tgzijMP9fe4fHzM82MHEL377J10aRouayaLi8bSirhuWVUPjHN3xOwz8iGEvx3lF0Y3Z7PUIwVPXFbVrCN7x\/u0\/8dZvfsXDk4fsHVzhzbffZr6sGFVQGcP9k4ccFinLquKL0YSmqrlxuEPlBI8i0bCzv4uFwKQRggRY3U0dkOAgeHaGBVt6A\/GO\/d0dHo0mNKLwcUYUZzy\/NWD8eISRVpU\/v\/lbbv\/+dzyI+tTGkhYFC2cIIaKfdZnMpmgFl3c36eYF09MxD05G9LsWaRqsUcKXrgyoGk9sQSOUVYN3DZPpnH6Vcn2wQXCB4Dwqs3QGO3wyaVDAlY0u2y89x7JqmC8qptMpWRy4e69CaUM5m5FkGcZGPJ4tyPOctL9DXE84GU+ZLxY8OD6md+0AgmC997zz8UMEIbEKhVBXNcE3qODwiecvH91lK0vxixIksLu9xV6\/y8H2JptJjdLCu+9\/TF3XPHz4iBuXcrzvUTmwkcXNF+giZyGaUVnz4ecf8fXnD8iTgn98eJe8mxAnKSeLJZbg6FNS2i4EjyJgcMRWqCpHbBX7O5t0Y808SWmIuD+aU+mKqkj5+4Mx20WCtYqr125yeOkSr772Gp\/9+i2q08cgEIJHe89fT2rGszmxaGzc4XQ6pmlqOpHm+q1bzMZzbJEotM25HC35dCTUroEQcOJQwXE6mdJP5yTGcuv5F6nKOdN5DdmAW7dusre7Q5bnRFFK5QM+CD6Adw0iggJiG1EvK1xTowR0mrKsK7I0YjDo0ywXOOdxErBagbWG+zNLExwoizIBjSZ4jenso7eucu16H5sUPHewh0I4On3MYH+fxkZ8djxiUh6RCgwPrvDJxx\/gfEBCwDtHU5XYJEUrCwowKbenUDdLbuzt4RdT3GxKPryMHdeGIskYbPWRWcOy9mSpZauXcOd4xvZVw+begEfjd9lMFfc+f4B3jjyJee+9f\/LJ3SNevrHL7e41Xpp\/xod\/vEOnN+Tq4QFJZ9xWrxJAE6cJadYl6XSpmoqujTjVMZv729xvBLvwWHzDYlFisXQ0JIlgVMODhyU4xzdf\/ypvfOMrANR1TRRFKKX4f4VFPHGkUUoxmteICIMsIo00ywqUAmMMSik+PzqiLEu00gw3hmxubNA4x3QyJU0TtNakaYpIO+9\/CaUUIoJVk09ZTmApAhJQEhiLbysuOJCb55OybpfIRtjIopUG4HE1YTQfsRH65HkOgABNveR4dMLOxiFpbBCRCxsDlGWJ9\/58XquQW6KgHbQCkhUQ4truvQpjLGnagnS73XYBaymKgsSm1HWrcJp2cMryt7Hjy+4IozUiIAi9ogAUgqCVxlr7lGVu2b6JAE9+H4iH4NrnU9IqpZjPF8RxTBBBRNBKkff7iAgikBrN1\/Y2UbTeaa0IIawUFLqdzjMwLZBfImtAsgKS4FHiLyg0mU6IrCXtdIiidrGmrjk+\/gIzVIQgFEXeQobA6ekpaZIQgqB0iya0lT+ZTDBas729fQHMiqtWAgqIrCwLLUwIF4BaudtoGkdVVfRsxtR0sJEFBO89WhtEa\/q9Pskq2VnlzdnZtW5z6emKtfglSOtqa1ULxfq9iulsRpZlbAyH54m5XC7Z399HJGCMwRizqjJFr1esQTy7+VkKXABSrnqCfQaFrFQKK5HbKIoC1zSMRiOyLCOKIhJV4l1JMAXeX8w37wNRHKH\/Qw9wzq0U1WuW+ercW0RQhPOKewLYxmQywXtPr+ixWJTAgiTpUAlEa2OKokfpHH+4c49Xdjex1qDgPMfOVBGR80Rfs6xe+5Q1pQQhXPBeKYVC4b3DmLZk47IC50mHw\/MeIwKxUjyXWhbz+QWA2XxGka+glCLPsqeAgluzRVb7rynEkxNkWYZ3Dq01\/X4fgJGd0NSK9Ck7lFKktu3wZz1HRCjynM6q5Neb5BpQs5YlsrpWXZWLg402YCFaK1OR8MyiZ3EGISKIDmitmc8XTKdTjLVk3S7GGDqdzhrQqvGdLalk\/UsuWDadTgEhiFAul3TSlN54yXxZQm\/rfFwQwRjDwcH+vwX9b\/EvDlDrxomykUsAAAAASUVORK5CYII=\u0022 data-src=\u0022https:\/\/avris.it\/image\/naked-after-place_big.png\u0022 alt=\u0022\u0022 class=\u0022border\u0022 width=\u0022960\u0022 height=\u0022647.34864300626\u0022\u003E\u003C\/span\u003E\n                \n            \u003C\/figure\u003E\n\u003Cfigure\u003E\n                \u003Cnoscript\u003E\n                    \u003Cimg src=\u0022https:\/\/avris.it\/image\/naked-after-submit_big.png\u0022 alt=\u0022\u0022 class=\u0022border\u0022 width=\u0022960\u0022 height=\u00221381.6666666667\u0022\u003E                \n                \u003C\/noscript\u003E\n                \u003Cspan class=\u0022hide-noscript\u0022\u003E\u003Cimg src=\u0022data:image\/png;base64,iVBORw0KGgoAAAANSUhEUgAAABkAAAAkCAYAAAB8DZEQAAAACXBIWXMAAA7EAAAOxAGVKw4bAAAGMklEQVRIiZWXu49cSRXGf6eq7qMf0z0z3Z6xkb32yAgk2AC0EhEkCBGw\/wABCcEGkBOQEbMBfwQiQUggLQsRiIAACRAIFrRazzK2sfFjPJ5H337ce6vqENx+zcyOMSepUt17zrnnq\/N9p1s+861f6UYnIbNKCIHJZMbebsIvfvgNyqqiKAo0KoPBNiKCiKCqrNviTEQA5ntQBRFwViB6z6RWhIAzisYIgDGGfq+PtWbpfDHB4vz4+ARjhH6\/T1EUdLvdeXJwiXjKWhAUiTVWK4QmqAAxRpyzlwJfMgHvAzFGQojLqgCcSywmRkBRIHoQVpWohv+dAGi3WlhrMcaQt\/LzSYpJTTt3TGYRK2DFEeeVTEPk4en4nMNFmID5c8UYQ+qS5mE14Va3hRVwvhxzVipooI4BjTVxuwvAg8dnvPf7fW7fuMbL0wlv3k7YaJv5ZTpSB6mrELHMakdiA8YqQYXEWujcRIzDqZ80X6QBjR6NFbFu7uD54WMOPvo1b7\/1TX7w3s\/46ckRuVMePpuSZhlfuDlCsjHEFCFhO59QmJq2zem2+nzvO+\/S29jExfUkwaOhIvp8Dkfkb\/uH\/OT93\/DhwSOsdRgR8laLYbfCaMHpKGW7HXH2jDOvRKNM4xSrngZlxYRqTKzGhHJMqMaEaoL6GQCJE06KKT\/\/3R8B8L4mKux0J8xCyle\/9m3yGGhnNc4anDGk4omxZBqUoAoILpbFGlyBGGuC7wCQOc9g0\/H8cEYdakARhCSDT7ee848\/\/5hrmzNMsKSpgEYSSRipYEOFzCnlfFUAETSiMaChRn0PgHFpGY0FjQ2DEWE2meBnQm09D54KW1nk3umQuzsFRje4lo\/p+AoFrGmUwMVqBKqoxlU1dQNXXdWcHR8jxpHmGaH2ILDbU6azHg9OHZndYG9zwo4oxz4gXogTyxtv3GLR+C5W43m\/xyZRDGgoAdgdbvH1L38JbIr3FaGu6bQzvnKnJksto1IoS0+Ihp1O4OUMNnLD2Fe0sj7GOkQEF+tJw3XVBjINaKgA+Nzd2\/zo+9+l1WqtCBgj\/zq4T97KGQ4GZFkGwLNnzwDo9Xrn31fFRT9dsVcjqBKjBxpZsdadE8Woig8eYwxFMSbPm3ZvVsE5d0kh3Bc\/v9dUwUK94LN3by2TpKk5J+HGGIaDIS5xpGm6lPiiGtHL+1R1TVVVdDqdpeRIjPGydl+wJocspf7Rw306GwNarRZJkpIkjuLFEbbTJkkSRARr7fID3PrAWQ0e5fzYaM4W1tvcxVpDlmUY04jpSTmD2QxjDVma0ev1liNCVNcrOY\/lvZP7\/PLBbxvoxBA18tbwTW5OuvS2dhAxdLod8ixlNGrUOkkT0iRZQgWs4HrVWL1oDw4f0U+65K0WeZYhIhzs\/5PBzs0lTKrQ7Tb34haOV43VT7Jtn2C72bJuVWWwewuNSpZlWHt+krpVuy0CfvKAWliMkSfFIV0NdLvN3MnznNOjJ+zcuINz7pLPa3XXRTs5ekl\/e+scH46LUxIsnU7nMk8W7fl61mD9+OlTRtMJ\/X6fVp6TpgnxbER27fqy2xpkmrgGVtg36\/r+\/L0stu12m1ae4+Y\/HECYpUJZlRRFQVVVLHgF4BaOq6C8MhHAcDhARBqJ8R5rLZvkuKRp3\/WuVFXMspeX6\/p+ta7jfG\/\/Yw5fvMCYhpAiwlFxRF3VhBAu+ZqLBwt2rydd2OLs+u4u21tbhBCo6xqArcGnCDFgjLn8kf8vGa86+\/f9j9i5cYc0TS69t2iF1ybjVWfZ1jZlWVLX\/tJ7ay28arl159dlkStK0mEf69zSx8j8jl9Fxo\/\/M+b9Pzy5MnDqDJWPVz5\/5+09WplFdFnXqpIPDk55590\/kTqhkxtCCIzGJVYCiXhORwXqZyTGkxnPyckxdVnQyZTMRE5OXjKbFkRfoRobgVz9aWm6ygfl5agidXA2aeZ6DJ6qLHHimU1n1PUUG0sIU6bFGcGPub43pN+xOKn56+PHRF+CRtx5Eq6xXiOqQuoMMQhRBPWQpRYnjnJmKacRa+b3qYqzhjRx\/P3Dg1VA9KrJCGgkeBhPAmigqio0VFRljdGKuq6pqppYT5tfOBr4ywf7RD8jxsD6JP0v8DmijnnKJUoAAAAASUVORK5CYII=\u0022 data-src=\u0022https:\/\/avris.it\/image\/naked-after-submit_big.png\u0022 alt=\u0022\u0022 class=\u0022border\u0022 width=\u0022960\u0022 height=\u00221381.6666666667\u0022\u003E\u003C\/span\u003E\n                \n            \u003C\/figure\u003E\u003C\/p\u003E\u003Csvg xmlns=\u0022http:\/\/www.w3.org\/2000\/svg\u0022 style=\u0022display: none;\u0022\u003E\u003C\/svg\u003E","tags":["bootstrap","colour","design","redesign","refactoring","naked","naked adventure","naturism","webdevelopment","website","font","symfony","javascript","booster"],"hasMore":true,"image":"https:\/\/avris.it\/image\/naked-revamp_small.png","introLite":"\u003Cfigure\u003E\u003Ca href=\u0022https:\/\/avris.it\/image\/naked-revamp_big.png\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Cimg src=\u0022https:\/\/avris.it\/image\/naked-revamp_mini.png\u0022 alt=\u0022\u0022 width=\u0022240\u0022 height=\u0022161.70744403956\u0022 loading=\u0022lazy\u0022\u003E\u003C\/a\u003E\u003C\/figure\u003E\u003C\/p\u003E\n\u003Cp\u003EYet another one of my projects, \u003Ca href=\u0022\/projects\/naked-adventure-de.lite\u0022\u003E Naked Adventure\u003C\/a\u003E,\ngrew too outdated to support it. I had to rewrite it from scratch.\u003C\/p\u003E\n\u003Cp\u003EI took the opportunity to redesign it as well. (screenshots before \u0026amp; after at the bottom)\u003C\/p\u003E","contentLite":"\u003Cfigure\u003E\u003Ca href=\u0022https:\/\/avris.it\/image\/naked-revamp_big.png\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Cimg src=\u0022https:\/\/avris.it\/image\/naked-revamp_mini.png\u0022 alt=\u0022\u0022 width=\u0022240\u0022 height=\u0022161.70744403956\u0022 loading=\u0022lazy\u0022\u003E\u003C\/a\u003E\u003C\/figure\u003E\u003C\/p\u003E\n\u003Cp\u003EYet another one of my projects, \u003Ca href=\u0022\/projects\/naked-adventure-de.lite\u0022\u003E Naked Adventure\u003C\/a\u003E,\ngrew too outdated to support it. I had to rewrite it from scratch.\u003C\/p\u003E\n\u003Cp\u003EI took the opportunity to redesign it as well. (screenshots before \u0026amp; after at the bottom)\u003C\/p\u003E\n\u003Cp\u003EHere\u0027s an overview of what I did:\u003C\/p\u003E\n\u003Cul\u003E\n\u003Cli\u003Ereplaced my abandoned framework \u003Ca href=\u0022\/projects\/micrus-v4.lite\u0022\u003E Micrus v4 \u2022 Beauty of simplicity\u003C\/a\u003E with \u003Ca href=\u0022https:\/\/symfony.com\/\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E Symfony 5\u003C\/a\u003E,\u003C\/li\u003E\n\u003Cli\u003Ebased the project on \u003Ca href=\u0022\/projects\/avris-booster-quick-start-of-new-projects.lite\u0022\u003E Avris Booster: Quick start of new projects\u003C\/a\u003E, to take advantage of built-in features:\nuser management (including a passwordless approach to authentication \u2013 \u003Ca href=\u0022\/blog\/passwords-are-pass%C3%A9.lite\u0022\u003E Passwords are pass\u00e9\u003C\/a\u003E), push notifications, etc.\u003C\/li\u003E\n\u003Cli\u003Ereplaced \u003Ca href=\u0022https:\/\/gitlab.com\/Avris\/Micrus-Assetic\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E custom Assetic setup\u003C\/a\u003E\nwith \u003Ca href=\u0022https:\/\/symfony.com\/doc\/current\/frontend\/encore\/installation.html\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E Webpack Encore\u003C\/a\u003E,\u003C\/li\u003E\n\u003Cli\u003Eupdated \u003Ca href=\u0022https:\/\/getbootstrap.com\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E Bootstrap\u003C\/a\u003E from 3.0 to 4.4,\u003C\/li\u003E\n\u003Cli\u003Eadded more contrast to the design, filled the excess of white spaces with content, making filters and maps more prominent,\u003C\/li\u003E\n\u003Cli\u003Ereplaced Google Maps with Apple Maps, because of privacy concerns (see: \u003Ca href=\u0022\/blog\/ungoogling.lite\u0022\u003E Ungoogling\u003C\/a\u003E, \u003Ca href=\u0022\/blog\/log-out-for-privacy.lite\u0022\u003E Log out for privacy\u003C\/a\u003E) \u2013 the website is now officially Google-free,\u003C\/li\u003E\n\u003Cli\u003Eremoved a couple of unnecessary and unused features:\n\u003Cul\u003E\n\u003Cli\u003Ethe homepage (now the user is shown the map right away \u2013 after all, the map is the whole point of the project),\u003C\/li\u003E\n\u003Cli\u003Ethe \u201dgeographic\u201d links (there\u0027s no separate map of e.g. German nude beaches anymore, it got integrated into the main map),\u003C\/li\u003E\n\u003Cli\u003Eseparate events section (now they show up together with places on the same map),\u003C\/li\u003E\n\u003Cli\u003Eforum (it wasn\u0027t used at all),\u003C\/li\u003E\n\u003Cli\u003Eadmin panel (now the buttons for admins are just integrated across the website),\u003C\/li\u003E\n\u003C\/ul\u003E\u003C\/li\u003E\n\u003Cli\u003Eimproved filters (for instance added filtering by name and location),\u003C\/li\u003E\n\u003Cli\u003Ethe process of submission of new steps isn\u0027t split into steps anymore: place info, review and description are finally just one single form,\u003C\/li\u003E\n\u003Cli\u003Eincluded some more \u003Ca href=\u0022\/blog\/reducing-website-size-by-a-half-by-optimising-bootstrap-and-fontawesome.lite\u0022\u003E optimisations\u003C\/a\u003E.\u003C\/li\u003E\n\u003C\/ul\u003E\n\u003Ch3\u003EBefore:\u003C\/h3\u003E\n\u003Cfigure\u003E\u003Ca href=\u0022https:\/\/avris.it\/image\/naked-before-home_big.png\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Cimg src=\u0022https:\/\/avris.it\/image\/naked-before-home_mini.png\u0022 alt=\u0022\u0022 width=\u0022240\u0022 height=\u0022286.83333333333\u0022 loading=\u0022lazy\u0022\u003E\u003C\/a\u003E\u003C\/figure\u003E\n\u003Cfigure\u003E\u003Ca href=\u0022https:\/\/avris.it\/image\/naked-before-map_big.png\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Cimg src=\u0022https:\/\/avris.it\/image\/naked-before-map_mini.png\u0022 alt=\u0022\u0022 width=\u0022240\u0022 height=\u0022227.80058651026\u0022 loading=\u0022lazy\u0022\u003E\u003C\/a\u003E\u003C\/figure\u003E\n\u003Cfigure\u003E\u003Ca href=\u0022https:\/\/avris.it\/image\/naked-before-place_big.png\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Cimg src=\u0022https:\/\/avris.it\/image\/naked-before-place_mini.png\u0022 alt=\u0022\u0022 width=\u0022240\u0022 height=\u0022223.16666666667\u0022 loading=\u0022lazy\u0022\u003E\u003C\/a\u003E\u003C\/figure\u003E\n\u003Cfigure\u003E\u003Ca href=\u0022https:\/\/avris.it\/image\/naked-before-submit_big.png\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Cimg src=\u0022https:\/\/avris.it\/image\/naked-before-submit_mini.png\u0022 alt=\u0022\u0022 width=\u0022240\u0022 height=\u0022202.99065420561\u0022 loading=\u0022lazy\u0022\u003E\u003C\/a\u003E\u003C\/figure\u003E\u003C\/p\u003E\n\u003Ch3\u003EAfter:\u003C\/h3\u003E\n\u003Cfigure\u003E\u003Ca href=\u0022https:\/\/avris.it\/image\/naked-after-home_big.png\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Cimg src=\u0022https:\/\/avris.it\/image\/naked-after-home_mini.png\u0022 alt=\u0022\u0022 width=\u0022240\u0022 height=\u0022196.2\u0022 loading=\u0022lazy\u0022\u003E\u003C\/a\u003E\u003C\/figure\u003E\n\u003Cfigure\u003E\u003Ca href=\u0022https:\/\/avris.it\/image\/naked-after-place_big.png\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Cimg src=\u0022https:\/\/avris.it\/image\/naked-after-place_mini.png\u0022 alt=\u0022\u0022 width=\u0022240\u0022 height=\u0022161.83716075157\u0022 loading=\u0022lazy\u0022\u003E\u003C\/a\u003E\u003C\/figure\u003E\n\u003Cfigure\u003E\u003Ca href=\u0022https:\/\/avris.it\/image\/naked-after-submit_big.png\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Cimg src=\u0022https:\/\/avris.it\/image\/naked-after-submit_mini.png\u0022 alt=\u0022\u0022 width=\u0022240\u0022 height=\u0022345.41666666667\u0022 loading=\u0022lazy\u0022\u003E\u003C\/a\u003E\u003C\/figure\u003E\u003C\/p\u003E","words":262,"readTime":2,"lang":"en"}}},"blog\/technology\/redesigning-a-website-avi":{"key":"blog\/technology\/redesigning-a-website-avi","type":"article","published":true,"meta":{"createdAt":"2020-04-10T19:33:59+02:00","publishedAt":"2020-04-10T19:33:59+02:00","group":"redesign","links":[{"icon":"globe-europe","colour":"primary","url":"https:\/\/avi.avris.it","displayUrl":null},{"icon":"brands gitlab","colour":"secondary","url":"https:\/\/gitlab.com\/Avris\/Avi","displayUrl":null}],"category":"blog","subcategory":"technology","slug":"redesigning-a-website-avi"},"content":{"en":{"slug":"redesigning-a-website-avi","title":"Redesigning a website: Avi","intro":"\u003Cfigure\u003E\n                \u003Cnoscript\u003E\n                    \u003Cimg src=\u0022https:\/\/avris.it\/image\/avi-comparison_small.png\u0022 alt=\u0022\u0022 class=\u0022border-bottom\u0022 width=\u0022480\u0022 height=\u0022403.61904761905\u0022\u003E                \n                \u003C\/noscript\u003E\n                \u003Cspan class=\u0022hide-noscript\u0022\u003E\u003Cimg src=\u0022data:image\/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAeCAYAAABE4bxTAAAACXBIWXMAAA7EAAAOxAGVKw4bAAAF+ElEQVRYhbWXy48cVxXGf\/dVVd093Z6ezKPHYw\/jJNhjj+PEsRWwMxEKCFYIBSWLwIIFiCURfwQrlrCBDQKiyAobXlFYBITA4BBDHE8snPBMzMSKHz3TM+6Z7urqqntZVPdtT+ZhGw+f1OqS6tx7T33nO9+pEkmSOOccUkruFc45AJ59\/is0m2sYY2i1WzgHQgicc6Rpis2yu95TO+cQQnD+\/HmMMTz22HG0Vj4gSRJWV1awzoFzaKNJuylSKarVqk+qHcdYa1FKAQLnLEJIlJI460AIwIGDzFqSpLt1Qv2Lw4cPo7XGZimJTQFQSqO1Yqhc9guiKPLXWe\/JR0aqABitEVIA+eHW5sz3kxYCnANrLUmSbJmQSJLEAbTX1nHOMjRUpsf54L8HafSGxWmaehaNMcRxjDEBYRhsU5A7w5esEIbgQChJmmXE7VZPB6CUxBiD6MXCQD\/5+lx\/aZaRZXHvXn5fKYUxpsdQvnbx2lVe\/cNrzD00y\/zxTw7YEQLdD8I6XJpBIUQIEAiscxip0Nr0tt8McRuDpVKJoHf4TrGLt5a5uHqdlUXFU4+f2vCAg5K1214T9JiwvSCtNcYYrwchhP8BdLspQWBwzvVEvTWszfdbaq9x4dr7TO8Z5dBILU9ESpQUiE6n44QQxHFMlmVIIUAKPCXO4chlSq+VlVIEQXBba2dEUchO9pFllub6em\/PPmUgpcRogzYBRjFIKE3TPKk0RWntD+vDOYfW2h8oZa4r5xytuEM3SUjTlCiKKBaL27J0J\/iSOedyhqTcoIsdF\/fi1lsxURjgkmyD33g2BL5rRaB7dG+546DLlFI71n8rWGsHLFqHW+sgymF+KNBsNr0uwzDM9+8mBMF2tuAGXVav1ymVSpRKpY0hzuVGlib8+Nff44HKGF88\/aVNLCEFohgg1EBDQRAgLCBAK7XJxz4KIcTAqSuVMlJIkqRD\/6GDIMA5h3OOThrzD3eZ6+1hnnHP+24DUEoglUQMheSGkUP\/D1ryJUuShHK5sjlroNvtotB8\/uRzVMwwQggW6x+yf3Qy7zqpsFlGo9HAWkutVrvn8vvz+qJOkoRCobBlkLUWYIPgrzVuMlrOZ1i3m6KUJI5jnAgQLvFdqZTybEop83lpLVLKLZP2JTt7+S\/caq+hZS7uTjcffk8cfJSPTUxtWlirjvlZBnhLSJIWUiqkFGRZ5jXYF7eUkiiKkFKSpqlP3DPU96G1uEWapZsOHiqUCPTW46DfZb87e27g8vcJPbiQCJQ3xEqlckc\/6pfypTM\/YWm5gTEayIetdQ5Bzoi1lrjTAbfdRBzAa+i7535BfX2VRnuNzwYzvPjyGZIk4Wtf\/jrf+fZZqtUiT3\/mGG\/86QxxHBNFET986UdArqFicWv93Stk39iWKxFTDx\/i6kiBbpYx\/+STnDhxgrjt+GDBMP3AIRofKFauLPPCN16g8f4SwIbxsisJ9csyceAhupNjHDx2klqtRitNMcUi46MTfGLuNHK1Rq26n6MzR3jxWz\/g6MwRgLseM3cLr6HH\/3aTG\/UbzABjD5d4cGIBKRXDI3Oog79hWQiCqScwS2X2DGuCbSzifuFLViwVeWTuGFNTU2T2KtPTYwyVl2g2b1Aw+wnlFH+92ODKuUXmT85z5Y\/\/ATa+Oe7GzzO0d2qSTrfDRHEcI95Dhx8yNrGH1nKZhddXCSPD6U\/tZbY8y60LTWYrh\/8vDPnh+stfvcK7\/3wXgK8+\/QX+\/PPchR99rsqnv\/kmAKeO7mVhr+Wt+luMfm4U2H0N+ZK9dulnzD91ipff+D4rly5TaXbovHmJG\/\/6O8P7asweeYS3l\/7Nqwuvs2\/u47xy8Ryw+13mGaocEPz+2k+ZOB4xqjS3Llxk\/OZNhgtF3tEN6iJget9+wpkav118h8KBSWDA0G4x5Y1xuX2duNsCYFKN011aBkCNj1KX+VdmSYesr7dJbYaWionyMLC7xuhnWX\/y9r8qpZRw27s+gBSCzFqiIATwwzNNs11LSPdnV38uATu8YpK\/+9wW+9EPx\/vFfwEsBAWgUvaJSgAAAABJRU5ErkJggg==\u0022 data-src=\u0022https:\/\/avris.it\/image\/avi-comparison_small.png\u0022 alt=\u0022\u0022 class=\u0022border-bottom\u0022 width=\u0022480\u0022 height=\u0022403.61904761905\u0022\u003E\u003C\/span\u003E\n                \n            \u003C\/figure\u003E\u003C\/p\u003E\n\u003Cp\u003EYet another one of my projects, \u003Ca href=\u0022\/projects\/avi-simple-placeholder-avatars\u0022\u003E\u003Csvg class=\u0022icon\u0022\u003E\u003Cuse xlink:href=\u0022#light-cogs\u0022\u003E\u003C\/use\u003E\u003C\/svg\u003E Avi \u2022 Simple placeholder avatars\u003C\/a\u003E,\ngrew too outdated to support it. I had to rewrite it from scratch.\u003C\/p\u003E\n\u003Cp\u003EI took the opportunity to redesign it as well.\u003C\/p\u003E\u003Csvg xmlns=\u0022http:\/\/www.w3.org\/2000\/svg\u0022 style=\u0022display: none;\u0022\u003E\u003C\/svg\u003E","content":"\u003Cfigure\u003E\n                \u003Cnoscript\u003E\n                    \u003Cimg src=\u0022https:\/\/avris.it\/image\/avi-comparison_big.png\u0022 alt=\u0022\u0022 class=\u0022border\u0022 width=\u0022960\u0022 height=\u0022807.2380952381\u0022\u003E                \n                \u003C\/noscript\u003E\n                \u003Cspan class=\u0022hide-noscript\u0022\u003E\u003Cimg src=\u0022data:image\/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAeCAYAAABE4bxTAAAACXBIWXMAAA7EAAAOxAGVKw4bAAAF+ElEQVRYhbWXy48cVxXGf\/dVVd093Z6ezKPHYw\/jJNhjj+PEsRWwMxEKCFYIBSWLwIIFiCURfwQrlrCBDQKiyAobXlFYBITA4BBDHE8snPBMzMSKHz3TM+6Z7urqqntZVPdtT+ZhGw+f1OqS6tx7T33nO9+pEkmSOOccUkruFc45AJ59\/is0m2sYY2i1WzgHQgicc6Rpis2yu95TO+cQQnD+\/HmMMTz22HG0Vj4gSRJWV1awzoFzaKNJuylSKarVqk+qHcdYa1FKAQLnLEJIlJI460AIwIGDzFqSpLt1Qv2Lw4cPo7XGZimJTQFQSqO1Yqhc9guiKPLXWe\/JR0aqABitEVIA+eHW5sz3kxYCnANrLUmSbJmQSJLEAbTX1nHOMjRUpsf54L8HafSGxWmaehaNMcRxjDEBYRhsU5A7w5esEIbgQChJmmXE7VZPB6CUxBiD6MXCQD\/5+lx\/aZaRZXHvXn5fKYUxpsdQvnbx2lVe\/cNrzD00y\/zxTw7YEQLdD8I6XJpBIUQIEAiscxip0Nr0tt8McRuDpVKJoHf4TrGLt5a5uHqdlUXFU4+f2vCAg5K1214T9JiwvSCtNcYYrwchhP8BdLspQWBwzvVEvTWszfdbaq9x4dr7TO8Z5dBILU9ESpQUiE6n44QQxHFMlmVIIUAKPCXO4chlSq+VlVIEQXBba2dEUchO9pFllub6em\/PPmUgpcRogzYBRjFIKE3TPKk0RWntD+vDOYfW2h8oZa4r5xytuEM3SUjTlCiKKBaL27J0J\/iSOedyhqTcoIsdF\/fi1lsxURjgkmyD33g2BL5rRaB7dG+546DLlFI71n8rWGsHLFqHW+sgymF+KNBsNr0uwzDM9+8mBMF2tuAGXVav1ymVSpRKpY0hzuVGlib8+Nff44HKGF88\/aVNLCEFohgg1EBDQRAgLCBAK7XJxz4KIcTAqSuVMlJIkqRD\/6GDIMA5h3OOThrzD3eZ6+1hnnHP+24DUEoglUQMheSGkUP\/D1ryJUuShHK5sjlroNvtotB8\/uRzVMwwQggW6x+yf3Qy7zqpsFlGo9HAWkutVrvn8vvz+qJOkoRCobBlkLUWYIPgrzVuMlrOZ1i3m6KUJI5jnAgQLvFdqZTybEop83lpLVLKLZP2JTt7+S\/caq+hZS7uTjcffk8cfJSPTUxtWlirjvlZBnhLSJIWUiqkFGRZ5jXYF7eUkiiKkFKSpqlP3DPU96G1uEWapZsOHiqUCPTW46DfZb87e27g8vcJPbiQCJQ3xEqlckc\/6pfypTM\/YWm5gTEayIetdQ5Bzoi1lrjTAbfdRBzAa+i7535BfX2VRnuNzwYzvPjyGZIk4Wtf\/jrf+fZZqtUiT3\/mGG\/86QxxHBNFET986UdArqFicWv93Stk39iWKxFTDx\/i6kiBbpYx\/+STnDhxgrjt+GDBMP3AIRofKFauLPPCN16g8f4SwIbxsisJ9csyceAhupNjHDx2klqtRitNMcUi46MTfGLuNHK1Rq26n6MzR3jxWz\/g6MwRgLseM3cLr6HH\/3aTG\/UbzABjD5d4cGIBKRXDI3Oog79hWQiCqScwS2X2DGuCbSzifuFLViwVeWTuGFNTU2T2KtPTYwyVl2g2b1Aw+wnlFH+92ODKuUXmT85z5Y\/\/ATa+Oe7GzzO0d2qSTrfDRHEcI95Dhx8yNrGH1nKZhddXCSPD6U\/tZbY8y60LTWYrh\/8vDPnh+stfvcK7\/3wXgK8+\/QX+\/PPchR99rsqnv\/kmAKeO7mVhr+Wt+luMfm4U2H0N+ZK9dulnzD91ipff+D4rly5TaXbovHmJG\/\/6O8P7asweeYS3l\/7Nqwuvs2\/u47xy8Ryw+13mGaocEPz+2k+ZOB4xqjS3Llxk\/OZNhgtF3tEN6iJget9+wpkav118h8KBSWDA0G4x5Y1xuX2duNsCYFKN011aBkCNj1KX+VdmSYesr7dJbYaWionyMLC7xuhnWX\/y9r8qpZRw27s+gBSCzFqiIATwwzNNs11LSPdnV38uATu8YpK\/+9wW+9EPx\/vFfwEsBAWgUvaJSgAAAABJRU5ErkJggg==\u0022 data-src=\u0022https:\/\/avris.it\/image\/avi-comparison_big.png\u0022 alt=\u0022\u0022 class=\u0022border\u0022 width=\u0022960\u0022 height=\u0022807.2380952381\u0022\u003E\u003C\/span\u003E\n                \n            \u003C\/figure\u003E\u003C\/p\u003E\n\u003Cp\u003EYet another one of my projects, \u003Ca href=\u0022\/projects\/avi-simple-placeholder-avatars\u0022\u003E\u003Csvg class=\u0022icon\u0022\u003E\u003Cuse xlink:href=\u0022#light-cogs\u0022\u003E\u003C\/use\u003E\u003C\/svg\u003E Avi \u2022 Simple placeholder avatars\u003C\/a\u003E,\ngrew too outdated to support it. I had to rewrite it from scratch.\u003C\/p\u003E\n\u003Cp\u003EI took the opportunity to redesign it as well.\u003C\/p\u003E\n\u003Cp\u003EIt\u0027s quite a simple project, so it only took me a couple of hours. Here\u0027s what I did:\u003C\/p\u003E\n\u003Cul\u003E\n\u003Cli\u003Ereplaced my abandoned framework \u003Ca href=\u0022\/projects\/micrus-v4\u0022\u003E\u003Csvg class=\u0022icon\u0022\u003E\u003Cuse xlink:href=\u0022#light-cogs\u0022\u003E\u003C\/use\u003E\u003C\/svg\u003E Micrus v4 \u2022 Beauty of simplicity\u003C\/a\u003E with \u003Ca href=\u0022https:\/\/symfony.com\/\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Csvg class=\u0022icon\u0022\u003E\u003Cuse xlink:href=\u0022#light-link\u0022\u003E\u003C\/use\u003E\u003C\/svg\u003E Symfony 5\u003C\/a\u003E,\u003C\/li\u003E\n\u003Cli\u003Ereplaced \u003Ca href=\u0022https:\/\/gitlab.com\/Avris\/Micrus-Assetic\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Csvg class=\u0022icon\u0022\u003E\u003Cuse xlink:href=\u0022#light-link\u0022\u003E\u003C\/use\u003E\u003C\/svg\u003E custom Assetic setup\u003C\/a\u003E\nwith \u003Ca href=\u0022https:\/\/symfony.com\/doc\/current\/frontend\/encore\/installation.html\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Csvg class=\u0022icon\u0022\u003E\u003Cuse xlink:href=\u0022#light-link\u0022\u003E\u003C\/use\u003E\u003C\/svg\u003E Webpack Encore\u003C\/a\u003E,\u003C\/li\u003E\n\u003Cli\u003Eupdated \u003Ca href=\u0022https:\/\/getbootstrap.com\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Csvg class=\u0022icon\u0022\u003E\u003Cuse xlink:href=\u0022#light-link\u0022\u003E\u003C\/use\u003E\u003C\/svg\u003E Bootstrap\u003C\/a\u003E from 3.0 to 4.4,\u003C\/li\u003E\n\u003Cli\u003Eadded more contrast to the design, while keeping it simple,\u003C\/li\u003E\n\u003Cli\u003Eremoved the ugly logo,\u003C\/li\u003E\n\u003Cli\u003Ereplaced the font that I used to overuse, \u003Ca href=\u0022https:\/\/design.ubuntu.com\/font\/\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Csvg class=\u0022icon\u0022\u003E\u003Cuse xlink:href=\u0022#light-link\u0022\u003E\u003C\/use\u003E\u003C\/svg\u003E Ubuntu\u003C\/a\u003E,\nwith the beautiful \u003Ca href=\u0022https:\/\/fonts.google.com\/specimen\/Baloo+Thambi+2\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Csvg class=\u0022icon\u0022\u003E\u003Cuse xlink:href=\u0022#light-link\u0022\u003E\u003C\/use\u003E\u003C\/svg\u003E Baloo Thambi 2\u003C\/a\u003E\nand \u003Ca href=\u0022https:\/\/www.jetbrains.com\/lp\/mono\/\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Csvg class=\u0022icon\u0022\u003E\u003Cuse xlink:href=\u0022#light-link\u0022\u003E\u003C\/use\u003E\u003C\/svg\u003E JetBrains Mono\u003C\/a\u003E,\u003C\/li\u003E\n\u003Cli\u003Emoved the generation of links from backend to frontend \u2013\u00a0now it gives you an immediate feedback\nto changes in the form, without having to reload the website,\u003C\/li\u003E\n\u003Cli\u003Eremoved the \u201cLatest generated avatars\u201d section \u2013 I never liked it, but I needed some showcase\nof what this project does\u2026 with the immediate feedback in the \u201cTry it!\u201d section, it\u0027s not needed anymore,\u003C\/li\u003E\n\u003Cli\u003Eincluded some more \u003Ca href=\u0022\/blog\/reducing-website-size-by-a-half-by-optimising-bootstrap-and-fontawesome\u0022\u003E\u003Csvg class=\u0022icon\u0022\u003E\u003Cuse xlink:href=\u0022#light-computer-speaker\u0022\u003E\u003C\/use\u003E\u003C\/svg\u003E optimisations\u003C\/a\u003E.\u003C\/li\u003E\n\u003C\/ul\u003E\n\u003Ch3\u003EBefore:\u003C\/h3\u003E\n\u003Cfigure\u003E\n                \u003Cnoscript\u003E\n                    \u003Cimg src=\u0022https:\/\/avris.it\/image\/avi-old_big.png\u0022 alt=\u0022\u0022 class=\u0022border\u0022 width=\u0022960\u0022 height=\u00221695.2\u0022\u003E                \n                \u003C\/noscript\u003E\n                \u003Cspan class=\u0022hide-noscript\u0022\u003E\u003Cimg src=\u0022data:image\/png;base64,iVBORw0KGgoAAAANSUhEUgAAABQAAAAkCAYAAACJ8xqgAAAACXBIWXMAAA7EAAAOxAGVKw4bAAAFCklEQVRIia2W229UVRjFf3vvc84MnTkzhU5LOy3QYQqUQAKUIAoGFNFETEgw+mTiizFi4pN\/hNEXH4gxMSaGmKiJBpWgCeqDYPVBEeQqlGulF2m1tMN0hjlzLtuH6TntOAVF\/B73\/vaab+219pojHMfRAEII7qe01gAY4YIQgv7+fjb29WGnUg0HyqUSgQ7QGnzfxzAMgiBAAFYshpSyHnB4eJhSqYTnezhOBbRGCIkQAtOyKJfLuJ4HaKRUEWAIFA0WUgYIggDDMFBK3TNdz\/NqE4Z353sebrmCNk2wTNAahIBg5vekBB2AEKiY1QAY4kSUDakQUmHEYwhD4bou5XIZKSU6CBBSYlkWSkqk1typZi9Aa3TVJXDdOZuCwPeRCAwhUTPgd6toQl+A22ThaZ9gehoAZRqIGSUDoRFSoaSILHJXwMD3qVartQmEACUQ7qy\/tNZUKg5SCISU0XoymaxT2gg3pFKYpokQoR7zG11rjZQSKWuWCoKgrjdSOWysVqu1DcNAiBq9+SgGQYDWGqVUdBZAVKvVqFtrPa9Z\/6nqJowoz9C4V1PPHQTmUHYch9u3b2PbNrFYrOFQeOC2U+b6+DUMZZLPrmyYsi4cEokEpmlGh+eW7\/sAnB0+yb7Dr1EoT\/HZq0cb+iLKge\/jem5Dg2ma0TVorbFsi+Z1C8nQGokVigd\/EwW4oyDVanUmADRNTYloffTmOLdKRVZ25uoBPc9DCIFlWfMC3smXnu\/jBz5KyHrK47ducmnkGkopDGXMNNciKd1ks6FnzbyAhlIoKRvjS0mFZVoRbcHsvfwbK4U4UcCGT+m\/VJ0Pw8VCqcjQ+O8IKTGEJKYlgQYlJYlEArRJaboCwMJFSaanp6Jn2tbWRjwer6d8YnyQN3\/4nA3tOa4Vxukbs9j\/0Qek7BRrenupjq3i4IFjrF6bZfeeBzh44HXsdIqTx3\/hnf3vsnvP7voJLdvmqS1P8M2NAdoXLWeRX2HvCy9iJ5NcGRxkaiJLe3wVjz+8gaRKkom38NIrL\/P1wcPE1ezLkmGamLbNmWaDnX3bSOVytGQy3Jia5PLIEO2dWZrNTrZv3sqFfknCyJC12\/nwjfcpDhZYIGNRKkWUcxXBM0MeMMbG+AIy+TSWrKne3pbhtwUOA+evA7DywQ6M5h3c\/PMmANkVSxrf8nRhElku4zgV\/vBc\/PQlpqZ+QkqNUznNJx8vJWnHOH9uCNcPOP7Fl2zYup5vDx2lt3c1+VX5GmDoNdtOkevupimeYGJqAskw6XQfvu9R9SYwRZYdj6zn+qUjGKKFXCJHT1sParPCNuzZT5FwVNu2EWbtHhYvbgM\/y2TxEKaRxjLyLOtawf63LyJlF4tbu8j2rsO56GAXU2QWtjRSPnX2FG+9tw+Azo5Onl79ED9+6gDj9GzO0bn9Css6TgDQui7NkZEzjIyOQitsiveRZ3m9yjcKQ3T0tNC2PM33l79iemCAFs9nxZKlFI79zPnJIbZt3smWTY8yWBznuwuneWzXk1wpTjA6OdGosmkLvHSBZDyFXRRklMnkrwOIWyWyHe20LO2mlLAoOiVSiRbsXCcnRq8yZrpYqUQj5XzXCs5NtgLw7LLnWOJsIlGs\/eEn167B6VnF1eIYC+LNrMvkCXYJJooF9nY\/T35Jd2TsunC4n2oIh7lp43kerusihEAatejyfA\/LsHB9FykkgQ6ImTHkTPyHgOL\/\/iT+C3VfUNvDPRWOAAAAAElFTkSuQmCC\u0022 data-src=\u0022https:\/\/avris.it\/image\/avi-old_big.png\u0022 alt=\u0022\u0022 class=\u0022border\u0022 width=\u0022960\u0022 height=\u00221695.2\u0022\u003E\u003C\/span\u003E\n                \n            \u003C\/figure\u003E\u003C\/p\u003E\n\u003Ch3\u003EAfter:\u003C\/h3\u003E\n\u003Cfigure\u003E\n                \u003Cnoscript\u003E\n                    \u003Cimg src=\u0022https:\/\/avris.it\/image\/avi-new_big.png\u0022 alt=\u0022\u0022 class=\u0022border\u0022 width=\u0022960\u0022 height=\u0022632\u0022\u003E                \n                \u003C\/noscript\u003E\n                \u003Cspan class=\u0022hide-noscript\u0022\u003E\u003Cimg src=\u0022data:image\/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAXCAYAAABj7u2bAAAACXBIWXMAAA7EAAAOxAGVKw4bAAACzElEQVRIib2Wu3IjVRCGvz6XmfHu4hvrMhkpkSNT1FJFsC9BxhtQvAAxAQHPCMHmrHGNR3NuTXBGkrXWSLLA+1epdGZa6v77fuT23XtlBt1JizGWh\/4BUEAmydz5v8OpzPLBWsvZ6SnOWUTM6r2qIsCwWJBzRkSQidqSYEzxOEJoVSUioKAoTAZiTAzDgDEGQRAjaCnVpBjevH6FKogIqmX6rrQ+3v1DKfPOzhJ6993tUZ68FKTscCPGyGKxIKXMxcX5ZyHkVswehXuJUgoPDwPGGj7e3eG9B11XSts0eO+3lvWfH\/4ipMjl6QVXl283ZCL116r65Lw3QilnTrru2Z7+8MuPfPnFOd9+c8OvP\/188P\/cLqG1FrZEbhuWni5xdXPD12+\/4s3F1cFkYE8NpZQopdA0zV5FOZfaoRM+3P9NLIWztuOye700hzEGa45MmaqScsa7nYGkqNL3A2MYgToCVMGYddS67gTF0rUeb+d1SQhxllCIAWtsTd1ngsulzAr7fmAYBkC5vr7+\/6zu2ECyGMN8ynJBhwhG6gdAp0rJkyPWAIqoVIWd389n2QBbCLmZ92vjY0S8Q175yTiEcaQf+2m\/Kd55mrahlAJjoWvbvaQAJh82zg42h9qnA06cnSK0Xq5ihNbXzrMIiOD2FP6hqCmbCdEh8+cooztStrPth8WCMI7kXDDGcH5+9iIEH8N9OmE3hNYQRTBGsNY8mcYvQmiXsKZMMNaDCPf396s0LmeTqmKMoZSC9w3WmjpQU6Lrumc7YdaGH5OoWN4DVetqiDFSSiGl9GRYigjjuCCEelPspoWsqrP6t51F91RuSom+7+sOshYRUBVEapRyzqtrbL09VnLee8zUmSEE2rZdPe+C++33P2aF63vy+vnQ7X8s5Pb797pt6wI452iaBkHJueC8I6WMMUIpSts0hBgJIZBz3kz3I+LPOf8L0k9\/atxDHsEAAAAASUVORK5CYII=\u0022 data-src=\u0022https:\/\/avris.it\/image\/avi-new_big.png\u0022 alt=\u0022\u0022 class=\u0022border\u0022 width=\u0022960\u0022 height=\u0022632\u0022\u003E\u003C\/span\u003E\n                \n            \u003C\/figure\u003E\u003C\/p\u003E\u003Csvg xmlns=\u0022http:\/\/www.w3.org\/2000\/svg\u0022 style=\u0022display: none;\u0022\u003E\u003C\/svg\u003E","tags":["bootstrap","colour","design","redesign","refactoring","avi","avatar","webdevelopment","website","font","symfony","javascript"],"hasMore":true,"image":"https:\/\/avris.it\/image\/avi-comparison_small.png","introLite":"\u003Cfigure\u003E\u003Ca href=\u0022https:\/\/avris.it\/image\/avi-comparison_big.png\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Cimg src=\u0022https:\/\/avris.it\/image\/avi-comparison_mini.png\u0022 alt=\u0022\u0022 width=\u0022240\u0022 height=\u0022201.80952380952\u0022 loading=\u0022lazy\u0022\u003E\u003C\/a\u003E\u003C\/figure\u003E\u003C\/p\u003E\n\u003Cp\u003EYet another one of my projects, \u003Ca href=\u0022\/projects\/avi-simple-placeholder-avatars.lite\u0022\u003E Avi \u2022 Simple placeholder avatars\u003C\/a\u003E,\ngrew too outdated to support it. I had to rewrite it from scratch.\u003C\/p\u003E\n\u003Cp\u003EI took the opportunity to redesign it as well.\u003C\/p\u003E","contentLite":"\u003Cfigure\u003E\u003Ca href=\u0022https:\/\/avris.it\/image\/avi-comparison_big.png\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Cimg src=\u0022https:\/\/avris.it\/image\/avi-comparison_mini.png\u0022 alt=\u0022\u0022 width=\u0022240\u0022 height=\u0022201.80952380952\u0022 loading=\u0022lazy\u0022\u003E\u003C\/a\u003E\u003C\/figure\u003E\u003C\/p\u003E\n\u003Cp\u003EYet another one of my projects, \u003Ca href=\u0022\/projects\/avi-simple-placeholder-avatars.lite\u0022\u003E Avi \u2022 Simple placeholder avatars\u003C\/a\u003E,\ngrew too outdated to support it. I had to rewrite it from scratch.\u003C\/p\u003E\n\u003Cp\u003EI took the opportunity to redesign it as well.\u003C\/p\u003E\n\u003Cp\u003EIt\u0027s quite a simple project, so it only took me a couple of hours. Here\u0027s what I did:\u003C\/p\u003E\n\u003Cul\u003E\n\u003Cli\u003Ereplaced my abandoned framework \u003Ca href=\u0022\/projects\/micrus-v4.lite\u0022\u003E Micrus v4 \u2022 Beauty of simplicity\u003C\/a\u003E with \u003Ca href=\u0022https:\/\/symfony.com\/\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E Symfony 5\u003C\/a\u003E,\u003C\/li\u003E\n\u003Cli\u003Ereplaced \u003Ca href=\u0022https:\/\/gitlab.com\/Avris\/Micrus-Assetic\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E custom Assetic setup\u003C\/a\u003E\nwith \u003Ca href=\u0022https:\/\/symfony.com\/doc\/current\/frontend\/encore\/installation.html\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E Webpack Encore\u003C\/a\u003E,\u003C\/li\u003E\n\u003Cli\u003Eupdated \u003Ca href=\u0022https:\/\/getbootstrap.com\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E Bootstrap\u003C\/a\u003E from 3.0 to 4.4,\u003C\/li\u003E\n\u003Cli\u003Eadded more contrast to the design, while keeping it simple,\u003C\/li\u003E\n\u003Cli\u003Eremoved the ugly logo,\u003C\/li\u003E\n\u003Cli\u003Ereplaced the font that I used to overuse, \u003Ca href=\u0022https:\/\/design.ubuntu.com\/font\/\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E Ubuntu\u003C\/a\u003E,\nwith the beautiful \u003Ca href=\u0022https:\/\/fonts.google.com\/specimen\/Baloo+Thambi+2\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E Baloo Thambi 2\u003C\/a\u003E\nand \u003Ca href=\u0022https:\/\/www.jetbrains.com\/lp\/mono\/\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E JetBrains Mono\u003C\/a\u003E,\u003C\/li\u003E\n\u003Cli\u003Emoved the generation of links from backend to frontend \u2013\u00a0now it gives you an immediate feedback\nto changes in the form, without having to reload the website,\u003C\/li\u003E\n\u003Cli\u003Eremoved the \u201cLatest generated avatars\u201d section \u2013 I never liked it, but I needed some showcase\nof what this project does\u2026 with the immediate feedback in the \u201cTry it!\u201d section, it\u0027s not needed anymore,\u003C\/li\u003E\n\u003Cli\u003Eincluded some more \u003Ca href=\u0022\/blog\/reducing-website-size-by-a-half-by-optimising-bootstrap-and-fontawesome.lite\u0022\u003E optimisations\u003C\/a\u003E.\u003C\/li\u003E\n\u003C\/ul\u003E\n\u003Ch3\u003EBefore:\u003C\/h3\u003E\n\u003Cfigure\u003E\u003Ca href=\u0022https:\/\/avris.it\/image\/avi-old_big.png\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Cimg src=\u0022https:\/\/avris.it\/image\/avi-old_mini.png\u0022 alt=\u0022\u0022 width=\u0022240\u0022 height=\u0022423.8\u0022 loading=\u0022lazy\u0022\u003E\u003C\/a\u003E\u003C\/figure\u003E\u003C\/p\u003E\n\u003Ch3\u003EAfter:\u003C\/h3\u003E\n\u003Cfigure\u003E\u003Ca href=\u0022https:\/\/avris.it\/image\/avi-new_big.png\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Cimg src=\u0022https:\/\/avris.it\/image\/avi-new_mini.png\u0022 alt=\u0022\u0022 width=\u0022240\u0022 height=\u0022158\u0022 loading=\u0022lazy\u0022\u003E\u003C\/a\u003E\u003C\/figure\u003E\u003C\/p\u003E","words":169,"readTime":null,"lang":"en"}}},"blog\/technology\/redesigning-a-website-stos\u0142owia":{"key":"blog\/technology\/redesigning-a-website-stos\u0142owia","type":"article","published":true,"meta":{"createdAt":"2018-08-24T15:23:40+02:00","publishedAt":"2018-08-24T15:22:00+02:00","group":"redesign","category":"blog","subcategory":"technology","slug":"redesigning-a-website-stos\u0142owia"},"content":{"en":{"slug":"redesigning-a-website-stos\u0142owia","title":"Redesigning  a website: Stos\u0142owia","intro":"\u003Cfigure\u003E\n                \u003Cnoscript\u003E\n                    \u003Cimg src=\u0022https:\/\/avris.it\/image\/stoslowia-redesign_small.png\u0022 alt=\u0022\u0022 class=\u0022border-bottom\u0022 width=\u0022480\u0022 height=\u0022299.375\u0022\u003E                \n                \u003C\/noscript\u003E\n                \u003Cspan class=\u0022hide-noscript\u0022\u003E\u003Cimg src=\u0022data:image\/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAWCAYAAACosj4+AAAACXBIWXMAAA7EAAAOxAGVKw4bAAAFPElEQVRIiX2Wy28cxxHGf1Xd89ql+RTNWJYjSrIs2TBiGHAeOgQ555\/KNfApyF+US2zlZOQSCApgPSgnlB0RJJfk7s6ju3KY2eGMKLqAvUx11X791VdVLTFGo7PnL5\/x3XffEhaQe8\/N2\/vs3b1DM1\/w34MDZifHzMOcqql59Ovfs3\/7DgBN01BVFd57zPp0qCp1XXN2cUFV1WRJgqrinOPvjx\/zzbePyYqCIi+Yz8+5u7+PF5E+wZOn\/+Lrv37NJC3YTTe4tX+P\/U8fUs2XvHj5bw6PnnHRnHP4wwl\/\/tNfuLN\/FwAR6X8AZsarV6\/Y2dnh6dOniAgbG5tcOAcGm5vrfP7ZZ7x4+ZLlcs4nH9\/l0e8ekaUpfnijvV\/s8dVXv8F5xWfCrc0Pufn+B5T1ET81KfduPiDWxsP7gb3dvREbQ2uahtlsxtbWFr+8fRsQpANa1RXHx6c4ifz2y19x\/8GnZFlGjJGyLJFhyaoQWdaRECOpgmp762iQKoQQCCgiQuodTltGQgijkq1+IQRCCCRJMgIcY6Cqao6Oj1lfew91StLF+uFBiQFtShSwCDiHqEIIlGZ453ASwQATwPWxQ7ZW5VNVkiQZ+VZAi6LgVlHQNA0xGs4pIGMNmSg1nsILdTQaA4lGFXV1gBANMUMd+EFsmqY9E2ZGHYzEXfpHF\/cZP1Xn\/GP2gj\/uPmDDZ5c+G8CvqpL5fHGlU1qa4+jbZDLpATRNg5mNAL348ZAb023yNMFhNM4IZmgIeC80qmSaYmYMSRkBKptI3QSK1BMGeq0jTDw0BjGCCHgF7RK9C9A8BFKEaIKzgBMDFdCRSvoSr2zUZRIbQrngvGwPmRnOOWKMnDHWyWQyQfw4ee834+L1a9KtLVLvMaD6\/jkne9uEGNje3gbgoD7kA7\/Lmk4uAY001AluCMbMrgy8lWCHscObGlACP56crDy89+FNXFVRLSveHL5BVdnJ1lnbmlxlaAVAfIKfbuClY7dr6zoKmXbtLIoBKFfqP2RpUkxQ105lDLI8Q1rUiEjP\/CpmhWHMeWgI8wvCW7cWEaoY+0QArijAuVH4Ckw0gzxBnMPakcjfTv\/DH9JdinyC0zbOXs8wXyJrWR87FnVZUlVV\/werDptOp\/ycvUvUBwcH7Ny40RWsHQvHxycg4Dvt5VlOUeTXixrnCV4ofDudzdqOmi1rcgfRIEQQMVLv+0n9NkNtKs\/pySlI+31jY4M8z6jqGosG0o6ZoshHcVdKZss588GnFUsXgzkkIvjJBKfjlTC06WSKOu0KBlmasgwleZ73eZ8vXuGiZ00vKzACpKp470fUiwghBGKnoRXd7i39DC1ahBTEda8A4J+LJ3w0fx\/nPd55ROBOdotCi1HsqO0DQoVDDZq2NqgYlSkeQwzqYEQznDfcNW2vKGdHMxBhe2sLEeGL\/CHzuKCqKqrY6lRUKYpirKERQxbRpqQO3QEzojo81tVZiKHpfNeXC0CdQ1WZnZ1hZkynU9I0Jc9zRFqGq6q+MjrG2x5G29l737\/wVoHeXx3977I8yxEV0q78SZIwOz1HRNlYX8cCzP4X0BuBYk0vAY2eBuqoJSHRiDqH0ZZxWdbte8ggli3dRZbir51DkWSakKYphiEIT8pnfOT3WCwWlEdLwCjWC\/Lp2rjLRqsjNFDNqYfUd122fKvLLPFXdtlQQ0evj9jc3Ox9n6\/d56K6IE0TMEjTpGf72tXhvSfPc1xX\/5U1TdPvr1UCVf3Z1ZFlGYvFEhEQUSZFwBJHmraL1DnHs7M33CtSpi7tMfwfMXi5tPgkQxcAAAAASUVORK5CYII=\u0022 data-src=\u0022https:\/\/avris.it\/image\/stoslowia-redesign_small.png\u0022 alt=\u0022\u0022 class=\u0022border-bottom\u0022 width=\u0022480\u0022 height=\u0022299.375\u0022\u003E\u003C\/span\u003E\n                \n            \u003C\/figure\u003E\u003C\/p\u003E\n\u003Cp\u003EThere is a website I\u2019ve created many years ago, \u003Ca href=\u0022https:\/\/stoslowia.avris.it\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Csvg class=\u0022icon\u0022\u003E\u003Cuse xlink:href=\u0022#light-link\u0022\u003E\u003C\/use\u003E\u003C\/svg\u003E Stos\u0142owia\u003C\/a\u003E (Polish only), which collects stories of up to a hundred words. It never got any users, but I didn\u2019t really care to promote it in any way either.\u003C\/p\u003E\n\u003Cp\u003ELast week I\u2019ve decided to rewrite it from scratch, because so many things were wrong about it \u2013 from an ancient backend in plain PHP with hardcoded credentials and no separation of concerns, to login with Facebook (and only Facebook) that stopped working... Now it\u2019s a fresh \u003Ca href=\u0022https:\/\/symfony.com\/\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Csvg class=\u0022icon\u0022\u003E\u003Cuse xlink:href=\u0022#light-link\u0022\u003E\u003C\/use\u003E\u003C\/svg\u003E Symfony 4.1\u003C\/a\u003E with \u003Ca href=\u0022https:\/\/symfony.com\/doc\/current\/frontend\/encore\/installation.html\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Csvg class=\u0022icon\u0022\u003E\u003Cuse xlink:href=\u0022#light-link\u0022\u003E\u003C\/use\u003E\u003C\/svg\u003E Encore\u003C\/a\u003E with some new features (like automatic screenshot generation, seen for instance on \u003Ca href=\u0022https:\/\/twitter.com\/Stoslowia\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Csvg class=\u0022icon\u0022\u003E\u003Cuse xlink:href=\u0022#light-link\u0022\u003E\u003C\/use\u003E\u003C\/svg\u003E Twitter\u003C\/a\u003E).\u003C\/p\u003E\n\u003Cp\u003EBut what I\u2019d like to show you, is how a couple of pretty small design changes have made the whole website way nicer visually (IMHO).\u003C\/p\u003E\u003Csvg xmlns=\u0022http:\/\/www.w3.org\/2000\/svg\u0022 style=\u0022display: none;\u0022\u003E\u003C\/svg\u003E","content":"\u003Cfigure\u003E\n                \u003Cnoscript\u003E\n                    \u003Cimg src=\u0022https:\/\/avris.it\/image\/stoslowia-redesign_big.png\u0022 alt=\u0022\u0022 class=\u0022border\u0022 width=\u0022960\u0022 height=\u0022598.75\u0022\u003E                \n                \u003C\/noscript\u003E\n                \u003Cspan class=\u0022hide-noscript\u0022\u003E\u003Cimg src=\u0022data:image\/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAWCAYAAACosj4+AAAACXBIWXMAAA7EAAAOxAGVKw4bAAAFPElEQVRIiX2Wy28cxxHGf1Xd89ql+RTNWJYjSrIs2TBiGHAeOgQ555\/KNfApyF+US2zlZOQSCApgPSgnlB0RJJfk7s6ju3KY2eGMKLqAvUx11X791VdVLTFGo7PnL5\/x3XffEhaQe8\/N2\/vs3b1DM1\/w34MDZifHzMOcqql59Ovfs3\/7DgBN01BVFd57zPp0qCp1XXN2cUFV1WRJgqrinOPvjx\/zzbePyYqCIi+Yz8+5u7+PF5E+wZOn\/+Lrv37NJC3YTTe4tX+P\/U8fUs2XvHj5bw6PnnHRnHP4wwl\/\/tNfuLN\/FwAR6X8AZsarV6\/Y2dnh6dOniAgbG5tcOAcGm5vrfP7ZZ7x4+ZLlcs4nH9\/l0e8ekaUpfnijvV\/s8dVXv8F5xWfCrc0Pufn+B5T1ET81KfduPiDWxsP7gb3dvREbQ2uahtlsxtbWFr+8fRsQpANa1RXHx6c4ifz2y19x\/8GnZFlGjJGyLJFhyaoQWdaRECOpgmp762iQKoQQCCgiQuodTltGQgijkq1+IQRCCCRJMgIcY6Cqao6Oj1lfew91StLF+uFBiQFtShSwCDiHqEIIlGZ453ASwQATwPWxQ7ZW5VNVkiQZ+VZAi6LgVlHQNA0xGs4pIGMNmSg1nsILdTQaA4lGFXV1gBANMUMd+EFsmqY9E2ZGHYzEXfpHF\/cZP1Xn\/GP2gj\/uPmDDZ5c+G8CvqpL5fHGlU1qa4+jbZDLpATRNg5mNAL348ZAb023yNMFhNM4IZmgIeC80qmSaYmYMSRkBKptI3QSK1BMGeq0jTDw0BjGCCHgF7RK9C9A8BFKEaIKzgBMDFdCRSvoSr2zUZRIbQrngvGwPmRnOOWKMnDHWyWQyQfw4ee834+L1a9KtLVLvMaD6\/jkne9uEGNje3gbgoD7kA7\/Lmk4uAY001AluCMbMrgy8lWCHscObGlACP56crDy89+FNXFVRLSveHL5BVdnJ1lnbmlxlaAVAfIKfbuClY7dr6zoKmXbtLIoBKFfqP2RpUkxQ105lDLI8Q1rUiEjP\/CpmhWHMeWgI8wvCW7cWEaoY+0QArijAuVH4Ckw0gzxBnMPakcjfTv\/DH9JdinyC0zbOXs8wXyJrWR87FnVZUlVV\/werDptOp\/ycvUvUBwcH7Ny40RWsHQvHxycg4Dvt5VlOUeTXixrnCV4ofDudzdqOmi1rcgfRIEQQMVLv+0n9NkNtKs\/pySlI+31jY4M8z6jqGosG0o6ZoshHcVdKZss588GnFUsXgzkkIvjJBKfjlTC06WSKOu0KBlmasgwleZ73eZ8vXuGiZ00vKzACpKp470fUiwghBGKnoRXd7i39DC1ahBTEda8A4J+LJ3w0fx\/nPd55ROBOdotCi1HsqO0DQoVDDZq2NqgYlSkeQwzqYEQznDfcNW2vKGdHMxBhe2sLEeGL\/CHzuKCqKqrY6lRUKYpirKERQxbRpqQO3QEzojo81tVZiKHpfNeXC0CdQ1WZnZ1hZkynU9I0Jc9zRFqGq6q+MjrG2x5G29l737\/wVoHeXx3977I8yxEV0q78SZIwOz1HRNlYX8cCzP4X0BuBYk0vAY2eBuqoJSHRiDqH0ZZxWdbte8ggli3dRZbir51DkWSakKYphiEIT8pnfOT3WCwWlEdLwCjWC\/Lp2rjLRqsjNFDNqYfUd122fKvLLPFXdtlQQ0evj9jc3Ox9n6\/d56K6IE0TMEjTpGf72tXhvSfPc1xX\/5U1TdPvr1UCVf3Z1ZFlGYvFEhEQUSZFwBJHmraL1DnHs7M33CtSpi7tMfwfMXi5tPgkQxcAAAAASUVORK5CYII=\u0022 data-src=\u0022https:\/\/avris.it\/image\/stoslowia-redesign_big.png\u0022 alt=\u0022\u0022 class=\u0022border\u0022 width=\u0022960\u0022 height=\u0022598.75\u0022\u003E\u003C\/span\u003E\n                \n            \u003C\/figure\u003E\u003C\/p\u003E\n\u003Cp\u003EThere is a website I\u2019ve created many years ago, \u003Ca href=\u0022https:\/\/stoslowia.avris.it\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Csvg class=\u0022icon\u0022\u003E\u003Cuse xlink:href=\u0022#light-link\u0022\u003E\u003C\/use\u003E\u003C\/svg\u003E Stos\u0142owia\u003C\/a\u003E (Polish only), which collects stories of up to a hundred words. It never got any users, but I didn\u2019t really care to promote it in any way either.\u003C\/p\u003E\n\u003Cp\u003ELast week I\u2019ve decided to rewrite it from scratch, because so many things were wrong about it \u2013 from an ancient backend in plain PHP with hardcoded credentials and no separation of concerns, to login with Facebook (and only Facebook) that stopped working... Now it\u2019s a fresh \u003Ca href=\u0022https:\/\/symfony.com\/\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Csvg class=\u0022icon\u0022\u003E\u003Cuse xlink:href=\u0022#light-link\u0022\u003E\u003C\/use\u003E\u003C\/svg\u003E Symfony 4.1\u003C\/a\u003E with \u003Ca href=\u0022https:\/\/symfony.com\/doc\/current\/frontend\/encore\/installation.html\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Csvg class=\u0022icon\u0022\u003E\u003Cuse xlink:href=\u0022#light-link\u0022\u003E\u003C\/use\u003E\u003C\/svg\u003E Encore\u003C\/a\u003E with some new features (like automatic screenshot generation, seen for instance on \u003Ca href=\u0022https:\/\/twitter.com\/Stoslowia\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Csvg class=\u0022icon\u0022\u003E\u003Cuse xlink:href=\u0022#light-link\u0022\u003E\u003C\/use\u003E\u003C\/svg\u003E Twitter\u003C\/a\u003E).\u003C\/p\u003E\n\u003Cp\u003EBut what I\u2019d like to show you, is how a couple of pretty small design changes have made the whole website way nicer visually (IMHO).\u003C\/p\u003E\n\u003Ch1\u003ELogo\u003C\/h1\u003E\n\u003Cp\u003ELet\u2019s start with the logo. The old one was the laziest option possible: just an icon of a pencil from \u003Ca href=\u0022https:\/\/fontawesome.com\/v4.7.0\/icons\/\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Csvg class=\u0022icon\u0022\u003E\u003Cuse xlink:href=\u0022#light-link\u0022\u003E\u003C\/use\u003E\u003C\/svg\u003E Font Awesome v4\u003C\/a\u003E.\u003C\/p\u003E\n\u003Cfigure\u003E\n                \u003Cnoscript\u003E\n                    \u003Cimg src=\u0022https:\/\/avris.it\/image\/stoslowia-old-logo_big.png\u0022 alt=\u0022\u0022 class=\u0022border\u0022 width=\u0022128\u0022 height=\u0022128\u0022\u003E                \n                \u003C\/noscript\u003E\n                \u003Cspan class=\u0022hide-noscript\u0022\u003E\u003Cimg src=\u0022data:image\/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAkCAYAAADhAJiYAAAACXBIWXMAAA7EAAAOxAGVKw4bAAABz0lEQVRYhe3WzWpTQQCG4afqQkS6FJEiIYSsRMSFEt24EHfeh5siIsWr8Aq0igvvQUqoGvwB8aeK1I24kOIF+EcopbqYOfQ0nJycTE5ThbybGSbnkJdvvpmEGTP+bRq4vN8SGW08xSdcw4EqLx3cI5kW7uI45nAem3izH0LtnEzGHC6gjzX8mZZQE8sDMnk6+I130xBq4V6JDDtJ\/cIHBUnVJdSsIJOX6uAH3hd9OCkt3MGJMd\/bwlV8yS9WOoolNBNloIuNwcVJhLICp8g8wi3hKthF6pZNIrOCm0UypCXUkL5NK1gaJsP4CWWdWUiQ6eJGmcy4QidxfwKZJeFSLKWqUEPozJ4lM47QAh4kyqwKBR6ZTMaoUjekb9OqkExlGcoTOoaHQndSZMZKJqMsoSvTlhkl1InjZxULiScStqmK0BGcjvNl4ZrvV5QZ9Vwph4ast4QObeI1vsb5bRwueL6H65PKMDyhc3HcwLc47wrdGPzSnhqSyRiW0MU4vsK28Lt1RuhV305KPSzWJUPxsT+Kx5jHW6FPDbu3ahvPhGR+1iVDcUKnogycza1\/xzpe4kWcb9UpM0yoHce+8PfyeRT4GKWmzjwuCadsxoz\/jr\/bT2F\/bPwgOgAAAABJRU5ErkJggg==\u0022 data-src=\u0022https:\/\/avris.it\/image\/stoslowia-old-logo_big.png\u0022 alt=\u0022\u0022 class=\u0022border\u0022 width=\u0022128\u0022 height=\u0022128\u0022\u003E\u003C\/span\u003E\n                \n            \u003C\/figure\u003E\u003C\/p\u003E\n\u003Cp\u003EThe new one is a modification of free vector icons \u003Ca href=\u0022https:\/\/thenounproject.com\/iconka\/collection\/sketchy-icons\/\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Csvg class=\u0022icon\u0022\u003E\u003Cuse xlink:href=\u0022#light-link\u0022\u003E\u003C\/use\u003E\u003C\/svg\u003E created by Denis Sazhin from the Noun Project\u003C\/a\u003E (CC-BY), that looks way more individual. Its elements form a \u201c100\u201d, which relates to the name and the purpose of the website.\u003C\/p\u003E\n\u003Cfigure\u003E\n                \u003Cnoscript\u003E\n                    \u003Cimg src=\u0022https:\/\/avris.it\/image\/stoslowia-new-logo_big.png\u0022 alt=\u0022\u0022 class=\u0022border\u0022 width=\u0022128\u0022 height=\u0022128\u0022\u003E                \n                \u003C\/noscript\u003E\n                \u003Cspan class=\u0022hide-noscript\u0022\u003E\u003Cimg src=\u0022data:image\/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAkCAYAAADhAJiYAAAACXBIWXMAAA7EAAAOxAGVKw4bAAAI1UlEQVRYhb2Yf2wT5xnHv2f7\/ONydmwnRI7TJIYlGCIISQ2ENjQYd8WDjM2AmGBDQpP4ZxJC+2NC+6MFoSmVEG2llXXtJk2dtElFaqNurSqBSEKBKI5p6jo\/+JE4AeIljnyJHcf23Tn2nd\/90dmLk8DWEfZIpzvd8\/74vN\/3eR69d0r892YG0AqABRD5Dv2+k1H\/wa8GsFOhULxYWlrqtlgsDdFoNGO1WnuDweDdTCajqqys\/H0oFEo9L8Dl9sMdO3Z8MzAwMDk1NSWeO3eODA0Nkb6+PvLBBx+QCxcukPr6+s6+vj7F\/wvodEdHx3AkEiEffvgh2b17N8lkMoQQQnK5HLlz5w7xeDyy3W7\/DYA1gXrqIDRNNzc0NNhSqRR8Ph\/27t0LmqYBABRFYXBwEM3NzYq2trZfa7Vaz\/MGYquqqnY1NTWxDMMgEAjA4\/GAEFK4wuEweJ7Ha6+9pqqurv6Tw+F44XkC7XK73eWiKMLv90MQBDQ1NQH4Vh1JktDT04P169dDFEUcO3ZMGhgYeObgVj3F96rT6dSazWb09\/fD7XaDor5NSkIIIpEIOI5DS0sLPv\/8c1y9evVBOp2OPyvQkxRSsCzb6HQ6tclkEv39\/fB4PAUgiqLQ39+PLVu24PHjx\/D5fJicnPRfunTpWXmeCGR2uVw2lUql1mq1mJ6exrZt2wowANDd3Y09e\/aAYRgsLCwgmUzOPjPNU4Aa3W63QqFQgOd5aDQaMAwDAIWA\/vrrr1FVVYVoNIpQKASKorqeG5BSqXzR7XarZFnG\/fv34XQ6i7ZrenoaLMuivLwcyWQS2Wx2TBCE\/ucGVFdXV6nX662JRALXrl2Dy+UqSne\/34+XXnoJJpMJ09PTyGQyfWsBA6yeZYb9+\/fbMpkMk8vlMDMzg4aGhoJCAODz+XDo0CEsLi5iZGQENE3\/fa2AVlNo5759+5h0Oo1oNIr6+npQFFWkUCwWA03TYFkWyWRSKCsru7NWQCsUoijK1tDQsJFhGPh8PuzevTv\/HgDA8zwAIBKJQBAE3Lt3LxQOh7m1AlqukMrhcGzW6XQv0DSN0dFRtLa2FqkzNjaGXbt2obq6GiUlJUin01cBSM8LyHLgwIEamqbV6XQauVwOZWVlRRkWCARQW1uL2dlZDA4OgmXZ7rWCWQ3o5UOHDrGCICAej8NqtRbBAADHcaioqADLspiZmZH0en3vWgIVxRDLstYNGzZs1Ol06OrqglarLfgIIUilUqAoChRFQZZlzMzMDIVCobTRaGzQarW7UqmUhef5ACHkSwDCswIxW7durY7H47ZwOIxoNAqDwVBwUhSFgYEBOByOAuj8\/Lz59ddfD1osFkt7e7uKoijcunUr19XVNXX79u2Lw8PDfySE5OOrHIARQPhpsEuBmo4ePVrDsqxCrVbjq6++wqZNmwpOjuNw\/vx5XLx4EbFYDPfv38fhw4dtHo8HZrMZhBAolUp4PB5Fe3t7jdfrvXz69OnWysrK8aqqKte+fftsiUSi3Ov1zg0NDf0tGAz+NplMjj8NqI0Q0pRIJKBWq1FVVQWTyQRRFEHTNC5dugS9Xg+KoiCKIubn57F9+3asW7du5SpVKnAcpzhz5sxPXS4XTCYTlEolDAYDTp069cLU1NTpK1eunHjrrbd+MTs7e2VpX+WS55\/p9XrX0aNHFd3d3Th58iQaGxvx2Wef4ebNm3C5XNDr9WhsbATDMLhx4wY8Hk9RnOW3tre3F4QQOJ1OWK1W6HQ6aDSagt9oNGLLli1aq9Xq6evrmxQEYXC17Xu5tbV1fmJigiwuLhYO8nnLZrOko6ODeL1eEgqFyNmzZ4v8efP7\/eTjjz8m6XR6VX\/eEokECQaD5M033xQBfD8PsTTtR8bGxnLl5eWgaRqEEAD\/Pm4olUrY7XZ0dnYinU7DbDYX+QkhkCQJPp8Pe\/bsgVqtXuFfesmyDKVSiYMHD2rb2touUBSlWA6UmJube9Db21uQNn+nKAo8z6OlpQVmsxlvvPEGtm3btqLN3bt3wfM8WJZdUb\/ybfKQHMdBkiQYDAYcOXJkJ4CNy4EAoKenp6doEEmSEAwGMTIygkAgALvdjpqaGjgcjqIJAWB8fBzNzc3Q6XQrYJbGWCwWA8MwEEURALB3716VTqc7DCwrjISQ66Ojo79aWFjQZrNZaLVaLCwsQKFQwGAwIBaL4YsvvsDbb7+N0tLSwmrzE2azWajV6sK75fd8+5KSEnAcB5vNhpKSknx4fG8FEICB8fFx7sSJEzX5Fdvtdhw\/fhyCIOQ6Ojoet7e3lxuNxkLFXDqRJEkQBGHV7VqyaAiCALVajVwuB4qiMDo6isXFRQDFaQ8AWVEUWywWS4PdbqdEUYRCoUA4HMa1a9fuDg8Pn3r06BG1c+fO7SaTqRC42WwWHMdBlmV4vV688sorBWWWgicSCczOzoLneZSWlhYK6nvvvQev1\/s7AN+sOKDxPN8NIDM7++1HRDwex6effvrQ5\/OdBNCbSqXOnzt37sHU1BSi0Sji8TgikQhKS0uxefNmPHz4EI8ePUI6nS4K5GQyiWQyCVmWYTQaQdM0KIrKL3YMwF9XUwgAEiaT6RRN05q6ujqEw+HAxMTEjwDc\/Zca\/MzMzHVZll8tKytbV1JSAoPBgIWFBZjNZtTX1+Pdd99FY2MjVCoVZFlGNBqFJEmQJAlarRZGoxEMw2BxcRGXL1+WOjs7fwkg8CSgOM\/zP5EkycJx3Jd+v\/\/HhJB\/LG0gy3L0wYMHV3t7e2uDwWCNIAh0MpnE8PAwAoEAbt++Hcpms5ra2lqVLMuFKm2xWKDRaEDTNFKpFN55553M+++\/\/xee5y8CyAFP+GHFsuzZ9evX75iYmPi5IAhP+15XaDSaCrvdvjESiRjVajU2bdr0cGJiYsxgMPygrq7uD\/v377c4nc5CzRFFEZOTk\/joo49GPvnkk8uxWOzPADL5AZ\/0B43B\/3ieWWoqlcpmNpsP2Gw2R0VFRYUoipibm3sYjUavV1RUdPn9\/vTyPv8EVEBqalCJz50AAAAASUVORK5CYII=\u0022 data-src=\u0022https:\/\/avris.it\/image\/stoslowia-new-logo_big.png\u0022 alt=\u0022\u0022 class=\u0022border\u0022 width=\u0022128\u0022 height=\u0022128\u0022\u003E\u003C\/span\u003E\n                \n            \u003C\/figure\u003E\u003C\/p\u003E\n\u003Ch1\u003EOld design\u003C\/h1\u003E\n\u003Cfigure\u003E\n                \u003Cnoscript\u003E\n                    \u003Cimg src=\u0022https:\/\/avris.it\/image\/stoslowia-old-home_big.png\u0022 alt=\u0022\u0022 class=\u0022border\u0022 width=\u0022960\u0022 height=\u00221197.5\u0022\u003E                \n                \u003C\/noscript\u003E\n                \u003Cspan class=\u0022hide-noscript\u0022\u003E\u003Cimg src=\u0022data:image\/png;base64,iVBORw0KGgoAAAANSUhEUgAAABwAAAAkCAYAAACaJFpUAAAACXBIWXMAAA7EAAAOxAGVKw4bAAAFCElEQVRIiaWWzY4kRxHHfxGZWdXTPbNe42UFyLKQWVnmERBHy+LIkQsvgMQFiTvPwI0LDwAvgLiCQOKCOHNDNrINi7We6Z3q+sgIDllVru6qgUHkYaqnKjMjM\/4fEZJzdi5G27YcXx+pUsLNEVVSDMRUISKIapnXNJg7ApRNyl9zZ3+1J4RwuTVRRFYv\/\/in3\/HTn\/2Yt5+8wacf3ZNb48Xzp3z7O9\/la8+\/wrvf\/wH+8h\/8\/le\/JlSR288+4w9\/+TPP3r7mNh\/55G+v+MXPf8mHH3xvHXD1ZjyhdcLLo3H4+jVvVE\/Zkfji9khU5+63vyG\/esW9GdGP\/IuXPH1RY3FAvwiIK2HMwn+8obsjIsQqkG4CXdswnBSvW+5RYnPN9ZNrnqlgu8hf\/SP+\/vHHdNajAs1tpjmduH4roVICisi8L0B0P4fQ3Xnxzff40Q9\/ggYh1YGhy2glkJV3nr\/Dm289o3n9OV99\/xv0bUYV8uDESlER7v7Z8q13X8z7LZ\/ilxGBZnDuB0eBwaEOcJPOsb7tnH0Skgpt2+ISMFFUIDvUQYi65oeY2SrgMPQ0zWk+Wdd1ECsGc4JAiJGEYWbnm4lgZqgqV1d7UopzSmcMt4B1L4FUBRBSVaEiXF\/VqAgiwjAMMzYpJS7ZriNpLhO4Ig0AIdFVkeskXEXhvreiMAHz8jxpJDskhaBCHhM1pxQhsCbNJoZ915WUSjnpZepUFXfHzOaNphvlnAFhv78ipbTK3llKp5OYO0Mezt6bGTFGzIwQAkLR6\/K803p3w323+P+\/yGKyr2rEZrrlnBYRBMjjzZebujt1Xa8w3JTFtKjLTjM4hyQFEwMr0M2jzU5Q4SoUXAcv3ydfDQq6heGWLPp+4Ng0ZQFgCCKjNbsTQphxVZzJ\/s0cFUCVw25HSmsRbJo3OFG+\/K3uiAMiIBCkHGCMT9Siv5QCPuIagq6kAg+Ztxlt25YULBZNv5cEKkEdQcg5z5g\/NDZTamazsOcNRaiqavPU\/8tYkQagzXDXFzwqhSCFNBOmCDRDIcZBjZwzHhLZyxyAGIQoG9XiLPrEpNzC8ZbszmkhhWloCKgIQx74PBfvvPTMm5sbpK5Xa1c6nCbsdrvFrZ3Z9UIAhKpKZwEmT12Orb0fJE3XddR1PS4SVGWRHjZt6zFj00uLZRUV6IWLzEwdm6fpdstvyxs+SvhNn7k79Zg5b+6UUwZwzEplEBFacxTnEIXBoLNyAMUxhMOuIoW1PDaFH2wgdK8JwOtjcRh3R0Xo3EkpEUdDv2tsrh4+pkVF8KRIrNcBN\/OsOhdV5zytk+iBWejAbO6qio8VZWs8yNKJ6lVVnWFRvittezoLVNf1GYYhhIdZOk2cJmSJdOlAHQQN0GfHoBTk8dmlAwDX0pe1ITEshD84m8LfZGnXdTRNMzdElxYXQkBE6Pt+0+pEhP1+v13xt67t7sWuxnTlnGezXmJZTs+icvhZmh8tfFUlxQjjogmPEMJcCUpNzIDiXogUY\/yyY3jA5Ddb\/TEvKzFPdqcji5dr\/i\/hd1Y6axV4UsmiGBdNCvCqc55UMpOkGQqx4qLzDhuXfLhNPJ3IOWNmGIov2vgQ9KLzHjuZBaCHw4GqqtYpXZ+h+OQk6hACYgZiCKWdUPGxO5\/uPOlTwB1H2OBLCfiQ8EtvWUrOdNJprqrS9\/3ctyyxmhos1W2Wipn5JYUfA\/4wDJiVZmli8WPW\/Rv9jECHOmzNXwAAAABJRU5ErkJggg==\u0022 data-src=\u0022https:\/\/avris.it\/image\/stoslowia-old-home_big.png\u0022 alt=\u0022\u0022 class=\u0022border\u0022 width=\u0022960\u0022 height=\u00221197.5\u0022\u003E\u003C\/span\u003E\n                \n            \u003C\/figure\u003E\u003C\/p\u003E\n\u003Cfigure\u003E\n                \u003Cnoscript\u003E\n                    \u003Cimg src=\u0022https:\/\/avris.it\/image\/stoslowia-old-add_big.png\u0022 alt=\u0022\u0022 class=\u0022border\u0022 width=\u0022960\u0022 height=\u0022442.5\u0022\u003E                \n                \u003C\/noscript\u003E\n                \u003Cspan class=\u0022hide-noscript\u0022\u003E\u003Cimg src=\u0022data:image\/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAQCAYAAAB+690jAAAACXBIWXMAAA7EAAAOxAGVKw4bAAABF0lEQVRIie2TwU7DMBBE39oOSnug\/3\/jGzjyA3wNB6RIBNvr5dDaFNomaRCIQ+c0kWazs7tjKaUYgIgAYGaND8OAquK9p+s6VBXnXPv+rs85E1NCoOlijIQQMDPMjBA6QvAntWYGgKjqnp1BjLEV1AbXYEhGMXD7X1AOne7v5GJNcM6dOK18HMc2mfeB7XaD9x4ROauv3MzIObNxLNIf8zA14W63u1g8B1VFRHDONZNL4BapVsDMeHl\/xbnPFunhEX16nqwT22PxSn\/CrRSYOd\/kyapwLT+Z\/pDXKcye7DiQ1\/I1mN1QSgkDaosa0hrUt3EkeE\/OGRGh7\/tmSFW\/bKSGfAp\/mqEl\/Nde2VrcDM3hZmgO\/87QB+2b5hKTe+QzAAAAAElFTkSuQmCC\u0022 data-src=\u0022https:\/\/avris.it\/image\/stoslowia-old-add_big.png\u0022 alt=\u0022\u0022 class=\u0022border\u0022 width=\u0022960\u0022 height=\u0022442.5\u0022\u003E\u003C\/span\u003E\n                \n            \u003C\/figure\u003E\u003C\/p\u003E\n\u003Cp\u003EMaybe I shouldn\u2019t judge the design, if it\u2019s me who created the website, but since it\u2019s mostly a \u003Ca href=\u0022https:\/\/bootswatch.com\/\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Csvg class=\u0022icon\u0022\u003E\u003Cuse xlink:href=\u0022#light-link\u0022\u003E\u003C\/use\u003E\u003C\/svg\u003E Bootswatch\u003C\/a\u003E theme anyway, I\u2019ll dare to say: it\u2019s not bad. I like it. It\u2019s clean and minimalist.\u003C\/p\u003E\n\u003Cp\u003EWhat I don\u2019t like is my own choices: like the jumbotron with random background images, which made the text not-so-readable, even with the addition of a text shadow, or the lack of a footer, which makes the website look somehow... \u003Cem\u003Eincomplete\u003C\/em\u003E...\u003C\/p\u003E\n\u003Cp\u003ESo what I did to polish it up:\u003C\/p\u003E\n\u003Cul\u003E\n\u003Cli\u003EI rebuilt it in \u003Ca href=\u0022https:\/\/getbootstrap.com\/\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Csvg class=\u0022icon\u0022\u003E\u003Cuse xlink:href=\u0022#light-link\u0022\u003E\u003C\/use\u003E\u003C\/svg\u003E Bootstrap 4\u003C\/a\u003E using a different \u003Ca href=\u0022https:\/\/bootswatch.com\/\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Csvg class=\u0022icon\u0022\u003E\u003Cuse xlink:href=\u0022#light-link\u0022\u003E\u003C\/use\u003E\u003C\/svg\u003E Bootswatch\u003C\/a\u003E theme (slightly modified).\u003C\/li\u003E\n\u003Cli\u003EI switched the \u003Ca href=\u0022https:\/\/fontawesome.com\/\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Csvg class=\u0022icon\u0022\u003E\u003Cuse xlink:href=\u0022#light-link\u0022\u003E\u003C\/use\u003E\u003C\/svg\u003E Font Awesome\u003C\/a\u003E icons to version 5, the light version.\u003C\/li\u003E\n\u003Cli\u003EI switched the font to something more distinctive.\u003C\/li\u003E\n\u003Cli\u003EMade the jumbotron bigger, with a non-random background image that matches the subject matter and is subdued, so that the text is better visible.\u003C\/li\u003E\n\u003Cli\u003EEven though the random jumbotrons in the old website were meant to add some colour to an otherwise dull website, it still looked pretty monotonous. That\u2019s why I decided to assign colours to the categories and display them as small bars on top of the story-card.\u003C\/li\u003E\n\u003Cli\u003EAlso to break the monotony, I decided to align the cards in a \u003Ca href=\u0022https:\/\/masonry.desandro.com\/\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Csvg class=\u0022icon\u0022\u003E\u003Cuse xlink:href=\u0022#light-link\u0022\u003E\u003C\/use\u003E\u003C\/svg\u003E Masonry\u003C\/a\u003E manner, instead of just rows.\u003C\/li\u003E\n\u003Cli\u003EWithin the card, I separated the important info (title, author, category) on the top, from the less important (number of words, date of submission, comments, votes and social buttons) on the bottom.\u003C\/li\u003E\n\u003Cli\u003ECategories are pretty important, yet in the old design they weren\u2019t emphasised at all. With the addition of colours they are way more visible, yet to make them even more distinctive and useful, I added icons and a list of all categories on the top.\u003C\/li\u003E\n\u003Cli\u003EI added a footer.\u003C\/li\u003E\n\u003Cli\u003EI reorganised the submission form so that it has a simple up-to-down flow, instead of the previous two columns that made it easy to overlook some fields.\u003C\/li\u003E\n\u003C\/ul\u003E\n\u003Cp\u003ECheck out the end effect below. What do you think? \ud83d\ude09\u003C\/p\u003E\n\u003Ch1\u003ENew design\u003C\/h1\u003E\n\u003Cfigure\u003E\n                \u003Cnoscript\u003E\n                    \u003Cimg src=\u0022https:\/\/avris.it\/image\/stoslowia-new-home_big.png\u0022 alt=\u0022\u0022 class=\u0022border\u0022 width=\u0022960\u0022 height=\u00221605.5\u0022\u003E                \n                \u003C\/noscript\u003E\n                \u003Cspan class=\u0022hide-noscript\u0022\u003E\u003Cimg src=\u0022data:image\/png;base64,iVBORw0KGgoAAAANSUhEUgAAABUAAAAkCAYAAABmMXGeAAAACXBIWXMAAA7EAAAOxAGVKw4bAAAEvUlEQVRIiZ2WT28byRHFf1XdPTOkJFIyLdKxAiyyh00+wO4hgD9DgBzyOfMVFsbuYYPkkkRADhsgudiWRNqkKJOcf105DDniaOQ9pHngYKb7VVe9eq9b8jw3M8PMOB6qSllV3K\/XlGVFlqbUVUWSBESEn\/76N75\/+xYzOD09I8sy5vNbfv36V3gAEQHAzCjLku12i6pyfX2Ncw6A2esr6qrifDwmCYHfffMNf\/\/nNScnJ9x8eMfrVy\/50x\/\/wMXFBZLnuR0AARaLBavViqurK3a7HQYIQow1ZVVzO18QLXL1asaPP7zFEN68ecPobERd15Rl1QU1M+7u7jAzkiRhl+ekaYqqtplgEJLAYn6HU+HF5BIR3WdkFEXRBz2Mw\/PTWgOUZU6MwmL5kSzJcM7hvcc7xcyQ3S5vwrdg7VMPzAxirKjrmhCSNmhV1cQYCcE3oNYMRAQzIxrUERL\/SN7hm4gQzdgWxn2948\/zf\/Dt6Irvxlct2UAfdLPdsvj0idnLKSF4wBCgbiYj+26JAsoR0FHgHmhpkVVZclJ5TMBZJFjFLtSoOYIo4oRSIZWkB\/rsTus8x2JERTADAWy1Ig5TimGCOm2BNnFHbTVTP+mAPs7YjyJGPq7XkCS4QYYOMiRLAWU9v2fz8TMDyRhIRiYpTlyP0H5NNxs+LZfNR4RokRACLycT3r1\/37wVwTnFe8\/kxQtUtbPTjkxFmgXee0QElSYRdYoBaZp2WFZVjtu4xYkxdhqyLEvyPH8EVqUsS7w64rZoZCuCc45isyWII5mOO+n741YwMz4XOZsyZzzM2kl\/2S75yg8Z7DbMZq9akwnBY8ttZ5fP1nS73bJcrghJ2AdTnFNGZ2e8\/3CDyGP7eB+YTS97oP6pxlUV592j9mMEp4jA2ekpIo1cD+BVXeOd63iEHpMEUNf1nvf9b1\/XKtZUviImQCbo0POBOf\/a\/fv59J8SVVVVO+lAlHOO29s7prNpsxAwDB88Xn2HqF5NP62XrDdrAC6nUwT4ufgvF4xwy0btts8\/y1LGo1Hbip0+PR6DkFG5GgEeFg34K5lwPh4zZ0FIEgTBnrHGlqjOtvfRiqJoiWjfRzgZnLUseecoipJ8V5INkk5de+w75zgZDhBVQggI4H1jgQ8PK4YnJ4zORg2ppbB4n3P1ddJhv1fTh91nSqtQERBQdfy8+Q+XyYTkwSE075t\/4cXFeav9Z9MH0Cjk99vmqN2n\/dvsa7xz3BZ3zeJGq50SdWr6NH0RQVRZrlaYgVNlMBzgQ8rp6Wnrs2mWHh9onfR72geoqhpV2R90EV+WlGlCqeD26irEuF69A+f4\/eSrvvMfb32321HvnT\/G2CpKVbm5uWE0GpFlWdtQwfvWYL5IVLH5DLFRlACiSrW8QV3gtgqdK5KIMJte4pz75eYvDeooZFlGPOxm9ptm8nyOihLt8EWelUDf+VVZr1bcrx9aR\/Lec\/lygnceBJy4Vq6NizmOcfyTkqIipGlKrGOb0mA4QFU5Px93FptZ9571JfZVlSQECAfba\/5jjHtl9cdh\/ReJ+n9HB\/TpwbcrKvIiMhgkxGg4bZTjezeEXwjQu6HUNbUdzG0f3eKR2eneoSOIw4l1WsrM+B+FtOglJDiiGQAAAABJRU5ErkJggg==\u0022 data-src=\u0022https:\/\/avris.it\/image\/stoslowia-new-home_big.png\u0022 alt=\u0022\u0022 class=\u0022border\u0022 width=\u0022960\u0022 height=\u00221605.5\u0022\u003E\u003C\/span\u003E\n                \n            \u003C\/figure\u003E\u003C\/p\u003E\n\u003Cfigure\u003E\n                \u003Cnoscript\u003E\n                    \u003Cimg src=\u0022https:\/\/avris.it\/image\/stoslowia-new-login_big.png\u0022 alt=\u0022\u0022 class=\u0022border\u0022 width=\u0022960\u0022 height=\u0022733\u0022\u003E                \n                \u003C\/noscript\u003E\n                \u003Cspan class=\u0022hide-noscript\u0022\u003E\u003Cimg src=\u0022data:image\/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAbCAYAAAAULC3gAAAACXBIWXMAAA7EAAAOxAGVKw4bAAAEjUlEQVRIic2WWW8cRRDHf9Xdc+3h9YHXCfHBJYXE4sXiOQgeonwAkADxQeCr8B14QjwhcclvHCJSwEQIWUkcXwmJZ+09Zne6m4ex12uzXu8iJKiH6eqZ7qp\/V\/2rayTLMu+9B+BkPC8igogAYK2lcdik2W4RhyFJHJN1uwB0sy5RFBKGAd57vIfNBw\/46tvvSNMD2u0OzjmCICROEkqlhCiKaLXaPNj8gziJMCcOvff98SJwIoLWmulalWqlRNo45PHeHnEYMjNdw2iNc448zzEmQMSz+OJVBE+n0yGOIkqVKuVyCWMMaZqy8es96vMv8NGHH3Dj+utIlmV9z8PAPH\/+nFKpRBRF7OzscP\/+farVKmmaUqvVyLKM6zdu8nh3j9Bori4s4L0nCAxaKfI85+69X\/j+x5+oVqtEUcTW1iN2t7d46aUV7ty+w8ryMlprnPPDAQ3qGxsbtNtt1tbWSNOU7Z0dvPdopRARer0ey8srWGc5PGqy++QpWinq83MkcUwpjmkcHvLl19+QHhzw6OEmb6ze5Natt1mo1xFReO+w1uG9L1I2mJITICJCq9XCOcfMzAzNZpMkSVhcXDyTRiUK5xxKhOmpKuVSQrPVZmt7F+cs9blZlq5dZSYW5hav8P5771Kbmupz0nmPd57c5vjLItRut1lfX2d1dZU4jtHGHIP0KCX90xXGBecc4LHWUa\/P02y1eLq\/R97LqJQrzM1fQQSUUmht0Lo4jPceay3dbu9yDp1syLKMIAjodDp4D9Vq5UykzhdF8c4hokjTBkdHDUrlCsYYojDEOY8HjNYoJcfFYE8BDePPeYej5oPvRATnLNZarHVY59h7sk8QhExPTdHpZCitKCel\/j6ljqPdarUKQMUX+oOczi8C4s8++mLzHs2jFBXEJHGCUqr\/rdPJyG2OUYZ21iEIAuI4wlqLAJLn+fDb8D8S8YX0WX9eb3WLG7ccK+QSY4N7D1oWD\/QsfJH+zOf7vyECn7zyFm\/WFof6EpEC0Ljom80mHnDWobQqUipSZEwAP3h1eOT4rkri+MIDn9fNUM8jw0BR8pwyR+SEWwWYSqU8NGrF2tG6mSBAbGwdsf30AOccURiBFM1Wa8Py4rXThY1uXy1HipVZPbaPiSL0e6PMfjcpJnkxTMWCy+HxZkbuIDtXI\/WKYmW2zLhyKakHL7s\/nz3jIG0QGMPy0tkWcpCmNNJGQScRlpcWx+bNoN7\/\/egjHKKfjEmSMDc7O\/RkcRxjtB5olhatx0\/ViUyUsjAILjakNXEUTQzgb3YmIbUbsfYyOxe1pvP6RBH67G6X\/cM2WgmlUDjKHN7Da\/MB77wqGGPOpPyfiJnEwNpSyFHmCY2gT9sT04kijtVQMCeNc1wZq8rGkU\/XD\/nhYUaghNAIPevpWs\/Lc4aPb9fGrrKJWsckMkmpnwHknPtfdfuRHOrmjk6v4Eyn54mD09E60Aqch1I4Pkcuk5ERarfbNDs5zVbOwlyCVwEOhXJdUKZo9q572mQBrwLwxc+WFwOuCyoABHFdwihCjyD5v0bqUXvH1fM85y\/9B+hVIrL\/rAAAAABJRU5ErkJggg==\u0022 data-src=\u0022https:\/\/avris.it\/image\/stoslowia-new-login_big.png\u0022 alt=\u0022\u0022 class=\u0022border\u0022 width=\u0022960\u0022 height=\u0022733\u0022\u003E\u003C\/span\u003E\n                \n            \u003C\/figure\u003E\u003C\/p\u003E\n\u003Cfigure\u003E\n                \u003Cnoscript\u003E\n                    \u003Cimg src=\u0022https:\/\/avris.it\/image\/stoslowia-new-add_big.png\u0022 alt=\u0022\u0022 class=\u0022border\u0022 width=\u0022960\u0022 height=\u0022713.5\u0022\u003E                \n                \u003C\/noscript\u003E\n                \u003Cspan class=\u0022hide-noscript\u0022\u003E\u003Cimg src=\u0022data:image\/png;base64,iVBORw0KGgoAAAANSUhEUgAAACQAAAAaCAYAAADfcP5FAAAACXBIWXMAAA7EAAAOxAGVKw4bAAAEQklEQVRIicWXXW9bRRCGn9k9Xz5OnDRtSFNahNSqohJQFFGJC6BXqD8CxB0X\/BB+EhJCtBR6hQRXKBSBaJWoSvOB2yS2j8\/X7nDh2HXa2E0CFSNZOzpnduY9M+\/MrqUoClVVAIbr8yIiiAgAzjn2uz16WUYcRaRJQlGWAJRFSRxHRFGIqqIKD9fXuHP3R\/b2dun3c9R7gjCi0WjQSBvEcUyWZaw9fEAjTQiGAVV1tE4CJyJYa5lvzTLbTNnvdNnY2iYKAxbOzBNYi\/eeunYEQYCIcnF5GREo8pwkSWjOzNBMU6wN2N19yoO\/\/mR5aYnPP\/uUt65eRYqiGEU+Cky73abZbJIkCZubm6yurtJqtdjd3WVubo6iKHj7nXd59HiTwBqWl5YACIMAaw11XfPr6m\/89PMvtFotoihkfX2N7a3HXLl8mVuf3OLSxYsYY\/BeDwM6CtT9+\/fp9\/usrKywt7fP9s423nsCGyBGqMqKC69fwDlHL+uzubMDCufOnWEmbZImCZ1ul29v3+HpkzYbG49YuX6dDz+6ydmFBYwxOO\/xzqHKZEAA3W6XtbU10jRlcXGRMIwoy2Jgd2Az+DKPeo8YQ13VZHnOxtYWRVGyuDDPm29c5O533xDEKe\/f+IBmsznipFfFO0dZVnj1R5dsqBdFwb1797h27RpxHBNFEVnWH2wUQcSgQx3BeQ8oznmWXluknxe029tknQ6tVouzi+cRARGDtZYgGHBOVfHeU5Tlyzk01IuiwFpLnucoMDszc2RWD2fbI2LodnvstLeZn1vAWkMcxQddqARBgDEyaoYRoKNATAs47ZmI4F1NVdc4Pwi8t7+P85652RZlUSJGaDQSjBhUFWMOOr3Xy3TIiOMAgQPrIwEN3jpXkXU7BHGDJE5GfAEoy4qqqgiMJa9KrLU0khjn\/OBjnHNHR\/2XogpOQYBCK7pu0AwLYUogZuK+wJjJL1WVrFQUaMYGmWj5zH6YjdopeaUEFr5u\/8EPTx4iwBeXbvBea\/kF+6Eu3vsTZUhV2d75m36\/TxxH1LVjdnaW+bnWSdxMlGD82JiEelyvPHz1PYS2QRhYuoXny48T4lSp3YBfItAIBSs8I+sx\/YtOYu6UDHWynDiOR8+MAM8VVABrDp+TxwJ00pK9ajHDq8Vxf6pKp9PFOTfV8fhMGq7H0k+ToaIoDpXsv5RTARqv\/UsDnJBDwXEdj4OZNrvG7U4jpyZ17mucepo2OlXgSXLsOTQU55Xbv\/dY7+9Riedqeg57MGs8jC5KxsDNK8mJ59DoTj2USfq47BfCnMwD8DTzJKEgAv2DY2awlzH95f5HnfZ\/zKFTk7qsPXmlxKGhXw4ykVdKEgrODyaxV0ijF0k+rTRTwU47OrIso5fXdLOa82cbYEIcButL1ASDS7kf\/CdTQBDUBKBuoIsFXyImRBHEl0RxTGDtdEAnId2r1Ou65h8cjuXlSrdDwgAAAABJRU5ErkJggg==\u0022 data-src=\u0022https:\/\/avris.it\/image\/stoslowia-new-add_big.png\u0022 alt=\u0022\u0022 class=\u0022border\u0022 width=\u0022960\u0022 height=\u0022713.5\u0022\u003E\u003C\/span\u003E\n                \n            \u003C\/figure\u003E\u003C\/p\u003E\u003Csvg xmlns=\u0022http:\/\/www.w3.org\/2000\/svg\u0022 style=\u0022display: none;\u0022\u003E\u003C\/svg\u003E","tags":["bootstrap","colour","design","redesign","refactoring","stos\u0142owia","webdevelopment","website"],"hasMore":true,"image":"https:\/\/avris.it\/image\/stoslowia-redesign_small.png","introLite":"\u003Cfigure\u003E\u003Ca href=\u0022https:\/\/avris.it\/image\/stoslowia-redesign_big.png\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Cimg src=\u0022https:\/\/avris.it\/image\/stoslowia-redesign_mini.png\u0022 alt=\u0022\u0022 width=\u0022240\u0022 height=\u0022149.6875\u0022 loading=\u0022lazy\u0022\u003E\u003C\/a\u003E\u003C\/figure\u003E\u003C\/p\u003E\n\u003Cp\u003EThere is a website I\u2019ve created many years ago, \u003Ca href=\u0022https:\/\/stoslowia.avris.it\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E Stos\u0142owia\u003C\/a\u003E (Polish only), which collects stories of up to a hundred words. It never got any users, but I didn\u2019t really care to promote it in any way either.\u003C\/p\u003E\n\u003Cp\u003ELast week I\u2019ve decided to rewrite it from scratch, because so many things were wrong about it \u2013 from an ancient backend in plain PHP with hardcoded credentials and no separation of concerns, to login with Facebook (and only Facebook) that stopped working... Now it\u2019s a fresh \u003Ca href=\u0022https:\/\/symfony.com\/\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E Symfony 4.1\u003C\/a\u003E with \u003Ca href=\u0022https:\/\/symfony.com\/doc\/current\/frontend\/encore\/installation.html\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E Encore\u003C\/a\u003E with some new features (like automatic screenshot generation, seen for instance on \u003Ca href=\u0022https:\/\/twitter.com\/Stoslowia\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E Twitter\u003C\/a\u003E).\u003C\/p\u003E\n\u003Cp\u003EBut what I\u2019d like to show you, is how a couple of pretty small design changes have made the whole website way nicer visually (IMHO).\u003C\/p\u003E","contentLite":"\u003Cfigure\u003E\u003Ca href=\u0022https:\/\/avris.it\/image\/stoslowia-redesign_big.png\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Cimg src=\u0022https:\/\/avris.it\/image\/stoslowia-redesign_mini.png\u0022 alt=\u0022\u0022 width=\u0022240\u0022 height=\u0022149.6875\u0022 loading=\u0022lazy\u0022\u003E\u003C\/a\u003E\u003C\/figure\u003E\u003C\/p\u003E\n\u003Cp\u003EThere is a website I\u2019ve created many years ago, \u003Ca href=\u0022https:\/\/stoslowia.avris.it\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E Stos\u0142owia\u003C\/a\u003E (Polish only), which collects stories of up to a hundred words. It never got any users, but I didn\u2019t really care to promote it in any way either.\u003C\/p\u003E\n\u003Cp\u003ELast week I\u2019ve decided to rewrite it from scratch, because so many things were wrong about it \u2013 from an ancient backend in plain PHP with hardcoded credentials and no separation of concerns, to login with Facebook (and only Facebook) that stopped working... Now it\u2019s a fresh \u003Ca href=\u0022https:\/\/symfony.com\/\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E Symfony 4.1\u003C\/a\u003E with \u003Ca href=\u0022https:\/\/symfony.com\/doc\/current\/frontend\/encore\/installation.html\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E Encore\u003C\/a\u003E with some new features (like automatic screenshot generation, seen for instance on \u003Ca href=\u0022https:\/\/twitter.com\/Stoslowia\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E Twitter\u003C\/a\u003E).\u003C\/p\u003E\n\u003Cp\u003EBut what I\u2019d like to show you, is how a couple of pretty small design changes have made the whole website way nicer visually (IMHO).\u003C\/p\u003E\n\u003Ch1\u003ELogo\u003C\/h1\u003E\n\u003Cp\u003ELet\u2019s start with the logo. The old one was the laziest option possible: just an icon of a pencil from \u003Ca href=\u0022https:\/\/fontawesome.com\/v4.7.0\/icons\/\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E Font Awesome v4\u003C\/a\u003E.\u003C\/p\u003E\n\u003Cfigure\u003E\u003Ca href=\u0022https:\/\/avris.it\/image\/stoslowia-old-logo_big.png\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Cimg src=\u0022https:\/\/avris.it\/image\/stoslowia-old-logo_mini.png\u0022 alt=\u0022\u0022 width=\u0022128\u0022 height=\u0022128\u0022 loading=\u0022lazy\u0022\u003E\u003C\/a\u003E\u003C\/figure\u003E\u003C\/p\u003E\n\u003Cp\u003EThe new one is a modification of free vector icons \u003Ca href=\u0022https:\/\/thenounproject.com\/iconka\/collection\/sketchy-icons\/\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E created by Denis Sazhin from the Noun Project\u003C\/a\u003E (CC-BY), that looks way more individual. Its elements form a \u201c100\u201d, which relates to the name and the purpose of the website.\u003C\/p\u003E\n\u003Cfigure\u003E\u003Ca href=\u0022https:\/\/avris.it\/image\/stoslowia-new-logo_big.png\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Cimg src=\u0022https:\/\/avris.it\/image\/stoslowia-new-logo_mini.png\u0022 alt=\u0022\u0022 width=\u0022128\u0022 height=\u0022128\u0022 loading=\u0022lazy\u0022\u003E\u003C\/a\u003E\u003C\/figure\u003E\u003C\/p\u003E\n\u003Ch1\u003EOld design\u003C\/h1\u003E\n\u003Cfigure\u003E\u003Ca href=\u0022https:\/\/avris.it\/image\/stoslowia-old-home_big.png\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Cimg src=\u0022https:\/\/avris.it\/image\/stoslowia-old-home_mini.png\u0022 alt=\u0022\u0022 width=\u0022240\u0022 height=\u0022299.375\u0022 loading=\u0022lazy\u0022\u003E\u003C\/a\u003E\u003C\/figure\u003E\u003C\/p\u003E\n\u003Cfigure\u003E\u003Ca href=\u0022https:\/\/avris.it\/image\/stoslowia-old-add_big.png\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Cimg src=\u0022https:\/\/avris.it\/image\/stoslowia-old-add_mini.png\u0022 alt=\u0022\u0022 width=\u0022240\u0022 height=\u0022110.625\u0022 loading=\u0022lazy\u0022\u003E\u003C\/a\u003E\u003C\/figure\u003E\u003C\/p\u003E\n\u003Cp\u003EMaybe I shouldn\u2019t judge the design, if it\u2019s me who created the website, but since it\u2019s mostly a \u003Ca href=\u0022https:\/\/bootswatch.com\/\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E Bootswatch\u003C\/a\u003E theme anyway, I\u2019ll dare to say: it\u2019s not bad. I like it. It\u2019s clean and minimalist.\u003C\/p\u003E\n\u003Cp\u003EWhat I don\u2019t like is my own choices: like the jumbotron with random background images, which made the text not-so-readable, even with the addition of a text shadow, or the lack of a footer, which makes the website look somehow... \u003Cem\u003Eincomplete\u003C\/em\u003E...\u003C\/p\u003E\n\u003Cp\u003ESo what I did to polish it up:\u003C\/p\u003E\n\u003Cul\u003E\n\u003Cli\u003EI rebuilt it in \u003Ca href=\u0022https:\/\/getbootstrap.com\/\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E Bootstrap 4\u003C\/a\u003E using a different \u003Ca href=\u0022https:\/\/bootswatch.com\/\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E Bootswatch\u003C\/a\u003E theme (slightly modified).\u003C\/li\u003E\n\u003Cli\u003EI switched the \u003Ca href=\u0022https:\/\/fontawesome.com\/\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E Font Awesome\u003C\/a\u003E icons to version 5, the light version.\u003C\/li\u003E\n\u003Cli\u003EI switched the font to something more distinctive.\u003C\/li\u003E\n\u003Cli\u003EMade the jumbotron bigger, with a non-random background image that matches the subject matter and is subdued, so that the text is better visible.\u003C\/li\u003E\n\u003Cli\u003EEven though the random jumbotrons in the old website were meant to add some colour to an otherwise dull website, it still looked pretty monotonous. That\u2019s why I decided to assign colours to the categories and display them as small bars on top of the story-card.\u003C\/li\u003E\n\u003Cli\u003EAlso to break the monotony, I decided to align the cards in a \u003Ca href=\u0022https:\/\/masonry.desandro.com\/\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E Masonry\u003C\/a\u003E manner, instead of just rows.\u003C\/li\u003E\n\u003Cli\u003EWithin the card, I separated the important info (title, author, category) on the top, from the less important (number of words, date of submission, comments, votes and social buttons) on the bottom.\u003C\/li\u003E\n\u003Cli\u003ECategories are pretty important, yet in the old design they weren\u2019t emphasised at all. With the addition of colours they are way more visible, yet to make them even more distinctive and useful, I added icons and a list of all categories on the top.\u003C\/li\u003E\n\u003Cli\u003EI added a footer.\u003C\/li\u003E\n\u003Cli\u003EI reorganised the submission form so that it has a simple up-to-down flow, instead of the previous two columns that made it easy to overlook some fields.\u003C\/li\u003E\n\u003C\/ul\u003E\n\u003Cp\u003ECheck out the end effect below. What do you think? \ud83d\ude09\u003C\/p\u003E\n\u003Ch1\u003ENew design\u003C\/h1\u003E\n\u003Cfigure\u003E\u003Ca href=\u0022https:\/\/avris.it\/image\/stoslowia-new-home_big.png\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Cimg src=\u0022https:\/\/avris.it\/image\/stoslowia-new-home_mini.png\u0022 alt=\u0022\u0022 width=\u0022240\u0022 height=\u0022401.375\u0022 loading=\u0022lazy\u0022\u003E\u003C\/a\u003E\u003C\/figure\u003E\u003C\/p\u003E\n\u003Cfigure\u003E\u003Ca href=\u0022https:\/\/avris.it\/image\/stoslowia-new-login_big.png\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Cimg src=\u0022https:\/\/avris.it\/image\/stoslowia-new-login_mini.png\u0022 alt=\u0022\u0022 width=\u0022240\u0022 height=\u0022183.25\u0022 loading=\u0022lazy\u0022\u003E\u003C\/a\u003E\u003C\/figure\u003E\u003C\/p\u003E\n\u003Cfigure\u003E\u003Ca href=\u0022https:\/\/avris.it\/image\/stoslowia-new-add_big.png\u0022 target=\u0022_blank\u0022 rel=\u0022noopener\u0022\u003E\u003Cimg src=\u0022https:\/\/avris.it\/image\/stoslowia-new-add_mini.png\u0022 alt=\u0022\u0022 width=\u0022240\u0022 height=\u0022178.375\u0022 loading=\u0022lazy\u0022\u003E\u003C\/a\u003E\u003C\/figure\u003E\u003C\/p\u003E","words":530,"readTime":3,"lang":"en"}}}}}