Continuing from where I left off (and some of you guys are already ahead of me, maybe seeing what I'm about to put in here next) leads me into the introduction of CSS3 Buttons. The CSS3 Button has the text over the button, and it is not an image. The text on this button can be searched for, and the button can be modified, and scaled to your desires based on the generator. I just did a quick Google search for a few CSS3 Button generators, and I came up with quite a few results. You can use these generators to generate the raw code for these unique, yet powerful buttons to help reduce the strain of bandwidth to the users accessing your website, and to boost your website in a search engine's results.
Here is what you do: You locate one of these websites by performing a simple search. From there, you can design the button. You can alter the text, give it a shadow, make it glassy, make the button larger, etc. These tools make it incredibly easy to design some very high speed buttons to give your website the flashy, and upbeat appearance that you'll want.
After you design your button, you will be given two different segments of code. One will be for adding the object of a button to your webpage in the form of HTML source, the other will be the styling for the button. You can put the styling either in a main.css file, or in the specific page itself. What's great about the styles is if you have a list of buttons, you can use the same styling code and apply it to all of the buttons. These websites are very straight forward, and very easy to use for the average (or even newbie) web-developer.
Stay tuned for part 3, when I introduce the Color Scheme Designer.
Random tidbits of information regarding Computers, the Internet, and Web Development. Follow me as I study Computer Science, and develop websites, posting relevant, and unique information.
Showing posts with label css. Show all posts
Showing posts with label css. Show all posts
Thursday, January 5, 2012
Tuesday, January 3, 2012
Putting Two and Two Together (part 1)
Hey, guys. I'd just like to give you all a brief tutorial on making some awesome buttons for your website, but first, lets go over a little bit of background.
Here are a few things to keep in mind when doing this:
1) Keep images to a minimum.
2) Use text on your website.
3) Avoid image maps.
Keeping images to a minimum helps clean up your website, giving it a more tidy appearance. Using CSS buttons instead of images actually helps load time. If you go into paint to make a button, a small JPEG file needs to be rendered on the screen, where you could have one line of code to say "background: #000;" instead. When you break down the load time of your website, you want it to run as efficiently as possible. I've been in locations trying to look for things on my phone, and the 3G sucked. It took forever for certain websites to load up, so you'll have to keep in mind that not everyone is running on high speed.
Using text on your website optimizes it for search engines. If you have a really cool image instead of a cool CSS button, then chances are it won't be found as often. It's better to have both. The image for its appeal, and the text and tags for it to be found by search engines.
Image maps are great, but they're getting outdated... An image map allows you to take one image, and partition it, or split it into separate links. This is a great shortcut. Instead of using two separate images, you can use one... But will that really optimize your website? Image maps aren't the best for search engines either. There are some times where you must use an image map, but if you can go without it, try to.
Stay tuned for part two!
Here are a few things to keep in mind when doing this:
1) Keep images to a minimum.
2) Use text on your website.
3) Avoid image maps.
Keeping images to a minimum helps clean up your website, giving it a more tidy appearance. Using CSS buttons instead of images actually helps load time. If you go into paint to make a button, a small JPEG file needs to be rendered on the screen, where you could have one line of code to say "background: #000;" instead. When you break down the load time of your website, you want it to run as efficiently as possible. I've been in locations trying to look for things on my phone, and the 3G sucked. It took forever for certain websites to load up, so you'll have to keep in mind that not everyone is running on high speed.
Using text on your website optimizes it for search engines. If you have a really cool image instead of a cool CSS button, then chances are it won't be found as often. It's better to have both. The image for its appeal, and the text and tags for it to be found by search engines.
Image maps are great, but they're getting outdated... An image map allows you to take one image, and partition it, or split it into separate links. This is a great shortcut. Instead of using two separate images, you can use one... But will that really optimize your website? Image maps aren't the best for search engines either. There are some times where you must use an image map, but if you can go without it, try to.
Stay tuned for part two!
Friday, December 30, 2011
Brush Up On Your Coding
Been a while since you've touched Java or Python? You should check out codingbat.com It has a ton of different methods for you to write for fun, and you're able to test them within the website itself. It's a great resource for you to bring your coding skills back up to speed!
What about CSS, HTML, PHP, and other web development languages? w3schools.com has a similar way for you to be able to brush up on these skills! It also has in depth training tools, and is a worthy knowledge base for any web developer seeking information on how to code very basic actions in web development.
Where's the codingbat for C? Since C is a much more volatile language to code with, they don't have anything like this for C. If they did, the dynamics of the C language are so diverse, that you would be able to manipulate the website with easy injection. Websites would crumble from anyone with experience who is intentionally trying to destroy the site.
If you'd like to brush up on your C, there are plenty of other free materials on the web, like cprogramming.com for you to be able to hone your skills. In order for you to test to see if your code is working in C, you would have to code locally, on your own PC -- not over the internet.
What about CSS, HTML, PHP, and other web development languages? w3schools.com has a similar way for you to be able to brush up on these skills! It also has in depth training tools, and is a worthy knowledge base for any web developer seeking information on how to code very basic actions in web development.
Where's the codingbat for C? Since C is a much more volatile language to code with, they don't have anything like this for C. If they did, the dynamics of the C language are so diverse, that you would be able to manipulate the website with easy injection. Websites would crumble from anyone with experience who is intentionally trying to destroy the site.
If you'd like to brush up on your C, there are plenty of other free materials on the web, like cprogramming.com for you to be able to hone your skills. In order for you to test to see if your code is working in C, you would have to code locally, on your own PC -- not over the internet.
Subscribe to:
Posts (Atom)


