In this blog I am going to talk about the different tools and techniques used to produce my website and I am going to describe what each tool does.
HTML
HTML (Hyper Text Markup Language) is a language for describing web pages. HTML is a markup language. Markup languages are designed for the processing, definition and presentation of text. The language specifies code for formatting, both the layout and style, within a text file. A markup language is a set of markup tags. The tags describe document content. HTML documents contain HTML tags and plain text. HTML documents are also called web page. HTML language is relatively easy to learn. Many Web development programs (such as Komodo Edit) allow you to create Web pages using a graphical interface. These programs allow you to place objects and text on the page and the HTML code is written for you.
Example:
<!DOCTYPE html>
<html>
<body>
<h1>This is heading 1</h1>
<h2>This is heading 2</h2>
<h3>This is heading 3</h3>
<h4>This is heading 4</h4>
<h5>This is heading 5</h5>
<h6>This is heading 6</h6>
</body>
</html>
CSS
CSS (Cascading Style Sheets) allows a web developer to design a website in terms of the colour and design. CSS does not "create" anything all it does is decorates and align stuff on the web page. HTML (Hyper Text Mark-up Language) is responsible for the construction and the total output of a web page. The main job of CSS is to define what the HTML elements will look like; therefore CSS is built into all HTML tags.
Example:
#container
{
background:red;
float:left;
}
Komodo Edit
Komodo Edit is a free language editor that allows you to create web pages using many programming languages such as HTML5, CSS, Python, PHP, Javascript and many more. Komodo Edit is available on most operating systems such as Mac, Linux and Windows. Komodo Edit has many tools to help the user such as ready made templates for any language you are using that has the basic codes written out for you. When I was creating my website I used HTML5 and CSS and I used the HTML template and it had all the necessary code written out for me which made it easier for me.
Lumzy (Wireframe Tool)
A wireframe is a design tool that is used in developing web pages. It is a tool that lets you present the structure and content of your pages without actually making them. This is done by presenting each section of your make e.g. the header, footer and content in boxes and you would put dummy text and images where your actual content would go. This would then give you an idea of what your web page will look like. Wireframe is also used for designing other products such as cars, the car is made of lots of wires and a prototype is produced to show what it might look like. I made my website wireframe from Lumzy.com.
A Car Wireframe
Gliffy ( Graphics Program)
Glifffy is graphics tool I used to create my navigation diagram for my website. Gliffy allows you to create diagrams and flowcharts and provides a wide range of tools to use so you can make your diagram very easily. For example it has ready made templates such as a floor plan for a house or a diagram for a website. I used to shapes Gliffy had such as squares and triangles to make my navigation chart and connected them up with lines.
Lorem Ipsum/ Lorem Pixel
Lorem Ipsum is 'dummy text' that is used in website designs or any other document e.g. a poster. The text itself is Latin and was made by Cicero with the words altered. The main purpose of this text is to put it into what you are working on e.g. a website so you can see how the text would look and you can therefore change the font and colour. In the design stages you wouldn't need real text so you would just use Lorem Ipsum. In order to get it you go on the website (www.Loremipsum.com) and you can choose how many paragraphs of text you want. Lorem Pixel is the exact same thing but it has images instead, and you can use them instead of using your real images to change the size and contrast of it etc. The website for Lorem Pixel is www.lorempixel.com.
Reference
HTML Examples - 14/03/2013 - http://bit.ly/BK9pD
HTML - 14/03/2013 - http://bit.ly/dl8XFm
CSS Introduction - 14/03/2013 - http://bit.ly/hP4IL
Wireframe - 14/03/2013 - http://bit.ly/YbtEBX
so good and elaborate for beginners like me.
ReplyDeleteoutsourcingall.com "Usually I never comment on blogs but your article is so convincing that I never stop myself to say something about it.
ReplyDeleteThis paragraph gives clear idea for the new viewers of blogging, Thanks you. You’re doing a great job Man, Keep it up.
Seo training
outsourcing training in dhaka
Best Website Development and Design Company in Bangladesh
free outsourcing training
graphic design training
digital marketing training
affiliate marketing training
outsourcing training
Wonderful information. Thank you so much for sharing and please keep posting these type of blog! Self Storage Website Design | Transportation Website Design | crowd funding website design | flower shop website design | motivational speaker web design | nutritionist website design | pharmaceutical website design
ReplyDeletehey there and thanks to your info – I’ve certainly picked up anything new from right here. I did however expertise a few technical issues the usage of this website, as I skilled to reload the web site a lot of instances prior to I may get it to load correctly. I had been puzzling over if your hosting is OK? No longer that I’m complaining, however sluggish loading instances instances will often have an effect on your placement in google and could injury your high-quality rating if ads and ***********|advertising|advertising|advertising and *********** with Adwords. Well I am including this RSS to my e-mail and could look out for much more of your respective intriguing content. Make sure you replace this once more very soon.. Logo designer ireland
ReplyDelete