Ideas for New Website

What's up everybody, Westley here, so no need to fear. Whatever that means, it just rhymes. Anyways, back to the task at hand. I wanted to take some of your time and fill you in on what my next project is. After finishing the mobile site and having a lot more experience with web development since starting my portfolio, West-Productions, I wanted my next project to be a great challenge. I want to push myself and create and unique and entertaining website that will further my knowledge in the field and also help others.

After some intensive meditation(not really), I decided to create a website dedicated to jiu-jitsu practitioners. I decided on this for two reasons: 1) jiu-jitsu has been part of my life for about the past two years, 2) I want to create content that will help others as well as myself. This is the challenge that I wanted. I have to create a website that is user friendly, unique, and has great content that will drive traffic to it.

To get me prepared for this task, I thought it would be a great idea to learn some HTML5. To do this, I went to one of my favorite subscriptions on youtube, thenewboston. He makes awesome tutorials and you should check him out whenever you can. Basically though, after getting enough experience with XHTML I felt it was time for me to learn HTML5. It is so much more powerful and easier to use that it will make my website that much better.

One of the most important parts of a website is the logo. Now I'm not a designer but I know it is an integral part of a business. Imagine the corporations we all love to hate: Wal-Mart, Target, etc. They all have easy to spot logos that help build a relationship with the shoppers. When a user can make an easy connection with a logo, it helps build the brand. After looking up some tutorials on how to create a simple logo, I came across this site that shows how to create a nice looking logo in Adobe Photoshop Extended CS6 Win Student 65171279 (Google Affiliate Ad). After following the tutorial for a little bit and looking up an image to use, I came up with this:

I think it came out nice but I also know that improvements can be made. Any suggestions will be help. So let me explain how I came up with the finalization of this logo. First of all, due to my limited Photoshop skills I simply could not figure out to change the background after putting text on the layer. I was too lazy to change the background color and start over so I stayed with white. I then searched for an image online that portrays jiu-jitsu since I also lack drawing skills. I have to pay for it to use it because of royalty use but it's worth it. I then wrote the name of the website, Westley Jiu-Jitsu in capital letters because it gives off a serious vibe. I used blue because it was used in the tutorial and it actually looked nice.

After deciding on a logo, I decided build a quick template and place the logo in it to get a better view of how it would look on a page. I made some changes in the CSS file to match the color scheme of the logo and viola, we have a template.

I couldn't figure out how to take a snapshot of the whole page so I just decided to take a snapshot of the body content because it is the meat of the page and you already have seen the logo. Just imagine the logo on top of the body. In the body we have a navigation bar at the top, an article and sidebar section in the middle, and a footer at the bottom. Let me know what you think about the set up and colors, any suggestion would be helpful.

That is where I am at with the website. After I finish learning some HTML5, I will start working more on this website. Until then, please let me know what you think of the direction I am heading with this website, I would really appreciate it. Thanks so much for taking the time to read this post and make sure to stay tuned for future updates!

- West

Mobile Programming - Part 3

What's up everybody. West here for another installment of my mobile programming series. Well in part 2 of the series I left off with the need to install an image gallery for my photos. I have done that and some minor tweaking to make the experience for the user much better. Let's start with the image gallery I chose to use. After searching the internet for the best image gallery, I decided to go with a simple plugin called ImageFlip. You can check out the page here, but basically when a user touches an image, it will show the image in bigger resolution with a black background. When the user clicks the image again, he/she can see a little description of the image and chose to view the next, previous image, or just exit from full screen.

As you can see from the image to the left, when the user clicks the button to go to a specific gallery, this is what they will see. These images were made smaller to accommodate for the space to see all images is a friendly manner.

Now what you see in this image is when the user touches an image they wish to see in bigger resolution. It's pretty simple. You can see the description of the image at the bottom and the ability to view other images or exit the mode at the top.

I mentioned in my previous installment that I was having problem with the loading of the site when first opened. Meaning, all the pages would show rather than just the active page and this is a big no-no. Well I indirectly fixed this problem when I was messing with a new way to list my buttons.

A few things were changed from old installments. The obvious difference being the buttons. Before I was using "data-role='navbar'", I then changed it to "data-role='listview'" and viola, no more loading issues. I don't know what was the issue with navbar, but needless to say I won't be using it anymore unless under direct circumstances.
Another that I added was the small arrow to the right of each button. This just makes it clearer to the user that this button directs to another page. Just a simple visual enhancement for the user. I also added a button in the header that will navigate to the home page of the desktop site. I just did this to get the knowledge.

