Here is the final look of my website on both internet browsers Chrome and Safari.
Here is the final look of my website on both internet browsers Chrome and Safari.
Here are the final development stages where I placed in my blog, deleted a few areas of my website which I thought were unnecessary which was actually just the one page being the about page which I may want to consider doing soon properly as I didn’t have enough time.
There are many ways in which you can make a website be accessible, although I am only designing my website and not necessarily publishing it there are limited features in which I can add in order to make it accessible.
If I were to publish my website there are a few features, techniques and tips in order to ensure it is accessible for all users. For example:
There are also many ways in which a website can be checked to ensure that it has been made accessible that include:
So here I started to place some content in and experimented with different background options as to just having pink could be a little too much on the eyes and distract visitors.
Here’s where I updated my logo. A really annoying error occurred just before this which messed around with my typeface on the navigation menu as that when you hover over it and when it’s active it goes to plain text though I checked up on everything within muse and it was supposedly working fine there! frustrating!
Here you can see that my website now has a kind of map to it. This is a great visual tool within Adobe Muse.
The main characteristic of a multimedia system is the use of more than one kind of media to deliver content and functionality. Web and desktop computing programs can both involve multimedia components. As well as different media items, a multimedia application will normally involve programming code and enhanced user interaction. Multimedia items generally fall into one of five main categories and use many different techniques for digital formatting.
Image files through digital media appear in many multimedia applications. Digital photographs can display content or can form part of a user interface. Interactive elements, such as buttons, often use custom images created by the designers and developers involved in the making of the application. Digital image files use a variety of formats and file extensions. Among the most common are PNGs and JPEGs. Both of these often appear on websites, as the formats allow developers to minimize on file size while maximizing on picture quality. Software such as Photoshop allow developers to create complex visual effects with digital images.
Audio files and streams play a major role in some multimedia systems. Audio files appear as part of application content and also to aid interaction with people who may have difficulty with reading. When they appear within Web applications and sites, audio files sometimes need to be deployed using plug-in media players. Formats include MP3, WMA etc. Web services can also stream audio, so that users can begin playback before the entire file is downloaded.
Text content is by far the most common media type in computing applications, it’s usually forgotten about seeing as we use it so much. Most multimedia systems use a combination of text and other media to deliver functions. Text in multimedia systems can express specific information and can act as reinforcement for information contained in other media items. This is a common practice in applications with accessibility requirements. For example, when Web pages include image elements, they can also include a short amount of text as information about the image for the user’s browser to include as an alternative, in case the digital image item is not available.
As the brief tells us that we must be able to understand slightly on how code works. This is great for me as that I have studied Computer Science for the last three years, so this will play in my advantage greatly.
In computing, source code is any collection of computer instructions (possibly with comments) written using some human-readable computer language, usually as text. The source code of a program is specially designed to facilitate the work of computer programmers, who specify the actions to be performed by a computer mostly by writing source code. The source code is often transformed by a compiler program into low-level machine code understood by the computer. The machine code might then be stored for execution at a later time. Alternatively, an interpreter can be used to analyze and perform the outcomes of the source code program directly on the fly. Most application softwares are distributed in a form that includes executable files, but not their source code. If the source code were included, it would be useful to a user, programmer, or system administrator, who may wish to modify the program or to understand how it works. Aside from its machine-readable forms, source code also appears in books and other media, often in the form of small code snippets, but occasionally complete code bases, a well-known case is the source code of PGP.
Source code is primarily used as input to the process that produces an executable program (i.e., it is compiled or interpreted). It is also used as a method of communicating algorithms between people (e.g., code snippets in books). Computer programmers often find it helpful to review existing source code to learn about programming techniques. The sharing of source code between developers is frequently cited as a contributing factor to the maturation of their programming skills. Some people consider source code an expressive artistic medium. Porting software to other computer platforms is usually prohibitively difficult without source code. Without the source code for a particular piece of software, portability is generally computationally expensive. Possible porting options include binary translation and emulation of the original platform. Decompilation of an executable program can be used to generate source code, either in assembly code or in a high-level language. Programmers frequently adapt source code from one piece of software to use in other projects, a concept known as software reusability.
There are two broad divisions of web development – front-end development (also called client-side development) and back-end development (also called server-side development).
Back-end development controls what goes on behind the scenes of a web application. A back-end often uses a database to generate the front-end. Here’s an example. Say you log into your Facebook account, and you are greeted with the latest updates in your News Feed. They’re not going to be the same updates that you saw yesterday. How did the page change? Did a Facebook employee manually edit the page to update your news feed? Of course not. A script on the Facebook back-end would have received the updates and re-generated the front-end accordingly. Back-end scripts are written in many different coding languages and frameworks, such as:
Now with my code it looks slightly jumbled as that I have been doing my website through a front end software (Muse), if I was to code then it would look a little less busy as that I’d be short coding most of it, so here are a few screenshots of my CSS code which shows the customisation of the website going through text fonts, colours, sizes, spacing etc.
Below is an area I can change the content in my website through coding.
And below is the PHP code for a form which you can make in a variety of text editors, I used to create these in windows visual basics.
Here I will be showing how I’m organising my website on my desktop and portable hard drive.
I am briefly going to go through the stages on how to save an image for a website. Muse fortunately offers a great feature which believe it or not lets you place .psd files into your website and what this does is as you update your .psd file Muse will automatically update your site, great right?! But what happens if you have an image created in an application such as Illustrator which there files aren’t supported to go on to the web straight away, well it’s pretty straight forward thanks to Adobe and I will show how I did it here!
Here all these file types are supported for the web so you can chose any but if you want a transparent background choose PNG, if not choose JPEG. GIF’s are usually moving images that move for approximately 10 seconds.
It’s also handy to tick the box above where it says “Transparency”.
You can also split the screen so you can make sure it looks exactly the same as the original piece, sometimes colour shading may change, not so sure why. After getting it how you want it to be simply hit the save button and choose where you want to save the image, preferably the same file that your website is in to keep it all organised and avoid dead links.
To input a .psd into your website you must do the following and make sure it’s in the right format to proceed.
Make sure you have your image mode as RGB Color as that the other modes are not supported on Muse yet.
If you choose to flatten all the layers then it’ll make the image hard to edit but all the colours will stay exactly the same as shown below. What I did is I just saved it as another version so I could still always go back to the original if it needs changing.
If you choose to not flatten the image then it will unfortunately lose some colours as shown below but you’ll still be able to edit the file and not worry to update it manually.
Here I will be saying what software I’m going to use and why I chose it. It was a pretty easy choice as that it’s a website for myself so it’s personal I could really choose anything I wanted but I want my website to look professional so that’s Weebly and Wix out of the picture! Also the time to make the site had to be bought into thought as that coding takes a very long time to do so I don’t want to raw code the whole site so that’s Sublime Text off the list too. As that dreamweaver was my first ever software I used to create a site I won’t be choosing that as that when I was using it back in school I had no help whatsoever and it scarred me from using it again for a while!
So my two choices are Brackets and Muse! I find muse’s user interface great to work with and is very friendly to new users. It’s also very easy to just jump into and get creating with many features included, there is also a huge free widget library on the adobe website for extra third party features. I have also worked a little on Muse in the past and back then I felt well invited to what it had to offer. Though there are some glitches here and there they are all relatively easy to fix and clear up in code which I will be using Brackets for. I haven’t really touched upon Brackets but I believe it’s the same as Sublime just a little less complex in certain aspects. This will be a good opportunity to take the dust off my skills of coding as that it has been a while since.