While I may be attending a $40,000 a year school, it doesn’t take a piece of paper to build on your Web Development skills— it just takes an interest in creating fun web design.
Fun Web Design? Huh? What? Why?
If you’re like me, coding, debugging, programming, and other aspects of web development really get your jets going. FrillyWeb is constant updates—on our site and through e-mail!– on ways to make it fun for beginners, professionals, students, and the site users.
What’s FrillyWeb Got to Do With It?
Since I’m on my first semester of Junior Year and only recently chose a major I have been latched on to my professors’ every word and mentally note every tip and piece of advice. Every new thing I learn has me delving further and further into the latest technologies of web development—learning fun web design is just apart of the journey but it’s my favorite pit stop along the way.
Interested in Fun Web Design? Then subscribing to our e-mail list will keep you updated for free on all the ways FrillyWeb is helping keep the fun alive!
How will this help?
As a web designer it’s partially our responsibility to make sure users enjoy their experience on a web site and sometimes that can be hard to do when there is a site structured entirely around text content. Although the typeface chosen is the utmost importance for text, there has to be other ways to work with the content to improve the user likability and encourage them to continue reading. This Creative CSS trick helped me with a website for an RWU criminal justice professor, he had a lot of published research done and adding this really boosted the look of the page.
What does the faded bottom text do?
It’s a cool effect where the bottom of the page seems to fade out. The technique makes use of a fixed position div (bottom: 0px;) with a transparent PNG image and a high z-index value. The example on the left should give you a good idea of how it’ll look.
So How Do You Use it? (Beginners)
This creative CSS trick needs to be put in your style section of the page you want it to appear on or a separate style sheet that you attach. The CSS code contains adjustments to selectors and also div id’s that you put around your text in the code. You can change the text to what you want but if you don’t know what you’re doing I wouldn’t mess around with any of the other parts of the CSS. The code is the top right picture. Now for the CSS to be applied to the text your text must be inside a div “<div id=”page_wrap”></div>.” At the end of the text inside the page_wrap div put <div id=”bottom_fade”></div> and then close the page wrap div. Make sure you use the exact same ID’s as the ones in the CSS, adding capitals or spaces will make it not work.
If you like this code subscribe to our e-mail list and receive updates for when FrillyWeb posts more! Tell us about how you used it in the comments to inspire other readers and share the post to friends so they can learn this creative CSS trick and more.
Just like a writer having writer’s block, web designers can also experience a shortage of ideas and with millions of sites out there unique web designs are crucial when it comes to make a client’s page stand-out. Just like art, web designers need some inspiration to create the page that will grab attention and keep users happy. If you watched the video above, and it sounds a lot like you, FrillyWeb found a couple of articles that’ll help inspire you by making the job a little more fun.
John Siebert’s article, which particularly helped me, outlines a 7-step process to creating a web page. Each step ends with a tip to make the step more fun. To read more click here.
Jeremy Girad’s article, “A Fun Approach to Creating a More Successful Website,” promotes unique web design through improving the ordinary. His ideas came to him after watching a contest video for The Fun Theory. The Fun Theory was a competition in which people created videos that make everyday things more fun. So elements most web pages have, such as about me, contact pages, or 404 error pages are examples of pages that can be improved in fun ways for a better user experience. To read his article click here. (Check out this post if you’re looking to improve upon an about me page with a lot of text.)
The last article I found is by Debra Gelman called “Designing Fun.” Her article shares how to develop a long-term approach to incorporating fun into unique web designs. Her steps are: define it, rank it, research it, task it out, and test it. Read more about these steps here.
These articles were pretty helpful, right? Subscribe to our e-mail list on our Free Updates Page and receive updates when FrillyWeb has new posts that could also contain helpful articles. Also, comment your ideas on how incorporating fun helps create unique web designs and share our posts and help spread the importance of fun.
For a limited time only FrillyWeb e-mail subscribers have the opportunity to sign up for a tutorial class for fun HTML codes. Entirely online, I’ll demonstrate for an hour twice a week how to make use of hundreds of fun HTML codes through a program that allows viewers to see my desktop as I work and ask questions for codes that are giving them problems.
One lucky subscriber will win a 6-month membership to a web host and a domain name of their choosing. So make sure you subscribe to our e-mail list so you can sign up for the tutorial classes and a chance to win! Comment what want to see in the tutorials and share this post so your friends can have an opportunity for a FREE class in fun HTML codes.