You can pull off this technique with either CSS or with creating a graphic. Either way is fine, but using the CSS method definitely allows for less load time.
Transparency in Web Design
Example of transparency in CSS and graphics:
We have a site with a dark background image and want to insert an area at 50% like the following setup:
background: #000 url(images/somedarkimage.png) center no-repeat;
This is using one method in CSS with alpha channels. You can also do this with the CSS opacity property.
background: #000 url(images/somedarkimage.png) center no-repeat;
If I were to just use that image above for a graphic, the area in white that you can see through is what is called transparency. My example is simple and not to be tasteful, but to just to explain.
You can use any color when putting together a transparency, but making it more effective to attract a visitor requires some experimenting.
More Examples of Transparency in Web Design Dos3>
These are just small screenshots. The first is from my Twitter handle – @blondishnet. As you can see, the content wrap around is transparency. The second is from my front page of Blondish.net.
Transparency in Web Design Dos3>
Do experiment with colors and how much or little transparency.
This will help you become more familiar with what works best together.
Do use transparency to make text pop.
When text shadows, font color, and font size are not enough from keeping the text from drowning into the background image, transparent ares can help. Transparency is not always effective in helping readability.
Do use your best judgement on how opaque your transparency will be.
You might use a very thick layer, or a very see through one, but do what is best to enhance the graphic that the transparent area is over.
Definitely use transparency in backgrounds.
Sometimes you can have a textured pattern with a cool fixed transparent overlay, or a photo.
Transparency in Web Design Don’ts3>
Don’t cover the cool parts of the image.
The transparency is there to allow people to appreciate what is underneath the area.
Transparency is not also the answer to make your text pop.
Sometimes you may have to do something different than using transparency in web design. Usually images with sharp contrast are not a good fit.
Don’t overuse or create too many transparency effects.
Overusing or creating too many effects can detract from the design. Try it in moderation.
Understanding How to Use Transparency in Web Design
Transparency can be used to create an entirely unique and functional site. It’s important to keep the tips mentioned in this article, especially with experimenting with transparency. If you’re not sure if it looks right, find someone that has a keen eye for design to check it out.
Do you use transparency in your website’s design? What tips on transparency in web design do you have?
This past #FanPageFriday, I saw more than 7 people come by and just share their own fan page, rather than follow the directions of the event. It was a little disappointing as that means their links aren’t in this recap post and they were set as hidden. This is fair because I’ve been holding this event for years and its not that hard to take an extra 20 seconds to share a fan page that you recommend.
In order to participate in #FanPageFriday, you have to like my Facebook fan page and then do two things which don’t take much time at all.
- Share a Facebook fan page from a person or company you recommend.
- Share your own Facebook fan page
#FanPageFriday Recap 2013 Volume 20
We create bespoke Websites, Apps, eCommerce and Social platforms for discerning clients all over the UK and further afield.
Professional British female voiceover artist with many years of experience. Also has a home recording studio. You can hear this voiceover voice all over the place! Clients include Virgin Media, Toshiba, BMW, Vauxhall, Toni and Guy and many more.
Going Beyond Natural Health, Nutrition, Homeopathy and Primal Living for Families to Restore Health and Balance!
The official fan page of Mark Sisson.
Too many entrepreneurs are stressed out, working too hard and for too little money. It doesn’t have to be that way for you. Let me show you how.
Creating Calm Network is a multi-media approach to inspiration. Here you will find programming for a better world… a brighter future & a sustainable planet
Diamond Website Conversion helps small businesses convert more of their website traffic to leads or customers.
Social Media Technology Specialist
A big thank you goes out to everyone who dropped by and participated #SharingSundays!
This awards program recognizes people and companies who have helped others with their small businesses. Winners consist of people who have been voted for by popular vote and by the award organization’s judges. Those who do win are recognized in a ceremony.
Because I’ve been nominated, that means I am asking for my readers to please stop by and give me a vote at the Small Business Influencer Awards.
Voting is simple.
- Visit my vote page at Small Business Influencer Awards
- Find the yellow button with the word “VOTE”
- Click and it will change to voted.
- If you would like to vote once a day and receive reminders, they offer that option too.
As the last step said, you can vote more than one time, but it can be only once a day.
If I have been helpful, and you support my work, please also share this post with others on the social networks or your lists. I can use all the help possible as I was made aware of this a little bit late into the nominations.
Thank you so much! If you do vote, please leave a comment so I can come by and leave a comment and share one of your articles on your site in return.
In fact, this would be the time to let me know if you have a site that talks about WordPress. Please note that not all sites submitted to me make my cut. Once I officially unveil the site, I will all for people to submit their feed URL there.
Even though I will have that site in place, I will not stop on my #WordPressWednesday series. I am happy to pick a small piece of the community and share it in a recap post for you.
#WordPressWednesday 2013 Volume 7
WPBeginner shares a method of to be able to create a Hot Or Not type site with a WordPress plugin.
Reginald gives some tips on WordPress plugins to use to become a better blogger at WPKube.
Erick Danzer publishes an open letter to his NextGEN plugin community. He explains why think has been a bit rocky with the most recent update of NextGEN gallery.
Cory Miller gives some advice for people who want to make a career in developing.
Sufyan bin Uzayr goes about explaining in depth about GPL at Torque Magazine, the same copyleft licensing that WordPress uses.
Mike Jolley explains the importance to make sure to develop secure plugins, no matter who they are for.
For WordPress Developers, might want to step on in during August 15, 2013 to share your ideas for WordPress 3.8 features.
Andrew Nacin explains the organizing behind WordPress 3.7.
WordPress Community News
Jeff Chandler asks in an interview with David Peralty on what he is doing now.
Devesh Sharma covers the pros and cons of managed WordPress hosting at WPKube.
See you next Wednesday for #WordPressWedneday!
Downtime can be caused by any of the following:
- The server is simply down or the network it is on is down.
- Improper configuration of your web host’s server.
- Improper configuration of your domain’s nameservers.
- If you are using any type of script like PHP, you may have an error or the script may have stop functioning.
- Denial of Service Attacks (DDOS)
- You are using too many data resources allotted to your web host account. This is most common in shared clients, reseller hosting, and VPS hosting.
Again, these are just a few examples. It is not always the web host’s fault if you are down. If you are a shared client with your web host, you are only given so many data resources that can be called on. If you are using a content management system much like WordPress, every time a person visits a page, fills out a form, or comments, using some other function that is made possible by a plugin that saves its data to the database, then your visitors are triggering those data resources.
Not all web hosts are up front about their limited data resources and often you will be sold packages that are beyond the specs for the data resources allotted.
Why Monitoring Your Website Uptime Is Necessary
Extensive downtime is noticeable to your site’s visitors. They may become impatient and never come back again. You might lose subscribers. You might lose advertisers. If you are a website owner focused on rank and numbers, those will go down and its not always easy to gain that rank or those numbers back quickly.
The biggest thing with website owners is losing their return on investment (ROI.) If your site is not up, your product or service is not available to be seen. In the case of busy sites that have regular or many new customers, this is a definite loss of money. And that is bad!
How to Monitor Your Website’s Uptime
As for monitoring your website’s uptime, you will need to keep an eye on that. Sometimes you can sign up for free services like Pingdom’s DNS check tool and they will monitor it for you. When your site is down, they can alert you via email or by text to your cell phone. Again, it is free to sign up and use.
As said earlier, your website can be down for both user reasons, or the server’s health. If you are noticing extensive downtime, let your web host know immediately. If you are using their support, don’t submit a regular ticket, use their live chat support instead for faster help. You are a customer and your web host has offered that type of support as an option, so use it. It’s not a bother for them as the support is paid to help you. AND if you’re not satisfied with your first support contact’s answers, ask them to escalate your issue to someone more knowledgeable.
If your web host is saying that you are using more data resources than allowed for your account, it may be necessary to find a bigger plan or a different host to accommodate you. Don’t be afraid to ask about your web hosting account’s data resource limitations. Yes, it may be frustrating, but its happens with a growing website… however, if you don’t know, its really your fault in the end for not asking.
Do you monitor your website’s uptime? What tools do you use?