The last thing I changed was my contact page. Originally I had an actual contact form where the user would write a message and it would send that message to my email when the submit button was clicked. This was frustrating to deal with because there were many variables that could break the friendly experience, such as submitting with blank fields, reloading the page, and pressing the back button upon submission. I felt it was best to avoid this and just put my contact information for the user to use at their leisure.

As you can see, I simply added my contact information instead of a form. I felt this was appropriate because using a smart phone device automatically can do the background work for the user. For example, if the user were to click on my phone number, it would immediately go to the dial setup. If they were to click my email, it would go to their email service. In fact, this can be seen as even more user friendly than a contact form.

Well after weeks of working on and off of this mobile site, I can say that it is finished. For a first timer like me, I think it turned out well and I will only expand on it with future projects. If you are looking to build a mobile application, you should check out mobile sites first and see if that would work. To me, applications are overrated and I much rather use the convenience of the web than having to download an app that may or may not be update to the date. Just my opinion. It's worth a check out right? Anyways, thank you so much for reading or just viewing my images (I try to make them pretty), it was a great experience and I highly recommend checking it out if you're into web development. Thanks again for taking your time to read this again, it means so much to. I will be making other posts on new projects so stay tuned for those! Thank you and have a great time!

- West P.S.
The website is West-Productions. Go to the mobile link at the bottom to view the mobile site. Thanks again!

Mobile Programming - Part 2

What's up everybody, hope all is well with you. If you don't know who I am, my name is Westley Vazquez and I have created a little blog that follows my progress as a aspiring programmer. Being as the title is part 2, there must be a part 1. If you haven't checked it out, you definitely should because you will get a better sense of where I am with this mobile programming thing.

Now that I have the required introduction out of the way, I can talk about my progress for my mobile site for West-Productions. On the last post I made, I left off with an image of what my mobile pages would look like. Not much has changed from then to now. The design of the pages are the same, with some minor changes to make a for a better mobile experience. For example, my education page has a table with three columns, including two images. This was just too cumbersome and to accommodate for a better viewing perspective, I removed the two images to make it a two column table. This worked perfectly as you can check out for yourself on the site.

The mobile site is nearly finished with the exception of the contact, programming, and survey pages. The site also has a weird glitch that when the site is first accessed from a mobile device, it shows all pages instead of just the active page, weird right? So what I do is just click on the About page and then the education page and everything should run normal from there. I don't know why it does it but I definitely intend to look into it when I get a chance. I have the contact page set up to send me an email when a request is set, I just need to set it up with the database. The same can be said with the survey page. The mystery page is oddly enough the programming page because of the amount of images to be posted on it. I haven't worked on the page yet to even see how a native img tag would work on a mobile site. As far as I know there are two ways to display images on a mobile device, landscape and portrait. I need to figure out which one is best for my site and viewers. You can check out this site Popup-images to have a better sense of what I mean. Other than that, I shouldn't have any problems, but it is programming so I wouldn't be surprised either.

I am happy that I have some experience with mobile programming and I plan to create a mobile site for each website that I work on. Even though it may not be necessary, I enjoy the experience and the afterthought. I also can't wait to get started on my next website because it will be my biggest project yet. I actually have an image of what this site is supposed to be, somewhat, and it will not only be beneficial to me but many other people, which makes me happy. I shall stop blabbing on, but before I go, I want to thank you for reading this post and stay tuned for my next post. Peace!

- West

Mobile Programming

What's up everybody, Westley here. Hope everything has been well for you guys. Anyways, I want to talk about what I've been doing lately. About a couple of weeks ago, out of the blue I decided to look up some videos about mobile programming and YouTube. Now I've done some minor programming and android development so I was expecting something similar. Little did I know or LDIK for the texters out there.

In android development, so much had to be done to get a simple "Hello World!" on the screen. Mobile development... not so much. Now I'm not an expert in mobile development, but the videos I saw have it all written in one file, yes one file. Using HTML5, pages can be defined to separate one from another and then be mapped by the id attribute. It's really neat how such a seemingly simple concept can render a whole website functional.

I plan on going much deeper into mobile programming in the future but for now I just want to create a near representation of West-Productions.com because I have so many ideas running through my mind that I don't have the time. Not too mention that I would like to learn HTML5 before learning more about mobile programming.

Although my main site, West-Productions.com, is up and running, It's pretty obvious that I am still working on the mobile site. Here is a preview though of what it will look like.

I will keep you guys posted with everything that is going on in my coding life because I have a lot of things that I would like to try and take you guys on my journey to getting there. Thanks for reading and have a great night!

- West