Archive for the ‘Web Design’ Category
07/02/10 by admin | HTML Tips, Just for Fun!, Recent Posts, Web Design Resources | No Comments »
45 iPhone Applications for Web Designers and Developers
I’m was sitting here tonight just trying to ignore the heat and came across a really cool post for iPhone apps. Even if you’re new to this whole thing (design), you still might find some of these very handy.
There are a few quick reference guides for CSS, HTML and PHP which could prove to be invaluable, especially if you are new or have been away from the “code” side for any length of time.
There’s stuff for organizing and making lists, financial apps and so much more…I think I’ll sit out in the cooler (not really cool) night air and play with my new toys:)
Enjoy Read more →
03/08/09 by admin | Recent Posts, Web Design | No Comments »
20 +ways
Blog
TO PLAY IN YOUR
The joy of CSS. Here we are using font sizes, margins, floats, and line height to position the text exactly where we want it.
…if you want to
spice up your webpage or blog,
then using these little
CSS code snippets will do the trick…
Looking for ways to spice up your blog posts? Even if you are new to blogging, you can use these little CSS techniques to give your page some variety and attract the attention of your reader.
Mandarin Design has a ton of code snippets you can grab and paste directly into your post quickly and easily.
Here are just a few of the examples they share:
1. Text Overlays using CSS
2. Centered Border Box
3. CSS Magazine Style Pullquotes
4. Opacity Blending Effects
5. CSS Background Images
6. Overlay Text on an Image
Not to mention the two I’ve included here. The top is an example of a magazine style header, while the pullquote on the right side would be perfect for adding testimonials or even emphasizing your topic to get your reader interested.
And this is all done by using inline CSS styles! Visit Mandarin Design to see all of the examples and then try a few in your next post.
01/21/09 by admin | Recent Posts, Web Design | 7 Comments »
Just recently a very interesting thing happen to a friend of mine. I’m not going to mention any names but the story is one that everyone and anyone looking to get their business, hobby or group site online should hear.
Most people will depend on their web designers to tell them what they need and will trust them when they suggest what is needed and to provide the best possible price. So if a designer says you need this, this and this to get your site up and running, you believe them. You don’t know any different.
In this case, the designer took advantage of this lack of knowledge to make more money.
To start this off, let’s say we are talking about a community of friends who use a specific application to get together and hang out. This “application” is one they pay for every month.
Now, when they started they hired a web designer to help them put the whole site together. They were told they would need to pay $30 each month for hosting on top of their monthly “application” charge as well as a certain amount for any updates they wanted made to their site. But first, of course, they had to pay to have the site developed.
Fine, they agreed and had their site created using a content management system with the application data built into the site. All they had to do was log in as members to use the site with their friends. Any updates or maintenance were taken care of by their designer.
In essence they were held captive. They had absolutely no control over the their own site. They didn’t know anything about their own ability to update and maintain their site using the cms administration panel and they had no idea where or how to access their site files. For a long while, they were ok with that because they trusted their designer and well, they didn’t know any better.
Anyway, my friend came to me a few months back and asked me what they should do. They needed the site updated and couldn’t get their designer to do it. In a sense they were lost because they didn’t know anything about their own site other than how to access it as regular members. So, I told them to ask for the proper access to both the administrative side of the CMS and the control panel where their files were. After some time they were given access to the CMS admin with only limited abilities. Their designer would not give them any further control. It was like pulling teeth to gain control of their own site!
Then, just recently he came to me again and said, they didn’t know what to do. They still couldn’t get the guy to update the site, they didn’t know how themselves even with the access and they wanted him out.
So I stepped in. Now you have to understand that I was going by the information my friend gave me and he did not understand the concept of hosting vs the CMS admin, nor about the site files vs the application they were using. I was walking in blind. Initially I told him he would have to change the hosting and re-create the site because we didn’t have any access to the original files. From what he was saying, I thought their hosting was on a completely different server with the application files being embedded into their existing pages.
Based on the information provided, I began the process of examining the set up of their site so I could re-create it on my own servers for them. Then it hit me! I immediately contacted the host of the application they were using to ask if they also provided regular hosting. The reply, yes and it was included in the monthly application cost! Hmmm, so what was the $30 hosting charge for?
Anyway, I figured this was great news. This would save them the monthly hosting fee they were paying their designer! I would simply set up their site using the hosting they were already paying for each month. Great news, right?
Wrong, because after gaining access to the control panel I realized that all of their site files were already there. It turns out, they were paying for the application each month PLUS an additional hosting charge to their designer to host their site files! I was outraged, what a scam.
So I talked to my friend and explained what was happening, needless to say he was angry. They had been severely taken advantage of without knowing it. He gave me the go ahead to re-gain control and lock their designer out. As for the CMS admin, we still didn’t have top control and the guy was not going to give us the passwords. So, with access to the database, I managed to change things around, lock the guy out and grant top administration access to my friend and his partner.
Now, I need to spend a little time showing them how to actually use and update the site. Being a content management system, it will be easy for them once they understand. They are now saving $30 each month from hosting and any addition charges for updates and maintenance.
The moral of this story…beware! Your designer should be willing to give you complete access to your entire site. Do some investigative work to make sure you understand the entire process from getting the domain name to hosting to the platform your site is designed in. Even if you would prefer to pay someone to maintain your site, you should always be the one in charge of every bit of that site.
If there is any part of the process you don’t understand, you designer should be more than willing to explain it all in detail. You could also confirm what you are being told by either searching online or asking other professionals in one of the millions of web design forums online.
Bottom line, don’t go into your project blind. A little research now could save you tons of money.
Have you or someone you know had a similar experience? Share it with us by leaving a comment to help others avoid similar scams.
12/29/08 by admin | Web Design | No Comments »
Again, my friend Kyle Reddoch brings us another great web design tip. This is actually a 3 part series, but I’m going to include them all in this post for your convenience.
HTML TITLE tag – understanding web page titles
Many web developers ignore the importance of the <title> tag. Though, according to HTML specifications, the use of <title> is mandatory, I have come across many pages on the Internet in which this tag is just not used.
<title> provides us with an opportunity to spell out the content of our pages. It is also used by search engines to index pages. On search sites such as Hotbot, Altavista etc. the title of the web page is displayed as the link.
This tip will show you how to write titles better, or rather, in a more logical manner. I have adopted this style and it has helped me in maintaining my web sites and in search engine optimization.
Decide on the keywords for the page and then build the title tag around them. Make sure you have all the keywords / key phrases in the title tag.
Contents of the HTML title tag
I have always believed that <title> tags should contain the important keywords and key phrases. This helps the web page to rank higher in search engines. I usually follow the keywords with the web site structure. I first put the the description of the present page (so that all keywords are contained in this description). Be sure that all the keywords and key phrases are included in the <title> tag.
You can use commas or hyphens to separate the key phrases in the <title> tag.
You must remember not to use colons or the forward slash (/) in the<title> tag. When you save a web page using the “Save As” option from the browsers “File” menu, the contents of the <title>are used as the file name. Since colons are not allowed within filenames on a Macintosh system and slashes are used to represent directories, it’s best to avoid them. Hyphens and commas, thus, seem as the best good choice.
Importance of TITLE Tag in Search Engine Optimization
The TITLE of a web page is displayed on the title bar of the browser. The title text is placed between the <TITLE> - </TITLE> tags inside the HTML head section.
There are a few important reasons why you should choose an intelligent title for a web page
* Many search engines display the results using the content of the TITLE tag.
* If the title is missing, such search engines will display the page as “Untitled”. This is not only ugly but also very unprofessional.
* The contents of the TITLE tag are used by search engines to index the page.
* It’s recommended that you write down all the important keywords that describe the web page contents and compose a sentence that should be used as the title of the page.
I hope this gives you a better understanding of the title tag and why you should ensure your web pages includes it. If you have comments or questions regarding web page title tags, leave us a comment below.
12/28/08 by admin | Web Design | No Comments »
Here’s another tip from my friend Kyle Reddoch on the importance of headings and how best to use them for SEO purposes…
Headings form a part of the logical structure of an HTML document. There are six heading tags <h1> to <h6> each having its ending tag.
To get better ranking in search engines, make sure that the web page headings contain all (or the most important) keywords and key phrases. If the same keywords and key phrases are repeated in the paragraph following the heading, the page will certainly get a boost in ranking.
You should NEVER use headings to increase the size of text. You have at your disposal the <font>tag, and the <small>, <big> tags for that purpose. Furthermore, you can gain a better control over font size and other text properties using Cascading Style Sheets.
Since headings provide a logical structure to the document, another important thing to remember is NEVER to use smaller level headings before the higher. Thus, <h4> should not be used before <h2> (though, HTML does not enforce this).
If you found this tip on web page headings using HTML tags helpful, please let us know by posting below.
12/19/08 by admin | Web Design | No Comments »
Kyle has once again brought us a great tip, this time he shows us how to assigned different colors to our links using stylesheets.
Changing the properties of links on a web page
The color of link on a web page is set using the link attribute of the
tag. The default color is blue (#0000FF). That is, if you don’t supply a color value (or color name) to the link attribute, the browser makes all the links on the web page blue in color. Specifying another value, say green, to the link attribute will turn all links in the document into green color.
Two different colors for links
Only one color can be set through the link attribute. With Style Sheets, you can have links of different colors and styles in the same document.
Styles sheets can be applied to documents in three different ways. In this article, I’ll cover two ways to embed style information on a web page.
Continue Reading on Kyle`s Blog
12/03/08 by admin | Recent Posts, Web Design | 10 Comments »
A CSS or “Cascading Style Sheet” file allows you to separate your websites content from it’s style or appearance. While you would create the layout of your websites content using your (X)HTML file, the CSS stylesheet would control the way in which that content appears (fonts, colours, borders, backgrounds, margins, etc.).
There are 3 methods you can use to implement the css into your design, but which one is better is dependant on what you are doing, or where you are using it.
Let’s first see what each one involves, then we can decided on the ultimate CSS method for
your project.
We aren’t going to go into details on the styles themselves, rather we’ll just go over the three methods in general.
Internal Stylesheets
This method places the CSS code itself inside the tags of your page. With this method each page is separate, therefore, the code must be placed inside each page in order for the styles to work their magic on every page of your website.
Example:
<!--
p { font-family: Verdana, Arial, Helvetica, sans-serif; font-size: 12px; color: #000000;
h1 { font-family: Arial, Helvetica, sans-serif; font-size: 14px; color: #000099; }
-->
I’m sure you can imagine how tedious it would be to update every page of your website one-by-one, so let’s examine this option…
External Stylesheets
The external stylesheet is a file all on it’s own that can be created using something as simple as notepad. This file contains no html code. When you save it, give it the .css extension and you have yourself an external stylesheet.
The styles would be the same as those listed about, but with the external stylesheet, you would link to it from within your “head” tags.
Example:
You would then place this code in your html document as shown below:
Using this method would give you far more flexibilty and of course save you time. By simply updating your external stylesheet, every page on your site would be updated at once, rather than using the internal stylesheet where you would have to update and change each individual page.
And finally, the Inline Styles
I don’t use this too often, but I do find it handy when I’m putting together a quick blog post or adding adsense to a page or even on websites where I am posting but don’t have any control over the css files.
An example would be one I explained in my article “How to Wrap Text Around an Image“.
Then type your text here.
This code is an example of using inline css to wrap your text around an image or ad. You could add the style to your internal or external css, but if you are working on the fly, or simply can’t, this is one solution you could use.
So again, which one is better?
- If you are creating a multi-paged website, an external css file would be the better choice. It would save you time and make updating your pages almost an instant process.
- If you are creating a single page, you could use an internal stylesheet simply because you only have to update the one page.
- And if you are working on content to be placed somewhere that you don’t have access to css or just want a quick style change, inline will do.
Some would say using the external method is the best choice and I would tend to agree. But there are situations where you could use either the internal or the inline stylesheets as I mentioned above.
Consider the project you are working on, then decide which option you feel would be your best option.
