Fork me on GitHub

pe_pplog demo page

Main menu

Redesigning forms

No comments
The forms in the pplog were in table format. This is actually bad design practice as it means a lot of unused white space and forms resizing badly to smaller screens.
See this example:

I redesigned them using the <legend>, <p> and <label> tags, which does not onlz have the advantage of using the space more efficiently and resizing nicely

but also makes the forms accessible for people using screen readers. I decided to get rid of the captcha, as it was easy for a spambot to circumvent and decided to give the possibility to prompt for random questions instead. I also added a honeypot to fool spambots. These measures should be effective against robots, the only thing helping against trolls is using the security question as a password.

While I was at it I added some bells and whistles to the new/edit entry forms:

Now when checking and unchecking "isHTML" the bbcode buttons disappear and reappear and existing categories are in a select box

Style changes in pe_pplog v2a

No comments
I decided to add a different style for viewing the blog on mobile devices, as well as a print layout.
Partly to make a mobile style work, partly because I think it is pretty a meu bar was added in the header
I also got rid of the javascript tooltips and used only CSS tooltips

Screenshots of the mobile style:

stylesheet for mobile devices

No comments
This blog should now have a different (and easier to use) layout for mobile devices, which will be part of the new release. Take out your smartphones and try away!

There is also a different print layout, so if you want a hard copy of a post, it will be a bit printer friendlier
Posted on - Categories: layout

Pages: [1]